Web/admin-sjzx
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

提交修改代码

Browse Source
This commit is contained in:
zhujiyan
2024-05-09 13:46:20 +08:00
parent 6076cec029
commit eeef608ccd
8 changed files with 535 additions and 404 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/Selector/userSelectorPlus.vue
View File

@@ -7,6 +7,7 @@
:destroy-on-close="true"
@ok="handleOk"
@cancel="handleClose"
:append-to-body="true"
>
<el-row :gutter="10">
<el-col :span="7">

22
src/components/XnWorkflow/nodes/components/navTitle.vue Normal file
View File

@@ -0,0 +1,22 @@
<template>
<div class="nav_title" :style="{ borderLeft: `4px solid ${borderColor}` }">
<p><slot name="nav_name"></slot></p>
</div>
</template>
<script setup>
import { useConfig } from '@/stores/config'
import { ref } from 'vue'
const configStore = useConfig()
const borderColor =configStore.getColorVal('elementUiPrimary')
</script>
<style lang="scss" scoped>
.nav_title {
padding-left: 8px;
margin-top: 10px;
p {
font-size: 15px;
color: #212121;
font-weight: 600;
}
}
</style>

12
src/components/XnWorkflow/nodes/exclusiveGateway.vue
View File

@@ -42,8 +42,9 @@
<add-node v-model="childNode.childNode" :parent-data="childNode" />
</div>
<xn-form-container
v-model:visible="drawer"
<formContainer
v-model="drawer"
:visible="visible"
:destroy-on-close="true"
:width="700"
:body-style="{ 'padding-top': '0px' }"
@@ -64,7 +65,7 @@
/>
</div>
</template>
<el-layout-content>
<div>
<el-tabs v-model="activeKey">
<el-tab-pane name="1" label="条件配置" lazy>
<el-form layout="vertical">
@@ -199,12 +200,12 @@
/>
</el-tab-pane>
</el-tabs>
</el-layout-content>
</div>
<template #footer>
<el-button type="primary" style="margin-right: 8px" @click="save">保存</el-button>
<el-button @click="drawer = false">取消</el-button>
</template>
</xn-form-container>
</formContainer>
</div>
</template>
@@ -503,6 +504,7 @@ import tool from '@/utils/tool'
import AddNode from './addNode.vue'
import { ref, watch, onMounted } from 'vue'
import PropListenerInfo from './prop/propListenerInfo.vue'
import formContainer from '@/components/formContainer/index.vue';
const props = defineProps({
modelValue: { type: Object, default: () => {} },
formFieldListValue: { type: Array, default: () => [] },

2
src/components/XnWorkflow/nodes/parallelGateway.vue
View File

@@ -2,7 +2,7 @@
<div class="branch-wrap">
<div class="branch-box-wrap">
<div class="branch-box">
<a-button class="add-branch" type="primary" shape="round" @click="addTerm">添加并行</a-button>
<el-button class="add-branch" type="primary" shape="round" @click="addTerm">添加并行</el-button>
<div v-for="(item, index) in childNode.conditionNodeList" :key="index" class="col-box">
<div class="condition-node">
<div class="condition-node-box">

81
src/components/XnWorkflow/nodes/prop/formUserSelector.vue
View File

@@ -13,7 +13,7 @@
ref="table"
:columns="columns"
:datel-source="dataSource"
:row-key="(record) => record.model"
:row-key="record => record.model"
:expand-row-by-click="true"
:row-selection="{ selectedRowKeys: state.selectedRowKeys, onChange: onSelectChange, type: 'radio' }"
:pagination="false"
@@ -25,12 +25,12 @@
</template>
<script setup name="formUserSelector">
import workFlowUtils from '@/components/XnWorkflow/nodes/utils/index'
import { ElMessage } from 'element-plus'
import {ref,reactive} from 'vue'
const visible = ref(false)
import workFlowUtils from '@/components/XnWorkflow/nodes/utils/index'
import { ElMessage } from 'element-plus'
import { ref, reactive } from 'vue'
const visible = ref(false)
const columns = [
const columns = [
{
title: '字段名',
dataIndex: 'label'
@@ -39,19 +39,22 @@
title: '字段',
dataIndex: 'model'
}
]
]
// 定义emit事件
const emit = defineEmits({ click: null })
const props = defineProps(['formFieldList'])
// 定义emit事件
const emit = defineEmits({ click: null })
const props = defineProps(['formFieldList'])
const dataSource = ref([])
dataSource.value = workFlowUtils.getListField(props.formFieldList).filter((f) => {
const dataSource = ref([])
dataSource.value = workFlowUtils
.getListField(props.formFieldList)
.filter(f => {
// 判断如果是人员类型的，就让列表显示
if (f.type === 'xnUserSelector') {
return f
}
}).map((m) => {
})
.map(m => {
return {
label: m.label,
model: m.model,
@@ -59,50 +62,56 @@
type: m.type
}
})
const selectedRowKeys = ref([])
// 设置默认选中的
const state = reactive({
const selectedRowKeys = ref([])
// 设置默认选中的
const state = reactive({
selectedRowKeys: selectedRowKeys.value,
loading: false
})
const showFormUserModal = (data = '') => {
})
const showFormUserModal = (data = '') => {
if (dataSource.value.length === 0) {
message.warning('表单内无人员可提供选择！')
ElMessage({
message: '表单内无人员可提供选择！',
type: 'warning'
})
return
}
if (dataSource.value.length === 1) {
emit('click', dataSource.value[0])
message.success('表单内仅有一个人员选择，默认选中！')
ElMessage({
message: '表单内仅有一个人员选择，默认选中！',
type: 'success'
})
} else {
visible.value = true
state.selectedRowKeys[0] = data
}
}
// 点击复选框回调
const onSelectChange = (selectedRowKeys) => {
}
// 点击复选框回调
const onSelectChange = selectedRowKeys => {
state.selectedRowKeys = selectedRowKeys
}
// 确定
const handleOk = () => {
const result = dataSource.value.filter((item) => state.selectedRowKeys[0] === item.model)
}
// 确定
const handleOk = () => {
const result = dataSource.value.filter(item => state.selectedRowKeys[0] === item.model)
emit('click', result[0])
visible.value = false
state.selectedRowKeys = []
}
// 关闭
const handleCancel = () => {
}
// 关闭
const handleCancel = () => {
visible.value = false
}
}
// 抛出方法，让上个界面使用
defineExpose({
// 抛出方法，让上个界面使用
defineExpose({
showFormUserModal
})
})
</script>
<style lang="less">
.form-user-table {
.form-user-table {
overflow: auto;
max-height: 400px;
}
}
</style>

205
src/components/XnWorkflow/nodes/serviceTask.vue
View File

@@ -1,27 +1,35 @@
<!-- 抄送人组件 -->
<template>
<div class="node-wrap">
<div class="node-wrap-box" @click="show">
<div class="title" style="background: #3296fa">
<send-outlined class="icon" />
<span>{{ childNode.title }}</span>
<close-outlined class="close" @click.stop="delNode()" />
<!-- <close-outlined class="close" /> -->
<el-icon>
<CloseBold @click="delNode()" />
</el-icon>
</div>
<div class="content">
<span v-if="toText(childNode)">{{ toText(childNode) }}</span>
<span v-else class="placeholder">请选择人员</span>
</div>
</div>
<add-node v-model="childNode.childNode"></add-node>
<xn-form-container
v-model:visible="drawer"
<addNode v-model="childNode.childNode"></addNode>
<formContainer
v-model="drawer"
:visibile="drawer"
:destroy-on-close="true"
:width="700"
:body-style="{ 'padding-top': '0px' }"
>
<template #title>
<div class="node-wrap-drawer__title">
<label v-if="!isEditTitle" @click="editTitle"
>{{ form.title }}<edit-outlined class="node-wrap-drawer-title-edit" />
<label v-if="!isEditTitle" @click="editTitle">
{{ form.title }}
<el-icon>
<EditPen />
</el-icon>
<!-- <edit-outlined class="node-wrap-drawer-title-edit" /> -->
</label>
<el-input
v-if="isEditTitle"
@@ -33,29 +41,35 @@
/>
</div>
</template>
<el-container>
<div class="tab_container">
<el-tabs v-model="activeKey">
<el-tab-pane name="1" label="抄送配置" lazy>
<el-form layout="vertical" :model="userTypeForm">
<div v-show="nodeLegal" style="margin-bottom: 10px">
<el-alert message="请选择抄送人员！" type="error" />
<div class="please_choose">
<p>请选择抄送人员！</p>
</div>
</div>
<div class="mb-2">
<span class="left-span-label">选择要抄送的人员</span>
<navTitle><template #nav_name>选择要抄送的人员</template></navTitle>
</div>
<el-radio-group v-model:value="userSelectionType" style="width: 100%">
<el-row style="padding-bottom: 10px">
<el-col :span="8" v-for="userSelectionType in userSelectionTypeList" :key="userSelectionType.value">
<el-radio :value="userSelectionType.value" @click="selectionClick(userSelectionType.value)">
{{ userSelectionType.label }}
<!-- 选择抄送人员 -->
<el-radio-group v-model="userSelectionType" @input="changeRadio" style="width: 100%">
<el-radio
v-for="(item, index) in userSelectionTypeList"
:value="item.value"
:key="index"
>
<!-- @click="selectionClick(item.value)" -->
{{ item.label }}
</el-radio>
</el-col>
</el-row>
</el-radio-group>
<el-form-item v-if="userSelectionType === 'USER'">
<el-button class="mt-2" type="primary" size="small" round @click="openSelector">
<el-button class="mt-2" type="primary" size="small" @click="openSelector">
<template #icon>
<search-outlined />
<el-icon>
<Search />
</el-icon>
</template>
选择
</el-button>
@@ -66,35 +80,48 @@
<div class="mt-2">
<el-button type="primary" @click="openSelector" size="small">
<template #icon>
<search-outlined />
<el-icon>
<Search />
</el-icon>
</template>
选择
</el-button>
</div>
<div class="mt-2">
<prop-tag
v-if="form.properties.participateInfo.length > 0 && form.properties.participateInfo[0].value !== ''"
v-if="
form.properties.participateInfo.length > 0 &&
form.properties.participateInfo[0].value !== ''
"
:tag-list="form.properties.participateInfo[0]"
/>
</div>
</el-form-item>
<!-- 选择人员变量 -->
<el-form-item
class="mt-2"
v-if="recordData.formType === 'DEFINE' && userSelectionType === 'FORM_USER'"
v-if="userSelectionType === 'FORM_USER'"
name="formUser"
:rules="[{ required: true, message: '请输入人员变量' }]"
>
<template #label>
<el-tooltip>
<template #title>单个字段可以采用：字段名，多个采用：字段名1,字段名2,字段名3</template>
:rules="[{ required: true, message: '请输入人员变量' }]">
<!-- recordData.formType === 'DEFINE' && -->
<!-- <template #label> -->
<!-- <el-tooltip>
<template #title></template>
<question-circle-outlined />
人员变量：
</el-tooltip> -->
<!-- </template> -->
<el-tooltip
content="单个字段可以采用：字段名，多个采用：字段名1,字段名2,字段名3"
placement="top-start"
>
<span class="user_icon">?</span>
<span style="width: 100px;display:block;float: left;">
</span>人员变量：
</el-tooltip>
</template>
<el-input
style="width: 50%"
v-model:value="userTypeForm.formUser"
allow-clear
v-model="userTypeForm.formUser"
clearable
@input="customFormUser"
@keyup.enter="customFormUser"
placeholder="请输入人员变量"
@@ -105,19 +132,19 @@
<el-tab-pane name="2" label="执行监听" lazy>
<prop-listener-info
ref="propExecutionListenerInfoRef"
v-if="form&&form.properties&&form.properties.executionListenerInfo"
v-if="form && form.properties && form.properties.executionListenerInfo"
:listener-value="form.properties.executionListenerInfo"
:default-listener-list="executionListenerInfo"
:listener-value-array="executionListenerArray"
/>
</el-tab-pane>
</el-tabs>
</el-container>
</div>
<template #footer>
<el-button type="primary" style="margin-right: 8px" @click="save">保存</el-button>
<el-button @click="drawer = false">取消</el-button>
</template>
</xn-form-container>
</formContainer>
<form-user-selector ref="formUserSelectorRef" :form-field-list="formFieldListValue" @click="userCallBack" />
<user-selector-plus
ref="userselectorPlus"
@@ -131,21 +158,29 @@
</template>
<script>
import addNode from './addNode.vue'
import userSelectorPlus from '@/components/Selector/userSelectorPlus.vue'
import FormUserSelector from './prop/formUserSelector.vue'
import propTag from './prop/propTag.vue'
import { cloneDeep, isEmpty } from 'lodash-es'
import config from '@/components/XnWorkflow/nodes/config/config'
import PropListenerInfo from './prop/propListenerInfo.vue'
export default {
import addNode from './addNode.vue'
import userSelectorPlus from '@/components/Selector/userSelectorPlus.vue'
import FormUserSelector from './prop/formUserSelector.vue'
import propTag from './prop/propTag.vue'
import { cloneDeep, isEmpty } from 'lodash-es'
import config from '@/components/XnWorkflow/nodes/config/config'
import PropListenerInfo from './prop/propListenerInfo.vue'
import { CloseBold, EditPen, Search ,InfoFilled} from '@element-plus/icons-vue'
import formContainer from '@/components/formContainer/index.vue'
import navTitle from '../components/navTitle.vue'
export default {
components: {
FormUserSelector,
addNode,
userSelectorPlus,
propTag,
PropListenerInfo
PropListenerInfo,
formContainer,
navTitle,
CloseBold,
EditPen,
Search,
InfoFilled
},
props: {
modelValue: { type: Object, default: () => {} },
@@ -185,7 +220,7 @@
if (!isEmpty(this.form.properties.participateInfo)) {
this.userSelectionType = this.form.properties.participateInfo[0].key
// 如果包含表单内的人
const formUserObj = this.form.properties.participateInfo.find((f) => f.key === 'FORM_USER')
const formUserObj = this.form.properties.participateInfo.find(f => f.key === 'FORM_USER')
if (formUserObj) {
this.userTypeForm.formUser = formUserObj.value
}
@@ -206,7 +241,8 @@
},
save() {
if (isEmpty(this.nodeLegal)) {
this.form.properties.executionListenerInfo = this.$refs.propExecutionListenerInfoRef.selectedListenerList()
this.form.properties.executionListenerInfo =
this.$refs.propExecutionListenerInfoRef.selectedListenerList()
this.form.dataLegal = true
this.$emit('update:modelValue', this.form)
this.drawer = false
@@ -231,7 +267,7 @@
this.form.properties.participateInfo = [
{
key: 'FORM_USER',
label: this.userSelectionTypeList.filter((item) => item.value === 'FORM_USER')[0].label,
label: this.userSelectionTypeList.filter(item => item.value === 'FORM_USER')[0].label,
value: value.model
}
]
@@ -241,7 +277,7 @@
getTagList(type) {
const participateInfo = this.form.properties.participateInfo
if (participateInfo.length > 0) {
const obj = participateInfo.find((item) => item.key === type)
const obj = participateInfo.find(item => item.key === type)
if (isEmpty(obj.label)) {
return undefined
} else {
@@ -251,6 +287,11 @@
return undefined
}
},
changeRadio() {
console.log(this.userSelectionType, '99999')
this.form.properties.participateInfo = []
this.nodeLegal = true
},
// 选择抄送人员类型
selectionClick(value) {
this.form.properties.participateInfo = []
@@ -268,14 +309,15 @@
},
// 监听自定义表单人员输入
customFormUser() {
// console.log(this.userTypeForm.formUser,"0000000");
if (this.userTypeForm.formUser) {
this.form.properties.participateInfo = [
{
key: 'FORM_USER',
label: '表单内的人',
value: this.userTypeForm.formUser
}
]
// this.form.properties.participateInfo = [
// {
// key: 'FORM_USER',
// label: '表单内的人',
// value: this.userTypeForm.formUser
// }
// ]
this.nodeLegal = false
} else {
this.nodeLegal = true
@@ -301,5 +343,56 @@
}
}
}
}
}
</script>
<style lang="scss" scoped>
.title {
position: relative;
.el-icon {
float: right;
position: absolute;
right: 13px;
top: 6px;
display: none;
}
}
.node-wrap-box:hover {
.el-icon {
display: block;
}
}
.node-wrap-drawer__title {
margin-bottom: 0 !important;
}
.el-tab_container {
width: 100%;
}
.please_choose {
width: 96%;
height: 40px;
margin-top: 20px;
background-color: #fff0f0;
border: 2px solid #ffa39e;
display: flex;
align-items: center;
justify-content: flex-start;
padding: 8px 15px;
p {
font-size: 14px;
font-weight: 400;
}
}
.el-radio-group {
margin: 10px 0;
}
.user_icon{
display: block;
width:18px;
height: 18px;
border:1px solid #000;
border-radius:50%;
font-size: 14px;
line-height: 18px;
text-align: center;
}
</style>

4
src/components/formContainer/index.vue
View File

@@ -1,10 +1,10 @@
<template>
<el-dialog v-if="isModal" v-model="visibles" @cancel="cancel" v-bind="$attrs">
<el-dialog v-if="isModal" size="50%" v-model="visibles" @cancel="cancel" v-bind="$attrs" :append-to-body="true">
<template v-for="slotKey in slotKeys" #[slotKey]>
<slot :name="slotKey" />
</template>
</el-dialog>
<el-drawer v-else v-model="visibles" v-bind="$attrs" :footer-style="{ textAlign: 'right' }">
<el-drawer v-else size="50%" v-model="visibles" v-bind="$attrs" :append-to-body="true" :footer-style="{ textAlign: 'right' }">
<template v-for="slotKey in slotKeys" #[slotKey]>
<slot :name="slotKey" />
</template>

4
src/styles/element.scss
View File

@@ -196,3 +196,7 @@
.sgmap-ctrl-bottom-left{
display: none !important;
}
.el-drawer__header{
margin-bottom: 0 !important;
}