档案管理界面调整

This commit is contained in:
qinjie 2021-09-11 00:30:41 +08:00
parent 8eba84f6a1
commit 5e81d39c86
5 changed files with 214 additions and 107 deletions

View File

@ -1,30 +1,25 @@
<template> <template>
<page-header-wrapper :title="false"> <a-card :bordered="false" title="人员档案">
<!-- 是否有边框 bordered --> <div class="table-page-search-wrapper">
<a-card :bordered="false"> <SearchCom :form="queryParam" :list="queryOptions" :orgTree="orgTreeOptions" @search="handleRefresh" @reset="() => {queryParam = {}, handleRefresh()}"></SearchCom>
<div class="table-page-search-wrapper"> <div style="width: 100%; height: 32px; margin-bottom: 8px;">
<SearchCom :form="queryParam" :list="queryOptions" :orgTree="orgTreeOptions" @search="handleRefresh" @reset="() => {queryParam = {}, handleRefresh()}"></SearchCom> <a-button type="primary" :style="{float: 'right'}">导出</a-button>
<div style="width: 100%; height: 32px; margin-bottom: 8px;">
<a-button type="primary" :style="{float: 'right'}">导出</a-button>
</div>
</div> </div>
<s-table ref="table" size="default" rowKey="id" :columns="columns" :data="loadData"> </div>
<template slot="action" slot-scope="text, record"> <s-table ref="table" size="small" rowKey="id" :columns="columns" :data="loadData" :pageNum="Number(this.$route.query.archivesUserPageNum) || 1">
<a href="javascript:;" @click="archivesProject(record)">项目档案</a> <template slot="action" slot-scope="text, record">
<a-divider type="vertical" /> <a href="javascript:;" @click="archivesProject(record)">项目档案</a>
<a href="javascript:;" @click="archivesSelfStudy(record)">自学档案</a> <a-divider type="vertical" />
<br /> <a href="javascript:;" @click="archivesSelfStudy(record)">自学档案</a>
<a href="javascript:;">违章档案</a> <br />
<a-divider type="vertical" /> <a href="javascript:;" @click="archivesViolation(record)">违章档案</a>
<a-popconfirm title="确认导出?" cancelText="取消" okText="确认" @confirm="() => handleDelete(record)"> <a-divider type="vertical" />
<a href="javascript:;"> 导出 </a> <a-popconfirm title="确认导出?" cancelText="取消" okText="确认" @confirm="() => handleDelete(record)">
</a-popconfirm> <a href="javascript:;"> 导出 </a>
</template> </a-popconfirm>
</s-table> </template>
</a-card> </s-table>
</page-header-wrapper> </a-card>
<!-- 搜索区 -->
<!-- -->
</template> </template>
<script> <script>
@ -35,7 +30,7 @@ export default {
components: { STable, SearchCom, orgTree }, components: { STable, SearchCom, orgTree },
data() { data() {
return { return {
queryParam: { name: '', orgId: '' }, queryParam: { name: this.$route.query.archivesUserName || '', orgId: this.$route.query.archivesUserOrgId || '' },
columns: [ columns: [
{ title: '姓名', width: '100px', align: 'center', dataIndex: 'name', key: 'name' }, { title: '姓名', width: '100px', align: 'center', dataIndex: 'name', key: 'name' },
{ title: '受训角色', width: 'auto', align: 'center', dataIndex: 'roleName', key: 'roleName' }, { title: '受训角色', width: 'auto', align: 'center', dataIndex: 'roleName', key: 'roleName' },
@ -57,7 +52,7 @@ export default {
] ]
}, },
orgTreeOptions: () => { orgTreeOptions: () => {
return { ifshow: true, formKey: 'orgId', startOrganizationId: '' }; return { ifshow: true, formKey: 'orgId', startOrganizationId: '', defaultOrganizationId: '' };
} }
}, },
methods: { methods: {
@ -66,11 +61,22 @@ export default {
}, },
// //
archivesProject(record) { archivesProject(record) {
this.$router.push({ path: '/archives/user/Project', query: { id: record.id } }); this.$router.push({
path: '/archives/user/Project', query: {
id: record.id,
archivesUserName: this.queryParam.name,
archivesUserOrgId: this.queryParam.orgId,
archivesUserPageNum: this.$refs.table.localPagination.current
}
});
}, },
// //
archivesSelfStudy(record) { archivesSelfStudy(record) {
this.$router.push({ path: '/archives/user/SelfStudy', query: { id: record.id } }); this.$router.push({ path: '/archives/user/SelfStudy', query: { id: record.id } });
},
//
archivesViolation(record) {
this.$router.push({ path: '/archives/user/Violation', query: { id: record.id } });
} }
} }
} }
@ -78,7 +84,9 @@ export default {
<style scoped> <style scoped>
.table-page-search-wrapper-button-group { .table-page-search-wrapper-button-group {
width: 100%; width: 100%;
margin-bottom: 8px; margin-bottom: 8px;
} }
.ant-card-body {
padding: 15px;
}
</style> </style>

View File

@ -1,34 +1,33 @@
<template> <template>
<page-header-wrapper :title="false"> <a-card :bordered="false" title="项目档案">
<a-tabs :animated="false" default-active-key="1" @change="callback" :style="{backgroundColor: '#fff'}"> <template slot="extra">
<a-button size="small" @click="close">返回</a-button>
</template>
<a-tabs :animated="false" :default-active-key="this.$route.query.defaultActiveKey || '1'" @change="callback" :headStyle="{paddingTop: '0px'}">
<a-tab-pane key="1" tab="自主培训"> <a-tab-pane key="1" tab="自主培训">
<a-card :bordered="false" :bodyStyle="{paddingTop: '0px'}"> <div class="table-page-search-wrapper">
<div class="table-page-search-wrapper"> <SearchCom :form="tabs1.queryParam" :list="tabs1QueryOptions" @search="tabs1HandleRefresh" @reset="() => {queryParam = {}, tabs1HandleRefresh()}"></SearchCom>
<SearchCom :form="tabs1.queryParam" :list="tabs1QueryOptions" @search="tabs1HandleRefresh" @reset="() => {queryParam = {}, tabs1HandleRefresh()}"></SearchCom> </div>
</div> <s-table ref="table1" size="small" rowKey="id" :columns="tabs1.columns" :data="tabs1.loadData" :pageNum="Number(this.$route.query.archivesUserProjectTable1PageNum) || 1">
<s-table ref="table1" size="default" rowKey="id" :columns="tabs1.columns" :data="tabs1.loadData"> <template slot="action" slot-scope="text, record">
<template slot="action" slot-scope="text, record"> <a href="javascript:;" @click="trainDetail(record)">培训详情</a>
<a href="javascript:;" @click="trainDetail(record)">培训详情</a> <br />
<br /> <a href="javascript:;" @click="trainAnswer(record)">答题记录</a>
<a href="javascript:;" @click="trainAnswer(record)">答题记录</a> </template>
</template> </s-table>
</s-table>
</a-card>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="2" tab="终端培训" force-render> <a-tab-pane key="2" tab="终端培训" force-render>
<a-card :bordered="false" :bodyStyle="{paddingTop: '0px'}"> <div class="table-page-search-wrapper">
<div class="table-page-search-wrapper"> <SearchCom :form="tabs2.queryParam" :list="tabs2QueryOptions" @search="tabs2HandleRefresh" @reset="() => {queryParam = {}, tabs2HandleRefresh()}"></SearchCom>
<SearchCom :form="tabs2.queryParam" :list="tabs2QueryOptions" @search="tabs2HandleRefresh" @reset="() => {queryParam = {}, tabs2HandleRefresh()}"></SearchCom> </div>
</div> <s-table ref="table2" size="small" rowKey="id" :columns="tabs2.columns" :data="tabs2.loadData" :pageNum="Number(this.$route.query.archivesUserProjectTable2PageNum) || 1">
<s-table ref="table2" size="default" rowKey="id" :columns="tabs2.columns" :data="tabs2.loadData"> <template slot="action" slot-scope="text, record">
<template slot="action" slot-scope="text, record"> <a href="javascript:;" @click="terminalTrainDetail(record)">查看详情</a>
<a href="javascript:;" @click="terminalTrainDetail(record)">查看详情</a> </template>
</template> </s-table>
</s-table>
</a-card>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
</page-header-wrapper> </a-card>
</template> </template>
<script> <script>
@ -41,7 +40,10 @@ export default {
return { return {
userid: this.$route.query.id, userid: this.$route.query.id,
tabs1: { tabs1: {
queryParam: { projectName: '', finishState: '' }, queryParam: {
projectName: this.$route.query.archivesUserProjectTable1ProjectName || '',
finishState: this.$route.query.archivesUserProjectTable1FinishState || ''
},
columns: [ columns: [
{ title: '项目名称', width: 'auto', align: 'center', dataIndex: 'projectName', key: 'projectName' }, { title: '项目名称', width: 'auto', align: 'center', dataIndex: 'projectName', key: 'projectName' },
{ title: '项目时间', width: 'auto', align: 'center', dataIndex: 'projectData', key: 'projectData' }, { title: '项目时间', width: 'auto', align: 'center', dataIndex: 'projectData', key: 'projectData' },
@ -69,10 +71,10 @@ export default {
}, },
{ title: '操作', width: '90px', key: 'operation', align: 'center', scopedSlots: { customRender: 'action' } } { title: '操作', width: '90px', key: 'operation', align: 'center', scopedSlots: { customRender: 'action' } }
], ],
loadData: parameter => { return getArchivesUserAutoTrainList(Object.assign(parameter, this.queryParam)).then(res => { return res }) } loadData: parameter => { return getArchivesUserAutoTrainList(Object.assign(parameter, this.tabs1.queryParam)).then(res => { return res }) }
}, },
tabs2: { tabs2: {
queryParam: { projectName: '' }, queryParam: { projectName: this.$route.query.archivesUserProjectTable2projectName || '' },
columns: [ columns: [
{ title: '项目名称', width: 'auto', align: 'center', dataIndex: 'projectName', key: 'projectName' }, { title: '项目名称', width: 'auto', align: 'center', dataIndex: 'projectName', key: 'projectName' },
{ title: '项目时间', width: 'auto', align: 'center', dataIndex: 'projectData', key: 'projectData' }, { title: '项目时间', width: 'auto', align: 'center', dataIndex: 'projectData', key: 'projectData' },
@ -87,7 +89,7 @@ export default {
}, },
{ title: '操作', width: '90px', key: 'operation', align: 'center', scopedSlots: { customRender: 'action' } } { title: '操作', width: '90px', key: 'operation', align: 'center', scopedSlots: { customRender: 'action' } }
], ],
loadData: parameter => { return getArchivesUserTerminalTrainList(Object.assign(parameter, this.queryParam)).then(res => { return res }) } loadData: parameter => { return getArchivesUserTerminalTrainList(Object.assign(parameter, this.tabs2.queryParam)).then(res => { return res }) }
} }
} }
}, },
@ -112,8 +114,13 @@ export default {
}, },
methods: { methods: {
callback(key) { callback(key) {
if (key === '1') this.tabs1HandleRefresh(); if (key === '1') {
else this.tabs2HandleRefresh(); this.tabs1.queryParam = {};
this.tabs1HandleRefresh();
} else {
this.tabs2.queryParam = {};
this.tabs2HandleRefresh();
}
}, },
tabs1HandleRefresh() { tabs1HandleRefresh() {
this.$refs.table1.refresh(true) this.$refs.table1.refresh(true)
@ -123,15 +130,60 @@ export default {
}, },
// //
trainDetail(record) { trainDetail(record) {
this.$router.push({ path: '/archives/user/ProjectDetail', query: { userId: this.userid, projectId: record.id } }); this.$router.push({
path: '/archives/user/ProjectDetail', query: {
userId: this.userid,
projectId: record.id,
archivesUserName: this.$route.query.archivesUserName,
archivesUserOrgId: this.$route.query.archivesUserOrgId,
archivesUserPageNum: this.$route.query.archivesUserPageNum,
archivesUserProjectTable1ProjectName: this.tabs1.queryParam.projectName,
archivesUserProjectTable1FinishState: this.tabs1.queryParam.finishState,
archivesUserProjectTable1PageNum: this.$refs.table1.localPagination.current,
defaultActiveKey: 1
}
});
}, },
// //
trainAnswer(record) { trainAnswer(record) {
this.$router.push({ path: '/archives/user/ProjectAnswer', query: { userId: this.userid, projectId: record.id } }); this.$router.push({
path: '/archives/user/ProjectAnswer', query: {
userId: this.userid,
projectId: record.id,
archivesUserName: this.$route.query.archivesUserName,
archivesUserOrgId: this.$route.query.archivesUserOrgId,
archivesUserPageNum: this.$route.query.archivesUserPageNum,
archivesUserProjectTable1ProjectName: this.tabs1.queryParam.projectName,
archivesUserProjectTable1FinishState: this.tabs1.queryParam.finishState,
archivesUserProjectTable1PageNum: this.$refs.table1.localPagination.current,
defaultActiveKey: 1
}
});
}, },
// //
terminalTrainDetail(record) { terminalTrainDetail(record) {
this.$router.push({ path: '/archives/user/TerminalTrainDetail', query: { userId: this.userid, projectId: record.id } }); this.$router.push({
path: '/archives/user/TerminalTrainDetail', query: {
userId: this.userid,
projectId: record.id,
archivesUserName: this.$route.query.archivesUserName,
archivesUserOrgId: this.$route.query.archivesUserOrgId,
archivesUserPageNum: this.$route.query.archivesUserPageNum,
archivesUserProjectTable2projectName: this.tabs2.queryParam.projectName,
archivesUserProjectTable2PageNum: this.$refs.table2.localPagination.current,
defaultActiveKey: 2
}
});
},
//
close() {
this.$router.push({
path: '/archives/user/Index', query: {
archivesUserName: this.$route.query.archivesUserName,
archivesUserOrgId: this.$route.query.archivesUserOrgId,
archivesUserPageNum: this.$route.query.archivesUserPageNum
}
});
} }
} }
} }

