zhc077
/
projectManagement
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

模块新增布局更改

Browse Source
master^2
xia 1 year ago
parent df04c8139a
commit 22775002a8
1 changed files with 389 additions and 201 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 588
      ant-design-vue-jeecg/src/views/modulex/modules/ModulexForm.vue

588
ant-design-vue-jeecg/src/views/modulex/modules/ModulexForm.vue
Unescape View File

@ -1,272 +1,460 @@
<template>
<a-spin :spinning="confirmLoading">
<j-form-container :disabled="formDisabled">
<a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
<a-form-model
ref="form"
:model="model"
:rules="validatorRules"
slot="detail"
>
<!-- <a-row style="border-bottom: 1px solid gainsboro">项目描述</a-row> -->
<a-row>
<a-col :span="24">
<a-form-model-item label="上级模块" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="pid">
<!-- <a-input v-model="model.pid" placeholder="请输入上级模块id" ></a-input>-->
<j-dict-select-tag v-model="model.pid" dict-code="modulex,module_name,id"
placeholder="请输入上级模块" style="width: 100%" />
<a-form-model-item
label="上级模块"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="pid"
>
<!-- <a-input v-model="model.pid" placeholder="请输入上级模块id" ></a-input>-->
<j-dict-select-tag
v-model="model.pid"
dict-code="modulex,module_name,id"
placeholder="请输入上级模块"
style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="项目名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="projectId">
<!-- <a-input v-model="model.projectId" placeholder="请输入项目id" ></a-input>-->
<j-dict-select-tag v-model="model.projectId" dict-code="projectx,project_name,id"
placeholder="请输入项目id" style="width: 100%" />
<a-form-model-item
label="项目名"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="projectId"
>
<!-- <a-input v-model="model.projectId" placeholder="请输入项目id" ></a-input>-->
<j-dict-select-tag
v-model="model.projectId"
dict-code="projectx,project_name,id"
placeholder="请输入项目id"
style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="中文名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="moduleName">
<a-input v-model="model.moduleName" placeholder="请输入中文名称" ></a-input>
<a-form-model-item
label="中文名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="moduleName"
>
<a-input
v-model="model.moduleName"
placeholder="请输入中文名称"
></a-input>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="英文名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="moduleEnName">
<a-input v-model="model.moduleEnName" placeholder="请输入英文名称" ></a-input>
<a-form-model-item
label="英文名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="moduleEnName"
>
<a-input
v-model="model.moduleEnName"
placeholder="请输入英文名称"
></a-input>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="模块编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="moduleCode">
<a-input v-model="model.moduleCode" placeholder="请输入模块编码" ></a-input>
<a-form-model-item
label="模块编码"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="moduleCode"
>
<a-input
v-model="model.moduleCode"
placeholder="请输入模块编码"
></a-input>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="内容描述" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="pmDescribe">
<a-input v-model="model.pmDescribe" placeholder="请输入内容描述" ></a-input>
<a-form-model-item
label="任务等级"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="workLevel"
>
<!-- <a-input-number v-model="model.workLevel" placeholder="请输入任务等级" style="width: 100%" />-->
<j-dict-select-tag
v-model="model.workLevel"
dict-code="work_level"
placeholder="请输入任务等级"
style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="责任人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="managerUsers">
<!-- <a-input v-model="model.managerUsers" placeholder="请输入责任人" ></a-input>-->
<j-select-user-by-dep v-model="model.managerUsers" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="任务等级" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workLevel">
<!-- <a-input-number v-model="model.workLevel" placeholder="请输入任务等级" style="width: 100%" />-->
<j-dict-select-tag v-model="model.workLevel" dict-code="work_level"
placeholder="请输入任务等级" style="width: 100%" />
<a-form-model-item
label="用户角色"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="userRole"
>
<!-- <a-input v-model="model.userRole" placeholder="请输入用户角色" ></a-input>-->
<j-multi-select-tag
type="list_multi"
v-model="model.userRole"
dictCode="sys_role,role_name,id"
placeholder="请选择用户角色"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="任务状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workStatus">
<!-- <a-input-number v-model="model.workStatus" placeholder="请输入任务状态" style="width: 100%" />-->
<j-dict-select-tag v-model="model.workStatus" dict-code="work_status"
placeholder="请输入任务状态" style="width: 100%" />
<a-form-model-item
label="责任人"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="managerUsers"
>
<!-- <a-input v-model="model.managerUsers" placeholder="请输入责任人" ></a-input>-->
<j-select-user-by-dep v-model="model.managerUsers" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="发布时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="publishTime">
<j-date placeholder="请选择发布时间" date-format="YYYY-MM-DD HH:mm:ss" v-model="model.publishTime" style="width: 100%" />
<a-form-model-item
label="任务时长"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="duration"
>
<a-input-number
:min="0.1"
:max="16"
:precision="1"
v-model="model.duration"
placeholder="请输入任务时长"
style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="任务时长" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="duration">
<a-input-number :min="0.1" :max="16" :precision="1" v-model="model.duration" placeholder="请输入任务时长" style="width: 100%"/>
<a-form-model-item
label="实际时长"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="realDuration"
>
<!-- <a-input-number v-model="model.realDuration" placeholder="请输入实际时长" style="width: 100%" />-->
<a-input-number
:min="0.1"
:max="16"
:precision="1"
v-model="model.realDuration"
placeholder="请输入实际时长"
style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="开始时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="startTime">
<j-date placeholder="请选择开始时间" date-format="YYYY-MM-DD HH:mm:ss" v-model="model.startTime" style="width: 100%" />
<a-form-model-item
label="开始时间"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="startTime"
>
<j-date
placeholder="请选择开始时间"
date-format="YYYY-MM-DD HH:mm:ss"
v-model="model.startTime"
style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="提交时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="submitTime">
<j-date placeholder="请选择提交时间" date-format="YYYY-MM-DD HH:mm:ss" v-model="model.submitTime" style="width: 100%" />
<a-form-model-item
label="提交时间"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="submitTime"
>
<j-date
placeholder="请选择提交时间"
date-format="YYYY-MM-DD HH:mm:ss"
v-model="model.submitTime"
style="width: 100%"
/>
</a-form-model-item>
</a-col>
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="关联实体" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="relatedBean">-->
<!-- <j-dict-select-tag v-model="model.relatedBean" dict-code="tablex,table_name,id"-->
<!-- placeholder="请输入关联实体" ></j-dict-select-tag>-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<a-col :span="24">
<a-form-model-item label="实际时长" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="realDuration">
<!-- <a-input-number v-model="model.realDuration" placeholder="请输入实际时长" style="width: 100%" />-->
<a-input-number :min="0.1" :max="16" :precision="1" v-model="model.realDuration" placeholder="请输入实际时长" style="width: 100%"/>
<a-form-model-item
label="发布时间"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="publishTime"
>
<j-date
placeholder="请选择发布时间"
date-format="YYYY-MM-DD HH:mm:ss"
v-model="model.publishTime"
style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="用户角色" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="userRole">
<!-- <a-input v-model="model.userRole" placeholder="请输入用户角色" ></a-input>-->
<j-multi-select-tag type="list_multi" v-model="model.userRole" dictCode="sys_role,role_name,id" placeholder="请选择用户角色" />
<a-form-model-item
label="版本状态"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="verisonStatus"
>
<!-- <a-input-number v-model="model.verisonStatus" placeholder="请输入版本状态" style="width: 100%" />-->
<j-dict-select-tag
type="radioButton"
v-model="model.verisonStatus"
dict-code="verison_status"
placeholder="请输入版本状态"
/>
</a-form-model-item>
</a-col>
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="关联实体" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="relatedBean">-->
<!-- <j-dict-select-tag v-model="model.relatedBean" dict-code="tablex,table_name,id"-->
<!-- placeholder="请输入关联实体" ></j-dict-select-tag>-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<a-col :span="24">
<a-form-model-item label="原型图" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="prototypes">
<!-- <a-input v-model="model.prototypes" placeholder="请输入原型图" ></a-input>-->
<j-image-upload isMultiple v-model="model.prototypes" ></j-image-upload>
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="版本号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="verison">-->
<!-- <a-input-number v-model="model.verison" placeholder="请输入版本号" style="width: 100%" />-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<a-col :span="24" style="height: 3rem">
<a-form-model-item
label="任务状态"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="workStatus"
>
<!-- <a-input-number v-model="model.workStatus" placeholder="请输入任务状态" style="width: 100%" />-->
<j-dict-select-tag
type="radio"
v-model="model.workStatus"
dict-code="work_status"
placeholder="请输入任务状态"
style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="分析图" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="diagrams">
<!-- <a-input v-model="model.diagrams" placeholder="请输入分析图" ></a-input>-->
<j-image-upload isMultiple v-model="model.diagrams" ></j-image-upload>
<a-form-model-item
label="模块状态"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="status"
>
<!-- <a-input-number v-model="model.status" placeholder="请输入模块状态" style="width: 100%" />-->
<j-dict-select-tag
type="radio"
v-model="model.status"
placeholder="请输入模块状态"
dict-code="a_status"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="模块状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status">
<!-- <a-input-number v-model="model.status" placeholder="请输入模块状态" style="width: 100%" />-->
<j-dict-select-tag type="radio" v-model="model.status" placeholder="请输入模块状态" dict-code="a_status" />
</a-row>
<a-row>
<a-col :span="24" class="content_describe">
<a-form-model-item
label="内容描述"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="pmDescribe"
>
<j-editor v-model="model.pmDescribe"></j-editor>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="版本状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="verisonStatus">
<!-- <a-input-number v-model="model.verisonStatus" placeholder="请输入版本状态" style="width: 100%" />-->
<j-dict-select-tag type="radioButton" v-model="model.verisonStatus" dict-code="verison_status"
placeholder="请输入版本状态"/>
</a-row>
<a-row>
<a-col style="width: 100%">
<a-form-model-item
label="原型图"
:labelCol="{ xs: { span: 24 }, sm: { span: 2 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 20 } }"
prop="prototypes"
>
<!-- <a-input v-model="model.prototypes" placeholder="请输入原型图" ></a-input>-->
<j-image-upload
isMultiple
v-model="model.prototypes"
></j-image-upload>
</a-form-model-item>
</a-col>
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="版本号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="verison">-->
<!-- <a-input-number v-model="model.verison" placeholder="请输入版本号" style="width: 100%" />-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
</a-row>
<a-row>
<a-col style="width: 100%">
<a-form-model-item
label="分析图"
:labelCol="{ xs: { span: 24 }, sm: { span: 2 } }"
:wrapperCol="{ xs: { span: 24 }, sm: { span: 20 } }"
prop="diagrams"
>
<!-- <a-input v-model="model.diagrams" placeholder="请输入分析图" ></a-input>-->
<j-image-upload
isMultiple
v-model="model.diagrams"
></j-image-upload>
</a-form-model-item> </a-col
></a-row>
</a-form-model>
</j-form-container>
</a-spin>
</template>
<script>
import { httpAction, getAction } from '@api/manage'
import { validateDuplicateValue } from '@/utils/util'
import moment from 'dayjs'
import { httpAction, getAction } from '@api/manage'
import { validateDuplicateValue } from '@/utils/util'
import moment from "dayjs";
export default {
name: 'ModulexForm',
components: {
},
props: {
//表单禁用
disabled: {
type: Boolean,
default: false,
required: false
export default {
name: 'ModulexForm',
components: {},
props: {
//表单禁用
disabled: {
type: Boolean,
default: false,
required: false
}
},
data() {
return {
model: {
workLevel: 2,
workStatus: 0,
duration: 1,
submitTime: moment(new Date()).format('YYYY-MM-DD HH:mm:ss'),
realDuration: 16,
status: 1,
verisonStatus: 1
},
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
confirmLoading: false,
validatorRules: {
projectId: [{ required: true, message: '请输入项目id!' }],
moduleName: [{ required: true, message: '请输入中文名称!' }],
moduleEnName: [{ required: true, message: '请输入英文名称!' }],
moduleCode: [{ required: true, message: '请输入模块编码!' }],
workLevel: [{ required: true, message: '请输入任务等级!' }],
workStatus: [{ required: true, message: '请输入任务状态!' }],
duration: [{ required: true, message: '请输入任务时长!' }],
realDuration: [{ required: true, message: '请输入实际时长!' }],
status: [{ required: true, message: '请输入模块状态!' }],
verisonStatus: [{ required: true, message: '请输入版本状态!' }],
verison: [{ required: true, message: '请输入版本号!' }]
},
url: {
add: '/modulex/modulex/add',
edit: '/modulex/modulex/edit',
queryById: '/modulex/modulex/queryById'
}
}
},
computed: {
formDisabled() {
return this.disabled
}
},
created() {
//备份model 原始值
this.modelDefault = JSON.parse(JSON.stringify(this.model))
},
methods: {
add() {
this.edit(this.modelDefault)
},
data () {
return {
model:{
workLevel: 2,
workStatus: 0,
duration: 1,
submitTime: moment(new Date()).format("YYYY-MM-DD HH:mm:ss"),
realDuration: 16,
status: 1,
verisonStatus: 1,
},
labelCol: {
xs: { span: 24 },
sm: { span: 5 },
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 },
},
confirmLoading: false,
validatorRules: {
projectId: [
{ required: true, message: '请输入项目id!'},
],
moduleName: [
{ required: true, message: '请输入中文名称!'},
],
moduleEnName: [
{ required: true, message: '请输入英文名称!'},
],
moduleCode: [
{ required: true, message: '请输入模块编码!'},
],
workLevel: [
{ required: true, message: '请输入任务等级!'},
],
workStatus: [
{ required: true, message: '请输入任务状态!'},
],
duration: [
{ required: true, message: '请输入任务时长!'},
],
realDuration: [
{ required: true, message: '请输入实际时长!'},
],
status: [
{ required: true, message: '请输入模块状态!'},
],
verisonStatus: [
{ required: true, message: '请输入版本状态!'},
],
verison: [
{ required: true, message: '请输入版本号!'},
],
},
url: {
add: "/modulex/modulex/add",
edit: "/modulex/modulex/edit",
queryById: "/modulex/modulex/queryById"
}
edit(record) {
this.model = Object.assign({}, record)
if (this.model.fuzhi) {
this.model.id = null
this.model.moduleName = this.model.moduleName + '+1'
this.model.moduleEnName = this.model.moduleEnName + '+1'
this.model.moduleCode = this.model.moduleCode + '+1'
this.model.createTime = null
}
this.visible = true
},
computed: {
formDisabled(){
return this.disabled
},
},
created () {
//备份model 原始值
this.modelDefault = JSON.parse(JSON.stringify(this.model));
},
methods: {
add () {
this.edit(this.modelDefault);
},
edit (record) {
this.model = Object.assign({}, record);
if (this.model.fuzhi){
this.model.id = null;
this.model.moduleName = this.model.moduleName + '+1';
this.model.moduleEnName = this.model.moduleEnName + '+1';
this.model.moduleCode = this.model.moduleCode + '+1';
this.model.createTime = null;
//复制源对象id
this.model.copyId = record.id;
}
this.visible = true;
},
submitForm () {
const that = this;
// 触发表单验证
this.$refs.form.validate(valid => {
if (valid) {
that.confirmLoading = true;
let httpurl = '';
let method = '';
if(!this.model.id){
httpurl+=this.url.add;
method = 'post';
}else{
httpurl+=this.url.edit;
method = 'put';
}
httpAction(httpurl,this.model,method).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.$emit('ok');
}else{
that.$message.warning(res.message);
submitForm() {
const that = this
// 触发表单验证
this.$refs.form.validate((valid) => {
if (valid) {
that.confirmLoading = true
let httpurl = ''
let method = ''
if (!this.model.id) {
httpurl += this.url.add
method = 'post'
} else {
httpurl += this.url.edit
method = 'put'
}
httpAction(httpurl, this.model, method)
.then((res) => {
if (res.success) {
that.$message.success(res.message)
that.$emit('ok')
} else {
that.$message.warning(res.message)
}
}).finally(() => {
that.confirmLoading = false;
})
}
})
},
.finally(() => {
that.confirmLoading = false
})
}
})
}
}
}
</script>
<style lang="less" scoped>
.ant-col {
width: 50%;
}
/deep/.ant-col-sm-16 {
width: 70%;
}
.ant-col-sm-5 {
width: 0%;
}
.content_describe {
width: 100%;
.ant-col-sm-5 {
width: 10% I;
}
/deep/ .ant-col-sm-16 {
width: 85%;
}
}
/deep/.ant-form-item-label {
width: 5rem;
height: 2rem;
text-align: right;
// background-color: aquamarine;
}
/deep/.ant-radio-wrapper {
margin-bottom: 0.5rem;
margin-right: 0.8rem;
}
</style>

Write Preview
Loading…
Cancel
Save