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

功能管理新增弹窗样式修改

Browse Source
master^2
deng 1 year ago
parent 82f4d9f92a
commit c47739dfe3
1 changed files with 478 additions and 71 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. 465
      ant-design-vue-jeecg/src/views/functionx/modules/FunctionxForm.vue

465
ant-design-vue-jeecg/src/views/functionx/modules/FunctionxForm.vue
Unescape View File

@ -1,7 +1,12 @@
<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>
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="对应模块id" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="moduleId">-->
@ -9,42 +14,183 @@
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<a-col :span="24">
<a-form-model-item label="中文名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="functionName">
<a-input v-model="model.functionName" placeholder="请输入中文名称" ></a-input>
<a-form-model-item
label="中文名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="functionName"
>
<a-input
v-model="model.functionName"
placeholder="请输入中文名称"
></a-input>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="英文名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="functionEnName">
<a-input v-model="model.functionEnName" placeholder="请输入英文名称" ></a-input>
<a-form-model-item
label="英文名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="functionEnName"
>
<a-input
v-model="model.functionEnName"
placeholder="请输入英文名称"
></a-input>
</a-form-model-item>
</a-col>
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="任务状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workStatus">-->
<!-- <j-dict-select-tag type="list" v-model="model.workStatus" dictCode="work_status" placeholder="请选择任务状态" />-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="发布时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="publishTime">-->
<!-- <j-date placeholder="请选择发布时间" 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="startTime">-->
<!-- <j-date placeholder="请选择开始时间" 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="请选择提交时间" 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="realDuration">-->
<!-- <a-input-number 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="status">-->
<!-- <j-dict-select-tag type="list" v-model="model.status" dictCode="a_status" placeholder="请选择功能状态" />-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="版本状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="verisonStatus">-->
<!-- <j-dict-select-tag type="list" v-model="model.verisonStatus" dictCode="verison_status" placeholder="请选择版本状态" />-->
<!-- </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 :span="24">-->
<!-- <a-form-model-item label="对应模块id" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="moduleId">-->
<!-- <a-input v-model="model.moduleId" placeholder="请输入对应模块id" ></a-input>-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<a-col :span="24">
<a-form-model-item label="功能类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="functionType">
<j-dict-select-tag type="list" v-model="model.functionType" dictCode="function_type" placeholder="请选择功能类型" @change="functionxbianma"/>
<a-form-model-item
label="功能类型"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="functionType"
>
<j-dict-select-tag
type="list"
v-model="model.functionType"
dictCode="function_type"
placeholder="请选择功能类型"
@change="functionxbianma"
/>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="功能编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="functionCode">
<a-input v-model="model.functionCode" placeholder="请输入功能编码" ></a-input>
<a-form-model-item
label="功能编码"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="functionCode"
>
<a-input
v-model="model.functionCode"
placeholder="请输入功能编码"
></a-input>
</a-form-model-item>
</a-col>
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="任务状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workStatus">-->
<!-- <j-dict-select-tag type="list" v-model="model.workStatus" dictCode="work_status" placeholder="请选择任务状态" />-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="发布时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="publishTime">-->
<!-- <j-date placeholder="请选择发布时间" 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="startTime">-->
<!-- <j-date placeholder="请选择开始时间" 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="请选择提交时间" 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="realDuration">-->
<!-- <a-input-number 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="status">-->
<!-- <j-dict-select-tag type="list" v-model="model.status" dictCode="a_status" placeholder="请选择功能状态" />-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="版本状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="verisonStatus">-->
<!-- <j-dict-select-tag type="list" v-model="model.verisonStatus" dictCode="verison_status" placeholder="请选择版本状态" />-->
<!-- </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 :span="24">-->
<!-- <a-form-model-item label="对应模块id" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="moduleId">-->
<!-- <a-input v-model="model.moduleId" placeholder="请输入对应模块id" ></a-input>-->
<!-- </a-form-model-item>-->
<!-- </a-col>-->
<a-col :span="24">
<a-form-model-item label="用户角色" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="userRole">
<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="userRole"
>
<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="managerUsers">
<a-form-model-item
label="责任人"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="managerUsers"
>
<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">
<j-dict-select-tag type="list" v-model="model.workLevel" dictCode="work_level" placeholder="请选择任务等级" />
</a-form-model-item>
</a-col>
<!-- <a-col :span="24">-->
<!-- <a-form-model-item label="任务状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workStatus">-->
<!-- <j-dict-select-tag type="list" v-model="model.workStatus" dictCode="work_status" placeholder="请选择任务状态" />-->
@ -60,11 +206,6 @@
<!-- <j-date placeholder="请选择开始时间" 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="duration">
<a-input-number 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="submitTime">-->
<!-- <j-date placeholder="请选择提交时间" v-model="model.submitTime" style="width: 100%" />-->
@ -90,16 +231,94 @@
<!-- <a-input-number v-model="model.verison" 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">
<j-image-upload isMultiple v-model="model.diagrams" ></j-image-upload>
</a-row>
<a-row>
<a-col>
<a-form-model-item
label="任务等级"
:labelCol="{
xs: { span: 24 },
sm: { span: 3 }
}"
:wrapperCol="{
xs: { span: 24 },
sm: { span: 21 }
}"
prop="workLevel"
style="margin-left: 15px"
>
<j-dict-select-tag
type="radio"
v-model="model.workLevel"
dictCode="work_level"
placeholder="请选择任务等级"
style="margin-left: 10px"
/>
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col :span="24">
<a-form-model-item label="功能描述" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="pmDescribe">
<j-editor v-model="model.pmDescribe" />
<a-col>
<a-form-model-item
label="任务时长"
:labelCol="{
xs: { span: 24 },
sm: { span: 3 }
}"
:wrapperCol="{
xs: { span: 24 },
sm: { span: 18 }
}"
prop="duration"
style="margin-left: 15px"
>
<a-input-number
v-model="model.duration"
placeholder="请输入任务时长"
style="width: 45%; margin-left: 8px"
/>
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col>
<a-form-model-item
label="分析图"
:labelCol="{
xs: { span: 24 },
sm: { span: 2 }
}"
:wrapperCol="{
xs: { span: 24 },
sm: { span: 21 }
}"
prop="diagrams"
style="margin-left: 50px"
>
<j-image-upload
isMultiple
v-model="model.diagrams"
style="margin-left: 8px"
></j-image-upload>
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col>
<a-form-model-item
label="功能描述"
:labelCol="{
xs: { span: 24 },
sm: { span: 2 }
}"
:wrapperCol="{
xs: { span: 24 },
sm: { span: 21 }
}"
prop="pmDescribe"
style="margin-left: 40px"
>
<j-editor v-model="model.pmDescribe" style="margin-left: 18px" />
</a-form-model-item>
</a-col>
</a-row>
@ -109,6 +328,194 @@
</template>
<script>
import { httpAction, getAction } from '@/api/manage'
import { validateDuplicateValue1 } from '@/utils/util'
export default {
name: 'FunctionxForm',
components: {},
props: {
//表单禁用
disabled: {
type: Boolean,
default: false,
required: false
}
},
data() {
return {
model: {
workLevel: 1,
workStatus: 0
},
labelCol: {
xs: { span: 20 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 20 },
sm: { span: 16 }
},
confirmLoading: false,
validatorRules: {
moduleId: [{ required: true, message: '请输入对应模块id!' }],
functionName: [
{ required: true, message: '请输入中文名称!' },
{
validator: (rule, value, callback) =>
validateDuplicateValue1(
'functionx',
'function_name',
value,
this.model.id,
this.moduleid,
callback
)
}
],
functionEnName: [
{ required: true, message: '请输入英文名称!' },
{
validator: (rule, value, callback) =>
validateDuplicateValue1(
'functionx',
'function_en_name',
value,
this.model.id,
this.moduleid,
callback
)
}
],
functionCode: [{ required: true, message: '请输入功能编码!' }],
functionType: [{ required: true, message: '请输入功能类型!' }],
workLevel: [{ required: true, message: '请输入任务等级!' }],
workStatus: [{ required: true, message: '请输入任务状态!' }],
realDuration: [{ required: true, message: '请输入实际时长!' }],
status: [{ required: true, message: '请输入功能状态!' }],
verisonStatus: [{ required: true, message: '请输入版本状态!' }],
verison: [{ required: true, message: '请输入版本号!' }]
},
url: {
add: '/functionx/functionx/add',
edit: '/functionx/functionx/edit',
queryById: '/functionx/functionx/queryById',
bianma: '/functionx/functionx/bianma'
},
moduleid: '',
modulecode: ''
}
},
computed: {
formDisabled() {
return this.disabled
}
},
created() {
//备份model原始值
this.moduleid = this.$route.query.moduleid
this.model.moduleId = this.$route.query.moduleid
//获得模块编码
this.modulebianma(this.moduleid)
this.modelDefault = JSON.parse(JSON.stringify(this.model))
},
methods: {
functionxbianma() {
if (this.model.functionType == 0) {
this.model.functionCode = this.modulecode + '列表'
} else if (this.model.functionType == 1) {
this.model.functionCode = this.modulecode + '增加'
} else if (this.model.functionType == 2) {
this.model.functionCode = this.modulecode + '删除'
} else if (this.model.functionType == 3) {
this.model.functionCode = this.modulecode + '修改'
} else if (this.model.functionType == 4) {
this.model.functionCode = this.modulecode + '查看'
} else if (this.model.functionType == 5) {
this.model.functionCode = this.modulecode + '导入'
} else if (this.model.functionType == 6) {
this.model.functionCode = this.modulecode + '导出'
} else {
this.model.functionCode = this.modulecode + '其他'
}
console.log(this.model.functionCode, '---------')
},
modulebianma(id) {
getAction(this.url.bianma, { id: id }).then((res) => {
if (res.success) {
//重新计算分页问题
this.modulecode = res.result
}
})
},
add() {
this.edit(this.modelDefault)
},
edit(record) {
this.model = Object.assign({}, record)
if (this.model.functionName1 != null) {
this.model.functionName = this.model.functionName1
}
if (this.model.functionEnName1 != null) {
this.model.functionEnName = this.model.functionEnName1
}
if (this.model.functionCode1 != null) {
this.model.functionCode = this.model.functionCode1
}
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)
}
})
.finally(() => {
that.confirmLoading = false
})
}
})
}
}
}
</script>
<style lang="less" scoped>
/deep/ .ant-col.ant-col-xs-20.ant-col-sm-5.ant-form-item-label > label {
display: block;
margin-right: 8px;
}
/deep/ .ant-btn {
background-color: #1890ff;
color: #fff;
}
/deep/ .ant-btn:hover {
color: #add4f9;
}
/deep/
.ant-col.ant-col-md-12.ant-col-lg-10.ant-col-xl-8.ant-col-xxl-5.ant-form-item-label {
margin-right: 15px;
}
</style>
import { httpAction, getAction } from '@/api/manage'
import { validateDuplicateValue1 } from '@/utils/util'

Write Preview
Loading…
Cancel
Save