export const template = (isTaskListener) => {
|
return `
|
<div class="panel-tab__content">
|
<el-table :data="elementListenersList" size="small" border>
|
<el-table-column label="序号" width="50px" type="index" />
|
<el-table-column label="事件类型" min-width="100px" prop="event" />
|
<el-table-column label="监听器类型" min-width="100px" show-overflow-tooltip :formatter="row => listenerTypeObject[row.listenerType]" />
|
<el-table-column label="操作" width="90px">
|
<template #default="scope">
|
<el-button size="small" type="primary" link @click="openListenerForm(scope, scope.$index)">编辑</el-button>
|
<el-divider direction="vertical" />
|
<el-button size="small" type="primary" link style="color: #ff4d4f" @click="removeListener(scope, scope.$index)">移除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div class="element-drawer__button">
|
<el-button size="small" type="primary" icon="el-icon-plus" @click="openListenerForm(null)">添加监听器</el-button>
|
</div>
|
|
<!-- 监听器 编辑/创建 部分 -->
|
<el-drawer :visible.sync="listenerFormModelVisible" title="执行监听器" :size="width + 'px'" append-to-body destroy-on-close>
|
<el-form size="small" :model="listenerForm" label-width="96px" ref="listenerFormRef" @submit.native.prevent>
|
<el-form-item label="事件类型" prop="event" :rules="{ required: true, trigger: ['blur', 'change'] }">
|
<el-select v-model="listenerForm.event">
|
<el-option label="start" value="start" />
|
<el-option label="end" value="end" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="监听器类型" prop="listenerType" :rules="{ required: true, trigger: ['blur', 'change'] }">
|
<el-select v-model="listenerForm.listenerType">
|
<el-option v-for="i in Object.keys(listenerTypeObject)" :key="i" :label="listenerTypeObject[i]" :value="i" />
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
v-if="listenerForm.listenerType === 'classListener'"
|
label="Java类"
|
prop="class"
|
key="listener-class"
|
:rules="{ required: true, trigger: ['blur', 'change'] }"
|
>
|
<el-input v-model="listenerForm.class" clearable />
|
</el-form-item>
|
<el-form-item
|
v-if="listenerForm.listenerType === 'expressionListener'"
|
label="表达式"
|
prop="expression"
|
key="listener-expression"
|
:rules="{ required: true, trigger: ['blur', 'change'] }"
|
>
|
<el-input v-model="listenerForm.expression" clearable />
|
</el-form-item>
|
<el-form-item
|
v-if="listenerForm.listenerType === 'delegateExpressionListener'"
|
label="代理表达式"
|
prop="delegateExpression"
|
key="listener-delegate"
|
:rules="{ required: true, trigger: ['blur', 'change'] }"
|
>
|
<el-input v-model="listenerForm.delegateExpression" clearable />
|
</el-form-item>
|
<template v-if="listenerForm.listenerType === 'scriptListener'">
|
<el-form-item
|
label="脚本格式"
|
prop="scriptFormat"
|
key="listener-script-format"
|
:rules="{ required: true, trigger: ['blur', 'change'], message: '请填写脚本格式' }"
|
>
|
<el-input v-model="listenerForm.scriptFormat" clearable />
|
</el-form-item>
|
<el-form-item
|
label="脚本类型"
|
prop="scriptType"
|
key="listener-script-type"
|
:rules="{ required: true, trigger: ['blur', 'change'], message: '请选择脚本类型' }"
|
>
|
<el-select v-model="listenerForm.scriptType">
|
<el-option label="内联脚本" value="inlineScript" />
|
<el-option label="外部脚本" value="externalScript" />
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
v-if="listenerForm.scriptType === 'inlineScript'"
|
label="脚本内容"
|
prop="value"
|
key="listener-script"
|
:rules="{ required: true, trigger: ['blur', 'change'], message: '请填写脚本内容' }"
|
>
|
<el-input v-model="listenerForm.value" clearable />
|
</el-form-item>
|
<el-form-item
|
v-if="listenerForm.scriptType === 'externalScript'"
|
label="资源地址"
|
prop="resource"
|
key="listener-resource"
|
:rules="{ required: true, trigger: ['blur', 'change'], message: '请填写资源地址' }"
|
>
|
<el-input v-model="listenerForm.resource" clearable />
|
</el-form-item>
|
</template>
|
${
|
isTaskListener
|
? "<el-form-item label='定时器类型' prop='eventDefinitionType' key='eventDefinitionType'>" +
|
"<el-select v-model='listenerForm.eventDefinitionType'>" +
|
"<el-option label='日期' value='date' />" +
|
"<el-option label='持续时长' value='duration' />" +
|
"<el-option label='循环' value='cycle' />" +
|
"<el-option label='无' value='' />" +
|
'</el-select>' +
|
'</el-form-item>' +
|
"<el-form-item v-if='!!listenerForm.eventDefinitionType' label='定时器' prop='eventDefinitions' key='eventDefinitions'>" +
|
"<el-input v-model='listenerForm.eventDefinitions' clearable />" +
|
'</el-form-item>'
|
: ''
|
}
|
</el-form>
|
<el-divider />
|
<p class="listener-filed__title">
|
<span><i class="el-icon-menu"></i>注入字段：</span>
|
<el-button size="small" type="primary" @click="openListenerFieldForm(null)">添加字段</el-button>
|
</p>
|
<el-table :data="fieldsListOfListener" size="small" max-height="240" border fit style="flex: none">
|
<el-table-column label="序号" width="50px" type="index" />
|
<el-table-column label="字段名称" min-width="100px" prop="name" />
|
<el-table-column label="字段类型" min-width="80px" show-overflow-tooltip :formatter="row => fieldTypeObject[row.fieldType]" />
|
<el-table-column label="字段值/表达式" min-width="100px" show-overflow-tooltip :formatter="row => row.string || row.expression" />
|
<el-table-column label="操作" width="100px">
|
<template #default="scope">
|
<el-button size="small" type="primary" link @click="openListenerFieldForm(scope, scope.$index)">编辑</el-button>
|
<el-divider direction="vertical" />
|
<el-button size="small" type="primary" link style="color: #ff4d4f" @click="removeListenerField(scope, scope.$index)">移除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<div class="element-drawer__button">
|
<el-button size="small" @click="listenerFormModelVisible = false">取 消</el-button>
|
<el-button size="small" type="primary" @click="saveListenerConfig">保 存</el-button>
|
</div>
|
</el-drawer>
|
|
<!-- 注入西段 编辑/创建 部分 -->
|
<el-dialog title="字段配置" :visible.sync="listenerFieldFormModelVisible" width="600px" append-to-body destroy-on-close>
|
<el-form :model="listenerFieldForm" size="small" label-width="96px" ref="listenerFieldFormRef" style="height: 136px" @submit.native.prevent>
|
<el-form-item label="字段名称：" prop="name" :rules="{ required: true, trigger: ['blur', 'change'] }">
|
<el-input v-model="listenerFieldForm.name" clearable />
|
</el-form-item>
|
<el-form-item label="字段类型：" prop="fieldType" :rules="{ required: true, trigger: ['blur', 'change'] }">
|
<el-select v-model="listenerFieldForm.fieldType">
|
<el-option v-for="i in Object.keys(fieldTypeObject)" :key="i" :label="fieldTypeObject[i]" :value="i" />
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
v-if="listenerFieldForm.fieldType === 'string'"
|
label="字段值："
|
prop="string"
|
key="field-string"
|
:rules="{ required: true, trigger: ['blur', 'change'] }"
|
>
|
<el-input v-model="listenerFieldForm.string" clearable />
|
</el-form-item>
|
<el-form-item
|
v-if="listenerFieldForm.fieldType === 'expression'"
|
label="表达式："
|
prop="expression"
|
key="field-expression"
|
:rules="{ required: true, trigger: ['blur', 'change'] }"
|
>
|
<el-input v-model="listenerFieldForm.expression" clearable />
|
</el-form-item>
|
</el-form>
|
<template #footer>
|
<el-button size="small" @click="listenerFieldFormModelVisible = false">取 消</el-button>
|
<el-button size="small" type="primary" @click="saveListenerFiled">确 定</el-button>
|
</template>
|
</el-dialog>
|
</div>
|
`
|
}
|