View File

@ -1,13 +1,14 @@
<template> <template>
<page-header-wrapper :title="false"> <a-card :bordered="false" title="答题记录">
<a-card :bordered="false"> <template slot="extra">
<s-table ref="table" size="default" rowKey="id" :columns="columns" :data="loadData"> <a-button size="small" @click="close">返回</a-button>
<template slot="action" slot-scope="text, record"> </template>
<a href="javascript:;" @click="trainDetail(record)">答题记录</a> <s-table ref="table" size="default" rowKey="id" :columns="columns" :data="loadData">
</template> <template slot="action" slot-scope="text, record">
</s-table> <a href="javascript:;" @click="trainDetail(record)">答题记录</a>
</a-card> </template>
</page-header-wrapper> </s-table>
</a-card>
</template> </template>
<script> <script>
@ -31,6 +32,22 @@ export default {
} }
}, },
computed: {}, computed: {},
methods: {} methods: {
//
close() {
this.$router.push({
path: '/archives/user/Project', query: {
id: this.$route.query.userId,
archivesUserName: this.$route.query.archivesUserName,
archivesUserOrgId: this.$route.query.archivesUserOrgId,
archivesUserPageNum: this.$route.query.archivesUserPageNum,
archivesUserProjectTable1ProjectName: this.$route.query.archivesUserProjectTable1ProjectName,
archivesUserProjectTable1FinishState: this.$route.query.archivesUserProjectTable1FinishState,
archivesUserProjectTable1PageNum: this.$route.query.archivesUserProjectTable1PageNum,
defaultActiveKey: this.$route.query.defaultActiveKey
}
});
}
}
} }
</script> </script>

