herenshan112
/
ShutongInterconnectedChemicalCloudPlatform
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'lwx_v5'

lwx_v6
超级管理员 1 year ago
parent
3dd90cd3a9 f345c851e8
commit
527f126381
3 changed files with 147 additions and 15 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. 1
      src/api/DesignForm/types.ts
  2. 48
      src/components/DesignForm/formControlAttr.vue
  3. 113
      src/components/DesignForm/public/form/form.vue

1
src/api/DesignForm/types.ts
View File

@ -1,4 +1,5 @@
export interface FormList {
list?: any
name: string
type: string
control: any // 当前type表单控件所有props

48
src/components/DesignForm/formControlAttr.vue
View File

@ -27,7 +27,7 @@
import { Plus } from '@element-plus/icons-vue'
import Draggable from 'vuedraggable-es'
@ -1155,6 +1155,14 @@
let delflag = true
let breakFlag = 0
if(controlData.value.type === 'checkbox'&& controlData.value.config.optionsType==0){
//多选删除时,当前index并不是索引而是value,需找出选择的多选框实际的索引作为index liwenxuan 多选选择框选项拖动功能 20240815 start
for(let i = 0;i<controlData.value.options.length;i++){
if(controlData.value.options[i].value==index){
index = i
break
}
}
//多选删除时,当前index并不是索引而是value,需找出选择的多选框实际的索引作为index liwenxuan 多选选择框选项拖动功能 20240815 end
for(var i = 0;i < controlData.value.control.glxxszForCheckBox.length;i ++){
if(breakFlag>0){
break
@ -3204,7 +3212,7 @@ const disabledIstrue = (val:string) => {
</el-select>
</el-form-item>
<template v-if="controlData.config.optionsType === 0">
<div v-if="controlData.type !== 'cascader'">
<div v-if="controlData.type !== 'cascader'&&controlData.type !== 'checkbox'">
<el-form-item
v-for="(item, index) in controlData.options"
:key="index"
@ -3225,6 +3233,42 @@ const disabledIstrue = (val:string) => {
</el-col>
</el-form-item>
</div>
<!-- 多选选择框选项拖动功能 liwenxuan 20240815 start -->
<div v-if="controlData.type !== 'cascader'&&controlData.type == 'checkbox'">
<draggable
:list="controlData.options"
:force-fallback="true"
chosen-class="chosenClass"
animation="300"
>
<template #item="{ element }">
<div class="item form_cont">
<el-form-item>
<el-col :span="2" style="padding-top:4px;cursor: move;color: #66B1FF">
<i class="icon-move" ></i>
</el-col>
<el-col :span="6" style="cursor: move;">
选项标签
</el-col>
<el-col :span="10">
<el-input v-model="element.label" placeholder="选项标签" />
</el-col>
<el-col :span="2" :offset="1">
<i
class="icon-del"
@click="delSelectOption(element.value as number)"
></i>
</el-col>
</el-form-item>
</div>
</template>
</draggable>
</div>
<!-- 多选选择框选项拖动功能 liwenxuan 20240815 end -->
<el-form-item class="form_cont">
<el-button @click="addSelectOption">{{ controlData.type === 'cascader' ? '编辑' : '新增' }}</el-button>
</el-form-item>

113
src/components/DesignForm/public/form/form.vue
View File

@ -215,6 +215,7 @@ const recursionToGetFinallyHideFields = (hideFieldArr: any[],radioSelectArr3: st
nextTick(() => {
//console.log(model.value)
/* console.log("以showFields的处理过冒号的每个元素为key,其对应的optionValue为value,新建的数组radioselectArr3 --- 内容为完整显示隐藏条件")
console.log(radioSelectArr3)
console.log("当前表单的值-------------------")
@ -225,6 +226,9 @@ const recursionToGetFinallyHideFields = (hideFieldArr: any[],radioSelectArr3: st
for(let i= 0;i<props.formData.list.length;i++){
modelKeyArr.push(props.formData.list[i].name+"")
}
modelKeyArr = newModelKeyArr
//console.log(modelKeyArr)
/* console.log("所有字段modelKeyArr^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^")
console.log(modelKeyArr) */
@ -341,13 +345,16 @@ const recursionToGetFinallyHideFields = (hideFieldArr: any[],radioSelectArr3: st
}
}
}else{//来自单选下拉
//console.log(conditionFieldValue)
//console.log(modelKeyArr)
for(let n = 0; n< modelKeyArr.length;n++){
if(modelKeyArr[n]==conditionField){
//let count_1 = 0;
let trueValue = model.value[modelKeyArr[n]]
//console.log(modelKeyArr[n])
//console.log(trueValue)
/* console.log("conditionField====="+conditionField)
console.log("trueValue====="+trueValue)
console.log("conditionFieldValue-----"+conditionFieldValue) */
if(trueValue==conditionFieldValue){
//此时满足了条件,但是必须看一下conditionField有没有被隐藏.如果被隐藏了,则x不能增加.
let flag = false//其依赖的选项的父字段是否被隐藏.默认没被隐藏,
@ -372,9 +379,11 @@ const recursionToGetFinallyHideFields = (hideFieldArr: any[],radioSelectArr3: st
}
}
}
//console.log(x,hideFieldArr,toshow)
if(x>0){
hideFieldArr = hideFieldArr.filter((item: string) => item!=toshow)
}
//console.log(x,hideFieldArr)
}
//将隐藏的字段值重置
for(let i = 0; i< hideFieldArr.length;i++){
@ -541,6 +550,8 @@ provide(constControlChange, ({ key, value, data, tProp, type, attribute }: any)
*/
})
let mustBeHidden: any = []
let newModelKeyArr: string[] = []
function showOrHide (data:any){
//console.log(data)
@ -734,21 +745,97 @@ function showOrHide (data:any){
const switchShowConfigArr = []
//以showFields的处理过冒号的每个元素为key,其对应的optionValue为value,新建一个数组radioselectArr2。----用于获取所有出现在配置中的字段。
const radioSelectArr2:any[] = []
//20240815 关联选项设置的隐藏效果嵌套在内时不生效的问题修复 liwenxuan start
//console.log(props.formData.list) newModelKeyArr
for(let i = 0;i<props.formData.list.length;i++){
if(props.formData.list[i].type=="radio"||props.formData.list[i].type=="select"||props.formData.list[i].type=="checkbox"||props.formData.list[i].type=="switch"){
props.formData.config.hideField = [];
if(props.formData.list[i].type=="radio"||props.formData.list[i].type=="select"){
radioSelectShowConfigArr.push(props.formData.list[i].control.glxxsz)
}else if(props.formData.list[i].type=="checkbox"){
checkboxShowConfigArr.push(props.formData.list[i].control.glxxszForCheckBox)
}else if(props.formData.list[i].type=="switch"){
switchShowConfigArr.push(props.formData.list[i].control.glxxszSwitch)
}
}else if(props.formData.list[i].type=="card"||props.formData.list[i].type=="flex"||props.formData.list[i].type=="div"||props.formData.list[i].type=="table"){
props.formData.config.hideField = [];
let a = JSON.parse(JSON.stringify(props.formData.list[i].list));
for(let w = 0;w<a.length;w++){
if(a[w].type=="radio"||a[w].type=="select"){
//console.log(a[w])
radioSelectShowConfigArr.push(a[w].control.glxxsz)
}else if(a[w].type=="checkbox"){
checkboxShowConfigArr.push(a[w].control.glxxszForCheckBox)
}else if(a[w].type=="switch"){
switchShowConfigArr.push(a[w].control.glxxszSwitch)
}
newModelKeyArr.push(a[w].name)
}
}else if(props.formData.list[i].type=="grid"){
props.formData.config.hideField = [];
let columns = JSON.parse(JSON.stringify(props.formData.list[i].columns));
if(columns.length>0){
for(let z = 0;z<columns.length;z++){
for(let x = 0; x<columns[z].list.length;x++){
let a = JSON.parse(JSON.stringify(columns[z].list[x]));
if(a.type=="radio"||a.type=="select"){
radioSelectShowConfigArr.push(a.control.glxxsz)
}else if(a.type=="checkbox"){
checkboxShowConfigArr.push(a.control.glxxszForCheckBox)
}else if(a.type=="switch"){
switchShowConfigArr.push(a.control.glxxszSwitch)
}
newModelKeyArr.push(a.name)
}
}
}
}else if(props.formData.list[i].type=="tabs"){//tabs标签页有可能再嵌套一层flex或者table
props.formData.config.hideField = [];
let columns = JSON.parse(JSON.stringify(props.formData.list[i].columns));
if(columns.length>0){
for(let z = 0;z<columns.length;z++){
for(let x = 0; x<columns[z].list.length;x++){
let a = JSON.parse(JSON.stringify(columns[z].list[x]));
if(a.type=="radio"||a.type=="select"){
radioSelectShowConfigArr.push(a.control.glxxsz)
}else if(a.type=="checkbox"){
checkboxShowConfigArr.push(a.control.glxxszForCheckBox)
}else if(a.type=="switch"){
switchShowConfigArr.push(a.control.glxxszSwitch)
}else if(a.type=="flex"||a.type=="table"){
if(a.list.length>0){
for(let m = 0;m<a.list.length;m++){
let q = JSON.parse(JSON.stringify(a.list[m]))
//console.log(q)
if(q.type=="radio"||q.type=="select"){
radioSelectShowConfigArr.push(q.control.glxxsz)
}else if(q.type=="checkbox"){
checkboxShowConfigArr.push(q.control.glxxszForCheckBox)
}else if(q.type=="switch"){
switchShowConfigArr.push(q.control.glxxszSwitch)
}
newModelKeyArr.push(q.name)
}
}
}
newModelKeyArr.push(a.name)
}
}
}
}
//console.log(props.formData.list[i].type)
if(props.formData.list[i].type=="radio"||props.formData.list[i].type=="select"){
radioSelectShowConfigArr.push(props.formData.list[i].control.glxxsz)
}else if(props.formData.list[i].type=="checkbox"){
checkboxShowConfigArr.push(props.formData.list[i].control.glxxszForCheckBox)
}else if(props.formData.list[i].type=="switch"){
switchShowConfigArr.push(props.formData.list[i].control.glxxszSwitch)
}
newModelKeyArr.push(props.formData.list[i].name)
}
newModelKeyArr = Array.from(new Set(newModelKeyArr));
//20240815 关联选项设置的隐藏效果嵌套在内时不生效的问题修复 liwenxuan end
//console.log(radioSelectShowConfigArr)
//数组深拷贝
const radioSelectShowConfigArr2 = JSON.parse(JSON.stringify(radioSelectShowConfigArr));
const checkboxShowConfigArr2 = JSON.parse(JSON.stringify(checkboxShowConfigArr));
@ -957,7 +1044,7 @@ function showOrHide (data:any){
//console.log(props.formData.config.hideField)

Write Preview
Loading…
Cancel
Save