WL/laws_weilai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

添加文档库弹框组件

Browse Source
This commit is contained in:
qq787203167
2022-02-15 17:53:00 +08:00
parent 469c190dc1
commit 12ac3223e1
7 changed files with 863 additions and 294 deletions
Download Patch File Download Diff File Expand all files Collapse all files
jero-web/src/components/addForm/index.vue
+49 -248
View File
@@ -1,197 +1,13 @@
<template>
<a-spin :spinning="confirmLoading">
<a-form-model :model="formInline" v-if="isFormInline" class="formAdd" :rules="rules" ref="ruleForm">
<div v-for="(val,index) in headerText" :key="index">
<div class="header-text">
&nbsp;{{val.text}}
</div>
<a-row :gutter="24" v-if="isDisplayType">
<div v-for="item in val.content">
<a-col :span="12" v-if="item.field_show_type === 'text'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-input class="box-input"
:disabled="disabled"
v-model="formInline[item.db_field_name]"
:placeholder="'请输入'+item.db_field_txt"/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12" v-else-if="item.field_show_type === 'CHECKBOX'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-multi-select-tag class="box-input" v-model="formInline[item.db_field_name]"
:disabled="disabled"
:placeholder="$t('selectStatus')" :type="'checkbox'"
:triggerChange="false" :dictCode="item.dict_field"/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12" v-else-if="item.field_show_type === 'date'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-date-picker class="box-input" v-model="formInline[item.db_field_name]"
:disabled="disabled"
style="width: 100%"/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12" v-else-if="item.field_show_type === 'SMULTITIME'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-range-picker class="box-input" v-model="formInline[item.db_field_name]"
:disabled="disabled"
@change="onChange"></a-range-picker>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12" v-else-if="item.field_show_type === 'NUMBER'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-input-number class="box-input"
:disabled="disabled"
v-model="formInline[item.db_field_name]" :min="1" :max="99999999"/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12" v-else-if="item.field_show_type === 'list'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-dict-select-tag class="box-input" v-model="formInline[item.db_field_name]"
:disabled="disabled"
@input="handleInput(item.db_field_name)"
:placeholder="$t('selectStatus')" :type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12" v-else-if="item.field_show_type === 'list_multi'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-multi-select-tag class="box-input" v-model="formInline[item.db_field_name]"
:disabled="disabled"
:placeholder="$t('selectStatus')" :type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12" v-else-if="item.field_show_type === 'RADIO'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-dict-select-tag v-model="formInline[item.db_field_name]"
:disabled="disabled"
@input="handleInput(item.db_field_name)"
:placeholder="$t('selectStatus')"
:type="'radio'" :triggerChange="false" :dictCode="item.dict_field"/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="24" v-else-if="item.field_show_type === 'TEXTAREA'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-textarea :placeholder="$t('selectStatus')"
:disabled="disabled"
v-model="formInline[item.db_field_name]" :rows="4"/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12" v-else-if="item.field_show_type === 'file'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-button type="primary" class="button-text"
@click="clickButtonToUpload(item.db_field_name)">
{{ (formInline[item.db_field_name] === 'null' || formInline[item.db_field_name] === '' ||
formInline[item.db_field_name] == null) ? '点击上传' : '查看已上传文件'
}}
</a-button>
</a-form-model-item>
</div>
</a-col>
<a-col :span="24" v-else-if="item.field_show_type === 'STANDARD'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<Standardselection :query="item" :disabled="disabled" v-model="formInline[item.db_field_name]"/>
</a-form-model-item>
</div>
</a-col>
</div>
</a-row>
</div>
<a-row :gutter="24" v-if="!isDisplayType">
<a-row :gutter="24">
<div v-for="(item,index) in dataList" :key="index">
<a-col :span="12" v-if="item.field_show_type === 'text'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -205,8 +21,8 @@
<a-col :span="12" v-else-if="item.field_show_type === 'CHECKBOX'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -221,8 +37,8 @@
<a-col :span="12" v-else-if="item.field_show_type === 'date'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -236,8 +52,8 @@
<a-col :span="12" v-else-if="item.field_show_type === 'SMULTITIME'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -251,8 +67,8 @@
<a-col :span="12" v-else-if="item.field_show_type === 'NUMBER'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -266,8 +82,8 @@
<a-col :span="12" v-else-if="item.field_show_type === 'list'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -282,8 +98,8 @@
<a-col :span="12" v-else-if="item.field_show_type === 'list_multi'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -298,8 +114,8 @@
<a-col :span="12" v-else-if="item.field_show_type === 'RADIO'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -313,8 +129,8 @@
<a-col :span="24" v-else-if="item.field_show_type === 'TEXTAREA'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -325,15 +141,15 @@
</div>
</a-col>
<a-col :span="24" v-else-if="item.field_show_type === 'file'">
<a-col :span="12" v-else-if="item.field_show_type === 'file'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-button type="primary" style="height: 38px;width: calc(50% - 80px);line-height: 38px"
<a-button type="primary" class="button-text"
@click="clickButtonToUpload(item.db_field_name)">
{{ (formInline[item.db_field_name] === 'null' || formInline[item.db_field_name] === '' ||
formInline[item.db_field_name] == null) ? '点击上传' : '查看已上传文件'
@@ -346,8 +162,8 @@
<a-col :span="24" v-else-if="item.field_show_type === 'STANDARD'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="Required" v-if="item.field_must_input == 0">*</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
@@ -383,10 +199,6 @@
type: Object,
default: {}
},
isDisplayType: {
type: Boolean,
default: false
},
flag: {
type: String,
default: ''
@@ -410,27 +222,13 @@
sm: { span: 17 }
},
dataList: [],
ruleList: [],
validatorRules: {},
confirmLoading: false,
uploadName: '',
headerText: [
{
text: '基本信息',
content: []
},
{
text: '文本信息',
content: []
},
{
text: '关联信息',
content: []
}
]
uploadName: ''
}
},
mounted() {
this.IntegrateData()
this.getForm()
},
methods: {
@@ -484,46 +282,47 @@
IntegrateData() {
this.isFormInline = false
let rules = {}
this.dataList.forEach((res, index) => {
this.ruleList.forEach((res, index) => {
const rule = []
if (res.Required) {
if (res.field_must_input == 0) {
if (res.field_show_type === 'text') {
rule.push({
required: true,
message: res.name + '不能为空',
message: res.db_field_txt + '不能为空',
trigger: 'blur'
})
} else if (res.field_show_type === 'CHECKBOX' || res.field_show_type === 'list_multi' ||
res.field_show_type === 'date' || res.field_show_type === 'file') {
rule.push({
required: true,
message: res.name + '不能为空',
message: res.db_field_txt + '不能为空',
trigger: 'change'
})
} else if (res.field_show_type === 'NUMBER') {
rule.push({
required: true,
message: res.name + '不能为空',
message: res.db_field_txt + '不能为空',
trigger: 'blur'
})
} else if (res.field_show_type === 'TEXTAREA') {
rule.push({
required: true,
message: res.name + '不能为空',
message: res.db_field_txt + '不能为空',
trigger: 'blur'
})
} else if (res.field_show_type === 'RADIO' || res.field_show_type === 'list') {
rule.push({
required: true,
message: res.name + '不能为空',
message: res.db_field_txt + '不能为空',
trigger: 'change'
})
}
}
if (rule.length > 0) {
rules[res.attrModel] = rule
rules[res.db_field_name] = rule
}
})
console.log(rules)
this.$set(this, 'rules', rules)
this.isFormInline = true
this.confirmLoading = false
@@ -536,19 +335,20 @@
getAction(this.url.getAddForm, params).then((res) => {
if (res.success) {
this.dataList = res.result
this.ruleList = res.result
this.IntegrateData()
if (this.isDisplayType) {
this.headerText.forEach((res) => {
res.content = []
this.dataList.forEach(val => {
if (res.text === val.area) {
res.content.push(val)
}
})
})
}
}
})
},
edit(item) {
getAction(this.url.getDocumentInfo, { id: item.id }).then((res) => {
if (res.success) {
this.formInline = res.result[0]
}
})
},
add(){
this.formInline = {}
}
}
}
@@ -655,7 +455,8 @@
.formAdd {
margin-bottom: 40px;
}
.button-text{
.button-text {
height: 38px;
width: calc(100% - 120px);
line-height: 38px;