feat: 注册页面

This commit is contained in:
cgd_mac 2022-02-24 14:43:49 +08:00
parent 205d81017e
commit 35a75281b1
14 changed files with 178 additions and 133 deletions

View File

@ -61,4 +61,14 @@ export default {
display: none;
}
.text-cut-2{
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
</style>

View File

@ -1,7 +1,7 @@
import request from '@/utils/request'
const countApi = {
myexamCount: 'study/data/home' // 学习统计
myexamCount: 'data/person/learningStatistics' // 学习统计
}
export function getMyexamCount (params) {

View File

@ -8,17 +8,17 @@
<a-progress
type="circle"
:percent="(data.score / data.totalScore) * 100"
:format="percent => `${data.score }分`"
:format="percent => `${data.score || 0}分`"
/>
</a-col>
<a-col class="count-info" :span="12">
<div>
{{ data.totalQuestions }}道题答对{{ data.rightQuestions }}总用时{{
data.answerTime
{{ data.totalQuestions || 0 }}道题答对{{ data.rightQuestions || 0 }}总用时{{
(data.answerTime/60).toFixed(2)
}}分钟
</div>
<div>已击败考生{{ data.beat }}%的考生</div>
<div>全站平均得分{{ data.avgScore }}</div>
<div>已击败考生{{ data.beat || 0 }}%的考生</div>
<div>全站平均得分{{ data.avgScore || 0 }}</div>
</a-col>
</a-row>
</a-card>

View File

@ -24,7 +24,8 @@
</a-form-item>
</a-col>
<a-col :md="6" :sm="24">
<!-- <a-col :md="6" :sm="24"> -->
<a-col>
<a-button type="primary" @click="handleQuery">查询</a-button>
<a-button @click="resetQuery">重置</a-button>
</a-col>

View File

@ -10,7 +10,7 @@ import { ACCESS_TOKEN } from '@/store/mutation-types'
import { Modal } from 'ant-design-vue' // NProgress Configuration
NProgress.configure({ showSpinner: false })
const whiteList = ['login', 'register', 'registerResult'] // no redirect whitelist
const whiteList = ['login', 'register', 'registerResult', 'setting'] // no redirect whitelist
const loginRoutePath = '/user/login'
// 无默认首页的情况
const defaultRoutePath = '/welcome'

View File

@ -34,7 +34,7 @@ const notFoundRouter = {
}
// 个人中心页面
const userAccount = [
export const userAccount = [
// account
{
'name': 'account',
@ -224,6 +224,7 @@ export const generator = (routerMap, parent) => {
// Recursion
currentRouter.children = generator(item.children, currentRouter)
}
console.log('currentRouter', currentRouter)
return currentRouter
})
}

View File

@ -144,10 +144,10 @@ export default {
},
methods: {
getTeams () {
this.$http.get('/workplace/teams').then(res => {
this.teams = res.result
this.teamSpinning = false
})
// this.$http.get('/workplace/teams').then(res => {
// this.teams = res.result
// this.teamSpinning = false
// })
},
handleTabChange (key, type) {

View File

@ -7,23 +7,25 @@
@search="handleRefresh"
@reset="
() => {
queryParam = {}
handleRefresh()
queryParam = {};
handleRefresh();
}
"></SearchCom>
"
></SearchCom>
</div>
<br/>
<br />
<s-table
ref="table"
:pageSize="5"
:columns="columns"
:data="loadData"
:rowKey="record => record.id">
:rowKey="record => record.id"
>
<span slot="index" slot-scope="text, record, index">
{{ index + 1 }}
</span>
<template slot="courseName" slot-scope="text, record">
<a-button @click="handlerDetail(record)" type="link" >{{ record.courseName }}</a-button>
<a-button @click="handlerDetail(record)" type="link">{{ record.courseName }}</a-button>
</template>
<span slot="trainType" slot-scope="text, record">
<a-tag v-if="record.trainType === 1" color="red">必修课</a-tag>
@ -37,9 +39,7 @@
<template slot="schedule" slot-scope="text, record">
<a-progress :percent="record.schedule" />
</template>
<template slot="learnHours" slot-scope="text, record">
{{ record.learnHours }}小时
</template>
<template slot="learnHours" slot-scope="text, record">{{ record.learnHours }}小时</template>
<span slot="action" slot-scope="text, record">
<a-popconfirm
v-if="record.status === 1"
@ -59,6 +59,7 @@
</template>
<script>
import moment from 'moment'
import { reqMyCourseList } from '@/api/mycourse/index'
import { dictionaryDropDown } from '@/api/sys/dictionaryItem'
import { dictToTree } from '@/utils/util'
@ -72,9 +73,9 @@ export default {
// UserForm,
// UserRoleForm
},
data () {
return {
loading: true,
data () {
return {
loading: true,
queryParam: {
name: '', //
trainWay: ''
@ -103,7 +104,11 @@ export default {
},
{
title: '开始时间',
dataIndex: 'startDate'
dataIndex: 'startDate',
customRender: text => {
if (!text) return '-'
return moment(text).format('YYYY-MM-DD')
}
},
{
title: '课程状态',
@ -133,27 +138,27 @@ export default {
},
selectedRows: [], //
options: {}
}
},
created () {
}
},
created () {
this.dictionaryDropDown()
this.columns.push({
title: '操作',
width: '150px',
dataIndex: 'action',
scopedSlots: { customRender: 'action' }
title: '操作',
width: '150px',
dataIndex: 'action',
scopedSlots: { customRender: 'action' }
})
},
methods: {
//
methods: {
//
handlerDetail () {
this.$refs.aycourseDetail.visible = true
this.$refs.aycourseDetail.visible = true
},
//
dictionaryDropDown () {
dictionaryDropDown({ dictionaryCode: '0009' }).then((res) => {
dictionaryDropDown({ dictionaryCode: '0009' }).then(res => {
this.queryOptions[1].options = dictToTree(res.data, [], 0)
this.loading = false
this.loading = false
})
},
classificationChange (value) {
@ -174,7 +179,8 @@ export default {
row: row,
callback: function () {
_this.$refs.table.refresh()
} })
}
})
},
//
handlerContinue (row) {
@ -184,7 +190,7 @@ export default {
query: { courseId: row.id }
})
}
}
}
}
</script>

View File

@ -1,46 +1,45 @@
<template>
<a-row :gutter="24">
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
<chart-card :loading="loading" title="" :total="data.totalClassHour">
<chart-card :loading="loading" title="" :total="data.sumClassHour">
<template slot="footer">当前累计学时</template>
</chart-card>
</a-col>
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
<chart-card :loading="loading" title="" :total="data.totalCourse">
<chart-card :loading="loading" title="" :total="data.sumCourse">
<template slot="footer">累计学习课程</template>
</chart-card>
</a-col>
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
<chart-card :loading="loading" title="" :total="data.completeCourse">
<chart-card :loading="loading" title="" :total="data.completionCourse">
<template slot="footer">结业课程</template>
</chart-card>
</a-col>
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
<chart-card :loading="loading" title="" :total="data.examSize">
<chart-card :loading="loading" title="" :total="data.examCount">
<template slot="footer">考试次数</template>
</chart-card>
</a-col>
<a-col
:span="24"
:style="{ marginBottom: '24px' }">
<a-col :span="24" :style="{ marginBottom: '24px' }">
<a-card :bordered="false" :style="{ height: '100%' }">
<div class="flex-center" style="justify-content: flex-start;" slot="title">
<h4 style="margin: 0;">年度学时完成情况</h4>
<div style="flex: 0 0 220px;margin: 0 10px;"><a-progress :percent="data.yearClassHourSituation * 100" :show-info="false" /></div>
<h4 style="margin: 0;">{{ data.yearTotalClassHour }}学时/{{ data.yearClassHourRequi }}学时</h4>
<div style="flex: 0 0 220px;margin: 0 10px;">
<a-progress
:percent="(data.yearClassHour / data.planClassHour) * 100"
:show-info="false"
/>
</div>
<h4 style="margin: 0;">{{ data.yearClassHour }}学时/{{ data.planClassHour }}学时</h4>
</div>
</a-card>
</a-col>
<a-col
:span="24"
:style="{ marginBottom: '24px' }">
<a-col :span="24" :style="{ marginBottom: '24px' }">
<a-card :bordered="false" title="学时统计图" :style="{ height: '100%' }">
<v-chart class="chart" :option="chartOptions" autoresize />
</a-card>
</a-col>
<a-col
:span="24"
:style="{ marginBottom: '24px' }">
<a-col :span="24" :style="{ marginBottom: '24px' }">
<a-card :bordered="false" title="所选课程的成绩情况" :style="{ height: '100%' }">
<a-table
ref="table"
@ -48,13 +47,14 @@
:columns="columns"
:showPagination="false"
:data-source="data.courseList"
:rowKey="record => record.courseId">
:rowKey="record => record.courseId"
>
<template slot="trainSdate" slot-scope="text, record">
{{ record.trainSdate }}{{ record.trainEdate }}
</template>
<span slot="courseType" slot-scope="text, record">
<a-tag v-if="record.courseType === 1" color="blue">选修</a-tag>
<a-tag v-if="record.courseType === 0" color="red">必修</a-tag>
<span slot="trainType" slot-scope="text, record">
<a-tag v-if="record.trainType === 1" color="blue">选修</a-tag>
<a-tag v-else-if="record.trainType === 0" color="red">必修</a-tag>
<template v-else>-</template>
</span>
<span slot="status" slot-scope="text, record">
@ -72,7 +72,8 @@
</template>
<script>
import "echarts";
import moment from 'moment'
import 'echarts'
import VChart, { THEME_KEY } from 'vue-echarts'
import {
ChartCard,
@ -111,16 +112,19 @@ export default {
columns: [
{
title: '课程名称',
dataIndex: 'courseName'
dataIndex: 'name'
},
{
title: '课程类别',
dataIndex: 'courseType',
scopedSlots: { customRender: 'courseType' }
dataIndex: 'trainType',
scopedSlots: { customRender: 'trainType' }
},
{
title: '开始时间',
dataIndex: 'startTime'
dataIndex: 'startDate',
customRender: function (text, record, index) {
return moment(text).format('YYYY-MM-DD')
}
},
{
title: '课程状态',
@ -129,11 +133,14 @@ export default {
},
{
title: '学时',
dataIndex: 'studyTime'
dataIndex: 'learnHours',
customRender: function (text, record, index) {
return `${text || 0}小时`
}
},
{
title: '考试成绩',
dataIndex: 'testResult'
dataIndex: 'score'
},
{
title: '操作',
@ -154,7 +161,7 @@ export default {
console.log('data', res)
this.data = res.data
this.loading = false
this.initChart(res.data)
this.initChart(res.data.classHourList)
})
},
initChart (data) {
@ -165,7 +172,7 @@ export default {
color: ['#1890ff'],
xAxis: {
type: 'category',
data: ['必修课程', '选修课程', '必须公告']
data: data.map(item => item.name)
},
yAxis: {
type: 'value'
@ -181,7 +188,7 @@ export default {
name: '课时',
type: 'bar',
barMaxWidth: 30,
data: [data.yearClassHour1, data.yearClassHour2, data.yearClassHour3],
data: data.map(item => item.classHour),
showBackground: true,
backgroundStyle: {
color: 'rgba(180, 180, 180, 0.2)'
@ -198,7 +205,7 @@ export default {
</script>
<style lang="less" scoped>
.chart{
.chart {
height: 300px;
}
</style>

View File

@ -36,10 +36,12 @@
:xs="12"
v-for="(j, k) in item.list"
:key="`${index}-${k}`">
<a-card hoverable style="width: 100%; margin-bottom: 15px;">
<div class="flex-center"><h4>{{ j.courseName }}</h4></div>
<div class="flex-center" style="margin-top: 10px;">
<a-button @click="handlerStart(j)" type="primary" size="small" round>开始答题</a-button>
<a-card hoverable :bodyStyle="{height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }" style="width: 100%; margin-bottom: 15px;height: 100px;">
<div>
<div class="flex-center"><h4 class="text-cut-2">{{ j.courseName }}</h4></div>
<div class="flex-center">
<a-button @click="handlerStart(j)" type="primary" size="small" round>开始答题</a-button>
</div>
</div>
</a-card>
</a-col>

View File

@ -8,10 +8,10 @@
:headStyle="{ paddingLeft: '0px !important' }"
>
<template slot="title">
<h3>{{ viewReport.courseName }}</h3>
<h3 v-if="viewReport.courseName">{{ viewReport.courseName }}</h3>
<div class="sub-info">
<span>交卷时间{{ viewReport.submitTime }}</span>
<span v-if="viewReport.totalScore">答题用时{{ viewReport.totalScore }}</span>
<span v-if="viewReport.totalScore">答题用时{{ (viewReport.answerTime/60).toFixed(2) || 0 }}分钟</span>
</div>
<DbReport :data="viewReport"></DbReport>
</template>
@ -24,7 +24,7 @@
:headStyle="{ paddingLeft: '0px !important' }"
>
<template slot="title">
<h4>{{ viewReport.courseName }}</h4>
<h4 v-if="viewReport.courseName">{{ viewReport.courseName }}</h4>
<!-- <div class="sub-info"><span>选择题30/30</span><span>选择题30/30</span><span>选择题30/30</span></div> -->
</template>
<template v-for="(item, index) in questionList">
@ -43,7 +43,6 @@
import DbQuestionInfoItem from '@/components/DbQuestionInfoItem/index.vue'
import DbReport from '@/components/DbReport/index.vue'
import { answerViewReport, answerViewResolution } from '@/api/practice/report'
import { reqExamViewReport, reqExamViewResolution } from '@/api/myexam/exam.js'
export default {
components: { DbQuestionInfoItem, DbReport },

View File

@ -1,6 +1,12 @@
<template>
<div class="main">
<a-form-model ref="ruleForm" class="user-layout-login" :model="form" :rules="rules" @submit.prevent="handleSubmit">
<a-form-model
ref="ruleForm"
class="user-layout-login"
:model="form"
:rules="rules"
@submit.prevent="handleSubmit"
>
<a-form-model-item>
<a-select v-model="form.roleCode" placeholder="请选择">
<a-select-option value="student">学员</a-select-option>
@ -18,7 +24,14 @@
</a-input-password>
</a-form-model-item>
<a-form-model-item>
<a-button block type="primary" size="large" html-type="submit" :loading="loading">登录</a-button>
<a-button block type="primary" size="large" html-type="submit" :loading="loading">
登录
</a-button>
</a-form-model-item>
<a-form-model-item style="text-align: center;">
<a-button @click="handlerRegister" type="link">
注册
</a-button>
</a-form-model-item>
</a-form-model>
</div>
@ -54,17 +67,25 @@ export default {
this.$refs.ruleForm.validate(valid => {
const { form } = this
if (valid) {
this.Login(form).then(() => {
this.loginSuccess()
}, () => {
this.requestFailed()
})
this.Login(form).then(
() => {
this.loginSuccess()
},
() => {
this.requestFailed()
}
)
} else {
this.loading = false
return false
}
})
},
handlerRegister () {
this.$router.push({
path: '/user/register'
})
},
loginSuccess (res) {
this.loading = false
this.$router.push({ path: '/' })
@ -83,5 +104,4 @@ export default {
}
</script>
<style lang="less" scoped>
</style>
<style lang="less" scoped></style>

View File

@ -6,14 +6,14 @@
<a-input
size="large"
type="text"
placeholder="邮箱"
v-decorator="['email', {rules: [{ required: true, type: 'email', message: '请输入邮箱地址' }], validateTrigger: ['change', 'blur']}]"
placeholder="用户名"
v-decorator="['username', {rules: [{ required: true, message: '请输入用户名' }], validateTrigger: ['change', 'blur']}]"
></a-input>
</a-form-item>
<a-popover
placement="rightTop"
:trigger="['focus']"
:trigger="['focus', 'click']"
:getPopupContainer="(trigger) => trigger.parentElement"
v-model="state.passwordLevelChecked">
<template slot="content">
@ -21,7 +21,7 @@
<div :class="['user-register', passwordLevelClass]">强度<span>{{ passwordLevelName }}</span></div>
<a-progress :percent="state.percent" :showInfo="false" :strokeColor=" passwordLevelColor " />
<div style="margin-top: 10px;">
<span>至少输入 6 个字符请不要使用容易被猜到的密码</span>
<span>输入至少包括大写小写数字特殊符号中的三种密码长度至少为8位</span>
</div>
</div>
</template>
@ -29,8 +29,8 @@
<a-input-password
size="large"
@click="handlePasswordInputClick"
placeholder="至少6位密码区分大小写"
v-decorator="['password', {rules: [{ required: true, message: '至少6位密码区分大小写'}, { validator: this.handlePasswordLevel }], validateTrigger: ['change', 'blur']}]"
placeholder="请输入至少包括大写、小写、数字、特殊符号中的三种密码长度至少为8位。"
v-decorator="['password', {rules: [{ required: true, message: '请输入至少包括大写、小写、数字、特殊符号中的三种密码长度至少为8位。'}, { validator: this.handlePasswordLevel }], validateTrigger: ['change', 'blur']}]"
></a-input-password>
</a-form-item>
</a-popover>
@ -42,23 +42,10 @@
v-decorator="['password2', {rules: [{ required: true, message: '至少6位密码区分大小写' }, { validator: this.handlePasswordCheck }], validateTrigger: ['change', 'blur']}]"
></a-input-password>
</a-form-item>
<a-form-item>
<a-input size="large" placeholder="11 位手机号" v-decorator="['mobile', {rules: [{ required: true, message: '请输入正确的手机号', pattern: /^1[3456789]\d{9}$/ }, { validator: this.handlePhoneCheck } ], validateTrigger: ['change', 'blur'] }]">
<a-select slot="addonBefore" size="large" defaultValue="+86">
<a-select-option value="+86">+86</a-select-option>
<a-select-option value="+87">+87</a-select-option>
</a-select>
</a-input>
</a-form-item>
<!--<a-input-group size="large" compact>
<a-select style="width: 20%" size="large" defaultValue="+86">
<a-select-option value="+86">+86</a-select-option>
<a-select-option value="+87">+87</a-select-option>
</a-select>
<a-input style="width: 80%" size="large" placeholder="11 位手机号"></a-input>
</a-input-group>-->
<a-row :gutter="16">
<a-col class="gutter-row" :span="16">
<a-form-item>
@ -76,7 +63,12 @@
v-text="!state.smsSendBtn && '获取验证码'||(state.time+' s')"></a-button>
</a-col>
</a-row>
<a-form-item>
<a-input size="large" placeholder="请您输入单位邀请码" v-decorator="['code', {rules: [{ required: true, message: '请输入正确的邀请码' }], validateTrigger: ['blur'] }]"></a-input>
</a-form-item>
<a-form-item>
<a-input size="large" disabled placeholder="输入邀请码以后自动绑定" v-decorator="['unit']"></a-input>
</a-form-item>
<a-form-item>
<a-button
size="large"
@ -85,7 +77,7 @@
class="register-button"
:loading="registerBtn"
@click.stop.prevent="handleSubmit"
:disabled="registerBtn">注册
:disabled="registerBtn">立即注册
</a-button>
<router-link class="login" :to="{ name: 'login' }">使用已有账户登录</router-link>
</a-form-item>
@ -101,7 +93,8 @@ const levelNames = {
0: '低',
1: '低',
2: '中',
3: '强'
3: '强',
4: '极强'
}
const levelClass = {
0: 'error',
@ -154,18 +147,20 @@ export default {
if (/[0-9]/.test(value)) {
level++
}
//
if (/[a-zA-Z]/.test(value)) {
if (/[a-z]/.test(value)) {
level++
}
if (/[A-Z]/.test(value)) {
level++
}
//
if (/[^0-9a-zA-Z_]/.test(value)) {
if (/[^0-9a-zA-Z]/.test(value)) {
level++
}
this.state.passwordLevel = level
this.state.percent = level * 30
if (level >= 2) {
if (level >= 3) {
this.state.percent = level * 25
if (level >= 3) {
if (level >= 4) {
this.state.percent = 100
}
callback()
@ -210,7 +205,7 @@ export default {
validateFields({ force: true }, (err, values) => {
if (!err) {
state.passwordLevelChecked = false
$router.push({ name: 'registerResult', params: { ...values } })
$router.push({ name: 'registerResult', query: { ...values } })
}
})
},

View File

@ -1,30 +1,32 @@
<template>
<a-result
:isSuccess="true"
:content="false"
:title="email"
:sub-title="description">
<template #extra>
<a-button size="large" type="primary">查看邮箱</a-button>
<a-button size="large" style="margin-left: 8px" @click="goHomeHandle">返回首页</a-button>
</template>
</a-result>
<div>
<a-result :isSuccess="true" :content="false" :title="email" :sub-title="description">
<template #extra>
<a-button size="large" type="primary" style="margin-right: 8px" @click="goUserInfo">
完善信息
</a-button>
<a-button size="large" style="margin-left: 8px" @click="goHomeHandle">返回首页</a-button>
</template>
</a-result>
<PersonForm ref="personForm"></PersonForm>
</div>
</template>
<script>
import PersonForm from '@/views/person/PersonOrgForm.vue'
export default {
name: 'RegisterResult',
components: { PersonForm },
data () {
return {
description: '激活邮件已发送到你的邮箱中邮件有效期为24小时。请及时登录邮箱点击邮件中的链接激活帐户。',
description: '您的账号已经注册成功,但是还有很多信息未完善,您可以继续完善您的个人信息~',
form: {}
}
},
computed: {
email () {
const v = this.form && this.form.email || 'xxx'
const v = (this.form && this.form.email) || 'xxx'
return `你的账户:${v} 注册成功`
}
},
@ -34,11 +36,13 @@ export default {
methods: {
goHomeHandle () {
this.$router.push({ name: 'login' })
},
goUserInfo () {
//
this.$refs.personForm.registerEdit({})
}
}
}
</script>
<style scoped>
</style>
<style scoped></style>