项目管理更新

This commit is contained in:
Yuanjianghong 2021-09-11 16:42:41 +08:00
parent ccc21b9820
commit 8fbeb58010
7 changed files with 267 additions and 123 deletions

View File

@ -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>

View File

@ -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-card :bordered="false" :title="title">
<a-steps class="steps" :current="currentTab">
<a-step title="基本信息" />
<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"/>
<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>
</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 = "新增项目"
add(type) {
this.modalTitle = '新增项目'
this.visible = true
this.formLoading = false
},
//
edit (record) {
edit(record) {
console.log(record)
this.modalTitle = "编辑项目"
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 {
.steps {
max-width: 750px;
margin: 16px auto;
}
}
</style>

View File

@ -73,8 +73,6 @@ 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) {
@ -83,16 +81,14 @@ export default {
this.handleCancel()
} else {
this.$message.error('新增失败:' + res.msg)
}
})
} else {
return false
this.handleCancel()
}
})
},
handleCancel(e) {
// console.log('Clicked cancel button')
this.$refs.table.refresh()
// this.$refs.table.refresh()
this.$parent.handleRefresh(false)
this.visible = false
},
},

View File

@ -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: {},
}

View File

@ -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 @@
//jsjsjson
//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>

View File

@ -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,

View File

@ -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>
//jsjsjson
//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>