feat: uI暂存
This commit is contained in:
parent
c08648778b
commit
ad6ba976ba
|
@ -54,6 +54,10 @@ export default {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.justify-between{
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
.nowrap{
|
.nowrap{
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,126 @@
|
||||||
|
<template>
|
||||||
|
<a-card
|
||||||
|
:bordered="false"
|
||||||
|
:loading="loading"
|
||||||
|
>
|
||||||
|
<a-table
|
||||||
|
ref="table"
|
||||||
|
:pageSize="5"
|
||||||
|
:columns="columns"
|
||||||
|
:showPagination="false"
|
||||||
|
:data-source="dataList"
|
||||||
|
:rowKey="record => record.id">
|
||||||
|
<span slot="action" slot-scope="text, record, index">
|
||||||
|
<a v-if="index % 3 == 1" @click="$refs.userForm.edit(record)">添加课程</a>
|
||||||
|
<a v-if="index % 3 == 2" @click="$refs.userForm.edit(record)">继续学习</a>
|
||||||
|
<a v-if="index % 3 == 0">已完成学习</a>
|
||||||
|
</span>
|
||||||
|
</a-table>
|
||||||
|
<CentralizedTrainingDetail ref="centralizedTrainingDetail"></CentralizedTrainingDetail>
|
||||||
|
</a-card>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { userPage, userDel, passwordReset } from '@/api/security/user'
|
||||||
|
import { getCourseList, deleteCourse } from '@/api/course/course'
|
||||||
|
import { dictionaryDropDown } from '@/api/sys/dictionaryItem'
|
||||||
|
import { dictToTree } from '@/utils/util'
|
||||||
|
import CentralizedTrainingDetail from './CentralizedTrainingDetail.vue'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
CentralizedTrainingDetail
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
dataList: [],
|
||||||
|
activeTab: '1',
|
||||||
|
loading: true,
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
title: '培训名称',
|
||||||
|
dataIndex: 'courseName',
|
||||||
|
scopedSlots: { customRender: 'courseName' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '培训时间',
|
||||||
|
dataIndex: 'courseTypeName'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '培训地点',
|
||||||
|
dataIndex: 'date'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '培训状态',
|
||||||
|
dataIndex: 'status'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
width: '150px',
|
||||||
|
dataIndex: 'action',
|
||||||
|
scopedSlots: { customRender: 'action' }
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// 加载数据方法 必须为 Promise 对象
|
||||||
|
loadData: parameter => {
|
||||||
|
return getCourseList(Object.assign(parameter, this.queryParam)).then(res => {
|
||||||
|
return res
|
||||||
|
})
|
||||||
|
},
|
||||||
|
selectedRows: [], // 选中行的数据
|
||||||
|
options: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created () {
|
||||||
|
this.dictionaryDropDown()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
tabChange (key) {
|
||||||
|
console.log('key', key)
|
||||||
|
},
|
||||||
|
// 点击详情
|
||||||
|
handlerDetail () {
|
||||||
|
this.$refs.aycourseDetail.visible = true
|
||||||
|
},
|
||||||
|
// 获取数据词典
|
||||||
|
dictionaryDropDown () {
|
||||||
|
dictionaryDropDown({ dictionaryCode: '0006' }).then((res) => {
|
||||||
|
this.loading = false
|
||||||
|
this.queryOptions[1].options = dictToTree(res.data, [], 0)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
classificationChange (value) {
|
||||||
|
this.queryParam.classification = value
|
||||||
|
},
|
||||||
|
// 获取列表
|
||||||
|
handleRefresh () {
|
||||||
|
|
||||||
|
},
|
||||||
|
sysUserDelete (param) {
|
||||||
|
userDel(param)
|
||||||
|
.then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success('删除成功')
|
||||||
|
this.$refs.table.refresh()
|
||||||
|
} else {
|
||||||
|
this.$message.error('删除失败:' + res.msg)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(err => {
|
||||||
|
this.$message.error('删除错误:' + err.msg)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleOk () {
|
||||||
|
this.$refs.table.refresh()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.table-operator {
|
||||||
|
margin-bottom: 18px;
|
||||||
|
}
|
||||||
|
button {
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,59 @@
|
||||||
|
<template>
|
||||||
|
<a-modal title="集中培训详情" :width="800" :visible="visible" :confirmLoading="confirmLoading" :footer="null">
|
||||||
|
<a-descriptions title="User Info">
|
||||||
|
<a-descriptions-item label="UserName">
|
||||||
|
Zhou Maomao
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="Telephone">
|
||||||
|
1810000000
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="Live">
|
||||||
|
Hangzhou, Zhejiang
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="Remark">
|
||||||
|
empty
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="Address">
|
||||||
|
No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China
|
||||||
|
</a-descriptions-item>
|
||||||
|
</a-descriptions>
|
||||||
|
</a-modal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
visible: false,
|
||||||
|
confirmLoading: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 开始学习
|
||||||
|
handlerStartLearn () {}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.cover-img {
|
||||||
|
width: 100%;
|
||||||
|
height: 200px;
|
||||||
|
border: 1px solid #e8e8e8;
|
||||||
|
border-radius: 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-text {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #666;
|
||||||
|
line-height: 1.8;
|
||||||
|
h2 {
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,135 @@
|
||||||
|
<template>
|
||||||
|
<a-card
|
||||||
|
:bordered="false"
|
||||||
|
:loading="loading"
|
||||||
|
>
|
||||||
|
<a-row :gutter="16">
|
||||||
|
<a-col :span="6" v-for="(item, index) in 8" :key="index">
|
||||||
|
<a-card hoverable style="width: 100%; margin-bottom: 15px;">
|
||||||
|
<img
|
||||||
|
slot="cover"
|
||||||
|
alt="example"
|
||||||
|
src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png"
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
<h4>建筑安全施工生产注意事项</h4>
|
||||||
|
<div class="flex-center justify-between">
|
||||||
|
<div>课时: 24小时</div>
|
||||||
|
<div>选修课</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a-card>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-card>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { userPage, userDel, passwordReset } from '@/api/security/user'
|
||||||
|
import { getCourseList, deleteCourse } from '@/api/course/course'
|
||||||
|
import { dictionaryDropDown } from '@/api/sys/dictionaryItem'
|
||||||
|
import { dictToTree } from '@/utils/util'
|
||||||
|
import { STable, SearchCom } from '@/components'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
STable,
|
||||||
|
SearchCom
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
dataList: [],
|
||||||
|
activeTab: '1',
|
||||||
|
loading: true,
|
||||||
|
queryParam: {
|
||||||
|
classification: '' // 课程分类
|
||||||
|
},
|
||||||
|
queryOptions: [
|
||||||
|
{ type: 'input', placeholder: '课程名称', key: 'courseName' },
|
||||||
|
{ type: 'select-dic-tree', placeholder: '请选择课程类别', key: 'courseType', options: [] }
|
||||||
|
],
|
||||||
|
// 表头
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
title: '课程名称',
|
||||||
|
dataIndex: 'courseName',
|
||||||
|
scopedSlots: { customRender: 'courseName' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '课程类别',
|
||||||
|
dataIndex: 'courseTypeName'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '学习时间',
|
||||||
|
dataIndex: 'date'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
width: '150px',
|
||||||
|
dataIndex: 'action',
|
||||||
|
scopedSlots: { customRender: 'action' }
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// 加载数据方法 必须为 Promise 对象
|
||||||
|
loadData: parameter => {
|
||||||
|
return getCourseList(Object.assign(parameter, this.queryParam)).then(res => {
|
||||||
|
return res
|
||||||
|
})
|
||||||
|
},
|
||||||
|
selectedRows: [], // 选中行的数据
|
||||||
|
options: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created () {
|
||||||
|
this.dictionaryDropDown()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
tabChange (key) {
|
||||||
|
console.log('key', key)
|
||||||
|
},
|
||||||
|
// 点击详情
|
||||||
|
handlerDetail () {
|
||||||
|
this.$refs.aycourseDetail.visible = true
|
||||||
|
},
|
||||||
|
// 获取数据词典
|
||||||
|
dictionaryDropDown () {
|
||||||
|
dictionaryDropDown({ dictionaryCode: '0006' }).then((res) => {
|
||||||
|
this.queryOptions[1].options = dictToTree(res.data, [], 0)
|
||||||
|
this.loading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
classificationChange (value) {
|
||||||
|
this.queryParam.classification = value
|
||||||
|
},
|
||||||
|
// 获取列表
|
||||||
|
handleRefresh () {
|
||||||
|
|
||||||
|
},
|
||||||
|
sysUserDelete (param) {
|
||||||
|
userDel(param)
|
||||||
|
.then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success('删除成功')
|
||||||
|
this.$refs.table.refresh()
|
||||||
|
} else {
|
||||||
|
this.$message.error('删除失败:' + res.msg)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(err => {
|
||||||
|
this.$message.error('删除错误:' + err.msg)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleOk () {
|
||||||
|
this.$refs.table.refresh()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.table-operator {
|
||||||
|
margin-bottom: 18px;
|
||||||
|
}
|
||||||
|
button {
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -11,7 +11,6 @@
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:showPagination="false"
|
:showPagination="false"
|
||||||
:data-source="dataList"
|
:data-source="dataList"
|
||||||
:showHeader="false"
|
|
||||||
:rowKey="record => record.id">
|
:rowKey="record => record.id">
|
||||||
<span slot="action" slot-scope="text, record, index">
|
<span slot="action" slot-scope="text, record, index">
|
||||||
<a v-if="index % 3 == 1" @click="$refs.userForm.edit(record)">添加课程</a>
|
<a v-if="index % 3 == 1" @click="$refs.userForm.edit(record)">添加课程</a>
|
||||||
|
@ -27,7 +26,6 @@
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:showPagination="false"
|
:showPagination="false"
|
||||||
:data-source="dataList"
|
:data-source="dataList"
|
||||||
:showHeader="false"
|
|
||||||
:rowKey="record => record.id">
|
:rowKey="record => record.id">
|
||||||
<span slot="action" slot-scope="text, record, index">
|
<span slot="action" slot-scope="text, record, index">
|
||||||
<a v-if="index % 3 == 1" @click="$refs.userForm.edit(record)">添加课程</a>
|
<a v-if="index % 3 == 1" @click="$refs.userForm.edit(record)">添加课程</a>
|
||||||
|
|
|
@ -12,21 +12,27 @@
|
||||||
<br />
|
<br />
|
||||||
<a-card title="集中培训" :bodyStyle="{padding: '0px !important'}">
|
<a-card title="集中培训" :bodyStyle="{padding: '0px !important'}">
|
||||||
<a slot="extra" href="#">查看更多</a>
|
<a slot="extra" href="#">查看更多</a>
|
||||||
|
<CentralizedTraining></CentralizedTraining>
|
||||||
</a-card>
|
</a-card>
|
||||||
<br />
|
<br />
|
||||||
<a-card title="系统推荐课程" :bodyStyle="{padding: '0px !important'}">
|
<a-card title="系统推荐课程" :bodyStyle="{padding: '0px !important'}">
|
||||||
<a slot="extra" href="#">查看更多</a>
|
<a slot="extra" href="#">查看更多</a>
|
||||||
|
<CourseRecommendation></CourseRecommendation>
|
||||||
</a-card>
|
</a-card>
|
||||||
</a-card>
|
</a-card>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import MyCourseList from './MyCourseList.vue'
|
import MyCourseList from './MyCourseList.vue' // 我的课程
|
||||||
import TrainingPlan from './TrainingPlan.vue'
|
import TrainingPlan from './TrainingPlan.vue' // 培训计划
|
||||||
|
import CentralizedTraining from './CentralizedTraining.vue' // 集中培训
|
||||||
|
import CourseRecommendation from './CourseRecommendation.vue' // 课程推荐
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
MyCourseList,
|
MyCourseList,
|
||||||
TrainingPlan
|
TrainingPlan,
|
||||||
|
CentralizedTraining,
|
||||||
|
CourseRecommendation
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
|
Loading…
Reference in New Issue