项目管理更新
This commit is contained in:
Yuanjianghong
parent
ccc21b9820
commit
8fbeb58010
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<a-card :bordered="false" title="人员档案">
|
||||
<a-space direction="vertical" style="width: 100%">
|
||||
<a-space direction="horizontal">
|
||||
项目名:
|
||||
|
|
@ -39,16 +39,10 @@
|
|||
</a-space>
|
||||
|
||||
<a-space class="table-operator" direction="horizontal">
|
||||
<a-button v-if="hasPerm('project:add')" type="primary" icon="plus" @click="$refs.projectStepForm.add()">新增项目</a-button>
|
||||
<a-button v-if="hasPerm('project:add')" type="primary" icon="plus" @click="handledCreate">新增项目</a-button>
|
||||
</a-space>
|
||||
|
||||
<s-table
|
||||
ref="table"
|
||||
size="default"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
>
|
||||
<s-table ref="table" size="default" rowKey="id" :columns="columns" :data="loadData" :pageNum="Number(this.$route.query.projectPageNum) || 1">
|
||||
<span slot="serial" slot-scope="text, record, index">
|
||||
{{ index + 1 }}
|
||||
</span>
|
||||
|
|
@ -65,20 +59,17 @@
|
|||
</template>
|
||||
</span>
|
||||
</s-table>
|
||||
<project-step-form ref="projectStepForm"></project-step-form>
|
||||
</a-space>
|
||||
</div>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { STable } from '@/components'
|
||||
import { getProjectList } from '@/api/project/project'
|
||||
import projectStepForm from './ProjectStepForm'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
STable,
|
||||
projectStepForm,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -141,14 +132,17 @@ export default {
|
|||
created() {},
|
||||
methods: {
|
||||
// 增
|
||||
handledCreate() {
|
||||
return this.$router.push(
|
||||
// {name: 'ProjectForm'}
|
||||
{ path: 'project/project/add' }
|
||||
)
|
||||
},
|
||||
handledCreate(record) {
|
||||
this.$router.push({
|
||||
path: '/project/projectStepForm',
|
||||
query: {
|
||||
id: record.id,
|
||||
projectQueryParam: this.queryParam,
|
||||
projectPageNum: this.$refs.table.localPagination.current
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
// @白鸣 发展党员哪个审批信息管理 是哪一级审核才显示，还是审核这一级的上级也能看到
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,32 +1,21 @@
|
|||
<template>
|
||||
|
||||
<a-modal
|
||||
:title="modalTitle"
|
||||
:width="1200"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:destroyOnClose="true"
|
||||
@ok="handleSubmit"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<!-- PageHeader 第二种使用方式 (v-slot) -->
|
||||
<a-card :bordered="false">
|
||||
<a-steps class="steps" :current="currentTab">
|
||||
<a-step title="基本信息" />
|
||||
<a-step title="选择单位" />
|
||||
<a-step title="选择课程" />
|
||||
<a-step title="选择人员" />
|
||||
<a-step title="完成" />
|
||||
</a-steps>
|
||||
<div class="content">
|
||||
<step1 v-if="currentTab === 0" @nextStep="nextStep"/>
|
||||
<step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep"/>
|
||||
<step3 v-if="currentTab === 2" @nextStep="nextStep" @prevStep="prevStep"/>
|
||||
<step4 v-if="currentTab === 3" @nextStep="nextStep" @prevStep="prevStep"/>
|
||||
<step5 v-if="currentTab === 4" @prevStep="prevStep" @finish="finish"/>
|
||||
</div>
|
||||
</a-card>
|
||||
</a-modal>
|
||||
<!-- PageHeader 第二种使用方式 (v-slot) -->
|
||||
<a-card :bordered="false" :title="title">
|
||||
<a-steps class="steps" :current="currentTab">
|
||||
<a-step title="基本信息" />
|
||||
<a-step title="选择单位" />
|
||||
<a-step v-if="['2', '3', '4'].includes(form.trainWay)" title="选择课程" />
|
||||
<a-step title="选择人员" />
|
||||
<a-step title="完成" />
|
||||
</a-steps>
|
||||
<div class="content">
|
||||
<step1 v-if="currentTab === 0" @nextStep="nextStep" />
|
||||
<step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep" />
|
||||
<step3 v-if="currentTab === 2" @nextStep="nextStep" @prevStep="prevStep" />
|
||||
<step4 v-if="currentTab === 3" @nextStep="nextStep" @prevStep="prevStep" />
|
||||
<step5 v-if="currentTab === 4" @prevStep="prevStep" @finish="finish" />
|
||||
</div>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -40,8 +29,9 @@ export default {
|
|||
Step2,
|
||||
Step3,
|
||||
},
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
title:'',
|
||||
currentTab: 0,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
|
|
@ -55,54 +45,52 @@ export default {
|
|||
visible: false,
|
||||
confirmLoading: false,
|
||||
type: '',
|
||||
form: null
|
||||
form: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 新增打开页面初始化
|
||||
add (type) {
|
||||
this.modalTitle = "新增项目"
|
||||
this.visible = true
|
||||
this.formLoading = false
|
||||
},
|
||||
// 编辑打开页面初始化
|
||||
edit (record) {
|
||||
console.log(record)
|
||||
this.modalTitle = "编辑项目"
|
||||
this.visible = true
|
||||
this.formLoading = false
|
||||
},
|
||||
add(type) {
|
||||
this.modalTitle = '新增项目'
|
||||
this.visible = true
|
||||
this.formLoading = false
|
||||
},
|
||||
// 编辑打开页面初始化
|
||||
edit(record) {
|
||||
console.log(record)
|
||||
this.modalTitle = '编辑项目'
|
||||
this.visible = true
|
||||
this.formLoading = false
|
||||
},
|
||||
|
||||
// handler
|
||||
//下一步
|
||||
nextStep () {
|
||||
nextStep() {
|
||||
if (this.currentTab < 5) {
|
||||
this.currentTab += 1
|
||||
}
|
||||
},
|
||||
//上一步
|
||||
prevStep () {
|
||||
console.log("返回上一步")
|
||||
prevStep() {
|
||||
console.log('返回上一步')
|
||||
if (this.currentTab > 0) {
|
||||
this.currentTab -= 1
|
||||
}
|
||||
},
|
||||
finish () {
|
||||
finish() {
|
||||
this.currentTab = 0
|
||||
},
|
||||
handleSubmit() {
|
||||
|
||||
},
|
||||
handleSubmit() {},
|
||||
handleCancel() {
|
||||
this.visible = false;
|
||||
}
|
||||
}
|
||||
this.visible = false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.steps {
|
||||
max-width: 750px;
|
||||
margin: 16px auto;
|
||||
}
|
||||
.steps {
|
||||
max-width: 750px;
|
||||
margin: 16px auto;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -73,26 +73,22 @@ export default {
|
|||
this.visible = true
|
||||
},
|
||||
handleOk(e) {
|
||||
this.$refs.ClassForm.validate((valid) => {
|
||||
if (valid) {
|
||||
this.confirmLoading = true
|
||||
classAdd(this.form).then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.confirmLoading = false
|
||||
this.handleCancel()
|
||||
} else {
|
||||
this.$message.error('新增失败：' + res.msg)
|
||||
}
|
||||
})
|
||||
this.confirmLoading = true
|
||||
classAdd(this.form).then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.confirmLoading = false
|
||||
this.handleCancel()
|
||||
} else {
|
||||
return false
|
||||
this.$message.error('新增失败：' + res.msg)
|
||||
this.handleCancel()
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel(e) {
|
||||
// console.log('Clicked cancel button')
|
||||
this.$refs.table.refresh()
|
||||
// this.$refs.table.refresh()
|
||||
this.$parent.handleRefresh(false)
|
||||
this.visible = false
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -50,15 +50,19 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
handledDel(record) {
|
||||
console.log("delete-id",record)
|
||||
classDel({ids:record.id}).then((res) => {
|
||||
console.log('delete-id', record)
|
||||
classDel({ ids: record.id }).then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.$message.success('删除成功')
|
||||
this.$refs.table.refresh(true)
|
||||
this.handleRefresh(false)
|
||||
}
|
||||
})
|
||||
},
|
||||
getData() {},
|
||||
// 搜索按钮
|
||||
handleRefresh(bool) {
|
||||
this.$refs.table.refresh(bool)
|
||||
},
|
||||
},
|
||||
created: {},
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,24 +1,41 @@
|
|||
<template>
|
||||
<a-modal
|
||||
id="modal"
|
||||
:title="modalTitle"
|
||||
:width="1000"
|
||||
:width="1200"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:destroyOnClose="true"
|
||||
@ok="handleSubmit"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<a-layout>
|
||||
<a-layout-sider>
|
||||
<a-row type="flex" justify="center" align="top">
|
||||
<a-col :span="6">
|
||||
<a-menu v-model="current" mode="horizontal">
|
||||
<a-menu-item key="mail"> <a-icon type="mail" />系统课程</a-menu-item>
|
||||
<a-menu-item key="app"> <a-icon type="appstore" />自制课程</a-menu-item>
|
||||
</a-menu>
|
||||
</a-layout-sider>
|
||||
<a-layout>
|
||||
<a-layout-content>Content</a-layout-content>
|
||||
</a-layout>
|
||||
</a-layout>
|
||||
<a-input-search style="margin-bottom: 8px" placeholder="Search" @change="onChange" />
|
||||
<a-tree
|
||||
:expanded-keys="expandedKeys"
|
||||
:auto-expand-parent="autoExpandParent"
|
||||
:tree-data="gData"
|
||||
@expand="onExpand"
|
||||
>
|
||||
<template slot="title" slot-scope="{ title }">
|
||||
<span v-if="title.indexOf(searchValue) > -1">
|
||||
{{ title.substr(0, title.indexOf(searchValue)) }}
|
||||
<span style="color: #f50">{{ searchValue }}</span>
|
||||
{{ title.substr(title.indexOf(searchValue) + searchValue.length) }}
|
||||
</span>
|
||||
<span v-else>{{ title }}</span>
|
||||
</template>
|
||||
</a-tree>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<p class="height-50">col-4</p>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
|
|
@ -26,6 +43,10 @@
|
|||
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
|
||||
//例如：import 《组件名称》 from '《组件路径》'
|
||||
|
||||
/**------------------------------------------------------------ */
|
||||
|
||||
/**----------------------------------------------------------------- */
|
||||
|
||||
export default {
|
||||
//import引入的组件需要注入到对象中才能使用
|
||||
components: {},
|
||||
|
|
@ -36,6 +57,11 @@ export default {
|
|||
visible: false,
|
||||
confirmLoading: false,
|
||||
current: ['mail'],
|
||||
|
||||
expandedKeys: [],
|
||||
searchValue: '',
|
||||
autoExpandParent: true,
|
||||
gData,
|
||||
}
|
||||
},
|
||||
//计算属性 类似于data概念
|
||||
|
|
@ -61,6 +87,27 @@ export default {
|
|||
this.visible = false
|
||||
this.formLoading = false
|
||||
},
|
||||
onExpand(expandedKeys) {
|
||||
this.expandedKeys = expandedKeys
|
||||
this.autoExpandParent = false
|
||||
},
|
||||
onChange(e) {
|
||||
console.log(this.gData)
|
||||
const value = e.target.value
|
||||
const expandedKeys = dataList
|
||||
.map((item) => {
|
||||
if (item.title.indexOf(value) > -1) {
|
||||
return getParentKey(item.key, gData)
|
||||
}
|
||||
return null
|
||||
})
|
||||
.filter((item, i, self) => item && self.indexOf(item) === i)
|
||||
Object.assign(this, {
|
||||
expandedKeys,
|
||||
searchValue: value,
|
||||
autoExpandParent: true,
|
||||
})
|
||||
},
|
||||
},
|
||||
created() {}, //生命周期 - 创建完成（可以访问当前this实例）
|
||||
mounted() {}, //生命周期 - 挂载完成（可以访问DOM元素）
|
||||
|
|
@ -74,24 +121,4 @@ export default {
|
|||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
#components-layout-demo-basic {
|
||||
text-align: center;
|
||||
}
|
||||
#components-layout-demo-basic .ant-layout-sider {
|
||||
background: #3ba0e9;
|
||||
color: #fff;
|
||||
line-height: 150px;
|
||||
}
|
||||
#components-layout-demo-basic .ant-layout-content {
|
||||
background: rgba(16, 142, 233, 1);
|
||||
color: #fff;
|
||||
min-height: 1100px;
|
||||
line-height: 120px;
|
||||
}
|
||||
#components-layout-demo-basic > .ant-layout {
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
#components-layout-demo-basic > .ant-layout:last-child {
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -5,7 +5,7 @@
|
|||
<a-row :gutter="24">
|
||||
<a-col :md="24" :sm="24">
|
||||
<a-form-model-item label="项目名称">
|
||||
<a-input v-decorator="['projectName',{rules: [{required: true, min: 1, message: '请输入项目名称！'}]}]" />
|
||||
<a-input v-model="form.projectName" />
|
||||
</a-form-model-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
|
@ -129,7 +129,7 @@ export default {
|
|||
labelCol: { span: 4 },
|
||||
wrapperCol: { span: 14 },
|
||||
personType: [],
|
||||
form: this.$form.createForm(this, { name: 'project' }),
|
||||
form: {},
|
||||
modalTitle: '新增项目',
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,135 @@
|
|||
<template>
|
||||
<a-card :bordered="false" title="终端培训列表">
|
||||
<div class="table-page-search-wrapper">
|
||||
<SearchCom
|
||||
:form="queryParam"
|
||||
:list="queryOptions"
|
||||
@search="handleRefresh"
|
||||
@reset="
|
||||
() => {
|
||||
;(queryParam = {}), handleRefresh()
|
||||
}
|
||||
"
|
||||
></SearchCom>
|
||||
</div>
|
||||
<s-table ref="table" size="small" rowKey="id" :columns="columns" :data="loadData" :pageNum="Number(this.$route.query.archivesUserPageNum) || 1">
|
||||
<template slot="action" slot-scope="text, record">
|
||||
<a href="javascript:;" @click="handleRefresh()">项目档案</a>
|
||||
<a-divider type="vertical" />
|
||||
<a href="javascript:;" @click="handleRefresh()">自学档案</a>
|
||||
<br />
|
||||
<a href="javascript:;" @click="handleRefresh()">违章档案</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确认导出?" cancelText="取消" okText="确认" @confirm="() => handleDelete(record)">
|
||||
<a href="javascript:;"> 导出 </a>
|
||||
</a-popconfirm>
|
||||
</template>
|
||||
</s-table>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
|
||||
//例如：import 《组件名称》 from '《组件路径》'
|
||||
import {SearchCom} from '@/components/SearchCom'
|
||||
|
||||
export default {
|
||||
//import引入的组件需要注入到对象中才能使用
|
||||
components: { SearchCom },
|
||||
props: {},
|
||||
data() {
|
||||
//这里存放数据
|
||||
return {
|
||||
queryParam: {
|
||||
status: this.$route.query.terminalTrainQueryProjectStatus || '',
|
||||
projectName: this.$route.query.terminalTrainQueryProjectName || '',
|
||||
startDate: this.$route.query.terminalTrainQueryStartDate || '',
|
||||
endDate: this.$route.query.terminalTrainQueryEndDate || '',
|
||||
},
|
||||
columns: [
|
||||
{ title: '项目名称', width: 'auto', align: 'center', dataIndex: 'projectName', key: 'projectName' },
|
||||
{ title: '项目时间', width: 'auto', align: 'center', dataIndex: 'projectData', key: 'projectData' },
|
||||
{ title: '受训角色', width: 'auto', align: 'center', dataIndex: 'roleName', key: 'roleName' },
|
||||
{ title: '应修学时', width: 'auto', align: 'center', dataIndex: 'mustClassHour', key: 'mustClassHour' },
|
||||
{ title: '已修学时', width: 'auto', align: 'center', dataIndex: 'alreadyClassHour', key: 'alreadyClassHour' },
|
||||
{
|
||||
title: '完成状态',
|
||||
width: 'auto',
|
||||
align: 'center',
|
||||
dataIndex: 'finishState',
|
||||
key: 'finishState',
|
||||
customRender: (text, record, index) => {
|
||||
// 完成状态 0-未完成 1-已完成
|
||||
if (text == 0) return '未完成'
|
||||
else if (text == 1) return '已完成'
|
||||
},
|
||||
},
|
||||
{ title: '总练习题量', width: 'auto', align: 'center', dataIndex: 'addUpExercises', key: 'addUpExercises' },
|
||||
{ title: '已练习题量', width: 'auto', align: 'center', dataIndex: 'alreadyExercises', key: 'alreadyExercises' },
|
||||
{ title: '答对题量', width: 'auto', align: 'center', dataIndex: 'yesTopic', key: 'yesTopic' },
|
||||
{ title: '正确率', width: 'auto', align: 'center', dataIndex: 'yesRate', key: 'yesRate' },
|
||||
{ title: '考试成绩', width: 'auto', align: 'center', dataIndex: 'testResult', key: 'testResult' },
|
||||
{ title: '补考成绩', width: 'auto', align: 'center', dataIndex: 'mendTestResult', key: 'mendTestResult' },
|
||||
{ title: '考试耗时', width: 'auto', align: 'center', dataIndex: 'testTime', key: 'testTime' },
|
||||
{
|
||||
title: '考试状态',
|
||||
width: 'auto',
|
||||
align: 'center',
|
||||
dataIndex: 'testState',
|
||||
key: 'testState',
|
||||
customRender: (text, record, index) => {
|
||||
// 考试状态 0-不合格 1-合格
|
||||
if (text == 0) return '不合格'
|
||||
else if (text == 1) return '合格'
|
||||
},
|
||||
},
|
||||
{ title: '操作', width: '90px', key: 'operation', align: 'center', scopedSlots: { customRender: 'action' } },
|
||||
],
|
||||
loadData: parameter => { return getArchivesUserList(Object.assign(parameter, this.queryParam)).then(res => { return res }) }
|
||||
}
|
||||
},
|
||||
//计算属性 类似于data概念
|
||||
computed: {
|
||||
queryOptions: function () {
|
||||
return [
|
||||
{ type: 'input', placeholder: '项目名称', key: 'projectName' },
|
||||
/** 培训状态：1-未发布 2-未开始 3-进行中 4-已结束 5-已中止 */
|
||||
{
|
||||
type: 'select',
|
||||
placeholder: '项目状态',
|
||||
key: 'status',
|
||||
options: [
|
||||
{ id: '', name: '全部' },
|
||||
{ id: '1', name: '未发布' },
|
||||
{ id: '2', name: '未开始' },
|
||||
{ id: '3', name: '进行中' },
|
||||
{ id: '4', name: '已结束' },
|
||||
{ id: '5', name: '已终止' },
|
||||
],
|
||||
},
|
||||
{ type: 'date', placeholder: '开始时间', key: 'startDate' },
|
||||
{ type: 'date', placeholder: '结束时间', key: 'endDate' },
|
||||
]
|
||||
},
|
||||
},
|
||||
//监控data中的数据变化
|
||||
watch: {},
|
||||
//方法集合
|
||||
methods: {
|
||||
handleRefresh() {
|
||||
console.log('handleRefresh')
|
||||
},
|
||||
},
|
||||
created() {}, //生命周期 - 创建完成（可以访问当前this实例）
|
||||
mounted() {}, //生命周期 - 挂载完成（可以访问DOM元素）
|
||||
beforeCreate() {}, //生命周期 - 创建之前
|
||||
beforeMount() {}, //生命周期 - 挂载之前
|
||||
beforeUpdate() {}, //生命周期 - 更新之前
|
||||
updated() {}, //生命周期 - 更新之后
|
||||
beforeDestroy() {}, //生命周期 - 销毁之前
|
||||
destroyed() {}, //生命周期 - 销毁完成
|
||||
activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
</style>
|
||||
Loading…
Reference in New Issue