feat: 自主项目新建部分样式修改
This commit is contained in:
parent
f9e51792e4
commit
9d6ba97e74
|
@ -55,7 +55,7 @@ export default {
|
|||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: 'file' // img: 图片上传, file: 文件上传
|
||||
default: 'img' // img: 图片上传, file: 文件上传
|
||||
},
|
||||
// 最大上传数量
|
||||
max: {
|
||||
|
|
|
@ -1,10 +1,9 @@
|
|||
<template>
|
||||
<!-- PageHeader 第二种使用方式 (v-slot) -->
|
||||
<a-card :bordered="false" :title="title">
|
||||
<a-steps class="steps" type="navigation" :current="currentTab">
|
||||
<a-steps class="steps" :current="currentTab">
|
||||
<a-step title="基本信息" />
|
||||
<a-step title="选择单位" />
|
||||
<!-- v-if="['2', '3', '4'].includes(form.trainWay)" -->
|
||||
<a-step v-if="['2', '3', '4'].includes(form.trainWay)" title="选择课程" />
|
||||
<a-step v-if="['2', '3', '4'].includes(form.trainWay)" title="选择人员" />
|
||||
<a-step v-if="['2', '3', '4'].includes(form.trainWay)" title="组卷策略" />
|
||||
|
@ -23,7 +22,13 @@
|
|||
@executeSave="executeSave"
|
||||
@executeIssue="executeIssue"
|
||||
/>
|
||||
<result v-if="currentTab === 5" :projectForm="form" @prevStep="prevStep" :projectSaveStatus="status" @close="close" />
|
||||
<result
|
||||
v-if="currentTab === 5"
|
||||
:projectForm="form"
|
||||
@prevStep="prevStep"
|
||||
:projectSaveStatus="status"
|
||||
@close="close"
|
||||
/>
|
||||
<!-- </keep-alive> -->
|
||||
</div>
|
||||
</a-card>
|
||||
|
@ -48,13 +53,13 @@ export default {
|
|||
Step3,
|
||||
Step4,
|
||||
step5,
|
||||
result,
|
||||
result
|
||||
},
|
||||
//生命周期 - 创建完成(可以访问当前this实例)
|
||||
created() {
|
||||
console.log('分步表单创建完成',this.$route)
|
||||
console.log('分步表单创建完成', this.$route)
|
||||
if (this.$route.query.projectId) {
|
||||
getProjectDetail({ id: this.$route.query.projectId }).then((res) => {
|
||||
getProjectDetail({ id: this.$route.query.projectId }).then(res => {
|
||||
this.form = res.data
|
||||
})
|
||||
}
|
||||
|
@ -65,16 +70,16 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
title: '',
|
||||
currentTab: 0,
|
||||
currentTab: 1,
|
||||
sourcePath: '',
|
||||
t: '',
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 },
|
||||
sm: { span: 6 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
modalTitle: '新增项目',
|
||||
visible: false,
|
||||
|
@ -84,10 +89,10 @@ export default {
|
|||
t: this.$route.query.t,
|
||||
projectType: this.$route.query.t === 'sys' ? 0 : 1,
|
||||
trainWay: '2',
|
||||
totalScore: '100',
|
||||
totalScore: '100'
|
||||
},
|
||||
result: true,
|
||||
status: '',
|
||||
status: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
@ -107,7 +112,7 @@ export default {
|
|||
|
||||
//发送请求保存数据
|
||||
saveData() {
|
||||
projectAdd(Object.assign({}, this.form)).then((res) => {
|
||||
projectAdd(Object.assign({}, this.form)).then(res => {
|
||||
if (res.code == 200) {
|
||||
this.status = 'success'
|
||||
this.currentTab = 5
|
||||
|
@ -145,14 +150,14 @@ export default {
|
|||
close() {
|
||||
console.log('close------', this.$route.query.t)
|
||||
this.$router.push({
|
||||
path: '/project/list/'+this.$route.query.t,
|
||||
path: '/project/list/' + this.$route.query.t,
|
||||
query: {
|
||||
t: this.$route.query.t,
|
||||
queryParam: this.$route.query.projectQueryParam,
|
||||
},
|
||||
queryParam: this.$route.query.projectQueryParam
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -161,4 +166,8 @@ export default {
|
|||
max-width: 750px;
|
||||
margin: 16px auto;
|
||||
}
|
||||
|
||||
::v-deep .ant-btn + .ant-btn {
|
||||
margin-left: 0px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,12 +1,20 @@
|
|||
<template>
|
||||
<div>
|
||||
<a-card :bordered="false" title="项目基本信息">
|
||||
<template slot="extra">
|
||||
<!-- <template slot="extra">
|
||||
<a-button type="primary" size="default" @click="toNext">下一步</a-button>
|
||||
</template>
|
||||
<template slot="extra">
|
||||
<a-button type="primary" size="default" @click="close">退出</a-button>
|
||||
</template>
|
||||
<a-form-model ref="form" :rules="rules" :model="form" :label-col="labelCol" :wrapper-col="wrapperCol" layout="horizontal">
|
||||
</template> -->
|
||||
<a-form-model
|
||||
ref="form"
|
||||
:rules="rules"
|
||||
:model="form"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
layout="horizontal"
|
||||
>
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="24" :sm="24">
|
||||
<a-form-model-item label="项目名称" prop="projectName">
|
||||
|
@ -115,8 +123,14 @@
|
|||
</a-form-model-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-col :span="24" style="text-align: center;">
|
||||
<a-button type="primary" size="default" @click="toNext">下一步</a-button>
|
||||
<a-button type="default" size="default" @click="close">退出</a-button>
|
||||
</a-col>
|
||||
</a-form-model>
|
||||
</a-card>
|
||||
</div>
|
||||
|
||||
<!-- </page-header-wrapper> -->
|
||||
<!-- <class-list ref="ClassList"></class-list> -->
|
||||
</template>
|
||||
|
@ -128,8 +142,8 @@ import { classList } from '@/api/project/class'
|
|||
export default {
|
||||
props: {
|
||||
projectForm: {
|
||||
type: Object,
|
||||
},
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
@ -154,14 +168,14 @@ export default {
|
|||
examSdate: [{ required: true, message: '请输入考试开始时间', trigger: 'change' }],
|
||||
examEdate: [{ required: true, message: '请输入考试结束时间', trigger: 'change' }],
|
||||
examNumber: [{ required: true, message: '请输入考试次数', trigger: 'blur' }],
|
||||
mockExam: [{ required: true, message: '请选择是否允许模拟考试', trigger: 'change' }],
|
||||
},
|
||||
mockExam: [{ required: true, message: '请选择是否允许模拟考试', trigger: 'change' }]
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
dictGet,
|
||||
ClassList,
|
||||
classList,
|
||||
classList
|
||||
},
|
||||
created(ClassList) {
|
||||
console.log('第一个表单创建了')
|
||||
|
@ -176,14 +190,14 @@ export default {
|
|||
//获取字典值,请求查询培训种类
|
||||
fetchTemplateData() {
|
||||
let formData = { type: 2 }
|
||||
dictGet(formData).then((res) => {
|
||||
dictGet(formData).then(res => {
|
||||
console.log(res)
|
||||
if (res.code == 200) {
|
||||
const result = res.data
|
||||
result.forEach((r) => {
|
||||
result.forEach(r => {
|
||||
this.personType.push({
|
||||
value: r.value,
|
||||
name: r.name,
|
||||
name: r.name
|
||||
})
|
||||
})
|
||||
}
|
||||
|
@ -193,14 +207,14 @@ export default {
|
|||
//获取培训种类列表
|
||||
getTrainClass() {
|
||||
let formData = { type: 1 }
|
||||
dictGet(formData).then((res) => {
|
||||
dictGet(formData).then(res => {
|
||||
console.log(res)
|
||||
if (res.code == 200) {
|
||||
const result = res.data
|
||||
result.forEach((r) => {
|
||||
result.forEach(r => {
|
||||
this.trainClass.push({
|
||||
value: r.id,
|
||||
name: r.name,
|
||||
name: r.name
|
||||
})
|
||||
})
|
||||
// console.log("222222222222222222222222222",this.trainClass)
|
||||
|
@ -212,15 +226,15 @@ export default {
|
|||
//下一步,跳转页面带上from对象
|
||||
toNext() {
|
||||
// console.log('toNext', this.form)
|
||||
this.$refs.form.validate((validate) => {
|
||||
this.$refs.form.validate(validate => {
|
||||
if (validate) {
|
||||
this.$emit('nextStep', this.form)
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
console.log('第一个表单销毁了')
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -1,28 +1,45 @@
|
|||
<template>
|
||||
<div>
|
||||
<a-card :bordered="false" title="选择培训单位">
|
||||
<template slot="extra">
|
||||
<a-button type="primary" size="default" @click="toPrep">上一步</a-button>
|
||||
</template>
|
||||
<template slot="extra">
|
||||
<a-button type="primary" v-if="['2', '3', '4'].includes(form.trainWay)" size="default" @click="toNext">下一步</a-button>
|
||||
</template>
|
||||
<template type="primary" v-if="form.trainWay === '1'" slot="extra">
|
||||
<a-button size="default" @click="handleSubmit">保存</a-button>
|
||||
</template>
|
||||
<a-transfer class="tree-transfer" :data-source="dataSource" :target-keys="targetKeys" :render="(item) => item.title" :show-select-all="false" @change="onChange">
|
||||
<a-transfer
|
||||
class="tree-transfer"
|
||||
:data-source="dataSource"
|
||||
:target-keys="targetKeys"
|
||||
:render="item => item.title"
|
||||
:show-select-all="false"
|
||||
@change="onChange"
|
||||
>
|
||||
<template slot="children" slot-scope="{ props: { direction, selectedKeys }, on: { itemSelect } }">
|
||||
<a-tree v-if="direction === 'left'" blockNode checkable checkStrictly defaultExpandAll :checkedKeys="[...selectedKeys, ...targetKeys]" :treeData="treeData" @check="
|
||||
<a-tree
|
||||
v-if="direction === 'left'"
|
||||
blockNode
|
||||
checkable
|
||||
checkStrictly
|
||||
defaultExpandAll
|
||||
:checkedKeys="[...selectedKeys, ...targetKeys]"
|
||||
:treeData="treeData"
|
||||
@check="
|
||||
(_, props) => {
|
||||
onChecked(_, props, [...selectedKeys, ...targetKeys], itemSelect)
|
||||
}
|
||||
" @select="
|
||||
"
|
||||
@select="
|
||||
(_, props) => {
|
||||
onChecked(_, props, [...selectedKeys, ...targetKeys], itemSelect)
|
||||
}
|
||||
" />
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
</a-transfer>
|
||||
</a-card>
|
||||
<a-col :span="24" style="text-align: center;">
|
||||
<a-button type="primary" size="default" @click="toPrep" style="margin-right: 8px;">上一步</a-button>
|
||||
<a-button type="primary" v-if="['2', '3', '4'].includes(form.trainWay)" size="default" @click="toNext"
|
||||
>下一步</a-button
|
||||
>
|
||||
<a-button v-if="form.trainWay === '1'" size="default" @click="handleSubmit">保存</a-button>
|
||||
</a-col>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
@ -47,7 +64,7 @@ const treeData = []
|
|||
const transferDataSource = []
|
||||
|
||||
function flatten(list = []) {
|
||||
list.forEach((item) => {
|
||||
list.forEach(item => {
|
||||
transferDataSource.push(item)
|
||||
flatten(item.children)
|
||||
})
|
||||
|
@ -80,7 +97,7 @@ export default {
|
|||
targetKeys: this.projectForm.unitIds || [],
|
||||
dataSource: transferDataSource,
|
||||
// treeData() {return handleTreeData(treeData, this.targetKeys)},
|
||||
treeData: [],
|
||||
treeData: []
|
||||
}
|
||||
},
|
||||
// 计算属性 类似于data概念
|
||||
|
@ -99,16 +116,16 @@ export default {
|
|||
},
|
||||
//获取数据源
|
||||
getSourceList(orgType) {
|
||||
orgList({ orgType: orgType || 1 }).then((res) => {
|
||||
orgList({ orgType: orgType || 1 }).then(res => {
|
||||
if (res.data) {
|
||||
this.dataSource = []
|
||||
res.data.forEach((item) => {
|
||||
res.data.forEach(item => {
|
||||
this.dataSource.push({
|
||||
id: item.id,
|
||||
key: item.id.toString(),
|
||||
title: item.name,
|
||||
children: [],
|
||||
pid: item.pid,
|
||||
pid: item.pid
|
||||
})
|
||||
})
|
||||
console.log('dataSource', this.dataSource)
|
||||
|
@ -140,7 +157,7 @@ export default {
|
|||
} else {
|
||||
this.$message.warning('请选择培训单位')
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
// 生命周期 - 创建完成(可以访问当前this实例)
|
||||
created() {
|
||||
|
@ -150,23 +167,23 @@ export default {
|
|||
},
|
||||
|
||||
// 生命周期 - 挂载完成(可以访问DOM元素)
|
||||
mounted() { },
|
||||
mounted() {},
|
||||
// 生命周期 - 创建之前
|
||||
beforeCreate() { },
|
||||
beforeCreate() {},
|
||||
// 生命周期 - 挂载之前
|
||||
beforeMount() { },
|
||||
beforeMount() {},
|
||||
// 生命周期 - 更新之前
|
||||
beforeUpdate() { },
|
||||
beforeUpdate() {},
|
||||
// 生命周期 - 更新之后
|
||||
updated() { },
|
||||
updated() {},
|
||||
// 生命周期 - 销毁之前
|
||||
beforeDestroy() { },
|
||||
beforeDestroy() {},
|
||||
// 生命周期 - 销毁完成
|
||||
destroyed() {
|
||||
console.log('第2个表单销毁了')
|
||||
},
|
||||
// 如果页面有keep-alive缓存功能,这个函数会触发
|
||||
activated() { },
|
||||
activated() {}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
@ -175,5 +192,3 @@ export default {
|
|||
flex: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
|
Loading…
Reference in New Issue