View File

@ -1,12 +1,13 @@
<template> <template>
<page-header-wrapper :title="false"> <a-card :bordered="false" title="培训详情">
<a-card :bordered="false"> <template slot="extra">
<div class="table-page-search-wrapper"> <a-button size="small" @click="close">返回</a-button>
<SearchCom :form="queryParam" :list="queryOptions" @search="handleRefresh" @reset="() => {queryParam = {}, handleRefresh()}"></SearchCom> </template>
</div> <div class="table-page-search-wrapper">
<s-table ref="table" size="default" rowKey="id" :columns="columns" :data="loadData"></s-table> <SearchCom :form="queryParam" :list="queryOptions" @search="handleRefresh" @reset="() => {queryParam = {}, handleRefresh()}"></SearchCom>
</a-card> </div>
</page-header-wrapper> <s-table ref="table" size="default" rowKey="id" :columns="columns" :data="loadData"></s-table>
</a-card>
</template> </template>
<script> <script>
@ -17,8 +18,6 @@ export default {
components: { STable, SearchCom }, components: { STable, SearchCom },
data() { data() {
return { return {
userId: this.$route.query.userId,
projectId: this.$route.query.projectId,
queryParam: { userId: this.$route.query.userId, projectId: this.$route.query.projectId, courseName: '' }, queryParam: { userId: this.$route.query.userId, projectId: this.$route.query.projectId, courseName: '' },
columns: [ columns: [
{ title: '课程名称', width: 'auto', align: 'center', dataIndex: 'courseName', key: 'courseName' }, { title: '课程名称', width: 'auto', align: 'center', dataIndex: 'courseName', key: 'courseName' },
@ -47,9 +46,24 @@ export default {
}, },
methods: { methods: {
handleRefresh() { handleRefresh() {
this.queryParam.userId = this.userId; this.queryParam.userId = this.$route.query.userId;
this.queryParam.projectId = this.projectId; this.queryParam.projectId = this.$route.query.projectId;
this.$refs.table.refresh(true) this.$refs.table.refresh(true)
},
//
close() {
this.$router.push({
path: '/archives/user/Project', query: {
id: this.$route.query.userId,
archivesUserName: this.$route.query.archivesUserName,
archivesUserOrgId: this.$route.query.archivesUserOrgId,
archivesUserPageNum: this.$route.query.archivesUserPageNum,
archivesUserProjectTable1ProjectName: this.$route.query.archivesUserProjectTable1ProjectName,
archivesUserProjectTable1FinishState: this.$route.query.archivesUserProjectTable1FinishState,
archivesUserProjectTable1PageNum: this.$route.query.archivesUserProjectTable1PageNum,
defaultActiveKey: this.$route.query.defaultActiveKey
}
});
} }
} }
} }

View File

@ -1,25 +1,26 @@
<template> <template>
<page-header-wrapper :title="false"> <a-card :bordered="false" title="终端培训详情">
<a-card :bordered="false"> <template slot="extra">
<a-descriptions title="集中培训详情" layout="horizontal" bordered size="small" :column="1"> <a-button size="small" @click="close">返回</a-button>
<a-descriptions-item label="培训名称">{{detailData.name}}</a-descriptions-item> </template>
<a-descriptions-item label="培训时间">{{detailData.time}}</a-descriptions-item> <a-descriptions title="集中培训详情" layout="horizontal" bordered size="small" :column="1">
<a-descriptions-item label="主持人">{{detailData.host}}</a-descriptions-item> <a-descriptions-item label="培训名称">{{detailData.name}}</a-descriptions-item>
<a-descriptions-item label="会议人数">{{detailData.personSize}}</a-descriptions-item> <a-descriptions-item label="培训时间">{{detailData.time}}</a-descriptions-item>
<a-descriptions-item label="学习内容">{{detailData.studyContent}}</a-descriptions-item> <a-descriptions-item label="主持人">{{detailData.host}}</a-descriptions-item>
<a-descriptions-item label="联系人">{{detailData.contact}}</a-descriptions-item> <a-descriptions-item label="会议人数">{{detailData.personSize}}</a-descriptions-item>
<a-descriptions-item label="备注">{{detailData.remark}}</a-descriptions-item> <a-descriptions-item label="学习内容">{{detailData.studyContent}}</a-descriptions-item>
</a-descriptions> <a-descriptions-item label="联系人">{{detailData.contact}}</a-descriptions-item>
<br /> <a-descriptions-item label="备注">{{detailData.remark}}</a-descriptions-item>
<a-descriptions title="签到时间" layout="horizontal" bordered size="small" :column="1"> </a-descriptions>
<a-descriptions-item label="时间">{{detailData.signInTime}}</a-descriptions-item> <br />
</a-descriptions> <a-descriptions title="签到时间" layout="horizontal" bordered size="small" :column="1">
<br /> <a-descriptions-item label="时间">{{detailData.signInTime}}</a-descriptions-item>
<a-descriptions title="培训状态" layout="horizontal" bordered size="small" :column="1"> </a-descriptions>
<a-descriptions-item label="状态">{{detailData.state}}</a-descriptions-item> <br />
</a-descriptions> <a-descriptions title="培训状态" layout="horizontal" bordered size="small" :column="1">
</a-card> <a-descriptions-item label="状态">{{detailData.state}}</a-descriptions-item>
</page-header-wrapper> </a-descriptions>
</a-card>
</template> </template>
<script> <script>
@ -35,6 +36,21 @@ export default {
created: function () { created: function () {
let parameter = {}; let parameter = {};
getArchivesUserTerminalTrainDetail(Object.assign(parameter, this.queryParam)).then(res => { this.detailData = res.data }); getArchivesUserTerminalTrainDetail(Object.assign(parameter, this.queryParam)).then(res => { this.detailData = res.data });
},
methods: {
close() {
this.$router.push({
path: '/archives/user/Project', query: {
id: this.$route.query.userId,
archivesUserName: this.$route.query.archivesUserName,
archivesUserOrgId: this.$route.query.archivesUserOrgId,
archivesUserPageNum: this.$route.query.archivesUserPageNum,
archivesUserProjectTable2projectName: this.$route.query.archivesUserProjectTable2projectName,
archivesUserProjectTable2PageNum: this.$route.query.archivesUserProjectTable2PageNum,
defaultActiveKey: this.$route.query.defaultActiveKey
}
});
}
} }
} }
</script> </script>