项目详情列表更新
This commit is contained in:
hbzgyjh
parent
9d6ba97e74
commit
dc422a1d76
|
|
@ -1,342 +1,137 @@
|
|||
<template>
|
||||
<a-card :bordered="false" title="终端培训详情">
|
||||
<a-card :bordered="false" title="项目详情">
|
||||
<template slot="extra">
|
||||
<a-button size="small" @click="close">返回</a-button>
|
||||
<a-button size="small" @click="goBack">返回</a-button>
|
||||
</template>
|
||||
<page-header-wrapper title="项目基础信息">
|
||||
<template v-slot:content>
|
||||
<a-descriptions size="small" :column="isMobile ? 1 : 2">
|
||||
<a-descriptions-item label="项目名称">曲丽丽</a-descriptions-item>
|
||||
|
||||
<a-descriptions-item label="培训类型">2017-07-07</a-descriptions-item>
|
||||
<a-descriptions-item label="培训种类"><a href="">12421</a></a-descriptions-item>
|
||||
<a-descriptions-item label="培训方式">2017-07-07</a-descriptions-item>
|
||||
|
||||
<a-descriptions-item label="培训时间">XX 服务</a-descriptions-item>
|
||||
<a-descriptions-item label="练习类型">2017-07-07</a-descriptions-item>
|
||||
<a-descriptions-item label="考试时间">2017-07-07</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="补考">
|
||||
<a-radio :default-checked="false" :disabled="disabled"> Disabled </a-radio>
|
||||
<a-radio default-checked :disabled="disabled"> Disabled </a-radio>
|
||||
</a-descriptions-item> -->
|
||||
<a-descriptions-item label="备注">请于两个工作日内确认</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</template>
|
||||
|
||||
<!-- <template v-slot:extraContent>
|
||||
<a-row class="status-list">
|
||||
<a-col :xs="12" :sm="12">
|
||||
<div class="text">状态</div>
|
||||
<div class="heading">待审批</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template> -->
|
||||
|
||||
<!-- <a-card :bordered="false" title="流程进度">
|
||||
<a-steps :direction="(isMobile && 'vertical') || 'horizontal'" :current="1" progressDot>
|
||||
<a-step>
|
||||
<template v-slot:title>
|
||||
<span>创建项目</span>
|
||||
</template>
|
||||
<template v-slot:description>
|
||||
<div class="antd-pro-pages-profile-advanced-style-stepDescription">
|
||||
曲丽丽
|
||||
<a-icon type="dingding" style="margin-left: 8px" />
|
||||
<div>2016-12-12 12:32</div>
|
||||
</div>
|
||||
</template>
|
||||
</a-step>
|
||||
<a-step>
|
||||
<template v-slot:title>
|
||||
<span>部门初审</span>
|
||||
</template>
|
||||
<template v-slot:description>
|
||||
<div class="antd-pro-pages-profile-advanced-style-stepDescription">
|
||||
周毛毛
|
||||
<a-icon type="dingding" style="color: rgb(0, 160, 233); margin-left: 8px" />
|
||||
<div><a>催一下</a></div>
|
||||
</div>
|
||||
</template>
|
||||
</a-step>
|
||||
<a-step title="财务复核" />
|
||||
<a-step title="完成" />
|
||||
</a-steps>
|
||||
</a-card> -->
|
||||
|
||||
<a-card style="margin-top: 24px" :bordered="false" title="用户信息">
|
||||
<a-descriptions>
|
||||
<a-descriptions-item label="用户姓名">付晓晓</a-descriptions-item>
|
||||
<a-descriptions-item label="会员卡号">32943898021309809423</a-descriptions-item>
|
||||
<a-descriptions-item label="身份证">3321944288191034921</a-descriptions-item>
|
||||
<a-descriptions-item label="联系方式">18112345678</a-descriptions-item>
|
||||
<a-descriptions-item label="联系地址">浙江省杭州市西湖区黄姑山路工专路交叉路口</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<a-descriptions title="信息组">
|
||||
<a-descriptions-item label="某某数据">725</a-descriptions-item>
|
||||
<a-descriptions-item label="该数据更新时间">2018-08-08</a-descriptions-item>
|
||||
<a-descriptions-item></a-descriptions-item>
|
||||
<a-descriptions-item label="某某数据">725</a-descriptions-item>
|
||||
<a-descriptions-item label="该数据更新时间">2018-08-08</a-descriptions-item>
|
||||
<a-descriptions-item></a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<a-card type="inner" title="多层信息组">
|
||||
<a-descriptions title="组名称" size="small">
|
||||
<a-descriptions-item label="负责人">林东东</a-descriptions-item>
|
||||
<a-descriptions-item label="角色码">1234567</a-descriptions-item>
|
||||
<a-descriptions-item label="所属部门">XX公司-YY部</a-descriptions-item>
|
||||
<a-descriptions-item label="过期时间">2018-08-08</a-descriptions-item>
|
||||
<a-descriptions-item label="描述">这段描述很长很长很长很长很长很长很长很长很长很长很长很长很长很长...</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<a-divider style="margin: 16px 0" />
|
||||
<a-descriptions title="组名称" size="small" :col="1">
|
||||
<a-descriptions-item label="学名">
|
||||
Citrullus lanatus (Thunb.) Matsum. et
|
||||
Nakai一年生蔓生藤本；茎、枝粗壮，具明显的棱。卷须较粗..</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<a-divider style="margin: 16px 0" />
|
||||
<a-descriptions title="组名称" size="small" :col="2">
|
||||
<a-descriptions-item label="负责人">付小小</a-descriptions-item>
|
||||
<a-descriptions-item label="角色码">1234567</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-card>
|
||||
</a-card>
|
||||
|
||||
<a-card style="margin-top: 24px" :bordered="false" title="用户近半年来电记录">
|
||||
<div class="no-data">
|
||||
<a-icon type="frown-o" />暂无数据
|
||||
</div>
|
||||
</a-card>
|
||||
|
||||
<!-- 操作 -->
|
||||
<a-card style="margin-top: 24px" :bordered="false" :tabList="operationTabList" :activeTabKey="operationActiveTabKey" @tabChange="
|
||||
(key) => {
|
||||
this.operationActiveTabKey = key
|
||||
}
|
||||
">
|
||||
<a-table v-if="operationActiveTabKey === '1'" :columns="operationColumns" :dataSource="operation1" :pagination="false">
|
||||
<template slot="status" slot-scope="status">
|
||||
<a-badge :status="status | statusTypeFilter" :text="status | statusFilter" />
|
||||
</template>
|
||||
</a-table>
|
||||
<a-table v-if="operationActiveTabKey === '2'" :columns="operationColumns" :dataSource="operation2" :pagination="false">
|
||||
<template slot="status" slot-scope="status">
|
||||
<a-badge :status="status | statusTypeFilter" :text="status | statusFilter" />
|
||||
</template>
|
||||
</a-table>
|
||||
<a-table v-if="operationActiveTabKey === '3'" :columns="operationColumns" :dataSource="operation3" :pagination="false">
|
||||
<template slot="status" slot-scope="status">
|
||||
<a-badge :status="status | statusTypeFilter" :text="status | statusFilter" />
|
||||
</template>
|
||||
</a-table>
|
||||
</a-card>
|
||||
</page-header-wrapper>
|
||||
<a-card :bordered="false" title="项目基本信息">
|
||||
<a-descriptions size="middle" :column="1" bordered="true">
|
||||
<a-descriptions-item label="项目名称">{{projectBasicInfo.projectName}}</a-descriptions-item>
|
||||
<a-descriptions-item label="培训类型">{{projectBasicInfo.trainType == 1 ? '必修课':'选修课'}}</a-descriptions-item>
|
||||
<a-descriptions-item label="培训种类">{{projectBasicInfo.trainClassName}}</a-descriptions-item>
|
||||
<a-descriptions-item label="培训方式">{{projectBasicInfo.trainWayName}}</a-descriptions-item>
|
||||
<a-descriptions-item label="培训时间">{{projectBasicInfo.trainSdate + ' - ' + projectBasicInfo.trainEdate}}</a-descriptions-item>
|
||||
<a-descriptions-item label="练习时间">{{projectBasicInfo.practiceSdate + ' - ' + projectBasicInfo.practiceEdate}}</a-descriptions-item>
|
||||
<a-descriptions-item label="考试时间">{{projectBasicInfo.examSdate + ' - ' + projectBasicInfo.examEdate}}</a-descriptions-item>
|
||||
<a-descriptions-item label="考试次数">{{projectBasicInfo.examNumber + '次'}}</a-descriptions-item>
|
||||
<a-descriptions-item label="模拟考试">{{projectBasicInfo.mockExam == 1 ? '允许':'不允许'}}</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">{{projectBasicInfo.remark}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-card>
|
||||
<a-card :bordered="false" title="课程信息">
|
||||
<a-table :columns="courseColumns" :data-source="projectBasicInfo.courseLists" size="small" :pagination="false" />
|
||||
</a-card>
|
||||
<a-card :bordered="false" title="人员信息">
|
||||
<a-table :columns="personColumns" :data-source="projectBasicInfo.projectPersonLists" size="small" :pagination="false" />
|
||||
</a-card>
|
||||
<a-card :bordered="false" title="组卷信息">
|
||||
<p>总分 : {{projectBasicInfo.totalScore}}分</p>
|
||||
<a-table :columns="testColumns" :data-source="projectBasicInfo.testPaperTactics" size="small" :pagination="false" />
|
||||
</a-card>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { baseMixin } from '@/store/app-mixin'
|
||||
import { getProjectDetail } from '@/api/project/project';
|
||||
import { STable } from '@/components'
|
||||
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
|
||||
// 例如：import 《组件名称》 from '《组件路径》'
|
||||
|
||||
export default {
|
||||
name: 'Advanced',
|
||||
mixins: [baseMixin],
|
||||
// import引入的组件需要注入到对象中才能使用
|
||||
components: {
|
||||
STable,
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
// 这里存放数据
|
||||
return {
|
||||
tabList: [
|
||||
{ key: 'detail', tab: '详情' },
|
||||
{ key: 'rule', tab: '规则' },
|
||||
],
|
||||
tabActiveKey: 'detail',
|
||||
projectId: this.$route.query.projectId || '', //项目id
|
||||
projectBasicInfo: {}, //项目基本信息
|
||||
unitTable: [],
|
||||
courseTable: [], //课程列表
|
||||
personTable: [], //人员列表
|
||||
|
||||
operationTabList: [
|
||||
{
|
||||
key: '1',
|
||||
tab: '操作日志一',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
tab: '操作日志二',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
tab: '操作日志三',
|
||||
},
|
||||
courseColumns: [ //课程列
|
||||
{ title: '序号', key: 'id', dataIndex: 'id', width: 60, scopedSlots: { customRender: 'serial' } },
|
||||
{ title: '课程编号', dataIndex: 'courseCode', key: 'courseCode' },
|
||||
{ title: '课程名称', dataIndex: 'courseName', key: 'courseName', },
|
||||
{ title: '课时', key: 'courseHours', dataIndex: 'courseHours', customRender: (text) => text + '小时' },
|
||||
{ title: '学时要求', dataIndex: 'learnHours', key: 'learnHours', customRender: (text) => text + '小时' },
|
||||
{ title: '题量', dataIndex: 'topicNumber', key: 'topicNumber' }
|
||||
],
|
||||
operationActiveTabKey: '1',
|
||||
|
||||
operationColumns: [
|
||||
{
|
||||
title: '操作类型',
|
||||
dataIndex: 'type',
|
||||
key: 'type',
|
||||
},
|
||||
{
|
||||
title: '操作人',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
},
|
||||
{
|
||||
title: '执行结果',
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
scopedSlots: { customRender: 'status' },
|
||||
},
|
||||
{
|
||||
title: '操作时间',
|
||||
dataIndex: 'updatedAt',
|
||||
key: 'updatedAt',
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
key: 'remark',
|
||||
},
|
||||
personColumns: [ //人员列
|
||||
{ title: '序号', key: 'id', dataIndex: 'id', width: 60, scopedSlots: { customRender: 'serial' } },
|
||||
{ title: '姓名', dataIndex: 'name', key: 'name' },
|
||||
{ title: '受训角色', dataIndex: 'role', key: 'role', },
|
||||
{ title: '单位信息', key: 'company', dataIndex: 'company', },
|
||||
{ title: '部门信息', dataIndex: 'department', key: 'department', },
|
||||
],
|
||||
operation1: [
|
||||
{
|
||||
key: 'op1',
|
||||
type: '订购关系生效',
|
||||
name: '曲丽丽',
|
||||
status: 'agree',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '-',
|
||||
},
|
||||
{
|
||||
key: 'op2',
|
||||
type: '财务复审',
|
||||
name: '付小小',
|
||||
status: 'reject',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '不通过原因',
|
||||
},
|
||||
{
|
||||
key: 'op3',
|
||||
type: '部门初审',
|
||||
name: '周毛毛',
|
||||
status: 'agree',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '-',
|
||||
},
|
||||
{
|
||||
key: 'op4',
|
||||
type: '提交订单',
|
||||
name: '林东东',
|
||||
status: 'agree',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '很棒',
|
||||
},
|
||||
{
|
||||
key: 'op5',
|
||||
type: '创建订单',
|
||||
name: '汗牙牙',
|
||||
status: 'agree',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '-',
|
||||
},
|
||||
],
|
||||
operation2: [
|
||||
{
|
||||
key: 'op2',
|
||||
type: '财务复审',
|
||||
name: '付小小',
|
||||
status: 'reject',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '不通过原因',
|
||||
},
|
||||
{
|
||||
key: 'op3',
|
||||
type: '部门初审',
|
||||
name: '周毛毛',
|
||||
status: 'agree',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '-',
|
||||
},
|
||||
{
|
||||
key: 'op4',
|
||||
type: '提交订单',
|
||||
name: '林东东',
|
||||
status: 'agree',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '很棒',
|
||||
},
|
||||
],
|
||||
operation3: [
|
||||
{
|
||||
key: 'op2',
|
||||
type: '财务复审',
|
||||
name: '付小小',
|
||||
status: 'reject',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '不通过原因',
|
||||
},
|
||||
{
|
||||
key: 'op3',
|
||||
type: '部门初审',
|
||||
name: '周毛毛',
|
||||
status: 'agree',
|
||||
updatedAt: '2017-10-03 19:23:12',
|
||||
remark: '-',
|
||||
|
||||
testColumns: [ //组卷列
|
||||
{ title: '序号', key: 'id', dataIndex: 'id', width: 60, scopedSlots: { customRender: 'serial' } },
|
||||
{ title: '题型', dataIndex: 'topicType', key: 'topicType', customRender: (text) => {
|
||||
if (text == 1) return '单选题'
|
||||
if (text == 2) return '多选题'
|
||||
if (text == 3) return '判断题'
|
||||
if (text == 4) return '简答题'
|
||||
if (text == 5) return '填空题'
|
||||
}
|
||||
},
|
||||
{ title: '考试题量', key: 'topicNum', dataIndex: 'topicNum',customRender: (text) => text + '题' },
|
||||
{ title: '单题分值', dataIndex: 'topicScore', key: 'topicScore', customRender: (text) => text + '分/题'},
|
||||
],
|
||||
};
|
||||
},
|
||||
// 计算属性 类似于data概念
|
||||
computed: {},
|
||||
// 监控data中的数据变化
|
||||
watch: {},
|
||||
// 方法集合
|
||||
methods: {
|
||||
//获取数据
|
||||
getData() {
|
||||
getProjectDetail({ id: this.projectId }).then((res) => {
|
||||
this.projectBasicInfo = res.data
|
||||
})
|
||||
},
|
||||
|
||||
//返回
|
||||
goBack() {
|
||||
this.$router.push({
|
||||
path: '/project/list/' + this.$route.query.t,
|
||||
query: {
|
||||
projectPageNum: this.$route.query.projectPageNum
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
agree: '成功',
|
||||
reject: '驳回',
|
||||
}
|
||||
return statusMap[status]
|
||||
},
|
||||
statusTypeFilter(type) {
|
||||
const statusTypeMap = {
|
||||
agree: 'success',
|
||||
reject: 'error',
|
||||
}
|
||||
return statusTypeMap[type]
|
||||
},
|
||||
// 生命周期 - 创建完成（可以访问当前this实例）
|
||||
created() {
|
||||
this.getData();
|
||||
},
|
||||
methods: {
|
||||
handleTabChange(key) {
|
||||
console.log('')
|
||||
this.tabActiveKey = key
|
||||
},
|
||||
},
|
||||
}
|
||||
// 生命周期 - 挂载完成（可以访问DOM元素）
|
||||
mounted() { },
|
||||
// 生命周期 - 创建之前
|
||||
beforeCreate() { },
|
||||
// 生命周期 - 挂载之前
|
||||
beforeMount() { },
|
||||
// 生命周期 - 更新之前
|
||||
beforeUpdate() { },
|
||||
// 生命周期 - 更新之后
|
||||
updated() { },
|
||||
// 生命周期 - 销毁之前
|
||||
beforeDestroy() { },
|
||||
// 生命周期 - 销毁完成
|
||||
destroyed() { },
|
||||
// 如果页面有keep-alive缓存功能，这个函数会触发
|
||||
activated() { }
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.detail-layout {
|
||||
margin-left: 44px;
|
||||
}
|
||||
.text {
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
.heading {
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.no-data {
|
||||
color: rgba(0, 0, 0, 0.25);
|
||||
text-align: center;
|
||||
line-height: 64px;
|
||||
font-size: 16px;
|
||||
|
||||
i {
|
||||
font-size: 24px;
|
||||
margin-right: 16px;
|
||||
position: relative;
|
||||
top: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.mobile {
|
||||
.detail-layout {
|
||||
margin-left: unset;
|
||||
}
|
||||
.status-list {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
<style scoped>
|
||||
/* 中国共产党宜昌裕波旭光纺织有限公司委员会,中共湖北省楚天视讯网络有限公司长阳分公司委员会 */
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -80,7 +80,14 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
// 查询参数
|
||||
queryParam: this.$route.query.queryParam || {},
|
||||
queryParam: {
|
||||
projectName: null,
|
||||
status: null,
|
||||
startDate: null,
|
||||
endDate: null,
|
||||
trainWay: null,
|
||||
type: '',
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{ title: '序号', key: 'id', dataIndex: 'id', width: 60, scopedSlots: { customRender: 'serial' } },
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
title: '',
|
||||
currentTab: 1,
|
||||
currentTab: 0,
|
||||
sourcePath: '',
|
||||
t: '',
|
||||
labelCol: {
|
||||
|
|
@ -148,7 +148,7 @@ export default {
|
|||
},
|
||||
//关闭页面，跳转list页面
|
||||
close() {
|
||||
console.log('close------', this.$route.query.t)
|
||||
// console.log('close------', this.$route.query.t)
|
||||
this.$router.push({
|
||||
path: '/project/list/' + this.$route.query.t,
|
||||
query: {
|
||||
|
|
|
|||
|
|
@ -49,17 +49,6 @@ import { orgList } from '@/api/org/org'
|
|||
import { listToTree } from '@/utils/util'
|
||||
|
||||
const treeData = []
|
||||
// { key: '0-0', title: '0-0' },
|
||||
// {
|
||||
// key: '0-1',
|
||||
// title: '0-1',
|
||||
// children: [
|
||||
// { key: '0-1-0', title: '0-1-0' },
|
||||
// { key: '0-1-1', title: '0-1-1' },
|
||||
// ],
|
||||
// },
|
||||
// { key: '0-2', title: '0-3' },
|
||||
// ]
|
||||
|
||||
const transferDataSource = []
|
||||
|
||||
|
|
@ -75,17 +64,6 @@ function isChecked(selectedKeys, eventKey) {
|
|||
return selectedKeys.indexOf(eventKey) !== -1
|
||||
}
|
||||
|
||||
//打开就报错
|
||||
// function handleTreeData(data, targetKeys = []) {
|
||||
// data.forEach((item) => {
|
||||
// item['disabled'] = targetKeys.includes(item.key)
|
||||
// if (item.children) {
|
||||
// handleTreeData(item.children, targetKeys)
|
||||
// }
|
||||
// })
|
||||
// return data
|
||||
// }
|
||||
|
||||
export default {
|
||||
// import引入的组件需要注入到对象中才能使用
|
||||
components: {},
|
||||
|
|
@ -96,7 +74,6 @@ export default {
|
|||
form: this.projectForm,
|
||||
targetKeys: this.projectForm.unitIds || [],
|
||||
dataSource: transferDataSource,
|
||||
// treeData() {return handleTreeData(treeData, this.targetKeys)},
|
||||
treeData: []
|
||||
}
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue