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

关联表单-数据填充规则-v0.276

lwx_v6
liwenxuan 1 year ago
parent
3c9d79eb50
commit
5eb98c91e5
1 changed files with 85 additions and 112 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. 197
      src/widget/associatedforms/associatedFormsChildFillRole.vue

197
src/widget/associatedforms/associatedFormsChildFillRole.vue
View File

@ -1,47 +1,33 @@
<!-- eslint-disable vue/no-v-html -->
<template>
<div
style="background-color: #F0F0F0;padding: 12px;border-radius: 5px;padding-left:45px;margin-bottom:20px;margin-right:11px;min-height: 65px;padding-top: 16px;color: black;">
<el-button
:icon="Close" size="small" circle type="info" plain
style="float: right;margin-top: -22px;margin-right: -22px" @click="delRole" />
<el-tree-select
<el-tree-select
v-model="selectedChildTable1" style="width: 290px;margin-bottom: -1px" :data="childTableList"
placeholder="请选择关联表单子表" check-strictly :render-after-expand="false" filterable
@change="selectedChildTableChanged" />
<el-popover
placement="top-end"
title=""
:width="200"
trigger="hover"
content="若【设置筛选条件】，则仅填充满足筛选条件的子表数据"
>
<template #reference>
<el-button
v-if="selectedChildTable1 !== '' && filterCondition1.conditionHtml === ''"
style="padding-top: 8px; width: 290px;margin-left: 85px;height: 30px;" type="primary" plain append-to-body="true"
modal="true" @click="filterConditionDialogFlag = true">设置筛选条件（选填）</el-button>
</template>
</el-popover>
<el-popover placement="top-end" title="" :width="200" trigger="hover" content="若【设置筛选条件】，则仅填充满足筛选条件的子表数据">
<template #reference>
<el-button
v-if="selectedChildTable1 !== '' && filterCondition1.conditionHtml === ''"
style="padding-top: 8px; width: 290px;margin-left: 85px;height: 30px;" type="primary" plain
append-to-body="true" modal="true" @click="filterConditionDialogFlag = true">设置筛选条件（选填）</el-button>
</template>
</el-popover>
<div
v-if="selectedChildTable1 !== '' && filterCondition1.conditionHtml !== ''"
style="padding-top: 5px; width: auto;margin-left: 85px;height: 30px;cursor: pointer;display: inline-block;margin-top: 3px;"
@click="filterConditionDialogHandle" v-html="filterCondition1.conditionHtml"></div>
<el-divider v-if="selectedChildTable1 !== ''" />
<div v-if="selectedChildTable1 !== ''" style="background-color: #F0F0F0;padding: 12px;border-radius: 10px;padding-left:45px;margin-bottom:20px;padding-bottom: 1px;margin-right: 10px;"><!-- #F5F7FA #E6F3FE #F0F0F0 #F5F7FA-->
<template v-for="(item, index) in childRoles" :key="childRoles[index].id">
{{ item }}
<!-- <AssociatedFormsFillRole
<div
v-if="selectedChildTable1 !== ''"
style="background-color: #F0F0F0;padding: 12px;border-radius: 10px;padding-left:45px;margin-bottom:20px;padding-bottom: 1px;margin-right: 10px;"><!-- #F5F7FA #E6F3FE #F0F0F0 #F5F7FA-->
<template v-for="(item, index) in childRoles" :key="childRoles[index].id">
{{ item }}
<!-- <AssociatedFormsFillRole
v-model:left-value="controlData.control.fillRoles.master[index].leftValue"
v-model:right-value="controlData.control.fillRoles.master[index].rightValue"
:left-tree-source = "asfasfMasterFieldTree"
@ -50,78 +36,65 @@
@del-role = "delRole"
>
</AssociatedFormsFillRole> -->
</template>
</template>
</div>
</div>
<el-dialog v-model="filterConditionDialogFlag" style="margin-top:70px ;min-height: 500px" width="50%" :show-close="false" title="筛选条件" append-to-body>
<div class="common-layout">
<el-container>
<el-aside width="300px" style="height:420px;border: 1px solid gainsboro;margin-right: 5px;">
<el-tree
ref="fieldTreeRef" node-key="id" empty-text="选择关联的表单后展示" :data="asfasfFieldTree"
:props="treeDefaultProps" :filter-node-method="filterNode"
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px;" @node-contextmenu="handleFieldTreeContextmenuRange" />
<!-- <el-input
v-show="fieldTreeSearchFlag" v-model="fieldTreeFilterText" style="width:98%;margin: 3px;"
placeholder="搜索字段" class="filter-tree" /> -->
<el-tree
ref="fieldTreeRef" node-key="id" empty-text="请先保存当前表单" :data="associatedFormsCurrentFormFieldTree"
:props="treeDefaultProps" :filter-node-method="filterNode"
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px;" @node-contextmenu="handleFieldTreeContextmenuRange" />
<!-- <el-input
v-show="orgTreeSearchFlag" v-model="orgTreeFilterText" style="width:98%;margin: 3px;"
placeholder="搜索字段" class="filter-tree" /> -->
<el-tree
ref="orgTreeRef" style="max-width: 600px; border: 1px solid gainsboro; margin: 3px;"
:data="orgAndManTree" :props="treeDefaultProps" :filter-node-method="filterNode"
@node-contextmenu="handleOrgTreeContextmenuRange" />
<!--<el-input
v-show="roleTreeSearchFlag" v-model="roleTreeFilterText" style="width:98%;margin: 3px;"
placeholder="搜索字段" class="filter-tree" />-->
<el-tree
ref="roleTreeRef" style="max-width: 600px; border: 1px solid gainsboro; margin: 3px;"
:data="roleTree" :props="treeDefaultProps" :filter-node-method="filterNode"
@node-contextmenu="handleRoleTreeContextmenuRange" />
</el-aside>
<el-main style="border: 1px solid gainsboro; padding: 3px;" class="associatedFormsHideDialogMain">
<div
style="border: 1px solid gainsboro; height: 7%; border-bottom: 0px; padding-top: 3px; padding-left: 5px; background-color: #E6F3FE;">
仅可选择符合以下条件的数据</div>
<div id="associatedFormsHideEditArea" style="border: 1px solid gainsboro; height: 38%; border-bottom: 0px;">
<AssociatedFormsTinyaceFillRoleFilterCondition
ref="tinymceRef"
:aft-text="filterCondition1.conditionHtml"
:aft-text-copy="filterCondition1.conditionHtmlCopy"
@text-change="aftTextChangedRange" @gongshi-change="aftGongshiChangedRange"
></AssociatedFormsTinyaceFillRoleFilterCondition>
</div>
<div style="border: 1px solid gainsboro; height: 55%; padding-top: 20px;">
<ul>
<li>请从左侧面板<span style="color: red">右击</span>选择字段或选项</li>
<li>支持的符号：<span style="color: red">'==', '>=', '>', '<=', '<' , '!=' </span>
</li>
<li>支持<span style="color: red">"包含,不包含,数据拥有者,数据所属部门"</span>关键字,用于组织机构条件,角色条件,==运算符和!=运算符</li>
<li>参考举例：</li>
<span style="margin-left: 14px;">年龄>10</span><br>
<span style="margin-left: 14px;">企管部==数据所属部门</span><br>
<span style="margin-left: 14px;">绩效考核执行人包含数据拥有者</span><br>
<span style="margin-left: 14px;">生产部包含数据所属部门</span>
</ul>
</div>
</el-main>
</el-container>
</div>
<el-dialog
v-model="filterConditionDialogFlag" style="margin-top:70px ;min-height: 500px" width="50%"
:show-close="false" title="筛选条件" append-to-body>
<div class="common-layout">
<el-container>
<el-aside width="300px" style="height:420px;border: 1px solid gainsboro;margin-right: 5px;">
<el-tree
ref="fieldTreeRef" node-key="id" empty-text="选择关联的表单后展示" :data="asfasfFieldTree"
:props="treeDefaultProps" :filter-node-method="filterNode"
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px;"
@node-contextmenu="handleFieldTreeContextmenuRange" />
<el-tree
ref="fieldTreeRef" node-key="id" empty-text="请先保存当前表单" :data="associatedFormsCurrentFormFieldTree"
:props="treeDefaultProps" :filter-node-method="filterNode"
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px;"
@node-contextmenu="handleFieldTreeContextmenuRange" />
<el-tree
ref="orgTreeRef" style="max-width: 600px; border: 1px solid gainsboro; margin: 3px;"
:data="orgAndManTree" :props="treeDefaultProps" :filter-node-method="filterNode"
@node-contextmenu="handleOrgTreeContextmenuRange" />
<el-tree
ref="roleTreeRef" style="max-width: 600px; border: 1px solid gainsboro; margin: 3px;"
:data="roleTree" :props="treeDefaultProps" :filter-node-method="filterNode"
@node-contextmenu="handleRoleTreeContextmenuRange" />
</el-aside>
<el-main style="border: 1px solid gainsboro; padding: 3px;" class="associatedFormsHideDialogMain">
<div
style="border: 1px solid gainsboro; height: 7%; border-bottom: 0px; padding-top: 3px; padding-left: 5px; background-color: #E6F3FE;">
仅可选择符合以下条件的数据</div>
<div id="associatedFormsHideEditArea" style="border: 1px solid gainsboro; height: 38%; border-bottom: 0px;">
<AssociatedFormsTinyaceFillRoleFilterCondition
ref="tinymceRef" :aft-text="filterCondition1.conditionHtml"
:aft-text-copy="filterCondition1.conditionHtmlCopy" @text-change="aftTextChangedRange"
@gongshi-change="aftGongshiChangedRange"></AssociatedFormsTinyaceFillRoleFilterCondition>
</div>
<div style="border: 1px solid gainsboro; height: 55%; padding-top: 20px;">
<ul>
<li>请从左侧面板<span style="color: red">右击</span>选择字段或选项</li>
<li>支持的符号：<span style="color: red">'==', '>=', '>', '<=', '<' , '!=' </span>
</li>
<li>支持<span style="color: red">"包含,不包含,数据拥有者,数据所属部门"</span>关键字,用于组织机构条件,角色条件,==运算符和!=运算符</li>
<li>参考举例：</li>
<span style="margin-left: 14px;">年龄>10</span><br>
<span style="margin-left: 14px;">企管部==数据所属部门</span><br>
<span style="margin-left: 14px;">绩效考核执行人包含数据拥有者</span><br>
<span style="margin-left: 14px;">生产部包含数据所属部门</span>
</ul>
</div>
</el-main>
</el-container>
</div>
<template #footer>
<div class="dialog-footer">
<!-- <el-button @click="asfhTextCancelRange">取消</el-button> -->
<el-button type="primary" @click="filterConditionDialogHandle">
确定
</el-button>
@ -137,40 +110,40 @@ import AssociatedFormsTinyaceFillRoleFilterCondition from '@/widget/associatedfo
let emit = defineEmits(["delRole", "update:selectedChildTable",]);
const props = defineProps({
orgAndManTree:{
orgAndManTree: {
type: Object,
default() {
return {}
}
},
roleTree:{
roleTree: {
type: Object,
default() {
return {}
}
},
associatedFormsCurrentFormFieldTree:{
associatedFormsCurrentFormFieldTree: {
type: Object,
default() {
return {}
}
},
filterNode:{
filterNode: {
type: Object,
default() {
return {}
}
},
treeDefaultProps:{
treeDefaultProps: {
type: Object,
default() {
return {}
}
},
asfasfFieldTree:{
asfasfFieldTree: {
type: Object,
default() {
return {}
@ -194,14 +167,14 @@ const props = defineProps({
return {}
}
},
currentKey: {
type: String,
default() {
return {}
}
},
childRoles:{
childRoles: {
type: Object,
default() {
return {}
@ -229,11 +202,11 @@ function filterConditionDialogHandle() {
filterConditionDialogFlag.value = !filterConditionDialogFlag.value
}
function aftTextChangedRange(str:string){
function aftTextChangedRange(str: string) {
filterCondition1.value.conditionHtml = str
}
function aftGongshiChangedRange(gongshi:any){
function aftGongshiChangedRange(gongshi: any) {
filterCondition1.value.gongShi.formulaHtml = gongshi.formulaHtml
filterCondition1.value.gongShi.mathsFormula = gongshi.mathsFormula
filterCondition1.value.gongShi.mathsString = gongshi.mathsString
@ -247,13 +220,13 @@ function selectedChildTableChanged() {
function delRole() {
emit('delRole', props.currentKey)
}
function handleOrgTreeContextmenuRange(MouseEvent:any, object:any, Node:any, element:any){
function handleOrgTreeContextmenuRange(MouseEvent: any, object: any, Node: any, element: any) {
tinymceRef.value.addIcon_org(object)
}
function handleRoleTreeContextmenuRange(MouseEvent:any, object:any, Node:any, element:any){
function handleRoleTreeContextmenuRange(MouseEvent: any, object: any, Node: any, element: any) {
tinymceRef.value.addIcon(object)
}
function handleFieldTreeContextmenuRange(MouseEvent:any, object:any, Node:any, element:any){
}
function handleFieldTreeContextmenuRange(MouseEvent: any, object: any, Node: any, element: any) {
tinymceRef.value.addIcon(object)
}
</script>

Write Preview
Loading…
Cancel
Save