fix
This commit is contained in:
吴红兵
@@ -1,20 +1,17 @@
|
||||
<template>
|
||||
<comment-timeline :currJob="props.currJob">
|
||||
</comment-timeline>
|
||||
<comment-timeline :currJob="props.currJob"> </comment-timeline>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="Comment">
|
||||
// 引入组件
|
||||
const CommentTimeline = defineAsyncComponent(() => import('./timeline.vue'));
|
||||
<script setup lang="ts" name="Comment">
|
||||
// 引入组件
|
||||
const CommentTimeline = defineAsyncComponent(() => import('./timeline.vue'));
|
||||
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
}
|
||||
});
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
<style scoped></style>
|
||||
|
||||
@@ -1,166 +1,168 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="90px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="90px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('jfcomment.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('jfcomment.inputFlowInstIdTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('jfcomment.flowInstId')" prop="flowInstId" >
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('jfcomment.inputFlowInstIdTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.flowKey')" prop="flowKey">
|
||||
<el-select v-model="form.flowKey" :placeholder="t('jfcomment.inputFlowKeyTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowKey" :key="index" :label="item.flowName" :value="item.flowKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.flowKey')" prop="flowKey">
|
||||
<el-select v-model="form.flowKey" :placeholder="t('jfcomment.inputFlowKeyTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowKey" :key="index" :label="item.flowName" :value="item.flowKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.runNodeId')" prop="runNodeId">
|
||||
<el-select v-model="form.runNodeId" :placeholder="t('jfcomment.inputRunNodeIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.runNodeId')" prop="runNodeId">
|
||||
<el-select v-model="form.runNodeId" :placeholder="t('jfcomment.inputRunNodeIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.runJobId')" prop="runJobId">
|
||||
<el-select v-model="form.runJobId" :placeholder="t('jfcomment.inputRunJobIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.runJobId')" prop="runJobId">
|
||||
<el-select v-model="form.runJobId" :placeholder="t('jfcomment.inputRunJobIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.userId')" prop="userId">
|
||||
<el-select v-model="form.userId" :placeholder="t('jfcomment.inputUserIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in dicData.userId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.userId')" prop="userId">
|
||||
<el-select v-model="form.userId" :placeholder="t('jfcomment.inputUserIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in dicData.userId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('jfcomment.inputRemarkTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('jfcomment.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('jfcomment.inputRemarkTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="CommentDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/comment';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { rule } from '/@/utils/validate';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/comment'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { rule } from '/@/utils/validate';
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'userId' });
|
||||
const onCascade = onCascadeChange(
|
||||
cascadeDic,
|
||||
{ key: 'flowInstId', cascades: ['flowKey', 'runNodeId'] },
|
||||
{ key: 'runNodeId', cascades: ['runJobId'] }
|
||||
);
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "userId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["flowKey", "runNodeId"]}, {key: "runNodeId", cascades: ["runJobId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowKey: '',
|
||||
flowNodeId: '',
|
||||
nodeJobId: '',
|
||||
userId: '',
|
||||
remark: '',
|
||||
});
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowKey: '',
|
||||
flowNodeId: '',
|
||||
nodeJobId: '',
|
||||
userId: '',
|
||||
remark: '',
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
flowKey: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
flowNodeId: [{ required: true, message: '节点名称不能为空', trigger: 'blur' }],
|
||||
nodeJobId: [{ required: true, message: '任务名称不能为空', trigger: 'blur' }],
|
||||
userId: [{ required: true, message: '审批人不能为空', trigger: 'blur' }],
|
||||
remark: [{ required: true, message: '审批意见不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
flowKey: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
flowNodeId: [{required: true, message: '节点名称不能为空', trigger: 'blur'}],
|
||||
nodeJobId: [{required: true, message: '任务名称不能为空', trigger: 'blur'}],
|
||||
userId: [{required: true, message: '审批人不能为空', trigger: 'blur'}],
|
||||
remark: [{required: true, message: '审批意见不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取Comment信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getCommentData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取Comment信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getCommentData(id)
|
||||
}
|
||||
};
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getCommentData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onCascade(form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getCommentData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onCascade(form);
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,35 +1,35 @@
|
||||
export default {
|
||||
jfcomment: {
|
||||
index: '#',
|
||||
importcommentTip: 'import Comment',
|
||||
id: 'id',
|
||||
flowKey: 'flowKey',
|
||||
flowNodeId: 'flowNodeId',
|
||||
nodeJobId: 'nodeJobId',
|
||||
userId: 'userId',
|
||||
subFlowStatus: 'subFlowStatus',
|
||||
remark: 'remark',
|
||||
signName: 'signName',
|
||||
reSign: 're-sign',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowInstId: 'flowInstId',
|
||||
runNodeId: 'runNodeId',
|
||||
runJobId: 'runJobId',
|
||||
tenantId: 'tenantId',
|
||||
useTime: 'useTime',
|
||||
inputIdTip: 'input id',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputNodeJobIdTip: 'input nodeJobId',
|
||||
inputUserIdTip: 'input userId',
|
||||
inputRemarkTip: 'input remark',
|
||||
inputSignNameTip: 'input signName',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputRunNodeIdTip: 'input runNodeId',
|
||||
inputRunJobIdTip: 'input runJobId',
|
||||
inputTenantIdTip: 'input tenantId',
|
||||
}
|
||||
}
|
||||
jfcomment: {
|
||||
index: '#',
|
||||
importcommentTip: 'import Comment',
|
||||
id: 'id',
|
||||
flowKey: 'flowKey',
|
||||
flowNodeId: 'flowNodeId',
|
||||
nodeJobId: 'nodeJobId',
|
||||
userId: 'userId',
|
||||
subFlowStatus: 'subFlowStatus',
|
||||
remark: 'remark',
|
||||
signName: 'signName',
|
||||
reSign: 're-sign',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowInstId: 'flowInstId',
|
||||
runNodeId: 'runNodeId',
|
||||
runJobId: 'runJobId',
|
||||
tenantId: 'tenantId',
|
||||
useTime: 'useTime',
|
||||
inputIdTip: 'input id',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputNodeJobIdTip: 'input nodeJobId',
|
||||
inputUserIdTip: 'input userId',
|
||||
inputRemarkTip: 'input remark',
|
||||
inputSignNameTip: 'input signName',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputRunNodeIdTip: 'input runNodeId',
|
||||
inputRunJobIdTip: 'input runJobId',
|
||||
inputTenantIdTip: 'input tenantId',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,35 +1,34 @@
|
||||
export default {
|
||||
jfcomment: {
|
||||
index: '#',
|
||||
importcommentTip: '导入节点批注管理',
|
||||
id: '主键ID',
|
||||
flowKey: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
nodeJobId: '任务名称',
|
||||
userId: '审批人',
|
||||
subFlowStatus: '子流程状态',
|
||||
remark: '审批意见',
|
||||
signName: '审批签名',
|
||||
reSign: '重签',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowInstId: '流程实例ID',
|
||||
runNodeId: '节点名称',
|
||||
runJobId: '任务名称',
|
||||
|
||||
useTime: '任务耗时',
|
||||
inputIdTip: '请输入主键ID',
|
||||
inputFlowKeyTip: '请输入流程名称',
|
||||
inputFlowNodeIdTip: '请输入节点名称',
|
||||
inputNodeJobIdTip: '请输入任务名称',
|
||||
inputUserIdTip: '请输入审批人',
|
||||
inputRemarkTip: '请输入审批意见',
|
||||
inputSignNameTip: '请输入审批签名',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputRunNodeIdTip: '请输入节点名称',
|
||||
inputRunJobIdTip: '请输入任务名称',
|
||||
|
||||
}
|
||||
}
|
||||
jfcomment: {
|
||||
index: '#',
|
||||
importcommentTip: '导入节点批注管理',
|
||||
id: '主键ID',
|
||||
flowKey: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
nodeJobId: '任务名称',
|
||||
userId: '审批人',
|
||||
subFlowStatus: '子流程状态',
|
||||
remark: '审批意见',
|
||||
signName: '审批签名',
|
||||
reSign: '重签',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowInstId: '流程实例ID',
|
||||
runNodeId: '节点名称',
|
||||
runJobId: '任务名称',
|
||||
|
||||
useTime: '任务耗时',
|
||||
inputIdTip: '请输入主键ID',
|
||||
inputFlowKeyTip: '请输入流程名称',
|
||||
inputFlowNodeIdTip: '请输入节点名称',
|
||||
inputNodeJobIdTip: '请输入任务名称',
|
||||
inputUserIdTip: '请输入审批人',
|
||||
inputRemarkTip: '请输入审批意见',
|
||||
inputSignNameTip: '请输入审批签名',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputRunNodeIdTip: '请输入节点名称',
|
||||
inputRunJobIdTip: '请输入任务名称',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,168 +1,157 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('jfcomment.flowInstId')" prop="flowInstId" >
|
||||
<el-input v-model="state.queryForm.flowInstId" :placeholder="t('jfcomment.inputFlowInstIdTip')"/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('jfcomment.userId')" prop="userId" >
|
||||
<el-select v-model="state.queryForm.userId" :placeholder="t('jfcomment.inputUserIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_comment_export'"
|
||||
class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('jfcomment.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('jfcomment.flowInstId')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowKey" :label="t('jfcomment.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey"
|
||||
:valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runNodeId" :label="t('jfcomment.runNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.runNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runJobId" :label="t('jfcomment.runJobId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runJobId" :value="scope.row.runJobId"
|
||||
:valueKey="'id'" :showKey="'jobName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('jfcomment.userId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signName" :label="t('jfcomment.signName')">
|
||||
<template #default="scope">
|
||||
<img width="200px" v-if="scope.row.signName" :src="scope.row.signName"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" :label="t('jfcomment.remark')" show-overflow-tooltip/>
|
||||
<el-table-column prop="createUser" :label="t('jfcomment.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('jfcomment.createTime')" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('jfcomment.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="state.queryForm.flowInstId" :placeholder="t('jfcomment.inputFlowInstIdTip')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('jfcomment.userId')" prop="userId">
|
||||
<el-select v-model="state.queryForm.userId" :placeholder="t('jfcomment.inputUserIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_comment_export'"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('jfcomment.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('jfcomment.flowInstId')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowKey" :label="t('jfcomment.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey" :valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runNodeId" :label="t('jfcomment.runNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.runNodeId" :valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runJobId" :label="t('jfcomment.runJobId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runJobId" :value="scope.row.runJobId" :valueKey="'id'" :showKey="'jobName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('jfcomment.userId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signName" :label="t('jfcomment.signName')">
|
||||
<template #default="scope">
|
||||
<img width="200px" v-if="scope.row.signName" :src="scope.row.signName" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" :label="t('jfcomment.remark')" show-overflow-tooltip />
|
||||
<el-table-column prop="createUser" :label="t('jfcomment.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('jfcomment.createTime')" show-overflow-tooltip />
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemComment">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/comment";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/comment';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onLoadDicUrl, onLoaded} from "/@/flow/components/convert-name/convert";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoadDicUrl, onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n()
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "users"});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'users' });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({key: "createUser"}, {key: "userId"}, {key: "flowInstId"}, {key: "runNodeId"}, {key: "runJobId"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({ key: 'createUser' }, { key: 'userId' }, { key: 'flowInstId' }, { key: 'runNodeId' }, { key: 'runJobId' }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -1,289 +1,285 @@
|
||||
<template>
|
||||
<div>
|
||||
<div style="color: red">注：一个任务若被审批多次，则会显示出多条审批记录（审批留痕）</div>
|
||||
<div id="printComment">
|
||||
<div>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar v-model:showSearch="showSearch" v-model:search="search"
|
||||
class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%;display: none"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('jfcomment.index')" width="40"/>
|
||||
<el-table-column prop="flowKey" :label="t('jfcomment.flowKey')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowInstId"
|
||||
:valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runNodeId" :label="t('jfcomment.runNodeId')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.runNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runJobId" :label="t('jfcomment.runJobId')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runJobId" :value="scope.row.runJobId"
|
||||
:valueKey="'id'" :showKey="'jobName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobType" :label="t('runJob.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('runJob.roleId')" :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-role-name :value="scope.row" :isJobType="'0'"></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('jfcomment.userId')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="startTime" :label="t('runJob.startTime')" show-overflow-tooltip width="160px"/>
|
||||
<el-table-column prop="endTime" :label="t('runJob.endTime')" show-overflow-tooltip width="160px"/>
|
||||
<el-table-column prop="useTime" :label="t('jfcomment.useTime')" show-overflow-tooltip width="120px"/>
|
||||
<el-table-column prop="status" :label="t('runJob.status')" show-overflow-tooltip width="90px">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subFlowInstId" :label="t('runJob.subFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联子流程工单信息" v-if="scope.row.subFlowInstId">
|
||||
<convert-name :options="state.dicData.subFlowInstId" :value="scope.row.subFlowInstId"
|
||||
:valueKey="'id'" :showKey="'flowName'"
|
||||
:elTagType="'primary'" @click="handleJobByFlowInstId(scope.row)"></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subFlowStatus" :label="t('jfcomment.subFlowStatus')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.subFlowStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signatureType" :label="t('runJob.signatureType')" show-overflow-tooltip width="90px">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.BELONG_TYPE" :value="scope.row.belongType" v-if="scope.row.belongType !== '0'"></dict-tag>
|
||||
<dict-tag :options="DIC_PROP.SIGNATURE_TYPE" :value="scope.row.signatureType" v-else></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="suspension" :label="t('runJob.suspension')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.suspension"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signName" :label="t('jfcomment.signName')" :width="data.width">
|
||||
<template #default="scope">
|
||||
<img width="200px" v-if="scope.row.signName" :src="scope.row.signName"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" :label="t('jfcomment.remark')" show-overflow-tooltip :width="data.width"/>
|
||||
<el-table-column :label="$t('common.action')" width="300">
|
||||
<template #default="scope">
|
||||
<el-button text type="primary" icon="Bell" @click="remind(scope.row, '0')"
|
||||
v-if="(scope.row.status ==='0' || scope.row.status ==='9') && scope.row.roleId">
|
||||
{{ $t('jfForm.urgentTask') }}
|
||||
</el-button>
|
||||
<el-button text type="primary" icon="Bell" @click="remind(scope.row, '1')"
|
||||
v-if="scope.row.subFlowStatus === '0'">
|
||||
{{ $t('jfForm.urgentSubFlow') }}
|
||||
</el-button>
|
||||
<el-button text type="primary" icon="delete" @click="signOff(scope.row)"
|
||||
v-if="scope.row.status ==='0' && validateSignOff(scope.row)">
|
||||
{{ $t('jfForm.reduceSign') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination style="display: none" @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
|
||||
v-bind="state.pagination"/>
|
||||
</div>
|
||||
<el-timeline style="margin-top: 22px; margin-left: 12px">
|
||||
<el-timeline-item
|
||||
v-for="(item, index) in state.dataList"
|
||||
:key="index"
|
||||
:icon="item.status === '0' ? 'Loading' : 'SuccessFilled'"
|
||||
:color="item.status === '0' ? '#409EFF' : '#19be6b'"
|
||||
size="large"
|
||||
:timestamp="item.endTime">
|
||||
<div style="align-items: center; display: flex;">
|
||||
<span style="margin-right: 15px">
|
||||
{{ item.nodeName }} {{ item.userName }}
|
||||
</span>
|
||||
<span style="margin-right: 15px">
|
||||
<convert-role-name :value="item"></convert-role-name>
|
||||
</span>
|
||||
<span style="margin-right: 15px">
|
||||
{{
|
||||
item.status === '0' || item.status === '2' || item.status === '9' ? item.useTime : item.remark
|
||||
}}
|
||||
</span>
|
||||
<div>
|
||||
<div style="color: red">注：一个任务若被审批多次，则会显示出多条审批记录（审批留痕）</div>
|
||||
<div id="printComment">
|
||||
<div>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
v-model:search="search"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%; display: none" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('jfcomment.index')" width="40" />
|
||||
<el-table-column prop="flowKey" :label="t('jfcomment.flowKey')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowInstId" :valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runNodeId" :label="t('jfcomment.runNodeId')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.runNodeId" :valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runJobId" :label="t('jfcomment.runJobId')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runJobId" :value="scope.row.runJobId" :valueKey="'id'" :showKey="'jobName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobType" :label="t('runJob.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('runJob.roleId')" :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-role-name :value="scope.row" :isJobType="'0'"></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('jfcomment.userId')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="startTime" :label="t('runJob.startTime')" show-overflow-tooltip width="160px" />
|
||||
<el-table-column prop="endTime" :label="t('runJob.endTime')" show-overflow-tooltip width="160px" />
|
||||
<el-table-column prop="useTime" :label="t('jfcomment.useTime')" show-overflow-tooltip width="120px" />
|
||||
<el-table-column prop="status" :label="t('runJob.status')" show-overflow-tooltip width="90px">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subFlowInstId" :label="t('runJob.subFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联子流程工单信息" v-if="scope.row.subFlowInstId">
|
||||
<convert-name
|
||||
:options="state.dicData.subFlowInstId"
|
||||
:value="scope.row.subFlowInstId"
|
||||
:valueKey="'id'"
|
||||
:showKey="'flowName'"
|
||||
:elTagType="'primary'"
|
||||
@click="handleJobByFlowInstId(scope.row)"
|
||||
></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subFlowStatus" :label="t('jfcomment.subFlowStatus')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.subFlowStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signatureType" :label="t('runJob.signatureType')" show-overflow-tooltip width="90px">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.BELONG_TYPE" :value="scope.row.belongType" v-if="scope.row.belongType !== '0'"></dict-tag>
|
||||
<dict-tag :options="DIC_PROP.SIGNATURE_TYPE" :value="scope.row.signatureType" v-else></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="suspension" :label="t('runJob.suspension')" show-overflow-tooltip :width="data.width">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.suspension"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="signName" :label="t('jfcomment.signName')" :width="data.width">
|
||||
<template #default="scope">
|
||||
<img width="200px" v-if="scope.row.signName" :src="scope.row.signName" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" :label="t('jfcomment.remark')" show-overflow-tooltip :width="data.width" />
|
||||
<el-table-column :label="$t('common.action')" width="300">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
text
|
||||
type="primary"
|
||||
icon="Bell"
|
||||
@click="remind(scope.row, '0')"
|
||||
v-if="(scope.row.status === '0' || scope.row.status === '9') && scope.row.roleId"
|
||||
>
|
||||
{{ $t('jfForm.urgentTask') }}
|
||||
</el-button>
|
||||
<el-button text type="primary" icon="Bell" @click="remind(scope.row, '1')" v-if="scope.row.subFlowStatus === '0'">
|
||||
{{ $t('jfForm.urgentSubFlow') }}
|
||||
</el-button>
|
||||
<el-button text type="primary" icon="delete" @click="signOff(scope.row)" v-if="scope.row.status === '0' && validateSignOff(scope.row)">
|
||||
{{ $t('jfForm.reduceSign') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination style="display: none" @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<el-timeline style="margin-top: 22px; margin-left: 12px">
|
||||
<el-timeline-item
|
||||
v-for="(item, index) in state.dataList"
|
||||
:key="index"
|
||||
:icon="item.status === '0' ? 'Loading' : 'SuccessFilled'"
|
||||
:color="item.status === '0' ? '#409EFF' : '#19be6b'"
|
||||
size="large"
|
||||
:timestamp="item.endTime"
|
||||
>
|
||||
<div style="align-items: center; display: flex">
|
||||
<span style="margin-right: 15px"> {{ item.nodeName }} {{ item.userName }} </span>
|
||||
<span style="margin-right: 15px">
|
||||
<convert-role-name :value="item"></convert-role-name>
|
||||
</span>
|
||||
<span style="margin-right: 15px">
|
||||
{{ item.status === '0' || item.status === '2' || item.status === '9' ? item.useTime : item.remark }}
|
||||
</span>
|
||||
|
||||
<el-tooltip placement="top" content="点击可查看关联子流程工单信息" v-if="item.subFlowInstId && state.dicData.subFlowInstId">
|
||||
<convert-name :options="state.dicData.subFlowInstId" :value="item.subFlowInstId" :style="'margin-right: 15px'"
|
||||
:valueKey="'id'" :showKey="'flowName'"
|
||||
:elTagType="'primary'" @click="handleJobByFlowInstId(item)"></convert-name>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" content="点击可查看关联子流程工单信息" v-if="item.subFlowInstId && state.dicData.subFlowInstId">
|
||||
<convert-name
|
||||
:options="state.dicData.subFlowInstId"
|
||||
:value="item.subFlowInstId"
|
||||
:style="'margin-right: 15px'"
|
||||
:valueKey="'id'"
|
||||
:showKey="'flowName'"
|
||||
:elTagType="'primary'"
|
||||
@click="handleJobByFlowInstId(item)"
|
||||
></convert-name>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top" :content="t('jfcomment.subFlowStatus')" v-if="item.subFlowInstId">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="item.subFlowStatus" style="margin-right: 15px"></dict-tag>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" :content="t('jfcomment.subFlowStatus')" v-if="item.subFlowInstId">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="item.subFlowStatus" style="margin-right: 15px"></dict-tag>
|
||||
</el-tooltip>
|
||||
|
||||
<dict-tag :options="DIC_PROP.BELONG_TYPE" :value="item.belongType" v-if="item.belongType !== '0'"></dict-tag>
|
||||
<dict-tag :options="DIC_PROP.BELONG_TYPE" :value="item.belongType" v-if="item.belongType !== '0'"></dict-tag>
|
||||
|
||||
<dict-tag :options="DIC_PROP.SIGNATURE_TYPE" :value="item.signatureType" v-else></dict-tag>
|
||||
<dict-tag :options="DIC_PROP.SIGNATURE_TYPE" :value="item.signatureType" v-else></dict-tag>
|
||||
|
||||
<template v-if="item.signName">
|
||||
<img width="200px" :src="item.signName"/>
|
||||
</template>
|
||||
<template v-if="item.signName">
|
||||
<img width="200px" :src="item.signName" />
|
||||
</template>
|
||||
|
||||
<el-button text type="primary" icon="Bell" @click="remind(item, '0')"
|
||||
v-if="(item.status ==='0' || item.status ==='9') && item.roleId">
|
||||
{{ $t('jfForm.urgentTask') }}
|
||||
</el-button>
|
||||
<el-button text type="primary" icon="Bell" @click="remind(item, '1')"
|
||||
v-if="item.subFlowStatus === '0'">
|
||||
{{ $t('jfForm.urgentSubFlow') }}
|
||||
</el-button>
|
||||
<el-button text type="primary" icon="delete" @click="signOff(item)"
|
||||
v-if="item.status ==='0' && validateSignOff(item)">
|
||||
{{ $t('jfForm.reduceSign') }}
|
||||
</el-button>
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</div>
|
||||
<!-- <footer class="el-dialog__footer" style="text-align: center;">-->
|
||||
<!-- <span class="dialog-footer">-->
|
||||
<!-- <el-button type="primary" @click="printForm">{{-->
|
||||
<!-- t('jfI18n.print')-->
|
||||
<!-- }}-->
|
||||
<!-- </el-button>-->
|
||||
<!-- </span>-->
|
||||
<!-- </footer>-->
|
||||
<el-button text type="primary" icon="Bell" @click="remind(item, '0')" v-if="(item.status === '0' || item.status === '9') && item.roleId">
|
||||
{{ $t('jfForm.urgentTask') }}
|
||||
</el-button>
|
||||
<el-button text type="primary" icon="Bell" @click="remind(item, '1')" v-if="item.subFlowStatus === '0'">
|
||||
{{ $t('jfForm.urgentSubFlow') }}
|
||||
</el-button>
|
||||
<el-button text type="primary" icon="delete" @click="signOff(item)" v-if="item.status === '0' && validateSignOff(item)">
|
||||
{{ $t('jfForm.reduceSign') }}
|
||||
</el-button>
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</div>
|
||||
<!-- <footer class="el-dialog__footer" style="text-align: center;">-->
|
||||
<!-- <span class="dialog-footer">-->
|
||||
<!-- <el-button type="primary" @click="printForm">{{-->
|
||||
<!-- t('jfI18n.print')-->
|
||||
<!-- }}-->
|
||||
<!-- </el-button>-->
|
||||
<!-- </span>-->
|
||||
<!-- </footer>-->
|
||||
|
||||
<el-drawer
|
||||
v-if="data.showHiJob"
|
||||
class="flow-header-drawer" direction="rtl"
|
||||
append-to-body size="90%"
|
||||
v-model="data.showHiJob"
|
||||
>
|
||||
<handle-job :curr-job="data.currJob"></handle-job>
|
||||
</el-drawer>
|
||||
|
||||
</div>
|
||||
<el-drawer v-if="data.showHiJob" class="flow-header-drawer" direction="rtl" append-to-body size="90%" v-model="data.showHiJob">
|
||||
<handle-job :curr-job="data.currJob"></handle-job>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="CommentTimeline">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchComment } from "/@/api/jsonflow/comment";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchComment } from '/@/api/jsonflow/comment';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onLoaded} from "/@/flow/components/convert-name/convert";
|
||||
import * as runJob from "/@/api/jsonflow/run-job";
|
||||
import {validateNull} from "/@/utils/validate";
|
||||
import {printHtml} from "/@/flow";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
import * as runJob from '/@/api/jsonflow/run-job';
|
||||
import { validateNull } from '/@/utils/validate';
|
||||
import { printHtml } from '/@/flow';
|
||||
|
||||
const HandleJob = defineAsyncComponent(() => import('/@/flow/components/handle-job/handle.vue'));
|
||||
const HandleJob = defineAsyncComponent(() => import('/@/flow/components/handle-job/handle.vue'));
|
||||
|
||||
// 引入组件
|
||||
const { t } = useI18n()
|
||||
const $message = useMessage();
|
||||
// 引入组件
|
||||
const { t } = useI18n();
|
||||
const $message = useMessage();
|
||||
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
}
|
||||
});
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
// 搜索变量
|
||||
const showSearch = ref(true)
|
||||
const search = ref(false)
|
||||
// 搜索变量
|
||||
const showSearch = ref(true);
|
||||
const search = ref(false);
|
||||
|
||||
const data = reactive({
|
||||
currJob: {},
|
||||
showHiJob: false,
|
||||
width: "-"
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {
|
||||
flowInstId: props.currJob.flowInstId
|
||||
},
|
||||
pageList: fetchComment,
|
||||
pagination: {
|
||||
size: 1000,
|
||||
},
|
||||
onLoaded: onLoaded({key: "userId"}, {key: "flowInstId"}, {key: "subFlowInstId"}, {key: "runNodeId"}, {key: "runJobId"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const data = reactive({
|
||||
currJob: {},
|
||||
showHiJob: false,
|
||||
width: '-',
|
||||
});
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {
|
||||
flowInstId: props.currJob.flowInstId,
|
||||
},
|
||||
pageList: fetchComment,
|
||||
pagination: {
|
||||
size: 1000,
|
||||
},
|
||||
onLoaded: onLoaded({ key: 'userId' }, { key: 'flowInstId' }, { key: 'subFlowInstId' }, { key: 'runNodeId' }, { key: 'runJobId' }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
function signOff(row) {
|
||||
runJob.signOff(row).then(() => {
|
||||
getDataList();
|
||||
$message.success('Reduce Sign Success')
|
||||
})
|
||||
}
|
||||
function signOff(row) {
|
||||
runJob.signOff(row).then(() => {
|
||||
getDataList();
|
||||
$message.success('Reduce Sign Success');
|
||||
});
|
||||
}
|
||||
|
||||
function remind(row, type) {
|
||||
row.remindType = type
|
||||
runJob.remind(row).then(() => {
|
||||
$message.success('Urgent Success')
|
||||
})
|
||||
}
|
||||
function remind(row, type) {
|
||||
row.remindType = type;
|
||||
runJob.remind(row).then(() => {
|
||||
$message.success('Urgent Success');
|
||||
});
|
||||
}
|
||||
|
||||
const router = useRouter();
|
||||
function handleJobByFlowInstId(row) {
|
||||
let find = state.dicData.subFlowInstId.find(f => f.id === row.subFlowInstId);
|
||||
data.currJob.flowInstId = find.id
|
||||
data.currJob.isHiJob = '1'
|
||||
data.currJob.isForm = '1'
|
||||
data.showHiJob = true
|
||||
}
|
||||
const router = useRouter();
|
||||
function handleJobByFlowInstId(row) {
|
||||
let find = state.dicData.subFlowInstId.find((f) => f.id === row.subFlowInstId);
|
||||
data.currJob.flowInstId = find.id;
|
||||
data.currJob.isHiJob = '1';
|
||||
data.currJob.isForm = '1';
|
||||
data.showHiJob = true;
|
||||
}
|
||||
|
||||
function validateSignOff(row) {
|
||||
// TODO 此处需要全量数据，否则判断有问题。目前pageSize 1000
|
||||
// 当前节点下只有一个任务不能做减签操作
|
||||
let existNodeJobs = state.dataList.filter(f => f.runNodeId === row.runNodeId && f.id !== row.id && ['0', '1', '2', '9'].some(s => s === f.status));
|
||||
if (validateNull(existNodeJobs)) return false;
|
||||
// 当前流程只有一个任务不能做减签操作
|
||||
let existFlowJobs = state.dataList.filter(f => f.flowInstId === row.flowInstId && f.id !== row.id && ['0', '2', '9'].some(s => s === f.status));
|
||||
return !validateNull(existFlowJobs);
|
||||
}
|
||||
function validateSignOff(row) {
|
||||
// TODO 此处需要全量数据，否则判断有问题。目前pageSize 1000
|
||||
// 当前节点下只有一个任务不能做减签操作
|
||||
let existNodeJobs = state.dataList.filter(
|
||||
(f) => f.runNodeId === row.runNodeId && f.id !== row.id && ['0', '1', '2', '9'].some((s) => s === f.status)
|
||||
);
|
||||
if (validateNull(existNodeJobs)) return false;
|
||||
// 当前流程只有一个任务不能做减签操作
|
||||
let existFlowJobs = state.dataList.filter((f) => f.flowInstId === row.flowInstId && f.id !== row.id && ['0', '2', '9'].some((s) => s === f.status));
|
||||
return !validateNull(existFlowJobs);
|
||||
}
|
||||
|
||||
function printForm() {
|
||||
data.width = "55"
|
||||
let flowName = state.dicData.flowInstId.find(f => f.flowKey === state.dataList[0].flowKey).flowName;
|
||||
printHtml("printComment", flowName, data)
|
||||
}
|
||||
function printForm() {
|
||||
data.width = '55';
|
||||
let flowName = state.dicData.flowInstId.find((f) => f.flowKey === state.dataList[0].flowKey).flowName;
|
||||
printHtml('printComment', flowName, data);
|
||||
}
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
} = useTable(state)
|
||||
|
||||
// 监听双向绑定
|
||||
watch(
|
||||
() => props.currJob.id,
|
||||
(val) => {
|
||||
getDataList();
|
||||
}
|
||||
);
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle } = useTable(state);
|
||||
|
||||
// 监听双向绑定
|
||||
watch(
|
||||
() => props.currJob.id,
|
||||
(val) => {
|
||||
getDataList();
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,208 +1,210 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="80%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="130px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.flowName')" prop="flowName">
|
||||
<el-input v-model="form.flowName" :placeholder="t('defFlow.inputFlowNameTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-dialog :title="title" v-model="visible" width="80%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="130px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.flowName')" prop="flowName">
|
||||
<el-input v-model="form.flowName" :placeholder="t('defFlow.inputFlowNameTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.flowKey')" prop="flowKey">
|
||||
<el-input v-model="form.flowKey" :disabled="operType === 'edit'" :placeholder="t('defFlow.inputFlowKeyTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.flowKey')" prop="flowKey">
|
||||
<el-input v-model="form.flowKey" :disabled="operType === 'edit'" :placeholder="t('defFlow.inputFlowKeyTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.groupName')" prop="groupName">
|
||||
<el-select v-model="form.groupName" :placeholder="t('defFlow.inputGroupNameTip')" style="width: 81%!important;"
|
||||
clearable filterable allowCreate defaultFirstOption>
|
||||
<el-option v-for="(item, index) in dicData.groupName" :key="index" :label="item.groupName" :value="item.groupName"></el-option>
|
||||
</el-select>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.groupName')" prop="groupName">
|
||||
<el-select
|
||||
v-model="form.groupName"
|
||||
:placeholder="t('defFlow.inputGroupNameTip')"
|
||||
style="width: 81% !important"
|
||||
clearable
|
||||
filterable
|
||||
allowCreate
|
||||
defaultFirstOption
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.groupName" :key="index" :label="item.groupName" :value="item.groupName"></el-option>
|
||||
</el-select>
|
||||
|
||||
<el-button
|
||||
type="primary" size="small" round style="margin-left: 10px"
|
||||
@click="handleAddGroupName"
|
||||
>新增分组
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-button type="primary" size="small" round style="margin-left: 10px" @click="handleAddGroupName">新增分组 </el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.status')" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.TEMP_STATUS" :key="index" :label="item.value" >
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.status')" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.TEMP_STATUS" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('defFlow.inputRemarkTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('defFlow.inputRemarkTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('defFlow.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('defFlow.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.isIndependent')" prop="isIndependent">
|
||||
<el-radio-group v-model="form.isIndependent">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value" >
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('defFlow.isIndependent')" prop="isIndependent">
|
||||
<el-radio-group v-model="form.isIndependent">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="DefFlowDialog">
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj, getByFlowName, tempStore } from '/@/api/jsonflow/def-flow';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { rule } from '/@/utils/validate';
|
||||
import { onLoadDicUrl, onUpdateDicData } from '/@/flow/components/convert-name/convert';
|
||||
import { deepClone } from '/@/utils/other';
|
||||
import { setPropsNullValue } from '/@/flow/support/common';
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
import {useMessage, useMessageBox} from "/@/hooks/message";
|
||||
import {getObj, addObj, putObj, getByFlowName, tempStore} from '/@/api/jsonflow/def-flow'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { rule } from '/@/utils/validate';
|
||||
import {onLoadDicUrl, onUpdateDicData} from "/@/flow/components/convert-name/convert";
|
||||
import {deepClone} from "/@/utils/other";
|
||||
import {setPropsNullValue} from "/@/flow/support/common";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({ prefix: 'defFlow', key: 'groupName' });
|
||||
const onUpdate = onUpdateDicData({ key: 'groupName' });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({prefix: "defFlow", key: "groupName"});
|
||||
const onUpdate = onUpdateDicData({key: "groupName"});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowName: '',
|
||||
flowKey: '',
|
||||
groupName: '',
|
||||
status: '-1',
|
||||
isIndependent: '0',
|
||||
remark: '',
|
||||
sort: 1,
|
||||
});
|
||||
// 初始表单数据
|
||||
const initForm = reactive(deepClone(form));
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowName: '',
|
||||
flowKey: '',
|
||||
groupName: '',
|
||||
status: '-1',
|
||||
isIndependent: '0',
|
||||
remark: '',
|
||||
sort: 1,
|
||||
});
|
||||
// 初始表单数据
|
||||
const initForm = reactive(deepClone(form));
|
||||
// 校验是否已存在
|
||||
let validateIsExist = (rule, value, callback) => {
|
||||
// 修改判断相同id
|
||||
getByFlowName(value).then((response) => {
|
||||
const result = response.data;
|
||||
if (result !== null) {
|
||||
if (result.id !== form.id) callback(new Error('流程名称已经存在'));
|
||||
else callback();
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 校验是否已存在
|
||||
let validateIsExist = (rule, value, callback) => {
|
||||
// 修改判断相同id
|
||||
getByFlowName(value).then(response => {
|
||||
const result = response.data
|
||||
if (result !== null) {
|
||||
if (result.id !== form.id)
|
||||
callback(new Error('流程名称已经存在'))
|
||||
else callback()
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
})
|
||||
}
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
flowName: [{ required: true, message: '流程名称不能为空', trigger: 'blur' } /*, {validator: validateIsExist, trigger: 'blur'}*/],
|
||||
flowKey: [{ required: true, message: '流程KEY不能为空', trigger: 'blur' }],
|
||||
groupName: [{ required: true, message: '分组名称不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态不能为空', trigger: 'blur' }],
|
||||
sort: [{ required: true, message: '排序值不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
flowName: [{required: true, message: '流程名称不能为空', trigger: 'blur'}/*, {validator: validateIsExist, trigger: 'blur'}*/],
|
||||
flowKey: [{required: true, message: '流程KEY不能为空', trigger: 'blur'}],
|
||||
groupName: [{required: true, message: '分组名称不能为空', trigger: 'blur'}],
|
||||
status: [{required: true, message: '状态不能为空', trigger: 'blur'}],
|
||||
sort: [{required: true, message: '排序值不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
setPropsNullValue(form, initForm);
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
setPropsNullValue(form, initForm)
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取DefFlow信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getDefFlowData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取DefFlow信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getDefFlowData(id)
|
||||
}
|
||||
};
|
||||
function handleAddGroupName() {
|
||||
useMessageBox()
|
||||
.prompt('请输入新的分组名称')
|
||||
.then(({ value }) => {
|
||||
form.groupName = value;
|
||||
onUpdate(dicData, form);
|
||||
});
|
||||
}
|
||||
|
||||
function handleAddGroupName() {
|
||||
useMessageBox().prompt("请输入新的分组名称")
|
||||
.then(({ value }) => {
|
||||
form.groupName = value
|
||||
onUpdate(dicData, form);
|
||||
})
|
||||
}
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
await tempStore(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
await tempStore(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getDefFlowData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getDefFlowData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,36 +1,35 @@
|
||||
export default {
|
||||
defFlow: {
|
||||
index: '#',
|
||||
importdefFlowTip: 'import DefFlow',
|
||||
id: 'id',
|
||||
flowName: 'flowName',
|
||||
flowKey: 'flowKey',
|
||||
groupName: 'groupName',
|
||||
status: 'status',
|
||||
remark: 'remark',
|
||||
version: 'version',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
sort: 'sort',
|
||||
isIndependent: 'isIndependent',
|
||||
updateUser: 'updateUser',
|
||||
updateTime: 'updateTime',
|
||||
delFlag: 'delFlag',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputFlowNameTip: 'input flowName',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputGroupNameTip: 'input groupName',
|
||||
inputStatusTip: 'input status',
|
||||
inputRemarkTip: 'input remark',
|
||||
inputVersionTip: 'input version',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputSortTip: 'input sort',
|
||||
inputIsIndependentTip: 'input isIndependent',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
inputDelFlagTip: 'input delFlag',
|
||||
|
||||
}
|
||||
}
|
||||
defFlow: {
|
||||
index: '#',
|
||||
importdefFlowTip: 'import DefFlow',
|
||||
id: 'id',
|
||||
flowName: 'flowName',
|
||||
flowKey: 'flowKey',
|
||||
groupName: 'groupName',
|
||||
status: 'status',
|
||||
remark: 'remark',
|
||||
version: 'version',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
sort: 'sort',
|
||||
isIndependent: 'isIndependent',
|
||||
updateUser: 'updateUser',
|
||||
updateTime: 'updateTime',
|
||||
delFlag: 'delFlag',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputFlowNameTip: 'input flowName',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputGroupNameTip: 'input groupName',
|
||||
inputStatusTip: 'input status',
|
||||
inputRemarkTip: 'input remark',
|
||||
inputVersionTip: 'input version',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputSortTip: 'input sort',
|
||||
inputIsIndependentTip: 'input isIndependent',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
inputDelFlagTip: 'input delFlag',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,36 +1,35 @@
|
||||
export default {
|
||||
defFlow: {
|
||||
index: '#',
|
||||
importdefFlowTip: '导入流程定义管理',
|
||||
id: '主键ID',
|
||||
flowName: '流程名称',
|
||||
flowKey: '流程KEY',
|
||||
groupName: '分组名称',
|
||||
status: '状态',
|
||||
remark: '备注',
|
||||
version: '版本',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
sort: '排序值',
|
||||
isIndependent: '发起后配置独立',
|
||||
updateUser: '修改人',
|
||||
updateTime: '修改时间',
|
||||
delFlag: '删除标识',
|
||||
|
||||
inputIdTip: '请输入主键ID',
|
||||
inputFlowNameTip: '请输入流程名称',
|
||||
inputFlowKeyTip: '请输入流程KEY',
|
||||
inputGroupNameTip: '请输入分组名称',
|
||||
inputStatusTip: '请输入状态',
|
||||
inputRemarkTip: '请输入备注',
|
||||
inputVersionTip: '请输入版本',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputSortTip: '请输入排序值',
|
||||
inputIsIndependentTip: '请选择发起后配置独立',
|
||||
inputUpdateUserTip: '请输入修改人',
|
||||
inputUpdateTimeTip: '请输入修改时间',
|
||||
inputDelFlagTip: '请输入删除标识',
|
||||
|
||||
}
|
||||
}
|
||||
defFlow: {
|
||||
index: '#',
|
||||
importdefFlowTip: '导入流程定义管理',
|
||||
id: '主键ID',
|
||||
flowName: '流程名称',
|
||||
flowKey: '流程KEY',
|
||||
groupName: '分组名称',
|
||||
status: '状态',
|
||||
remark: '备注',
|
||||
version: '版本',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
sort: '排序值',
|
||||
isIndependent: '发起后配置独立',
|
||||
updateUser: '修改人',
|
||||
updateTime: '修改时间',
|
||||
delFlag: '删除标识',
|
||||
|
||||
inputIdTip: '请输入主键ID',
|
||||
inputFlowNameTip: '请输入流程名称',
|
||||
inputFlowKeyTip: '请输入流程KEY',
|
||||
inputGroupNameTip: '请输入分组名称',
|
||||
inputStatusTip: '请输入状态',
|
||||
inputRemarkTip: '请输入备注',
|
||||
inputVersionTip: '请输入版本',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputSortTip: '请输入排序值',
|
||||
inputIsIndependentTip: '请选择发起后配置独立',
|
||||
inputUpdateUserTip: '请输入修改人',
|
||||
inputUpdateTimeTip: '请输入修改时间',
|
||||
inputDelFlagTip: '请输入删除标识',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,197 +1,202 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('defFlow.flowName')" prop="flowName" >
|
||||
<el-input :placeholder="t('defFlow.inputFlowNameTip')" v-model="state.queryForm.flowName"
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')"
|
||||
v-auth="'jsonflow_defflow_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('defFlow.flowName')" prop="flowName">
|
||||
<el-input :placeholder="t('defFlow.inputFlowNameTip')" v-model="state.queryForm.flowName" style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')" v-auth="'jsonflow_defflow_add'"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_defflow_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_defflow_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_defflow_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('defFlow.index')" width="40" />
|
||||
<el-table-column prop="flowName" :label="t('defFlow.flowName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowKey" :label="t('defFlow.flowKey')" show-overflow-tooltip/>
|
||||
<el-table-column prop="groupName" :label="t('defFlow.groupName')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="isIndependent" :label="t('defFlow.isIndependent')" show-overflow-tooltip>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_defflow_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('defFlow.index')" width="40" />
|
||||
<el-table-column prop="flowName" :label="t('defFlow.flowName')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowKey" :label="t('defFlow.flowKey')" show-overflow-tooltip />
|
||||
<el-table-column prop="groupName" :label="t('defFlow.groupName')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="isIndependent" :label="t('defFlow.isIndependent')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.isIndependent"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="remark" :label="t('defFlow.remark')" width="300" show-overflow-tooltip/>
|
||||
<el-table-column prop="status" :label="t('defFlow.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.TEMP_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="version" :label="t('defFlow.version')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="createUser" :label="t('defFlow.createUser')" show-overflow-tooltip>
|
||||
<el-table-column prop="remark" :label="t('defFlow.remark')" width="300" show-overflow-tooltip />
|
||||
<el-table-column prop="status" :label="t('defFlow.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.TEMP_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="version" :label="t('defFlow.version')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="createUser" :label="t('defFlow.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('defFlow.createTime')" show-overflow-tooltip/>-->
|
||||
<el-table-column :label="$t('common.action')" width="120">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)" v-auth="'jsonflow_defflow_view'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" v-auth="'jsonflow_defflow_edit'" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" v-auth="'jsonflow_defflow_del'" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.fromType === '1'">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.designFlow') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="Share" v-auth="'jsonflow_defflow_edit'"
|
||||
@click="handleEditPhoto(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<el-table-column :label="$t('common.action')" width="120">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)" v-auth="'jsonflow_defflow_view'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" v-auth="'jsonflow_defflow_edit'" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" v-auth="'jsonflow_defflow_del'" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.fromType === '1'">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.designFlow') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="Share" v-auth="'jsonflow_defflow_edit'" @click="handleEditPhoto(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemDefFlow">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/def-flow";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/def-flow';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { onLoaded } from "/@/flow/components/convert-name/convert";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n()
|
||||
// 定义查询字典
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
// 定义查询字典
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {fromType: '1'},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({key: "createUser"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: { fromType: '1' },
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({ key: 'createUser' }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/def-flow/export', state.queryForm, 'def-flow.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/def-flow/export', state.queryForm, 'def-flow.xlsx');
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
const handleEditPhoto = (row: any) => {
|
||||
let src = "/jsonflow/flow-design/index";
|
||||
router.push({
|
||||
path: src,
|
||||
query: {
|
||||
currFlowId: row.id,
|
||||
flowType: '0'
|
||||
}
|
||||
})
|
||||
}
|
||||
const router = useRouter();
|
||||
const handleEditPhoto = (row: any) => {
|
||||
let src = '/jsonflow/flow-design/index';
|
||||
router.push({
|
||||
path: src,
|
||||
query: {
|
||||
currFlowId: row.id,
|
||||
flowType: '0',
|
||||
},
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -1,174 +1,195 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.delRoleId')" prop="delRoleId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="form.delRoleId" :placeholder="t('distPerson.inputDelRoleIdTip')" clearable filterable
|
||||
remote :remote-method="remoteMethodDel" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.delRoleId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.delRoleId')" prop="delRoleId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="form.delRoleId"
|
||||
:placeholder="t('distPerson.inputDelRoleIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="remoteMethodDel"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.delRoleId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.recRoleId')" prop="roleId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="form.roleId" :placeholder="t('distPerson.inputRoleIdTip')" clearable filterable
|
||||
remote :remote-method="remoteMethod" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.recRoleId')" prop="roleId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="form.roleId"
|
||||
:placeholder="t('distPerson.inputRoleIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="remoteMethod"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.delStartTime')" prop="delStartTime">
|
||||
<el-date-picker type="datetime" :placeholder="t('distPerson.inputDelStartTimeTip')"
|
||||
v-model="form.delStartTime" :value-format="dateTimeStr"></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.delStartTime')" prop="delStartTime">
|
||||
<el-date-picker
|
||||
type="datetime"
|
||||
:placeholder="t('distPerson.inputDelStartTimeTip')"
|
||||
v-model="form.delStartTime"
|
||||
:value-format="dateTimeStr"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.delEndTime')" prop="delEndTime">
|
||||
<el-date-picker type="datetime" :placeholder="t('distPerson.inputDelEndTimeTip')"
|
||||
v-model="form.delEndTime" :value-format="dateTimeStr"></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.delEndTime')" prop="delEndTime">
|
||||
<el-date-picker
|
||||
type="datetime"
|
||||
:placeholder="t('distPerson.inputDelEndTimeTip')"
|
||||
v-model="form.delEndTime"
|
||||
:value-format="dateTimeStr"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.delStatus')" prop="delStatus">
|
||||
<el-radio-group v-model="form.delStatus">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.DELEGATE_STATUS" :key="index" :label="item.value" >
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.delStatus')" prop="delStatus">
|
||||
<el-radio-group v-model="form.delStatus">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.DELEGATE_STATUS" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="DelPersonDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, delegate } from '/@/api/jsonflow/dist-person';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onFormLoadedUrl, onLoadDicUrl, remoteMethodByKey } from '/@/flow/components/convert-name/convert';
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, delegate } from '/@/api/jsonflow/dist-person'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import {onFormLoadedUrl, onLoadDicUrl, remoteMethodByKey} from "/@/flow/components/convert-name/convert";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
const onFormLoaded = onFormLoadedUrl({ key: 'delRoleId' }, { key: 'users', field: 'roleId' });
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
const onFormLoaded = onFormLoadedUrl({key: "delRoleId"}, {key: "users", field: "roleId"});
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
delRoleId: '',
|
||||
roleId: '',
|
||||
delStartTime: null,
|
||||
delEndTime: null,
|
||||
delStatus: '0',
|
||||
});
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
delRoleId: '',
|
||||
roleId: '',
|
||||
delStartTime: null,
|
||||
delEndTime: null,
|
||||
delStatus: '0',
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
delRoleId: [{ required: true, message: '委托人不能为空', trigger: 'blur' }],
|
||||
roleId: [{ required: true, message: '接收人不能为空', trigger: 'blur' }],
|
||||
delStartTime: [{ required: true, message: '委托开始时间不能为空', trigger: 'blur' }],
|
||||
delEndTime: [{ required: true, message: '委托结束时间不能为空', trigger: 'blur' }],
|
||||
delStatus: [{ required: true, message: '委托状态不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
delRoleId: [{required: true, message: '委托人不能为空', trigger: 'blur'}],
|
||||
roleId: [{required: true, message: '接收人不能为空', trigger: 'blur'}],
|
||||
delStartTime: [{required: true, message: '委托开始时间不能为空', trigger: 'blur'}],
|
||||
delEndTime: [{required: true, message: '委托结束时间不能为空', trigger: 'blur'}],
|
||||
delStatus: [{required: true, message: '委托状态不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取DistPerson信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getDistPersonData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取DistPerson信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getDistPersonData(id)
|
||||
}
|
||||
};
|
||||
function remoteMethodDel(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'delRoleId');
|
||||
}
|
||||
|
||||
function remoteMethodDel(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "delRoleId")
|
||||
}
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'users');
|
||||
}
|
||||
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "users")
|
||||
}
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
await delegate(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
await delegate(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getDistPersonData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onFormLoaded(dicData, form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getDistPersonData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onFormLoaded(dicData, form);
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,209 +1,228 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('distPerson.delRoleId')" prop="delRoleId" >
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="state.queryForm.delRoleId" :placeholder="t('distPerson.inputDelRoleIdTip')" clearable filterable style="max-width: 180px"
|
||||
remote :remote-method="remoteMethodDel" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.delRoleId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('distPerson.recRoleId')" prop="roleId" >
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="state.queryForm.roleId" :placeholder="t('distPerson.inputRecRoleIdTip')" clearable filterable style="max-width: 180px"
|
||||
remote :remote-method="remoteMethod" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')"
|
||||
v-auth="'jsonflow_distperson_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_distperson_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('distPerson.delRoleId')" prop="delRoleId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="state.queryForm.delRoleId"
|
||||
:placeholder="t('distPerson.inputDelRoleIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
remote
|
||||
:remote-method="remoteMethodDel"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.delRoleId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('distPerson.recRoleId')" prop="roleId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="state.queryForm.roleId"
|
||||
:placeholder="t('distPerson.inputRecRoleIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
remote
|
||||
:remote-method="remoteMethod"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')" v-auth="'jsonflow_distperson_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_distperson_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_distperson_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('distPerson.index')" width="40" />
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_distperson_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('distPerson.index')" width="40" />
|
||||
|
||||
<el-table-column prop="delRoleId" :label="t('distPerson.delRoleId')">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.delRoleId" :value="scope.row.delRoleId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="delRoleId" :label="t('distPerson.delRoleId')">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.delRoleId" :value="scope.row.delRoleId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="roleId" :label="t('distPerson.recRoleId')">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.roleId" :value="scope.row.roleId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('distPerson.recRoleId')">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.roleId" :value="scope.row.roleId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="delStartTime" :label="t('distPerson.delStartTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="delEndTime" :label="t('distPerson.delEndTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="delStatus" :label="t('distPerson.delStatus')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.DELEGATE_STATUS" :value="scope.row.delStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="delStartTime" :label="t('distPerson.delStartTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="delEndTime" :label="t('distPerson.delEndTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="delStatus" :label="t('distPerson.delStatus')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.DELEGATE_STATUS" :value="scope.row.delStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="createUser" :label="t('distPerson.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('distPerson.createTime')" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<el-table-column prop="createUser" :label="t('distPerson.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('distPerson.createTime')" show-overflow-tooltip />
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemDelPerson">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { delegatePage, delObjs } from "/@/api/jsonflow/dist-person";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { delegatePage, delObjs } from '/@/api/jsonflow/dist-person';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onLoadDicUrl, onLoaded, remoteMethodByKey} from "/@/flow/components/convert-name/convert";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoadDicUrl, onLoaded, remoteMethodByKey } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./del-form.vue'));
|
||||
const { t } = useI18n()
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./del-form.vue'));
|
||||
const { t } = useI18n();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: delegatePage,
|
||||
onLoaded: onLoaded({key: "createUser"}, {key: "delRoleId"}, {key: "roleId"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: delegatePage,
|
||||
onLoaded: onLoaded({ key: 'createUser' }, { key: 'delRoleId' }, { key: 'roleId' }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/dist-person/export', state.queryForm, 'dist-person.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/dist-person/export', state.queryForm, 'dist-person.xlsx');
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
|
||||
function remoteMethodDel(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "delRoleId")
|
||||
}
|
||||
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "users")
|
||||
}
|
||||
function remoteMethodDel(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'delRoleId');
|
||||
}
|
||||
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'users');
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,56 +1,72 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading"
|
||||
:disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<!-- <el-col :span="24" class="mb20">
|
||||
<div>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<!-- <el-col :span="24" class="mb20">
|
||||
<el-form-item>
|
||||
<div style="color: red;font-size: 14px">备注: 当不指定待分配节点时, 默认对当前相同userKey进行全局统一分配</div>
|
||||
</el-form-item>
|
||||
</el-col>-->
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.code')" prop="code">
|
||||
<el-select v-model="form.code" :placeholder="t('distPerson.inputCodeTip')" clearable filterable disabled
|
||||
@change="cascadeChange('code', ['flowInstId'])">
|
||||
<el-option v-for="(item, index) in dicData.code" :key="index" :label="item.code" :value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.code')" prop="code">
|
||||
<el-select
|
||||
v-model="form.code"
|
||||
:placeholder="t('distPerson.inputCodeTip')"
|
||||
clearable
|
||||
filterable
|
||||
disabled
|
||||
@change="cascadeChange('code', ['flowInstId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.code" :key="index" :label="item.code" :value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.flowKey')" prop="flowInstId">
|
||||
<el-select v-model="form.flowInstId" :placeholder="t('distPerson.inputFlowKeyTip')" clearable filterable disabled
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.flowInstId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.flowKey')" prop="flowInstId">
|
||||
<el-select
|
||||
v-model="form.flowInstId"
|
||||
:placeholder="t('distPerson.inputFlowKeyTip')"
|
||||
clearable
|
||||
filterable
|
||||
disabled
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowInstId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.runNodeId')" prop="runNodeId">
|
||||
<el-select v-model="form.runNodeId" :placeholder="t('distPerson.inputRunNodeIdTip')" clearable filterable
|
||||
:disabled="!!props.currJob.distFlowNodeId"
|
||||
@change="cascadeChange('runNodeId', ['distRunJobId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.runNodeId')" prop="runNodeId">
|
||||
<el-select
|
||||
v-model="form.runNodeId"
|
||||
:placeholder="t('distPerson.inputRunNodeIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
:disabled="!!props.currJob.distFlowNodeId"
|
||||
@change="cascadeChange('runNodeId', ['distRunJobId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.runJobId')" prop="runJobId">
|
||||
<el-select v-model="form.runJobId" :placeholder="t('distPerson.inputRunJobIdTip')" clearable filterable @change="runJobIdChange">
|
||||
<el-option v-for="(item, index) in cascadeDic.distRunJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.runJobId')" prop="runJobId">
|
||||
<el-select v-model="form.runJobId" :placeholder="t('distPerson.inputRunJobIdTip')" clearable filterable @change="runJobIdChange">
|
||||
<el-option v-for="(item, index) in cascadeDic.distRunJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.userKey')" prop="userKey" disabled>
|
||||
<el-input v-model="form.userKey" :placeholder="t('distPerson.inputUserKeyTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.userKey')" prop="userKey" disabled>
|
||||
<el-input v-model="form.userKey" :placeholder="t('distPerson.inputUserKeyTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- <el-col :span="12" class="mb20">
|
||||
<!-- <el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.isNowRun')" prop="isNowRun" disabled>
|
||||
<el-radio-group disabled v-model="form.isNowRun">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
@@ -59,312 +75,352 @@
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>-->
|
||||
</el-row>
|
||||
|
||||
</el-row>
|
||||
<el-row :gutter="48">
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item>
|
||||
<div style="color: red; font-size: 14px">注: 《分配参与者》允许为任意的节点分配参与者, 让分配参与者更自由</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item :label="t('distPerson.roleUserId')" prop="roleUserId">
|
||||
<el-table :data="form.roleUserId" border style="width: 100%" max-height="500">
|
||||
<el-table-column type="index" :label="t('distPerson.index')" width="80">
|
||||
<template #header>
|
||||
<el-button icon="Plus" size="small" type="primary" circle @click="methods.onAddItem"></el-button>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
icon="Minus"
|
||||
size="small"
|
||||
type="danger"
|
||||
circle
|
||||
:disabled="scope.row.isDisabled"
|
||||
@click="methods.handleDelete(scope.$index, scope.row)"
|
||||
></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-row :gutter="48">
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item>
|
||||
<div style="color: red;font-size: 14px">注: 《分配参与者》允许为任意的节点分配参与者, 让分配参与者更自由</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item :label="t('distPerson.roleUserId')" prop="roleUserId">
|
||||
<el-table :data="form.roleUserId" border style="width: 100%" max-height="500">
|
||||
<el-table-column type="index" :label="t('distPerson.index')" width="80">
|
||||
<template #header>
|
||||
<el-button icon="Plus" size="small" type="primary" circle
|
||||
@click="methods.onAddItem"></el-button>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-button icon="Minus" size="small" type="danger" circle :disabled="scope.row.isDisabled"
|
||||
@click="methods.handleDelete(scope.$index, scope.row)"></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobType" :label="t('distPerson.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-select
|
||||
v-model="scope.row.jobType"
|
||||
:placeholder="t('distPerson.inputJobTypeTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="handleRoleType"
|
||||
:disabled="scope.row.isDisabled"
|
||||
>
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="jobType" :label="t('distPerson.jobType')" show-overflow-tooltip >
|
||||
<template #default="scope">
|
||||
<el-select v-model="scope.row.jobType" :placeholder="t('distPerson.inputJobTypeTip')" clearable filterable
|
||||
@change="handleRoleType" :disabled="scope.row.isDisabled">
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('distPerson.roleId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip content="请输入名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="scope.row.roleId"
|
||||
:placeholder="t('distPerson.inputRoleIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
:disabled="scope.row.isDisabled"
|
||||
remote
|
||||
:remote-method="(query) => remoteMethodAll(query, scope.row.jobType)"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.users"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.userId"
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[0].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.roles"
|
||||
:key="index"
|
||||
:label="item.roleName"
|
||||
:value="item.roleId"
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[1].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.posts"
|
||||
:key="index"
|
||||
:label="item.postName"
|
||||
:value="item.postId"
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[2].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.depts"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.deptId"
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[3].value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="roleId" :label="t('distPerson.roleId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip content="请输入名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="scope.row.roleId" :placeholder="t('distPerson.inputRoleIdTip')" clearable filterable
|
||||
:disabled="scope.row.isDisabled"
|
||||
remote :remote-method="(query) => remoteMethodAll(query, scope.row.jobType)" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[0].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.roles" :key="index" :label="item.roleName" :value="item.roleId"
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[1].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.posts" :key="index" :label="item.postName" :value="item.postId"
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[2].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.depts" :key="index" :label="item.name" :value="item.deptId"
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[3].value"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="jobName" :label="t('distPerson.jobName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="可为空，为空时参与者的任务名称都相同">
|
||||
<el-input v-model="scope.row.jobName" :placeholder="t('distPerson.inputJobNameTip')" :disabled="scope.row.isDisabled"/>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sort" :label="t('distPerson.sort')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="可为空，为空时参与者的任务排序值都相同">
|
||||
<el-input-number :min="1" :max="1000" v-model="scope.row.sort" :placeholder="t('distPerson.inputSortTip')"
|
||||
:disabled="scope.row.isDisabled"></el-input-number>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template v-if="operType !== 'view'">
|
||||
<footer class="el-dialog__footer">
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="methods.handleUpdate" :disabled="loading">{{
|
||||
$t('common.confirmButtonText')
|
||||
}}</el-button>
|
||||
</span>
|
||||
</footer>
|
||||
</template>
|
||||
</div>
|
||||
<el-table-column prop="jobName" :label="t('distPerson.jobName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="可为空，为空时参与者的任务名称都相同">
|
||||
<el-input v-model="scope.row.jobName" :placeholder="t('distPerson.inputJobNameTip')" :disabled="scope.row.isDisabled" />
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sort" :label="t('distPerson.sort')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="可为空，为空时参与者的任务排序值都相同">
|
||||
<el-input-number
|
||||
:min="1"
|
||||
:max="1000"
|
||||
v-model="scope.row.sort"
|
||||
:placeholder="t('distPerson.inputSortTip')"
|
||||
:disabled="scope.row.isDisabled"
|
||||
></el-input-number>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template v-if="operType !== 'view'">
|
||||
<footer class="el-dialog__footer">
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="methods.handleUpdate" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</footer>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="DistPersonFlow">
|
||||
import {useMessage} from "/@/hooks/message";
|
||||
import {getByFlowInstId, saveByFlowInstId} from '/@/api/jsonflow/dist-person'
|
||||
import {useI18n} from "vue-i18n"
|
||||
import {
|
||||
onCascadeChange,
|
||||
onFormLoadedUrl,
|
||||
onLoadDicUrl,
|
||||
remoteMethodAllByKey
|
||||
} from "/@/flow/components/convert-name/convert";
|
||||
import {setPropsDataValue, setPropsNull} from '/@/flow/support/common'
|
||||
import * as orderVue from "/@/api/order/order-key-vue";
|
||||
import { useUserInfo } from '/@/stores/userInfo';
|
||||
import {validateNull} from "/@/utils/validate";
|
||||
import {DIC_PROP} from "/@/flow/support/dict-prop";
|
||||
import {handleChangeJobType} from "/@/flow";
|
||||
import {PROP_CONST} from "/@/flow/support/prop-const";
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getByFlowInstId, saveByFlowInstId } from '/@/api/jsonflow/dist-person';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onFormLoadedUrl, onLoadDicUrl, remoteMethodAllByKey } from '/@/flow/components/convert-name/convert';
|
||||
import { setPropsDataValue, setPropsNull } from '/@/flow/support/common';
|
||||
import * as orderVue from '/@/api/order/order-key-vue';
|
||||
import { useUserInfo } from '/@/stores/userInfo';
|
||||
import { validateNull } from '/@/utils/validate';
|
||||
import { DIC_PROP } from '/@/flow/support/dict-prop';
|
||||
import { handleChangeJobType } from '/@/flow';
|
||||
import { PROP_CONST } from '/@/flow/support/prop-const';
|
||||
|
||||
const {t} = useI18n();
|
||||
const userInfo = useUserInfo();
|
||||
const emits = defineEmits(["handleJob"]);
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "code"});
|
||||
const onFormLoaded = onFormLoadedUrl(...PROP_CONST.LOAD_USER_ROLE);
|
||||
onMounted(async () => {
|
||||
await onLoad(dicData);
|
||||
});
|
||||
const { t } = useI18n();
|
||||
const userInfo = useUserInfo();
|
||||
const emits = defineEmits(['handleJob']);
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'code' });
|
||||
const onFormLoaded = onFormLoadedUrl(...PROP_CONST.LOAD_USER_ROLE);
|
||||
onMounted(async () => {
|
||||
await onLoad(dicData);
|
||||
});
|
||||
|
||||
const fields = ['userKey', 'valType', 'isNowRun'];
|
||||
const fields = ['userKey', 'valType', 'isNowRun'];
|
||||
|
||||
const cascadeDic = reactive({});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "code", cascades: ["flowInstId"]}, {key: "flowInstId", cascades: ["runNodeId"]}, {key: "runNodeId", cascades: ["distRunJobId"]});
|
||||
async function cascadeChange(key, cascades) {
|
||||
await onCascade(form, {key: key, cascades: cascades});
|
||||
if (key === 'runNodeId') {
|
||||
setPropsNull(form, ...fields)
|
||||
form.roleUserId = []
|
||||
if (!validateNull(cascadeDic.distRunJobId)) return
|
||||
useMessage().info("当前节点任务非指定《参与者KEY》类型，不允许前端分配参与者");
|
||||
}
|
||||
}
|
||||
function runJobIdChange(newVal){
|
||||
form.roleUserId = []
|
||||
if (!newVal) {
|
||||
setPropsNull(form, ...fields)
|
||||
return
|
||||
}
|
||||
const runJob = cascadeDic.distRunJobId.find(f => f.id === newVal)
|
||||
setPropsDataValue(form, runJob, fields)
|
||||
if (form.valType !== DIC_PROP.VAL_TYPE[1].value) {
|
||||
form.runJobId = null
|
||||
useMessage().info("当前节点任务非指定《参与者KEY》类型，不允许前端分配参与者");
|
||||
return;
|
||||
}
|
||||
form.runJobId = newVal;
|
||||
// 重新查询分配信息
|
||||
methods.handleGetObj(form)
|
||||
}
|
||||
const cascadeDic = reactive({});
|
||||
const onCascade = onCascadeChange(
|
||||
cascadeDic,
|
||||
{ key: 'code', cascades: ['flowInstId'] },
|
||||
{ key: 'flowInstId', cascades: ['runNodeId'] },
|
||||
{ key: 'runNodeId', cascades: ['distRunJobId'] }
|
||||
);
|
||||
async function cascadeChange(key, cascades) {
|
||||
await onCascade(form, { key: key, cascades: cascades });
|
||||
if (key === 'runNodeId') {
|
||||
setPropsNull(form, ...fields);
|
||||
form.roleUserId = [];
|
||||
if (!validateNull(cascadeDic.distRunJobId)) return;
|
||||
useMessage().info('当前节点任务非指定《参与者KEY》类型，不允许前端分配参与者');
|
||||
}
|
||||
}
|
||||
function runJobIdChange(newVal) {
|
||||
form.roleUserId = [];
|
||||
if (!newVal) {
|
||||
setPropsNull(form, ...fields);
|
||||
return;
|
||||
}
|
||||
const runJob = cascadeDic.distRunJobId.find((f) => f.id === newVal);
|
||||
setPropsDataValue(form, runJob, fields);
|
||||
if (form.valType !== DIC_PROP.VAL_TYPE[1].value) {
|
||||
form.runJobId = null;
|
||||
useMessage().info('当前节点任务非指定《参与者KEY》类型，不允许前端分配参与者');
|
||||
return;
|
||||
}
|
||||
form.runJobId = newVal;
|
||||
// 重新查询分配信息
|
||||
methods.handleGetObj(form);
|
||||
}
|
||||
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form)
|
||||
}
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form);
|
||||
}
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
code: '',
|
||||
runNodeId: '',
|
||||
runJobId: '',
|
||||
userKey: '',
|
||||
flowInstId: '',
|
||||
flowKey: '',
|
||||
roleUserId: [],
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
code: '',
|
||||
runNodeId: '',
|
||||
runJobId: '',
|
||||
userKey: '',
|
||||
flowInstId: '',
|
||||
flowKey: '',
|
||||
roleUserId: [],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
code: [{required: true, message: '工单编号不能为空', trigger: 'blur'}],
|
||||
runNodeId: [{required: true, message: '节点名称不能为空', trigger: 'blur'}],
|
||||
runJobId: [{required: true, message: '任务名称不能为空', trigger: 'blur'}],
|
||||
userKey: [{required: true, message: '参与者KEY不能为空', trigger: 'blur'}],
|
||||
// roleUserId: [{required: true, message: '参与者不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
code: [{ required: true, message: '工单编号不能为空', trigger: 'blur' }],
|
||||
runNodeId: [{ required: true, message: '节点名称不能为空', trigger: 'blur' }],
|
||||
runJobId: [{ required: true, message: '任务名称不能为空', trigger: 'blur' }],
|
||||
userKey: [{ required: true, message: '参与者KEY不能为空', trigger: 'blur' }],
|
||||
// roleUserId: [{required: true, message: '参与者不能为空', trigger: 'blur'}],
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
currElTab: {
|
||||
type: Object,
|
||||
default: {},
|
||||
},
|
||||
});
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
currElTab: {
|
||||
type: Object,
|
||||
default: {},
|
||||
},
|
||||
});
|
||||
|
||||
function remoteMethodAll(query: string, jobType) {
|
||||
remoteMethodAllByKey(onLoad, dicData, query, jobType)
|
||||
}
|
||||
function remoteMethodAll(query: string, jobType) {
|
||||
remoteMethodAllByKey(onLoad, dicData, query, jobType);
|
||||
}
|
||||
|
||||
const methods = {
|
||||
disableForm() {
|
||||
operType.value = "view"
|
||||
},
|
||||
enableForm() {
|
||||
operType.value = "flow"
|
||||
},
|
||||
async initJobData() {
|
||||
// 判断是否仅查看
|
||||
if (props.currElTab.id) {
|
||||
await orderVue.currElTabIsView(methods, props.currJob, props.currElTab.id, methods.handleUpdate)
|
||||
}
|
||||
setPropsDataValue(form, props.currJob, 'code', 'flowKey', 'flowInstId')
|
||||
await onCascade(form);
|
||||
const methods = {
|
||||
disableForm() {
|
||||
operType.value = 'view';
|
||||
},
|
||||
enableForm() {
|
||||
operType.value = 'flow';
|
||||
},
|
||||
async initJobData() {
|
||||
// 判断是否仅查看
|
||||
if (props.currElTab.id) {
|
||||
await orderVue.currElTabIsView(methods, props.currJob, props.currElTab.id, methods.handleUpdate);
|
||||
}
|
||||
setPropsDataValue(form, props.currJob, 'code', 'flowKey', 'flowInstId');
|
||||
await onCascade(form);
|
||||
|
||||
form.flowNodeId = props.currJob.distFlowNodeId
|
||||
// 判断待分配参与者节点ID
|
||||
if (!form.flowNodeId) return
|
||||
form.runNodeId = cascadeDic.runNodeId.find(f => form.flowNodeId === f.flowNodeId).id;
|
||||
await cascadeChange('runNodeId', ['distRunJobId'])
|
||||
// 动态加减签其中一个即可
|
||||
runJobIdChange(cascadeDic.distRunJobId[0]?.id)
|
||||
},
|
||||
handleGetObj(form) {
|
||||
// 查询已分配参与者
|
||||
getByFlowInstId(form).then(response => {
|
||||
let roleUserId = response.data.roleUserId
|
||||
// 排除该节点非本人分配参与者（除查看）
|
||||
roleUserId.forEach(f => {
|
||||
let b = f.createUser !== userInfo.userInfos.user.userId;
|
||||
if (b) f.isDisabled = true
|
||||
})
|
||||
form.roleUserId = roleUserId
|
||||
if (validateNull(roleUserId)) return
|
||||
onFormLoaded(dicData, roleUserId)
|
||||
})
|
||||
},
|
||||
async handleUpdate() {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {
|
||||
});
|
||||
if (!valid) return false;
|
||||
form.flowNodeId = props.currJob.distFlowNodeId;
|
||||
// 判断待分配参与者节点ID
|
||||
if (!form.flowNodeId) return;
|
||||
form.runNodeId = cascadeDic.runNodeId.find((f) => form.flowNodeId === f.flowNodeId).id;
|
||||
await cascadeChange('runNodeId', ['distRunJobId']);
|
||||
// 动态加减签其中一个即可
|
||||
runJobIdChange(cascadeDic.distRunJobId[0]?.id);
|
||||
},
|
||||
handleGetObj(form) {
|
||||
// 查询已分配参与者
|
||||
getByFlowInstId(form).then((response) => {
|
||||
let roleUserId = response.data.roleUserId;
|
||||
// 排除该节点非本人分配参与者（除查看）
|
||||
roleUserId.forEach((f) => {
|
||||
let b = f.createUser !== userInfo.userInfos.user.userId;
|
||||
if (b) f.isDisabled = true;
|
||||
});
|
||||
form.roleUserId = roleUserId;
|
||||
if (validateNull(roleUserId)) return;
|
||||
onFormLoaded(dicData, roleUserId);
|
||||
});
|
||||
},
|
||||
async handleUpdate() {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
const validateRoleUser = await methods.validateRoleUser(form)
|
||||
if (validateRoleUser) {
|
||||
if (props.currElTab.id) {
|
||||
orderVue.currElTabIsSave(props.currJob, props.currElTab.id, true, emits)
|
||||
}
|
||||
return
|
||||
}
|
||||
const validateRoleUser = await methods.validateRoleUser(form);
|
||||
if (validateRoleUser) {
|
||||
if (props.currElTab.id) {
|
||||
orderVue.currElTabIsSave(props.currJob, props.currElTab.id, true, emits);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
await saveByFlowInstId(form);
|
||||
if (props.currElTab.id) {
|
||||
orderVue.currElTabIsSave(props.currJob, props.currElTab.id, true, emits)
|
||||
}
|
||||
useMessage().success("分配参与者成功");
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
},
|
||||
// 校验分配数据
|
||||
async validateRoleUser(row) {
|
||||
if (validateNull(row.roleUserId)) return false
|
||||
if (row.flowNodeId === props.currJob.flowNodeId) {
|
||||
useMessage().error('待分配参与者节点不能是当前节点本身')
|
||||
return true
|
||||
}
|
||||
// 分配参与者判断是否重复
|
||||
if (methods.validateDupRoleId(row, 0, '人员')) return true
|
||||
if (methods.validateDupRoleId(row, 1, '角色')) return true
|
||||
if (methods.validateDupRoleId(row, 2, '岗位')) return true
|
||||
if (methods.validateDupRoleId(row, 3, '部门')) return true
|
||||
return false
|
||||
},
|
||||
// 分配参与者判断是否重复
|
||||
validateDupRoleId(row, typeIndex, msg) {
|
||||
let roleIds = row.roleUserId.filter(f => f.roleId && f.jobType === DIC_PROP.JOB_USER_TYPE[typeIndex].value).map(roleUser => {
|
||||
return roleUser.roleId
|
||||
})
|
||||
if (new Set(roleIds).size !== roleIds.length) {
|
||||
useMessage().info("分配的办理 " + msg + " 不能重复, 请重新选择")
|
||||
return true
|
||||
}
|
||||
return false
|
||||
},
|
||||
onAddItem() {
|
||||
if (props.currElTab.id) {
|
||||
orderVue.currElTabIsSave(props.currJob, props.currElTab.id, false)
|
||||
}
|
||||
let obj = {};
|
||||
form.roleUserId.push(obj);
|
||||
},
|
||||
handleDelete(index: number, row: any) {
|
||||
form.roleUserId.splice(index, 1)
|
||||
}
|
||||
}
|
||||
try {
|
||||
loading.value = true;
|
||||
await saveByFlowInstId(form);
|
||||
if (props.currElTab.id) {
|
||||
orderVue.currElTabIsSave(props.currJob, props.currElTab.id, true, emits);
|
||||
}
|
||||
useMessage().success('分配参与者成功');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
},
|
||||
// 校验分配数据
|
||||
async validateRoleUser(row) {
|
||||
if (validateNull(row.roleUserId)) return false;
|
||||
if (row.flowNodeId === props.currJob.flowNodeId) {
|
||||
useMessage().error('待分配参与者节点不能是当前节点本身');
|
||||
return true;
|
||||
}
|
||||
// 分配参与者判断是否重复
|
||||
if (methods.validateDupRoleId(row, 0, '人员')) return true;
|
||||
if (methods.validateDupRoleId(row, 1, '角色')) return true;
|
||||
if (methods.validateDupRoleId(row, 2, '岗位')) return true;
|
||||
if (methods.validateDupRoleId(row, 3, '部门')) return true;
|
||||
return false;
|
||||
},
|
||||
// 分配参与者判断是否重复
|
||||
validateDupRoleId(row, typeIndex, msg) {
|
||||
let roleIds = row.roleUserId
|
||||
.filter((f) => f.roleId && f.jobType === DIC_PROP.JOB_USER_TYPE[typeIndex].value)
|
||||
.map((roleUser) => {
|
||||
return roleUser.roleId;
|
||||
});
|
||||
if (new Set(roleIds).size !== roleIds.length) {
|
||||
useMessage().info('分配的办理 ' + msg + ' 不能重复, 请重新选择');
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
onAddItem() {
|
||||
if (props.currElTab.id) {
|
||||
orderVue.currElTabIsSave(props.currJob, props.currElTab.id, false);
|
||||
}
|
||||
let obj = {};
|
||||
form.roleUserId.push(obj);
|
||||
},
|
||||
handleDelete(index: number, row: any) {
|
||||
form.roleUserId.splice(index, 1);
|
||||
},
|
||||
};
|
||||
|
||||
// 监听双向绑定
|
||||
watch(
|
||||
() => props.currJob.id,
|
||||
() => {
|
||||
methods.initJobData();
|
||||
}
|
||||
);
|
||||
// 监听双向绑定
|
||||
watch(
|
||||
() => props.currJob.id,
|
||||
() => {
|
||||
methods.initJobData();
|
||||
}
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
methods.initJobData()
|
||||
});
|
||||
onMounted(() => {
|
||||
methods.initJobData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-dialog__footer {
|
||||
text-align: center;
|
||||
.el-dialog__footer {
|
||||
text-align: center;
|
||||
|
||||
.dialog-footer {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.dialog-footer {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,89 +1,129 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.code')" prop="code">
|
||||
<el-select v-model="form.code" :placeholder="t('distPerson.inputCodeTip')" clearable filterable
|
||||
@change="cascadeChange('code', ['flowInstId'])">
|
||||
<el-option v-for="(item, index) in dicData.code" :key="index" :label="item.code" :value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.code')" prop="code">
|
||||
<el-select
|
||||
v-model="form.code"
|
||||
:placeholder="t('distPerson.inputCodeTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('code', ['flowInstId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.code" :key="index" :label="item.code" :value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.flowKey')" prop="flowInstId">
|
||||
<el-select v-model="form.flowInstId" :placeholder="t('runJob.inputFlowKeyTip')" clearable filterable
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.flowInstId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.flowKey')" prop="flowInstId">
|
||||
<el-select
|
||||
v-model="form.flowInstId"
|
||||
:placeholder="t('runJob.inputFlowKeyTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowInstId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="operType !== 'view'">
|
||||
<el-form-item :label="t('distPerson.runNodeId')" prop="runNodeId">
|
||||
<el-select v-model="form.runNodeId" :placeholder="t('distPerson.inputRunNodeIdTip')" clearable filterable
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="operType !== 'view'">
|
||||
<el-form-item :label="t('distPerson.runNodeId')" prop="runNodeId">
|
||||
<el-select
|
||||
v-model="form.runNodeId"
|
||||
:placeholder="t('distPerson.inputRunNodeIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="operType !== 'view'">
|
||||
<el-form-item :label="t('distPerson.runJobId')" prop="runJobId">
|
||||
<el-select v-model="form.runJobId" :placeholder="t('distPerson.inputRunJobIdTip')" clearable filterable @change="runJobIdChange">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="operType !== 'view'">
|
||||
<el-form-item :label="t('distPerson.runJobId')" prop="runJobId">
|
||||
<el-select v-model="form.runJobId" :placeholder="t('distPerson.inputRunJobIdTip')" clearable filterable @change="runJobIdChange">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.userKey')" prop="userKey" disabled>
|
||||
<el-input v-model="form.userKey" :placeholder="t('distPerson.inputUserKeyTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.userKey')" prop="userKey" disabled>
|
||||
<el-input v-model="form.userKey" :placeholder="t('distPerson.inputUserKeyTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.jobType')" prop="jobType">
|
||||
<el-select v-model="form.jobType" :placeholder="t('distPerson.inputJobTypeTip')" clearable filterable
|
||||
@change="handleRoleType">
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.jobType')" prop="jobType">
|
||||
<el-select v-model="form.jobType" :placeholder="t('distPerson.inputJobTypeTip')" clearable filterable @change="handleRoleType">
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.roleId')" prop="roleId">
|
||||
<el-tooltip content="请输入名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="form.roleId" :placeholder="t('distPerson.inputRoleIdTip')" clearable filterable
|
||||
remote :remote-method="(query) => remoteMethodAll(query, form.jobType)" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[0].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.roles" :key="index" :label="item.roleName" :value="item.roleId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[1].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.posts" :key="index" :label="item.postName" :value="item.postId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[2].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.depts" :key="index" :label="item.name" :value="item.deptId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[3].value"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.roleId')" prop="roleId">
|
||||
<el-tooltip content="请输入名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="form.roleId"
|
||||
:placeholder="t('distPerson.inputRoleIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="(query) => remoteMethodAll(query, form.jobType)"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.users"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.userId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[0].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.roles"
|
||||
:key="index"
|
||||
:label="item.roleName"
|
||||
:value="item.roleId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[1].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.posts"
|
||||
:key="index"
|
||||
:label="item.postName"
|
||||
:value="item.postId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[2].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.depts"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.deptId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[3].value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.jobName')" prop="jobName">
|
||||
<el-input v-model="form.jobName" :placeholder="t('distPerson.inputJobNameTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.jobName')" prop="jobName">
|
||||
<el-input v-model="form.jobName" :placeholder="t('distPerson.inputJobNameTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('distPerson.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('distPerson.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- <el-col :span="12" class="mb20">
|
||||
<!-- <el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('distPerson.isNowRun')" prop="isNowRun" disabled>
|
||||
<el-radio-group disabled v-model="form.isNowRun">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
@@ -92,155 +132,160 @@
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>-->
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="DistPersonDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/dist-person';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { rule } from '/@/utils/validate';
|
||||
import { onCascadeChange, onFormLoadedUrl, onLoadDicUrl, remoteMethodAllByKey } from '/@/flow/components/convert-name/convert';
|
||||
import { setPropsDataValue, setPropsNull } from '/@/flow/support/common';
|
||||
import { handleChangeJobType } from '/@/flow';
|
||||
import { DIC_PROP } from '/@/flow/support/dict-prop';
|
||||
import { PROP_CONST } from '/@/flow/support/prop-const';
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/dist-person'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { rule } from '/@/utils/validate';
|
||||
import {onCascadeChange, onFormLoadedUrl, onLoadDicUrl, remoteMethodAllByKey} from "/@/flow/components/convert-name/convert";
|
||||
import {setPropsDataValue, setPropsNull} from "/@/flow/support/common";
|
||||
import {handleChangeJobType} from "/@/flow";
|
||||
import {DIC_PROP} from "/@/flow/support/dict-prop";
|
||||
import {PROP_CONST} from "/@/flow/support/prop-const";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'code' });
|
||||
const onFormLoaded = onFormLoadedUrl(...PROP_CONST.LOAD_USER_ROLE);
|
||||
const onCascade = onCascadeChange(
|
||||
cascadeDic,
|
||||
{ key: 'code', cascades: ['flowInstId'] },
|
||||
{ key: 'flowInstId', cascades: ['runNodeId'] },
|
||||
{ key: 'runNodeId', cascades: ['runJobId'] }
|
||||
);
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "code"});
|
||||
const onFormLoaded = onFormLoadedUrl(...PROP_CONST.LOAD_USER_ROLE);
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "code", cascades: ["flowInstId"]}, {key: "flowInstId", cascades: ["runNodeId"]}, {key: "runNodeId", cascades: ["runJobId"]});
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
}
|
||||
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
}
|
||||
function runJobIdChange(newVal) {
|
||||
let fields = ['flowKey', 'flowNodeId', 'nodeJobId', 'jobType', 'userKey', 'valType', 'isNowRun'];
|
||||
if (!newVal) {
|
||||
setPropsNull(form, ...fields);
|
||||
return;
|
||||
}
|
||||
const runJob = cascadeDic.runJobId.find((f) => f.id === newVal);
|
||||
setPropsDataValue(form, runJob, fields);
|
||||
if (form.valType !== DIC_PROP.VAL_TYPE[1].value) {
|
||||
form.runJobId = null;
|
||||
useMessage().info('当前节点任务为非分配类型的任务，不允许单独分配参与者');
|
||||
}
|
||||
}
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
code: '',
|
||||
runNodeId: '',
|
||||
runJobId: '',
|
||||
roleId: '',
|
||||
jobType: '',
|
||||
userKey: '',
|
||||
flowInstId: '',
|
||||
flowKey: '',
|
||||
});
|
||||
|
||||
function runJobIdChange(newVal) {
|
||||
let fields = ['flowKey', 'flowNodeId', 'nodeJobId', 'jobType', 'userKey', 'valType', 'isNowRun'];
|
||||
if (!newVal) {
|
||||
setPropsNull(form, ...fields)
|
||||
return
|
||||
}
|
||||
const runJob = cascadeDic.runJobId.find(f => f.id === newVal)
|
||||
setPropsDataValue(form, runJob, fields)
|
||||
if (form.valType !== DIC_PROP.VAL_TYPE[1].value) {
|
||||
form.runJobId = null
|
||||
useMessage().info("当前节点任务为非分配类型的任务，不允许单独分配参与者");
|
||||
}
|
||||
}
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
code: '',
|
||||
runNodeId: '',
|
||||
runJobId: '',
|
||||
roleId: '',
|
||||
jobType: '',
|
||||
userKey: '',
|
||||
flowInstId: '',
|
||||
flowKey: '',
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
code: [{ required: true, message: '工单编号不能为空', trigger: 'blur' }],
|
||||
flowInstId: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
// runNodeId: [{required: true, message: '节点名称不能为空', trigger: 'blur'}],
|
||||
// runJobId: [{required: true, message: '任务名称不能为空', trigger: 'blur'}],
|
||||
jobType: [{ required: true, message: '参与者类型不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
code: [{required: true, message: '工单编号不能为空', trigger: 'blur'}],
|
||||
flowInstId: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
// runNodeId: [{required: true, message: '节点名称不能为空', trigger: 'blur'}],
|
||||
// runJobId: [{required: true, message: '任务名称不能为空', trigger: 'blur'}],
|
||||
jobType: [{required: true, message: '参与者类型不能为空', trigger: 'blur'}],
|
||||
})
|
||||
function remoteMethodAll(query: string, jobType) {
|
||||
remoteMethodAllByKey(onLoad, dicData, query, jobType);
|
||||
}
|
||||
|
||||
function remoteMethodAll(query: string, jobType) {
|
||||
remoteMethodAllByKey(onLoad, dicData, query, jobType)
|
||||
}
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form);
|
||||
}
|
||||
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form)
|
||||
}
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取DistPerson信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getDistPersonData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取DistPerson信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getDistPersonData(id)
|
||||
}
|
||||
};
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getDistPersonData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onFormLoaded(dicData, form);
|
||||
onCascade(form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getDistPersonData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onFormLoaded(dicData, form);
|
||||
onCascade(form);
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,45 +1,44 @@
|
||||
export default {
|
||||
distPerson: {
|
||||
index: '#',
|
||||
importdistPersonTip: 'import DistPerson',
|
||||
id: 'id',
|
||||
code: 'code',
|
||||
roleId: 'roleId',
|
||||
roleUserId: 'dist Person',
|
||||
jobType: 'jobType',
|
||||
userKey: 'userKey',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowInstId: 'flowInstId',
|
||||
flowKey: 'flowKey',
|
||||
updateUser: 'updateUser',
|
||||
updateTime: 'updateTime',
|
||||
jobName: 'new jobName',
|
||||
sort: 'new sort',
|
||||
recRoleId: 'recRoleId',
|
||||
delRoleId: 'delRoleId',
|
||||
delStartTime: 'delStartTime',
|
||||
delEndTime: 'delEndTime',
|
||||
delStatus: 'delStatus',
|
||||
distPerson: {
|
||||
index: '#',
|
||||
importdistPersonTip: 'import DistPerson',
|
||||
id: 'id',
|
||||
code: 'code',
|
||||
roleId: 'roleId',
|
||||
roleUserId: 'dist Person',
|
||||
jobType: 'jobType',
|
||||
userKey: 'userKey',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowInstId: 'flowInstId',
|
||||
flowKey: 'flowKey',
|
||||
updateUser: 'updateUser',
|
||||
updateTime: 'updateTime',
|
||||
jobName: 'new jobName',
|
||||
sort: 'new sort',
|
||||
recRoleId: 'recRoleId',
|
||||
delRoleId: 'delRoleId',
|
||||
delStartTime: 'delStartTime',
|
||||
delEndTime: 'delEndTime',
|
||||
delStatus: 'delStatus',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputCodeTip: 'input code',
|
||||
inputRoleIdTip: 'input roleId',
|
||||
inputJobTypeTip: 'input jobType',
|
||||
inputUserKeyTip: 'input userKey',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
inputJobNameTip: 'input new jobName',
|
||||
inputSortTip: 'input new sort',
|
||||
inputRecRoleIdTip: 'input recRoleId',
|
||||
inputDelRoleIdTip: 'input delRoleId',
|
||||
inputDelStartTimeTip: 'input delStartTime',
|
||||
inputDelEndTimeTip: 'input delEndTime',
|
||||
inputDelStatusTip: 'input delStatus',
|
||||
|
||||
}
|
||||
}
|
||||
inputIdTip: 'input id',
|
||||
inputCodeTip: 'input code',
|
||||
inputRoleIdTip: 'input roleId',
|
||||
inputJobTypeTip: 'input jobType',
|
||||
inputUserKeyTip: 'input userKey',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
inputJobNameTip: 'input new jobName',
|
||||
inputSortTip: 'input new sort',
|
||||
inputRecRoleIdTip: 'input recRoleId',
|
||||
inputDelRoleIdTip: 'input delRoleId',
|
||||
inputDelStartTimeTip: 'input delStartTime',
|
||||
inputDelEndTimeTip: 'input delEndTime',
|
||||
inputDelStatusTip: 'input delStatus',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,48 +1,48 @@
|
||||
export default {
|
||||
distPerson: {
|
||||
index: '#',
|
||||
importdistPersonTip: '导入分配参与者',
|
||||
id: ' id',
|
||||
code: '工单编号',
|
||||
roleId: '参与者',
|
||||
roleUserId: '分配参与者',
|
||||
jobType: '参与者类型',
|
||||
userKey: '参与者KEY',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowInstId: '流程实例ID',
|
||||
flowKey: '流程名称',
|
||||
updateUser: '更新人',
|
||||
updateTime: '更新时间',
|
||||
jobName: '新任务名称',
|
||||
sort: '新任务排序',
|
||||
runNodeId: '节点名称',
|
||||
runJobId: '任务名称',
|
||||
recRoleId: '接收人',
|
||||
delRoleId: '委托人',
|
||||
delStartTime: '委托开始时间',
|
||||
delEndTime: '委托结束时间',
|
||||
delStatus: '委托状态',
|
||||
distPerson: {
|
||||
index: '#',
|
||||
importdistPersonTip: '导入分配参与者',
|
||||
id: ' id',
|
||||
code: '工单编号',
|
||||
roleId: '参与者',
|
||||
roleUserId: '分配参与者',
|
||||
jobType: '参与者类型',
|
||||
userKey: '参与者KEY',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowInstId: '流程实例ID',
|
||||
flowKey: '流程名称',
|
||||
updateUser: '更新人',
|
||||
updateTime: '更新时间',
|
||||
jobName: '新任务名称',
|
||||
sort: '新任务排序',
|
||||
runNodeId: '节点名称',
|
||||
runJobId: '任务名称',
|
||||
recRoleId: '接收人',
|
||||
delRoleId: '委托人',
|
||||
delStartTime: '委托开始时间',
|
||||
delEndTime: '委托结束时间',
|
||||
delStatus: '委托状态',
|
||||
|
||||
inputIdTip: '请输入ID',
|
||||
inputCodeTip: '请输入工单编号',
|
||||
inputRoleIdTip: '请选择参与者',
|
||||
inputJobTypeTip: '请输入参与者类型',
|
||||
inputUserKeyTip: '请输入参与者KEY',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFlowKeyTip: '请输入流程名称',
|
||||
inputUpdateUserTip: '请输入更新人',
|
||||
inputUpdateTimeTip: '请输入更新时间',
|
||||
inputJobNameTip: '请输入新任务名称',
|
||||
inputSortTip: '请输入新任务排序',
|
||||
inputRunNodeIdTip: '请输入节点名称',
|
||||
inputRunJobIdTip: '请输入任务名称',
|
||||
inputRecRoleIdTip: '请选择接收人',
|
||||
inputDelRoleIdTip: '请选择委托人',
|
||||
inputDelStartTimeTip: '请选择委托开始时间',
|
||||
inputDelEndTimeTip: '请选择委托结束时间',
|
||||
inputDelStatusTip: '请选择委托状态',
|
||||
}
|
||||
}
|
||||
inputIdTip: '请输入ID',
|
||||
inputCodeTip: '请输入工单编号',
|
||||
inputRoleIdTip: '请选择参与者',
|
||||
inputJobTypeTip: '请输入参与者类型',
|
||||
inputUserKeyTip: '请输入参与者KEY',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFlowKeyTip: '请输入流程名称',
|
||||
inputUpdateUserTip: '请输入更新人',
|
||||
inputUpdateTimeTip: '请输入更新时间',
|
||||
inputJobNameTip: '请输入新任务名称',
|
||||
inputSortTip: '请输入新任务排序',
|
||||
inputRunNodeIdTip: '请输入节点名称',
|
||||
inputRunJobIdTip: '请输入任务名称',
|
||||
inputRecRoleIdTip: '请选择接收人',
|
||||
inputDelRoleIdTip: '请选择委托人',
|
||||
inputDelStartTimeTip: '请选择委托开始时间',
|
||||
inputDelEndTimeTip: '请选择委托结束时间',
|
||||
inputDelStatusTip: '请选择委托状态',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,201 +1,204 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('distPerson.flowInstId')" prop="flowInstId" >
|
||||
<el-input :placeholder="t('distPerson.inputFlowInstIdTip')" v-model="state.queryForm.flowInstId" clearable
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('distPerson.code')" prop="code" >
|
||||
<el-select v-model="state.queryForm.code" :placeholder="t('distPerson.inputCodeTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.code" :key="index" :label="item.code" :value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')"
|
||||
v-auth="'jsonflow_distperson_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_distperson_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('distPerson.flowInstId')" prop="flowInstId">
|
||||
<el-input :placeholder="t('distPerson.inputFlowInstIdTip')" v-model="state.queryForm.flowInstId" clearable style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('distPerson.code')" prop="code">
|
||||
<el-select v-model="state.queryForm.code" :placeholder="t('distPerson.inputCodeTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.code" :key="index" :label="item.code" :value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')" v-auth="'jsonflow_distperson_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_distperson_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_distperson_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('distPerson.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('distPerson.flowInstId')" show-overflow-tooltip/>
|
||||
<el-table-column prop="code" :label="t('distPerson.code')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowKey" :label="t('distPerson.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey"
|
||||
:valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_distperson_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('distPerson.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('distPerson.flowInstId')" show-overflow-tooltip />
|
||||
<el-table-column prop="code" :label="t('distPerson.code')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowKey" :label="t('distPerson.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey" :valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="jobType" :label="t('distPerson.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobType" :label="t('distPerson.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="roleId" :label="t('distPerson.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name :options="{users: state.dicData.users, roles: state.dicData.roles, posts: state.dicData.posts, depts: state.dicData.depts }"
|
||||
:value="scope.row"></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('distPerson.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name
|
||||
:options="{ users: state.dicData.users, roles: state.dicData.roles, posts: state.dicData.posts, depts: state.dicData.depts }"
|
||||
:value="scope.row"
|
||||
></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="userKey" :label="t('distPerson.userKey')" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userKey" :label="t('distPerson.userKey')" show-overflow-tooltip> </el-table-column>
|
||||
|
||||
<el-table-column prop="jobName" :label="t('distPerson.jobName')" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sort" :label="t('distPerson.sort')" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobName" :label="t('distPerson.jobName')" show-overflow-tooltip> </el-table-column>
|
||||
<el-table-column prop="sort" :label="t('distPerson.sort')" show-overflow-tooltip> </el-table-column>
|
||||
|
||||
<el-table-column prop="createUser" :label="t('distPerson.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('distPerson.createTime')" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<el-table-column prop="createUser" :label="t('distPerson.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('distPerson.createTime')" show-overflow-tooltip />
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemDistPerson">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/dist-person";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/dist-person';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onLoadDicUrl, onLoaded} from "/@/flow/components/convert-name/convert";
|
||||
import {PROP_CONST} from "/@/flow/support/prop-const";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoadDicUrl, onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
import { PROP_CONST } from '/@/flow/support/prop-const';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n()
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "code"});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'code' });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({key: "createUser"}, {key: "flowInstId"}, ...PROP_CONST.LOAD_USER_ROLE),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({ key: 'createUser' }, { key: 'flowInstId' }, ...PROP_CONST.LOAD_USER_ROLE),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/dist-person/export', state.queryForm, 'dist-person.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/dist-person/export', state.queryForm, 'dist-person.xlsx');
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -1,239 +1,241 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="90px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="90px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('flowClazz.inputDefFlowIdTip')" clearable filterable @change="defFlowIdChange">
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('flowClazz.inputDefFlowIdTip')" clearable filterable
|
||||
@change="defFlowIdChange">
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.flowNodeId')" prop="flowNodeId">
|
||||
<el-select
|
||||
v-model="form.flowNodeId"
|
||||
:placeholder="t('flowClazz.inputFlowNodeIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('flowNodeId', ['nodeJobId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="form.flowNodeId" :placeholder="t('flowClazz.inputFlowNodeIdTip')" clearable filterable
|
||||
@change="cascadeChange('flowNodeId', ['nodeJobId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.clazz')" prop="clazz">
|
||||
<el-input v-model="form.clazz" :placeholder="t('flowClazz.inputClazzTip')"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.httpUrl')" prop="httpUrl">
|
||||
<el-input v-model="form.httpUrl" :placeholder="t('flowClazz.inputHttpUrlTip')"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.clazz')" prop="clazz">
|
||||
<el-input v-model="form.clazz" :placeholder="t('flowClazz.inputClazzTip')"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.httpUrl')" prop="httpUrl">
|
||||
<el-input v-model="form.httpUrl" :placeholder="t('flowClazz.inputHttpUrlTip')"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.httpMethod')" prop="httpMethod">
|
||||
<el-select v-model="form.httpMethod" :placeholder="t('flowClazz.inputHttpMethodTip')">
|
||||
<el-option v-for="(item, index) in DIC_PROP.HTTP_METHODS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.httpMethod')" prop="httpMethod">
|
||||
<el-select v-model="form.httpMethod" :placeholder="t('flowClazz.inputHttpMethodTip')">
|
||||
<el-option v-for="(item, index) in DIC_PROP.HTTP_METHODS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.methods')" prop="methods">
|
||||
<el-select v-model="form.methods" :placeholder="t('flowClazz.inputMethodsTip')" clearable filterable multiple>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FLOW_METHODS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.methods')" prop="methods">
|
||||
<el-select v-model="form.methods" :placeholder="t('flowClazz.inputMethodsTip')" clearable filterable multiple>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FLOW_METHODS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.valType')" prop="valType">
|
||||
<el-select v-model="form.valType" :placeholder="t('flowClazz.inputValTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.VAL_TYPE.slice(2, 5)" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.valType')" prop="valType">
|
||||
<el-select v-model="form.valType" :placeholder="t('flowClazz.inputValTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.VAL_TYPE.slice(2, 5)" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.varKeyVal')" prop="varKeyVal">
|
||||
<el-input v-model="form.varKeyVal" :placeholder="t('flowClazz.inputVarKeyValTip')" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.varKeyVal')" prop="varKeyVal">
|
||||
<el-input v-model="form.varKeyVal" :placeholder="t('flowClazz.inputVarKeyValTip')" clearable/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.operator')" prop="operator">
|
||||
<el-select v-model="form.operator" :placeholder="t('flowClazz.inputOperatorTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.OPERATOR" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.operator')" prop="operator">
|
||||
<el-select v-model="form.operator" :placeholder="t('flowClazz.inputOperatorTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.OPERATOR" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.varVal')" prop="varVal">
|
||||
<el-input v-model="form.varVal" :placeholder="t('flowClazz.inputVarValTip')"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.varVal')" prop="varVal">
|
||||
<el-input v-model="form.varVal" :placeholder="t('flowClazz.inputVarValTip')"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.type')" prop="type">
|
||||
<el-select v-model="form.type" :placeholder="t('flowClazz.inputTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.CLAZZ_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.type')" prop="type">
|
||||
<el-select v-model="form.type" :placeholder="t('flowClazz.inputTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.CLAZZ_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('flowClazz.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('flowClazz.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('flowClazz.inputRemarkTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowClazz.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('flowClazz.inputRemarkTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="FlowClazzDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/flow-clazz';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { rule } from '/@/utils/validate';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
import { notifyLeft } from '/@/flow';
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/flow-clazz'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { rule } from '/@/utils/validate';
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
import {notifyLeft} from "/@/flow";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'defFlowId' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'defFlowId', cascades: ['flowNodeId'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
}
|
||||
const defFlowIdChange = (newVal: any) => {
|
||||
onCascade(form, { key: 'defFlowId', cascades: ['flowNodeId'] });
|
||||
if (newVal) {
|
||||
const defFlow = dicData.defFlowId.find((f) => f.id === newVal);
|
||||
form.flowKey = defFlow.flowKey;
|
||||
} else {
|
||||
form.flowKey = null;
|
||||
}
|
||||
};
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "defFlowId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "defFlowId", cascades: ["flowNodeId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
}
|
||||
const defFlowIdChange = (newVal: any) => {
|
||||
onCascade(form, {key: 'defFlowId', cascades: ['flowNodeId']});
|
||||
if (newVal) {
|
||||
const defFlow = dicData.defFlowId.find(f => f.id === newVal)
|
||||
form.flowKey = defFlow.flowKey
|
||||
} else {
|
||||
form.flowKey = null
|
||||
}
|
||||
}
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
sort: 0,
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
clazz: '',
|
||||
httpUrl: '',
|
||||
httpMethod: 'GET',
|
||||
methods: '',
|
||||
valType: '',
|
||||
varKeyVal: '',
|
||||
operator: '',
|
||||
varVal: '',
|
||||
remark: '',
|
||||
type: '',
|
||||
});
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
sort: 0,
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
clazz: '',
|
||||
httpUrl: '',
|
||||
httpMethod: 'GET',
|
||||
methods: '',
|
||||
valType: '',
|
||||
varKeyVal: '',
|
||||
operator: '',
|
||||
varVal: '',
|
||||
remark: '',
|
||||
type: '',
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
methods: [{ required: true, message: '方法名称不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '事件类型不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
methods: [{required: true, message: '方法名称不能为空', trigger: 'blur'}],
|
||||
type: [{required: true, message: '事件类型不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取FlowClazz信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getFlowClazzData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取FlowClazz信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getFlowClazzData(id)
|
||||
}
|
||||
};
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
if (!form.clazz && !form.httpUrl) {
|
||||
notifyLeft('请填写 监听类 或者 Http请求地址', 'warning');
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!form.clazz && !form.httpUrl) {
|
||||
notifyLeft('请填写 监听类 或者 Http请求地址', 'warning')
|
||||
return false
|
||||
}
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getFlowClazzData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onCascade(form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getFlowClazzData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onCascade(form);
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,44 +1,43 @@
|
||||
export default {
|
||||
flowClazz: {
|
||||
index: '#',
|
||||
importflowClazzTip: 'import FlowClazz',
|
||||
id: 'id',
|
||||
sort: 'sort',
|
||||
defFlowId: 'defFlowId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
clazz: 'clazz',
|
||||
httpUrl: 'httpUrl',
|
||||
httpMethod: 'httpMethod',
|
||||
methods: 'methods',
|
||||
valType: 'valType',
|
||||
varKeyVal: 'varKeyVal',
|
||||
operator: 'operator',
|
||||
varVal: 'varVal',
|
||||
remark: 'remark',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowKey: 'flowKey',
|
||||
type: 'type',
|
||||
delFlag: 'delFlag',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputSortTip: 'input sort',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputClazzTip: 'input clazz',
|
||||
inputHttpUrlTip: 'input httpUrl',
|
||||
inputHttpMethodTip: 'input httpMethod',
|
||||
inputMethodsTip: 'input methods',
|
||||
inputValTypeTip: 'input valType',
|
||||
inputVarKeyValTip: 'input varKeyVal',
|
||||
inputOperatorTip: 'input operator',
|
||||
inputVarValTip: 'input varVal',
|
||||
inputRemarkTip: 'input remark',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputTypeTip: 'input type',
|
||||
inputDelFlagTip: 'input delFlag',
|
||||
|
||||
}
|
||||
}
|
||||
flowClazz: {
|
||||
index: '#',
|
||||
importflowClazzTip: 'import FlowClazz',
|
||||
id: 'id',
|
||||
sort: 'sort',
|
||||
defFlowId: 'defFlowId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
clazz: 'clazz',
|
||||
httpUrl: 'httpUrl',
|
||||
httpMethod: 'httpMethod',
|
||||
methods: 'methods',
|
||||
valType: 'valType',
|
||||
varKeyVal: 'varKeyVal',
|
||||
operator: 'operator',
|
||||
varVal: 'varVal',
|
||||
remark: 'remark',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowKey: 'flowKey',
|
||||
type: 'type',
|
||||
delFlag: 'delFlag',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputSortTip: 'input sort',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputClazzTip: 'input clazz',
|
||||
inputHttpUrlTip: 'input httpUrl',
|
||||
inputHttpMethodTip: 'input httpMethod',
|
||||
inputMethodsTip: 'input methods',
|
||||
inputValTypeTip: 'input valType',
|
||||
inputVarKeyValTip: 'input varKeyVal',
|
||||
inputOperatorTip: 'input operator',
|
||||
inputVarValTip: 'input varVal',
|
||||
inputRemarkTip: 'input remark',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputTypeTip: 'input type',
|
||||
inputDelFlagTip: 'input delFlag',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,44 +1,43 @@
|
||||
export default {
|
||||
flowClazz: {
|
||||
index: '#',
|
||||
importflowClazzTip: '导入节点事件设置',
|
||||
id: '主键ID',
|
||||
sort: '排序值',
|
||||
defFlowId: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
clazz: '监听类',
|
||||
httpUrl: 'Http请求地址',
|
||||
httpMethod: 'Http请求类型',
|
||||
methods: '方法名称',
|
||||
valType: '条件模式',
|
||||
varKeyVal: '表单字段',
|
||||
operator: '运算符',
|
||||
varVal: '校验值',
|
||||
remark: '备注',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowKey: '业务KEY',
|
||||
type: '事件类型',
|
||||
delFlag: '删除标识',
|
||||
|
||||
inputIdTip: '请输入主键ID',
|
||||
inputSortTip: '请输入排序值',
|
||||
inputDefFlowIdTip: '请输入流程名称',
|
||||
inputFlowNodeIdTip: '请输入节点名称',
|
||||
inputClazzTip: 'Bean名称：FlowInterceptor实现类',
|
||||
inputHttpUrlTip: '可输入全路径或相对路径',
|
||||
inputHttpMethodTip: '请选择Http请求类型',
|
||||
inputMethodsTip: '多个方法名称，英文逗号分隔，顺序从左到右',
|
||||
inputValTypeTip: '请输入条件模式',
|
||||
inputVarKeyValTip: '请输入表单字段',
|
||||
inputOperatorTip: '请输入条件运算符',
|
||||
inputVarValeTip: '请输入条件校验值',
|
||||
inputRemarkTip: '请输入备注',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowKeyTip: '请输入业务KEY',
|
||||
inputTypeTip: '请输入事件类型',
|
||||
inputDelFlagTip: '请输入删除标识',
|
||||
flowClazz: {
|
||||
index: '#',
|
||||
importflowClazzTip: '导入节点事件设置',
|
||||
id: '主键ID',
|
||||
sort: '排序值',
|
||||
defFlowId: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
clazz: '监听类',
|
||||
httpUrl: 'Http请求地址',
|
||||
httpMethod: 'Http请求类型',
|
||||
methods: '方法名称',
|
||||
valType: '条件模式',
|
||||
varKeyVal: '表单字段',
|
||||
operator: '运算符',
|
||||
varVal: '校验值',
|
||||
remark: '备注',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowKey: '业务KEY',
|
||||
type: '事件类型',
|
||||
delFlag: '删除标识',
|
||||
|
||||
}
|
||||
}
|
||||
inputIdTip: '请输入主键ID',
|
||||
inputSortTip: '请输入排序值',
|
||||
inputDefFlowIdTip: '请输入流程名称',
|
||||
inputFlowNodeIdTip: '请输入节点名称',
|
||||
inputClazzTip: 'Bean名称：FlowInterceptor实现类',
|
||||
inputHttpUrlTip: '可输入全路径或相对路径',
|
||||
inputHttpMethodTip: '请选择Http请求类型',
|
||||
inputMethodsTip: '多个方法名称，英文逗号分隔，顺序从左到右',
|
||||
inputValTypeTip: '请输入条件模式',
|
||||
inputVarKeyValTip: '请输入表单字段',
|
||||
inputOperatorTip: '请输入条件运算符',
|
||||
inputVarValeTip: '请输入条件校验值',
|
||||
inputRemarkTip: '请输入备注',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowKeyTip: '请输入业务KEY',
|
||||
inputTypeTip: '请输入事件类型',
|
||||
inputDelFlagTip: '请输入删除标识',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,211 +1,225 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('flowClazz.defFlowId')" prop="defFlowId" >
|
||||
<el-select v-model="state.queryForm.defFlowId" :placeholder="t('flowClazz.inputDefFlowIdTip')"
|
||||
clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')"
|
||||
v-auth="'jsonflow_flowclazz_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_flowclazz_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_flowclazz_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('flowClazz.index')" width="40" />
|
||||
<el-table-column prop="sort" :label="t('flowClazz.sort')" show-overflow-tooltip/>
|
||||
<el-table-column prop="defFlowId" :label="t('flowClazz.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.defFlowId" :value="scope.row.defFlowId"
|
||||
:valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="flowNodeId" :label="t('flowClazz.flowNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.cascadeDic[scope.row.defFlowId]" :value="scope.row.flowNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="clazz" :label="t('flowClazz.clazz')" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="httpUrl" :label="t('flowClazz.httpUrl')" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="httpMethod" :label="t('flowClazz.httpMethod')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.HTTP_METHODS" :value="scope.row.httpMethod"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="methods" :label="t('flowClazz.methods')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_METHODS" :value="scope.row.methods"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="valType" :label="t('flowClazz.valType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.VAL_TYPE.slice(2, 5)" :value="scope.row.valType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varKeyVal" :label="t('flowClazz.varKeyVal')" show-overflow-tooltip/>
|
||||
<el-table-column prop="operator" :label="t('flowClazz.operator')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.OPERATOR" :value="scope.row.operator"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varVal" :label="t('flowClazz.varVal')" show-overflow-tooltip/>
|
||||
<el-table-column prop="type" :label="t('flowClazz.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.CLAZZ_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" :label="t('flowClazz.remark')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="createUser" :label="t('flowClazz.createUser')" show-overflow-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('flowClazz.defFlowId')" prop="defFlowId">
|
||||
<el-select
|
||||
v-model="state.queryForm.defFlowId"
|
||||
:placeholder="t('flowClazz.inputDefFlowIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')" v-auth="'jsonflow_flowclazz_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_flowclazz_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_flowclazz_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('flowClazz.index')" width="40" />
|
||||
<el-table-column prop="sort" :label="t('flowClazz.sort')" show-overflow-tooltip />
|
||||
<el-table-column prop="defFlowId" :label="t('flowClazz.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.defFlowId" :value="scope.row.defFlowId" :valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="flowNodeId" :label="t('flowClazz.flowNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name
|
||||
:options="state.cascadeDic[scope.row.defFlowId]"
|
||||
:value="scope.row.flowNodeId"
|
||||
:valueKey="'id'"
|
||||
:showKey="'nodeName'"
|
||||
></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="clazz" :label="t('flowClazz.clazz')" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="httpUrl" :label="t('flowClazz.httpUrl')" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="httpMethod" :label="t('flowClazz.httpMethod')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.HTTP_METHODS" :value="scope.row.httpMethod"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="methods" :label="t('flowClazz.methods')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_METHODS" :value="scope.row.methods"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="valType" :label="t('flowClazz.valType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.VAL_TYPE.slice(2, 5)" :value="scope.row.valType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varKeyVal" :label="t('flowClazz.varKeyVal')" show-overflow-tooltip />
|
||||
<el-table-column prop="operator" :label="t('flowClazz.operator')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.OPERATOR" :value="scope.row.operator"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varVal" :label="t('flowClazz.varVal')" show-overflow-tooltip />
|
||||
<el-table-column prop="type" :label="t('flowClazz.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.CLAZZ_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" :label="t('flowClazz.remark')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="createUser" :label="t('flowClazz.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('flowClazz.createTime')" show-overflow-tooltip/>-->
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemFlowClazz">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/flow-clazz";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/flow-clazz';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onCascaded, onLoadDicUrl, onLoaded} from "/@/flow/components/convert-name/convert";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascaded, onLoadDicUrl, onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n()
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "defFlowId"});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'defFlowId' });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({key: "createUser"}),
|
||||
onCascaded: onCascaded({key: "defFlowId", cascades: ["flowNodeId"]}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({ key: 'createUser' }),
|
||||
onCascaded: onCascaded({ key: 'defFlowId', cascades: ['flowNodeId'] }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/flow-clazz/export', state.queryForm, 'flow-clazz.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/flow-clazz/export', state.queryForm, 'flow-clazz.xlsx');
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,220 +1,243 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 发起工单 -->
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer" direction="rtl"
|
||||
append-to-body size="90%"
|
||||
v-if="data.showInitiateOrder"
|
||||
v-model="data.showInitiateOrder"
|
||||
@closed="handleClosed()"
|
||||
>
|
||||
<el-tabs class="flow-predict_display_center" v-model="data.currActive" @tab-click="handleTabClick">
|
||||
<el-tab-pane label="① 录入表单" name="form"></el-tab-pane>
|
||||
<el-tab-pane label="② 流程预测" name="flow"></el-tab-pane>
|
||||
<el-tab-pane label="③ 审批预测" name="comment"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<div>
|
||||
<!-- 发起工单 -->
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer"
|
||||
direction="rtl"
|
||||
append-to-body
|
||||
size="90%"
|
||||
v-if="data.showInitiateOrder"
|
||||
v-model="data.showInitiateOrder"
|
||||
@closed="handleClosed()"
|
||||
>
|
||||
<el-tabs class="flow-predict_display_center" v-model="data.currActive" @tab-click="handleTabClick">
|
||||
<el-tab-pane label="① 录入表单" name="form"></el-tab-pane>
|
||||
<el-tab-pane label="② 流程预测" name="flow"></el-tab-pane>
|
||||
<el-tab-pane label="③ 审批预测" name="comment"></el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<div id="predictFormHeight" style="height: 850px; overflow-y: auto">
|
||||
<slot :currActive="data.currActive"></slot>
|
||||
</div>
|
||||
<div id="predictFormHeight" style="height: 850px; overflow-y: auto">
|
||||
<slot :currActive="data.currActive"></slot>
|
||||
</div>
|
||||
|
||||
<div v-show="data.currActive === 'flow'">
|
||||
<div class="flow-predict_display_center">
|
||||
<el-button type="primary" round icon="VideoPlay" @click="submitPredict(false)" v-if="!data.isPredicted || !data.predictFlow.flowInstId"
|
||||
:disabled="data.btnLoading">开始预测</el-button>
|
||||
<el-button type="primary" round icon="Refresh" @click="submitPredict(true)" v-if="data.isPredicted && data.predictFlow.flowInstId"
|
||||
:disabled="data.btnLoading">刷新预测</el-button>
|
||||
</div>
|
||||
<div v-show="data.currActive === 'flow'">
|
||||
<div class="flow-predict_display_center">
|
||||
<el-button
|
||||
type="primary"
|
||||
round
|
||||
icon="VideoPlay"
|
||||
@click="submitPredict(false)"
|
||||
v-if="!data.isPredicted || !data.predictFlow.flowInstId"
|
||||
:disabled="data.btnLoading"
|
||||
>开始预测</el-button
|
||||
>
|
||||
<el-button
|
||||
type="primary"
|
||||
round
|
||||
icon="Refresh"
|
||||
@click="submitPredict(true)"
|
||||
v-if="data.isPredicted && data.predictFlow.flowInstId"
|
||||
:disabled="data.btnLoading"
|
||||
>刷新预测</el-button
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="flow-predict_display">
|
||||
<span style="margin-top: 5px">流程预测选项：</span>
|
||||
<el-checkbox-group v-model="data.predictOptions">
|
||||
<el-checkbox v-for="(item, index) in DIC_PROP.PREDICT_OPTIONS" :key="index" :label="item.value"
|
||||
:disabled="!!item.disabled">
|
||||
{{ item.label }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
<div class="flow-predict_display">
|
||||
<span style="margin-top: 5px">流程预测选项：</span>
|
||||
<el-checkbox-group v-model="data.predictOptions">
|
||||
<el-checkbox v-for="(item, index) in DIC_PROP.PREDICT_OPTIONS" :key="index" :label="item.value" :disabled="!!item.disabled">
|
||||
{{ item.label }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
|
||||
<keep-alive v-if="data.currTabComp && data.isPredicted">
|
||||
<component ref="flow" v-if="data.currTabComp && data.isPredicted" :key="data.currTabComp" :is="data.currTabComp" :currJob="data.predictFlow"></component>
|
||||
</keep-alive>
|
||||
<keep-alive v-if="data.currTabComp && data.isPredicted">
|
||||
<component
|
||||
ref="flow"
|
||||
v-if="data.currTabComp && data.isPredicted"
|
||||
:key="data.currTabComp"
|
||||
:is="data.currTabComp"
|
||||
:currJob="data.predictFlow"
|
||||
></component>
|
||||
</keep-alive>
|
||||
|
||||
<div v-if="!data.isPredicted && data.predictFlow.defFlowId" class="flow-predict_display_center" style="font-size: 20px; margin-top: 10%; font-weight: 300">
|
||||
全流程预测进行中：流转轨迹预测、节点参与者预测、连线条件预测、审批过程预测
|
||||
</div>
|
||||
<div
|
||||
v-if="!data.isPredicted && data.predictFlow.defFlowId"
|
||||
class="flow-predict_display_center"
|
||||
style="font-size: 20px; margin-top: 10%; font-weight: 300"
|
||||
>
|
||||
全流程预测进行中：流转轨迹预测、节点参与者预测、连线条件预测、审批过程预测
|
||||
</div>
|
||||
|
||||
<div v-if="!data.predictFlow.defFlowId" class="flow-predict_display_center" style="font-size: 20px; margin-top: 10%; font-weight: 300">
|
||||
请点击《开始预测》按钮，进行全流程预测：流转轨迹预测、节点参与者预测、连线条件预测、审批过程预测
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!data.predictFlow.defFlowId" class="flow-predict_display_center" style="font-size: 20px; margin-top: 10%; font-weight: 300">
|
||||
请点击《开始预测》按钮，进行全流程预测：流转轨迹预测、节点参与者预测、连线条件预测、审批过程预测
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="predictClientHeight" style="min-width: 980px; overflow-y: auto">
|
||||
<comment ref="comment" v-if="data.isPredicted" v-show="data.currActive === 'comment'" :curr-job="data.predictFlow"></comment>
|
||||
</div>
|
||||
</el-drawer>
|
||||
|
||||
</div>
|
||||
<div id="predictClientHeight" style="min-width: 980px; overflow-y: auto">
|
||||
<comment ref="comment" v-if="data.isPredicted" v-show="data.currActive === 'comment'" :curr-job="data.predictFlow"></comment>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="JsonFlowPredict">
|
||||
import {useI18n} from "vue-i18n";
|
||||
import {utils} from "/@//flow/designer/utils/common";
|
||||
import * as defFlow from '/@/flow/designer/api/jsonflow'
|
||||
import {useMessage} from "/@/hooks/message";
|
||||
import * as orderVue from "/@/api/order/order-key-vue";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { utils } from '/@//flow/designer/utils/common';
|
||||
import * as defFlow from '/@/flow/designer/api/jsonflow';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import * as orderVue from '/@/api/order/order-key-vue';
|
||||
|
||||
// 引入组件
|
||||
const FlowPhoto = defineAsyncComponent(() => import('/@/views/jsonflow/flow-design/view.vue'));
|
||||
const Comment = defineAsyncComponent(() => import('/@/views/jsonflow/comment/timeline.vue'));
|
||||
// 引入组件
|
||||
const FlowPhoto = defineAsyncComponent(() => import('/@/views/jsonflow/flow-design/view.vue'));
|
||||
const Comment = defineAsyncComponent(() => import('/@/views/jsonflow/comment/timeline.vue'));
|
||||
|
||||
const {t} = useI18n()
|
||||
const {proxy} = getCurrentInstance();
|
||||
const $message = useMessage();
|
||||
const $emit = defineEmits(['handleInitiateOrder']);
|
||||
const { t } = useI18n();
|
||||
const { proxy } = getCurrentInstance();
|
||||
const $message = useMessage();
|
||||
const $emit = defineEmits(['handleInitiateOrder']);
|
||||
|
||||
const props = defineProps({
|
||||
currFlowForm: {
|
||||
type: Object,
|
||||
default: {},
|
||||
},
|
||||
proxy: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
const props = defineProps({
|
||||
currFlowForm: {
|
||||
type: Object,
|
||||
default: {},
|
||||
},
|
||||
proxy: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const data = reactive({
|
||||
showInitiateOrder: false,
|
||||
predictFlow: {},
|
||||
currActive: 'form',
|
||||
isPredicted: false,
|
||||
btnLoading: false,
|
||||
predictOptions: [1, 2, 4, 8, 16, 0],
|
||||
currTabComp: null,
|
||||
})
|
||||
const data = reactive({
|
||||
showInitiateOrder: false,
|
||||
predictFlow: {},
|
||||
currActive: 'form',
|
||||
isPredicted: false,
|
||||
btnLoading: false,
|
||||
predictOptions: [1, 2, 4, 8, 16, 0],
|
||||
currTabComp: null,
|
||||
});
|
||||
|
||||
function initClientHeight() {
|
||||
nextTick(() => {
|
||||
let browserHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
||||
let initClientHeight = document.getElementById("predictClientHeight");
|
||||
if (initClientHeight) {
|
||||
initClientHeight.style.height = (browserHeight - initClientHeight.offsetTop) + "px";
|
||||
}
|
||||
let predictFormHeight = document.getElementById("predictFormHeight");
|
||||
if (predictFormHeight) {
|
||||
predictFormHeight.style.height = (browserHeight - predictFormHeight.offsetTop - 20) + "px";
|
||||
}
|
||||
})
|
||||
}
|
||||
function initClientHeight() {
|
||||
nextTick(() => {
|
||||
let browserHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
||||
let initClientHeight = document.getElementById('predictClientHeight');
|
||||
if (initClientHeight) {
|
||||
initClientHeight.style.height = browserHeight - initClientHeight.offsetTop + 'px';
|
||||
}
|
||||
let predictFormHeight = document.getElementById('predictFormHeight');
|
||||
if (predictFormHeight) {
|
||||
predictFormHeight.style.height = browserHeight - predictFormHeight.offsetTop - 20 + 'px';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function initPredictFlow(row) {
|
||||
data.currActive = 'form'
|
||||
data.predictFlow = {defFlowId: row.defFlowId, flowKey: row.flowKey}
|
||||
data.isPredicted = false
|
||||
data.btnLoading = false
|
||||
data.predictOptions = [1, 2, 4, 8, 16, 0]
|
||||
}
|
||||
function initPredictFlow(row) {
|
||||
data.currActive = 'form';
|
||||
data.predictFlow = { defFlowId: row.defFlowId, flowKey: row.flowKey };
|
||||
data.isPredicted = false;
|
||||
data.btnLoading = false;
|
||||
data.predictOptions = [1, 2, 4, 8, 16, 0];
|
||||
}
|
||||
|
||||
async function handleTabClick(tab) {
|
||||
let currActive = data.currActive
|
||||
if (currActive === tab.paneName) return
|
||||
if (currActive === 'form' && tab.paneName !== 'form') {
|
||||
let formData
|
||||
try {
|
||||
formData = await props.proxy.$refs.form.getFormData();
|
||||
} catch (err: any) {
|
||||
// 表单校验报错
|
||||
}
|
||||
if (!formData) {
|
||||
data.currActive = currActive
|
||||
return
|
||||
}
|
||||
}
|
||||
if (tab.paneName === 'flow'){
|
||||
handLoader(true)
|
||||
// 定制化开发工单
|
||||
if (data.predictFlow.defFlowId) {
|
||||
data.isPredicted = true
|
||||
}
|
||||
}
|
||||
if (tab.paneName === 'comment'){
|
||||
handLoader(false)
|
||||
if (!data.predictFlow.flowInstId) {
|
||||
$message.warning('请先点击第二步，完成流程预测');
|
||||
// 不生效
|
||||
data.currActive = currActive
|
||||
return
|
||||
}
|
||||
}
|
||||
data.currActive = tab.paneName
|
||||
}
|
||||
async function handleTabClick(tab) {
|
||||
let currActive = data.currActive;
|
||||
if (currActive === tab.paneName) return;
|
||||
if (currActive === 'form' && tab.paneName !== 'form') {
|
||||
let formData;
|
||||
try {
|
||||
formData = await props.proxy.$refs.form.getFormData();
|
||||
} catch (err: any) {
|
||||
// 表单校验报错
|
||||
}
|
||||
if (!formData) {
|
||||
data.currActive = currActive;
|
||||
return;
|
||||
}
|
||||
}
|
||||
if (tab.paneName === 'flow') {
|
||||
handLoader(true);
|
||||
// 定制化开发工单
|
||||
if (data.predictFlow.defFlowId) {
|
||||
data.isPredicted = true;
|
||||
}
|
||||
}
|
||||
if (tab.paneName === 'comment') {
|
||||
handLoader(false);
|
||||
if (!data.predictFlow.flowInstId) {
|
||||
$message.warning('请先点击第二步，完成流程预测');
|
||||
// 不生效
|
||||
data.currActive = currActive;
|
||||
return;
|
||||
}
|
||||
}
|
||||
data.currActive = tab.paneName;
|
||||
}
|
||||
|
||||
async function submitPredict(isRefresh) {
|
||||
data.isPredicted = false
|
||||
data.btnLoading = true
|
||||
let flowInstId = data.predictFlow.flowInstId;
|
||||
// 流程预测
|
||||
let formData = await props.proxy.$refs.form.getFormData();
|
||||
formData.id = utils.getId()
|
||||
formData.flowInstId = formData.id
|
||||
// 定制化开发工单新增时
|
||||
if (!formData.flowKey) {
|
||||
formData.flowKey = data.predictFlow.flowKey
|
||||
}
|
||||
formData.predictOption = data.predictOptions.reduce((a, b) => a + b, 0);
|
||||
await defFlow.predictFlow(formData, null)
|
||||
.finally(() => {
|
||||
data.btnLoading = false
|
||||
});
|
||||
if (flowInstId) await delFlowInfo(flowInstId)
|
||||
data.predictFlow.flowInstId = formData.flowInstId
|
||||
data.isPredicted = true
|
||||
}
|
||||
async function submitPredict(isRefresh) {
|
||||
data.isPredicted = false;
|
||||
data.btnLoading = true;
|
||||
let flowInstId = data.predictFlow.flowInstId;
|
||||
// 流程预测
|
||||
let formData = await props.proxy.$refs.form.getFormData();
|
||||
formData.id = utils.getId();
|
||||
formData.flowInstId = formData.id;
|
||||
// 定制化开发工单新增时
|
||||
if (!formData.flowKey) {
|
||||
formData.flowKey = data.predictFlow.flowKey;
|
||||
}
|
||||
formData.predictOption = data.predictOptions.reduce((a, b) => a + b, 0);
|
||||
await defFlow.predictFlow(formData, null).finally(() => {
|
||||
data.btnLoading = false;
|
||||
});
|
||||
if (flowInstId) await delFlowInfo(flowInstId);
|
||||
data.predictFlow.flowInstId = formData.flowInstId;
|
||||
data.isPredicted = true;
|
||||
}
|
||||
|
||||
function handleClosed() {
|
||||
$emit('handleInitiateOrder', false)
|
||||
}
|
||||
function handleClosed() {
|
||||
$emit('handleInitiateOrder', false);
|
||||
}
|
||||
|
||||
async function delFlowInfo(flowInstId?) {
|
||||
let row = {id: flowInstId, isPredicted: '1'}
|
||||
await defFlow.delFlowInfo(row)
|
||||
}
|
||||
async function delFlowInfo(flowInstId?) {
|
||||
let row = { id: flowInstId, isPredicted: '1' };
|
||||
await defFlow.delFlowInfo(row);
|
||||
}
|
||||
|
||||
function open(row, bool) {
|
||||
delFlowInfo()
|
||||
initPredictFlow(row)
|
||||
data.showInitiateOrder = bool
|
||||
if (!bool) return
|
||||
initClientHeight()
|
||||
}
|
||||
function open(row, bool) {
|
||||
delFlowInfo();
|
||||
initPredictFlow(row);
|
||||
data.showInitiateOrder = bool;
|
||||
if (!bool) return;
|
||||
initClientHeight();
|
||||
}
|
||||
|
||||
function handLoader(isLoad) {
|
||||
if (isLoad) {
|
||||
let path = orderVue.vueKey.FlowDesignView;
|
||||
data.currTabComp = `../../views${path}.vue`
|
||||
} else data.currTabComp = null
|
||||
}
|
||||
function handLoader(isLoad) {
|
||||
if (isLoad) {
|
||||
let path = orderVue.vueKey.FlowDesignView;
|
||||
data.currTabComp = `../../views${path}.vue`;
|
||||
} else data.currTabComp = null;
|
||||
}
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
open
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
open,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.flow-predict_display {
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
.flow-predict_display_center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
.flow-predict_display {
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
.flow-predict_display_center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,367 +1,367 @@
|
||||
<template>
|
||||
<div id="initClientHeight">
|
||||
<el-container class="flow-container">
|
||||
<el-container>
|
||||
<el-header class="header-view-option">
|
||||
<div class="header-option__buttons" style="color: #409EFF;font-size: 12px; font-weight: 500">
|
||||
<el-button type="success" size="small" circle style="width: 16px; height: 16px"/> 已执行
|
||||
<el-button type="primary" size="small" circle color="#0057FF" style="width: 16px; height: 16px"/> 执行中
|
||||
<el-button type="info" size="small" circle style="width: 16px; height: 16px"/> 未执行
|
||||
</div>
|
||||
<div class="header-option__buttons" v-if="data.globalConfig.isHideShortcut !== '1'">
|
||||
<el-button v-if="!other.isMobile()"
|
||||
style="color: #409EFF;font-size: 12px"
|
||||
@click="methods.exportPNG"
|
||||
class="header-option-button"
|
||||
icon="Download"
|
||||
>下载流程图
|
||||
</el-button>
|
||||
<el-button
|
||||
style="color: #409EFF;font-size: 12px"
|
||||
@click="methods.shortcutHelper"
|
||||
class="header-option-button"
|
||||
icon="QuestionFilled"
|
||||
>快捷键
|
||||
</el-button>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<flow-area-view ref="flowArea"
|
||||
@initJsonFlowView="initJsonFlowView"
|
||||
:currSelect="data.currSelect">
|
||||
</flow-area-view>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
<!-- 快捷入门 -->
|
||||
<shortcut-modal :shortcut="data.shortcut" ref="shortcutModal"></shortcut-modal>
|
||||
</div>
|
||||
<div id="initClientHeight">
|
||||
<el-container class="flow-container">
|
||||
<el-container>
|
||||
<el-header class="header-view-option">
|
||||
<div class="header-option__buttons" style="color: #409eff; font-size: 12px; font-weight: 500">
|
||||
<el-button type="success" size="small" circle style="width: 16px; height: 16px" /> 已执行
|
||||
<el-button type="primary" size="small" circle color="#0057FF" style="width: 16px; height: 16px" /> 执行中
|
||||
<el-button type="info" size="small" circle style="width: 16px; height: 16px" /> 未执行
|
||||
</div>
|
||||
<div class="header-option__buttons" v-if="data.globalConfig.isHideShortcut !== '1'">
|
||||
<el-button
|
||||
v-if="!other.isMobile()"
|
||||
style="color: #409eff; font-size: 12px"
|
||||
@click="methods.exportPNG"
|
||||
class="header-option-button"
|
||||
icon="Download"
|
||||
>下载流程图
|
||||
</el-button>
|
||||
<el-button style="color: #409eff; font-size: 12px" @click="methods.shortcutHelper" class="header-option-button" icon="QuestionFilled"
|
||||
>快捷键
|
||||
</el-button>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<flow-area-view ref="flowArea" @initJsonFlowView="initJsonFlowView" :currSelect="data.currSelect"> </flow-area-view>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
<!-- 快捷入门 -->
|
||||
<shortcut-modal :shortcut="data.shortcut" ref="shortcutModal"></shortcut-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="JsonFlowView">
|
||||
import {flowConfig} from "/@/flow/designer/config/flow-config";
|
||||
import * as other from "/@/utils/other";
|
||||
import {CommonNodeType, HighNodeType, LaneNodeType} from "/@/flow/designer/config/type";
|
||||
import * as defFlow from '/@/flow/designer/api/jsonflow'
|
||||
import * as nodeConfig from "/@/flow/designer/config/node-config";
|
||||
import JsonflowDesign from "@jackrolling/jsonflow3"
|
||||
import {nodeJobSvgIcons} from "/@/flow/designer/assets/svges/path";
|
||||
import {useI18n} from "vue-i18n"
|
||||
import {notifyLeft} from "/@/flow";
|
||||
import {useMessage} from "/@/hooks/message";
|
||||
import {validateNull} from "/@/utils/validate";
|
||||
import {initJsonFlowViewByApp} from "/@/flow/support/extend";
|
||||
import {hideVueContextmenuName, initFlowDesignHeight} from "/@/flow/utils";
|
||||
import { flowConfig } from '/@/flow/designer/config/flow-config';
|
||||
import * as other from '/@/utils/other';
|
||||
import { CommonNodeType, HighNodeType, LaneNodeType } from '/@/flow/designer/config/type';
|
||||
import * as defFlow from '/@/flow/designer/api/jsonflow';
|
||||
import * as nodeConfig from '/@/flow/designer/config/node-config';
|
||||
import JsonflowDesign from '@jackrolling/jsonflow3';
|
||||
import { nodeJobSvgIcons } from '/@/flow/designer/assets/svges/path';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { notifyLeft } from '/@/flow';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { validateNull } from '/@/utils/validate';
|
||||
import { initJsonFlowViewByApp } from '/@/flow/support/extend';
|
||||
import { hideVueContextmenuName, initFlowDesignHeight } from '/@/flow/utils';
|
||||
|
||||
const {t} = useI18n();
|
||||
const $route = useRoute();
|
||||
const {proxy} = getCurrentInstance();
|
||||
const $message = useMessage();
|
||||
// 引入组件
|
||||
const FlowAreaView = defineAsyncComponent(() => import('/@/flow/designer/components/flow-area-view.vue'));
|
||||
const ShortcutModal = defineAsyncComponent(() => import('/@/flow/designer/views/shortcut.vue'));
|
||||
const { t } = useI18n();
|
||||
const $route = useRoute();
|
||||
const { proxy } = getCurrentInstance();
|
||||
const $message = useMessage();
|
||||
// 引入组件
|
||||
const FlowAreaView = defineAsyncComponent(() => import('/@/flow/designer/components/flow-area-view.vue'));
|
||||
const ShortcutModal = defineAsyncComponent(() => import('/@/flow/designer/views/shortcut.vue'));
|
||||
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: {},
|
||||
}
|
||||
});
|
||||
const data = reactive({
|
||||
globalConfig: flowConfig.globalConfig,
|
||||
globalValue: {},
|
||||
flowData: other.deepClone(flowConfig.flowData),
|
||||
gridConfig: flowConfig.gridConfig,
|
||||
shortcut: flowConfig.viewShortcut,
|
||||
comments: {},
|
||||
runJobs: {},
|
||||
currSelect: {}
|
||||
})
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: {},
|
||||
},
|
||||
});
|
||||
const data = reactive({
|
||||
globalConfig: flowConfig.globalConfig,
|
||||
globalValue: {},
|
||||
flowData: other.deepClone(flowConfig.flowData),
|
||||
gridConfig: flowConfig.gridConfig,
|
||||
shortcut: flowConfig.viewShortcut,
|
||||
comments: {},
|
||||
runJobs: {},
|
||||
currSelect: {},
|
||||
});
|
||||
|
||||
const methods = {
|
||||
removeEleTools() {
|
||||
window._jfOperate.removeEleTools()
|
||||
methods.clearCurrSelect();
|
||||
hideVueContextmenuName()
|
||||
},
|
||||
initClientHeight() {
|
||||
nextTick(() => {
|
||||
let browserHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
||||
initFlowDesignHeight($route, browserHeight)
|
||||
})
|
||||
},
|
||||
// 初始化流程
|
||||
initFlow(currFlowId?: any, callback?: Function) {
|
||||
let flowType = '0'
|
||||
// 判断编辑
|
||||
if (!currFlowId && props.currJob) {
|
||||
currFlowId = props.currJob.defFlowId
|
||||
let flowInstId = props.currJob.flowInstId;
|
||||
if (flowInstId) {
|
||||
currFlowId = flowInstId
|
||||
flowType = '1'
|
||||
}
|
||||
}
|
||||
if (currFlowId) {
|
||||
defFlow.getNodesByIdType(currFlowId, flowType, '0').then(resp => {
|
||||
let defFlowData = resp.data
|
||||
if (!defFlowData.attrs) {
|
||||
notifyLeft('当前流程信息不存在')
|
||||
} else if (!validateNull(defFlowData.nodeList)) {
|
||||
methods.loadFlow(defFlowData, callback);
|
||||
}
|
||||
}).catch((e) => {
|
||||
$message.error("获取流程信息失败");
|
||||
console.error(e)
|
||||
})
|
||||
}
|
||||
},
|
||||
handleNodeListInfo(loadData) {
|
||||
let flowNodes = loadData.graph.cells.filter(f => f.attrs.cdata.type !== CommonNodeType.LINK);
|
||||
flowNodes.forEach(node => {
|
||||
if (node.attrs.cdata.type === LaneNodeType.X_LANE || node.attrs.cdata.type === LaneNodeType.Y_LANE) {
|
||||
return
|
||||
}
|
||||
let status = loadData.attrs.status;
|
||||
if (node.ports && node.ports.items.length > 0) {
|
||||
node.ports.items.forEach(each => {
|
||||
methods.doNodeListInfo(each, true, false, status);
|
||||
})
|
||||
}
|
||||
let isJobSeparated = '0'
|
||||
if (loadData.attrs) isJobSeparated = loadData.attrs.isJobSeparated
|
||||
methods.doNodeListInfo(node, false, isJobSeparated, status);
|
||||
})
|
||||
methods.handleLinkListInfo(loadData, flowNodes)
|
||||
},
|
||||
handleLinkListInfo(loadData, flowNodes) {
|
||||
loadData.graph.cells.filter(f => f.attrs.cdata.type === CommonNodeType.LINK)
|
||||
.forEach(link => {
|
||||
let stroke;
|
||||
let source = flowNodes.find(f => f.id === link.source.id);
|
||||
let target = flowNodes.find(f => f.id === link.target.id);
|
||||
let idNodeJob = target.attrs.cdata.type === HighNodeType.JOB;
|
||||
if (!idNodeJob) {
|
||||
let exists = data.runRejects.filter(f => source.attrs.cdata.attrs.runNodeId === f.fromRunNodeId &&
|
||||
target.attrs.cdata.attrs.runNodeId === f.toRunNodeId);
|
||||
if (validateNull(exists)) return
|
||||
}
|
||||
if (source.status === '1' && (target.status === '0' || target.status === '9')) {
|
||||
stroke = '#0057FF'
|
||||
} else if (source.status === '1' && target.status === '1') {
|
||||
stroke = 'green'
|
||||
}
|
||||
if (stroke) {
|
||||
if (link.attrs.line) link.attrs.line.stroke = stroke
|
||||
else link.attrs.line = {'stroke': stroke}
|
||||
}
|
||||
})
|
||||
},
|
||||
doNodeListInfo(node, isPort, isJobSeparated, status) {
|
||||
let findComments = data.comments.filter(f => f.flowNodeId === node.id || f.nodeJobId === node.id);
|
||||
if (!validateNull(findComments)) {
|
||||
methods.updateNodeContMenuData(findComments, isPort ? node.attributes : node, node, isPort, isJobSeparated, true)
|
||||
} else {
|
||||
let findRunJobs = data.runJobs.filter(f => f.flowNodeId === node.id || f.nodeJobId === node.id);
|
||||
if (!validateNull(findRunJobs)) {
|
||||
if (status === '1') {
|
||||
findRunJobs.forEach(each => {
|
||||
if (each.status === '0' || each.status === '2' || each.status === '9') each.status = '-1'
|
||||
})
|
||||
}
|
||||
methods.updateNodeContMenuData(findRunJobs, isPort ? node.attributes : node, node, isPort, isJobSeparated, false)
|
||||
} else {
|
||||
node = isPort ? node.attributes : node
|
||||
let startTimeBtnName = flowConfig.contextMenu.nodeView.menulists[1].btnName;
|
||||
node.startTime = startTimeBtnName + '节点信息有误,请核实'
|
||||
let userRoleBtnName = flowConfig.contextMenu.nodeView.menulists[2].btnName;
|
||||
node.userRoleName = userRoleBtnName + ''
|
||||
let userBtnName = flowConfig.contextMenu.nodeView.menulists[3].btnName;
|
||||
node.userName = userBtnName + ''
|
||||
let remarkBtnName = flowConfig.contextMenu.nodeView.menulists[4].btnName;
|
||||
node.remark = remarkBtnName + ''
|
||||
}
|
||||
}
|
||||
},
|
||||
updateNodeContMenuData(findNodes, node, source, isPort, isJobSeparated, isComment) {
|
||||
let startTimeBtnName = flowConfig.contextMenu.nodeView.menulists[1].btnName;
|
||||
let userRoleBtnName = flowConfig.contextMenu.nodeView.menulists[2].btnName;
|
||||
let userBtnName = flowConfig.contextMenu.nodeView.menulists[3].btnName;
|
||||
let remarkBtnName = flowConfig.contextMenu.nodeView.menulists[4].btnName;
|
||||
const methods = {
|
||||
removeEleTools() {
|
||||
window._jfOperate.removeEleTools();
|
||||
methods.clearCurrSelect();
|
||||
hideVueContextmenuName();
|
||||
},
|
||||
initClientHeight() {
|
||||
nextTick(() => {
|
||||
let browserHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
||||
initFlowDesignHeight($route, browserHeight);
|
||||
});
|
||||
},
|
||||
// 初始化流程
|
||||
initFlow(currFlowId?: any, callback?: Function) {
|
||||
let flowType = '0';
|
||||
// 判断编辑
|
||||
if (!currFlowId && props.currJob) {
|
||||
currFlowId = props.currJob.defFlowId;
|
||||
let flowInstId = props.currJob.flowInstId;
|
||||
if (flowInstId) {
|
||||
currFlowId = flowInstId;
|
||||
flowType = '1';
|
||||
}
|
||||
}
|
||||
if (currFlowId) {
|
||||
defFlow
|
||||
.getNodesByIdType(currFlowId, flowType, '0')
|
||||
.then((resp) => {
|
||||
let defFlowData = resp.data;
|
||||
if (!defFlowData.attrs) {
|
||||
notifyLeft('当前流程信息不存在');
|
||||
} else if (!validateNull(defFlowData.nodeList)) {
|
||||
methods.loadFlow(defFlowData, callback);
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
$message.error('获取流程信息失败');
|
||||
console.error(e);
|
||||
});
|
||||
}
|
||||
},
|
||||
handleNodeListInfo(loadData) {
|
||||
let flowNodes = loadData.graph.cells.filter((f) => f.attrs.cdata.type !== CommonNodeType.LINK);
|
||||
flowNodes.forEach((node) => {
|
||||
if (node.attrs.cdata.type === LaneNodeType.X_LANE || node.attrs.cdata.type === LaneNodeType.Y_LANE) {
|
||||
return;
|
||||
}
|
||||
let status = loadData.attrs.status;
|
||||
if (node.ports && node.ports.items.length > 0) {
|
||||
node.ports.items.forEach((each) => {
|
||||
methods.doNodeListInfo(each, true, false, status);
|
||||
});
|
||||
}
|
||||
let isJobSeparated = '0';
|
||||
if (loadData.attrs) isJobSeparated = loadData.attrs.isJobSeparated;
|
||||
methods.doNodeListInfo(node, false, isJobSeparated, status);
|
||||
});
|
||||
methods.handleLinkListInfo(loadData, flowNodes);
|
||||
},
|
||||
handleLinkListInfo(loadData, flowNodes) {
|
||||
loadData.graph.cells
|
||||
.filter((f) => f.attrs.cdata.type === CommonNodeType.LINK)
|
||||
.forEach((link) => {
|
||||
let stroke;
|
||||
let source = flowNodes.find((f) => f.id === link.source.id);
|
||||
let target = flowNodes.find((f) => f.id === link.target.id);
|
||||
let idNodeJob = target.attrs.cdata.type === HighNodeType.JOB;
|
||||
if (!idNodeJob) {
|
||||
let exists = data.runRejects.filter(
|
||||
(f) => source.attrs.cdata.attrs.runNodeId === f.fromRunNodeId && target.attrs.cdata.attrs.runNodeId === f.toRunNodeId
|
||||
);
|
||||
if (validateNull(exists)) return;
|
||||
}
|
||||
if (source.status === '1' && (target.status === '0' || target.status === '9')) {
|
||||
stroke = '#0057FF';
|
||||
} else if (source.status === '1' && target.status === '1') {
|
||||
stroke = 'green';
|
||||
}
|
||||
if (stroke) {
|
||||
if (link.attrs.line) link.attrs.line.stroke = stroke;
|
||||
else link.attrs.line = { stroke: stroke };
|
||||
}
|
||||
});
|
||||
},
|
||||
doNodeListInfo(node, isPort, isJobSeparated, status) {
|
||||
let findComments = data.comments.filter((f) => f.flowNodeId === node.id || f.nodeJobId === node.id);
|
||||
if (!validateNull(findComments)) {
|
||||
methods.updateNodeContMenuData(findComments, isPort ? node.attributes : node, node, isPort, isJobSeparated, true);
|
||||
} else {
|
||||
let findRunJobs = data.runJobs.filter((f) => f.flowNodeId === node.id || f.nodeJobId === node.id);
|
||||
if (!validateNull(findRunJobs)) {
|
||||
if (status === '1') {
|
||||
findRunJobs.forEach((each) => {
|
||||
if (each.status === '0' || each.status === '2' || each.status === '9') each.status = '-1';
|
||||
});
|
||||
}
|
||||
methods.updateNodeContMenuData(findRunJobs, isPort ? node.attributes : node, node, isPort, isJobSeparated, false);
|
||||
} else {
|
||||
node = isPort ? node.attributes : node;
|
||||
let startTimeBtnName = flowConfig.contextMenu.nodeView.menulists[1].btnName;
|
||||
node.startTime = startTimeBtnName + '节点信息有误,请核实';
|
||||
let userRoleBtnName = flowConfig.contextMenu.nodeView.menulists[2].btnName;
|
||||
node.userRoleName = userRoleBtnName + '';
|
||||
let userBtnName = flowConfig.contextMenu.nodeView.menulists[3].btnName;
|
||||
node.userName = userBtnName + '';
|
||||
let remarkBtnName = flowConfig.contextMenu.nodeView.menulists[4].btnName;
|
||||
node.remark = remarkBtnName + '';
|
||||
}
|
||||
}
|
||||
},
|
||||
updateNodeContMenuData(findNodes, node, source, isPort, isJobSeparated, isComment) {
|
||||
let startTimeBtnName = flowConfig.contextMenu.nodeView.menulists[1].btnName;
|
||||
let userRoleBtnName = flowConfig.contextMenu.nodeView.menulists[2].btnName;
|
||||
let userBtnName = flowConfig.contextMenu.nodeView.menulists[3].btnName;
|
||||
let remarkBtnName = flowConfig.contextMenu.nodeView.menulists[4].btnName;
|
||||
|
||||
if (findNodes.find(f => f.status === '-3')) node.status = '-3'
|
||||
else if (findNodes.find(f => f.status === '-2')) node.status = '-2'
|
||||
else if (findNodes.find(f => f.status === '0' || f.status === '9' || f.subFlowStatus === '0')) node.status = '0'
|
||||
else if (findNodes.find(f => f.status === '2')) node.status = '2'
|
||||
else if (findNodes.find(f => f.status === '1')) node.status = '1'
|
||||
else if (findNodes.find(f => f.status === '3')) node.status = '3'
|
||||
else if (findNodes.every(f => f.status === '-1')) node.status = '-1'
|
||||
if (findNodes.find((f) => f.status === '-3')) node.status = '-3';
|
||||
else if (findNodes.find((f) => f.status === '-2')) node.status = '-2';
|
||||
else if (findNodes.find((f) => f.status === '0' || f.status === '9' || f.subFlowStatus === '0')) node.status = '0';
|
||||
else if (findNodes.find((f) => f.status === '2')) node.status = '2';
|
||||
else if (findNodes.find((f) => f.status === '1')) node.status = '1';
|
||||
else if (findNodes.find((f) => f.status === '3')) node.status = '3';
|
||||
else if (findNodes.every((f) => f.status === '-1')) node.status = '-1';
|
||||
|
||||
findNodes.sort((a, b) => b.createTime - a.createTime);
|
||||
let length = findNodes.length;
|
||||
findNodes.forEach((f, index) => {
|
||||
let comma = index > 0 ? '，' : '';
|
||||
let startTime = node.startTime ? node.startTime : '';
|
||||
if (f.status === '3') node.startTime = startTime + comma + (f.startTime ? f.startTime : '已被跳过节点或任务')
|
||||
else node.startTime = startTime + comma + (f.startTime ? f.startTime : '未开始')
|
||||
if (length === index + 1) node.startTime = startTimeBtnName + node.startTime
|
||||
findNodes.sort((a, b) => b.createTime - a.createTime);
|
||||
let length = findNodes.length;
|
||||
findNodes.forEach((f, index) => {
|
||||
let comma = index > 0 ? '，' : '';
|
||||
let startTime = node.startTime ? node.startTime : '';
|
||||
if (f.status === '3') node.startTime = startTime + comma + (f.startTime ? f.startTime : '已被跳过节点或任务');
|
||||
else node.startTime = startTime + comma + (f.startTime ? f.startTime : '未开始');
|
||||
if (length === index + 1) node.startTime = startTimeBtnName + node.startTime;
|
||||
|
||||
let userName = f.userName, userRoleName = '', userBtnName2 = ''
|
||||
if (userName) userBtnName2 += userName
|
||||
let roleName = f.roleName;
|
||||
if (roleName) userRoleName += roleName
|
||||
node.userRoleName = (node.userRoleName ? node.userRoleName : '') + comma + (roleName ? userRoleName : '无')
|
||||
node.userName = (node.userName ? node.userName : '') + comma + (userName ? userBtnName2 : '无')
|
||||
if (length === index + 1) node.userRoleName = userRoleBtnName + node.userRoleName
|
||||
if (length === index + 1) node.userName = userBtnName + node.userName
|
||||
let userName = f.userName,
|
||||
userRoleName = '',
|
||||
userBtnName2 = '';
|
||||
if (userName) userBtnName2 += userName;
|
||||
let roleName = f.roleName;
|
||||
if (roleName) userRoleName += roleName;
|
||||
node.userRoleName = (node.userRoleName ? node.userRoleName : '') + comma + (roleName ? userRoleName : '无');
|
||||
node.userName = (node.userName ? node.userName : '') + comma + (userName ? userBtnName2 : '无');
|
||||
if (length === index + 1) node.userRoleName = userRoleBtnName + node.userRoleName;
|
||||
if (length === index + 1) node.userName = userBtnName + node.userName;
|
||||
|
||||
let remark = node.remark ? node.remark : '';
|
||||
if (f.status === '-3') node.remark = remark + comma + '已终止'
|
||||
else if (f.status === '-2') node.remark = remark + comma + '已作废'
|
||||
else if (f.status === '0') node.remark = remark + comma + '正在审批中'
|
||||
else if (f.subFlowStatus === '0') node.remark = remark + comma + '子流程中'
|
||||
else if (f.status === '9') node.remark = remark + comma + '被驳回中'
|
||||
else if (f.status === '1' && (!f.userId || !isComment)) node.remark = remark + comma + (f.remark ? f.remark : '由【他人】审批')
|
||||
else if (f.status === '1') node.remark = remark + comma + (f.remark ? f.remark : '已审批')
|
||||
else if (f.status === '2') node.remark = remark + comma + '驳回中'
|
||||
else if (f.status === '-1') node.remark = remark + comma + '未审批'
|
||||
else if (f.status === '3') node.remark = remark + comma + '已被跳过'
|
||||
let remark = node.remark ? node.remark : '';
|
||||
if (f.status === '-3') node.remark = remark + comma + '已终止';
|
||||
else if (f.status === '-2') node.remark = remark + comma + '已作废';
|
||||
else if (f.status === '0') node.remark = remark + comma + '正在审批中';
|
||||
else if (f.subFlowStatus === '0') node.remark = remark + comma + '子流程中';
|
||||
else if (f.status === '9') node.remark = remark + comma + '被驳回中';
|
||||
else if (f.status === '1' && (!f.userId || !isComment)) node.remark = remark + comma + (f.remark ? f.remark : '由【他人】审批');
|
||||
else if (f.status === '1') node.remark = remark + comma + (f.remark ? f.remark : '已审批');
|
||||
else if (f.status === '2') node.remark = remark + comma + '驳回中';
|
||||
else if (f.status === '-1') node.remark = remark + comma + '未审批';
|
||||
else if (f.status === '3') node.remark = remark + comma + '已被跳过';
|
||||
|
||||
if (length === index + 1) node.remark = remarkBtnName + node.remark
|
||||
})
|
||||
if (length === index + 1) node.remark = remarkBtnName + node.remark;
|
||||
});
|
||||
|
||||
if (node.status === '-1') return
|
||||
methods.updateNodeJobSeparated(node.status, node, source, isPort, isJobSeparated)
|
||||
},
|
||||
updateNodeJobSeparated(status, node, source, isPort, isJobSeparated) {
|
||||
let icon;
|
||||
let stroke;
|
||||
if (status === '-3' || status === '-2' || status === '3') {
|
||||
icon = {xlinkHref: nodeJobSvgIcons.warning}
|
||||
} else if (status === '0' || status === '9') {
|
||||
icon = {xlinkHref: nodeJobSvgIcons.loading}
|
||||
stroke = '#0057FF'
|
||||
} else if (status === '1') {
|
||||
icon = {xlinkHref: nodeJobSvgIcons.success}
|
||||
stroke = 'green'
|
||||
}
|
||||
if (stroke) {
|
||||
if (source.attrs.body) source.attrs.body.stroke = stroke
|
||||
else source.attrs.body = {'stroke': stroke}
|
||||
}
|
||||
if (source.attrs.cdata && (source.attrs.cdata.type === CommonNodeType.SERIAL || source.attrs.cdata.type === CommonNodeType.PARALLEL)) {
|
||||
if (source.attrs.cdata.attrs.isGateway === '1') return
|
||||
if (isJobSeparated !== '1') {
|
||||
if (icon) source.attrs.icon = icon
|
||||
} else {
|
||||
if (icon) source.attrs.image = icon
|
||||
}
|
||||
} else if (icon) {
|
||||
isPort ? source.attrs.portImage = icon : source.attrs.image = icon
|
||||
}
|
||||
},
|
||||
// 加载流程
|
||||
loadFlow(loadData, callback) {
|
||||
if (node.status === '-1') return;
|
||||
methods.updateNodeJobSeparated(node.status, node, source, isPort, isJobSeparated);
|
||||
},
|
||||
updateNodeJobSeparated(status, node, source, isPort, isJobSeparated) {
|
||||
let icon;
|
||||
let stroke;
|
||||
if (status === '-3' || status === '-2' || status === '3') {
|
||||
icon = { xlinkHref: nodeJobSvgIcons.warning };
|
||||
} else if (status === '0' || status === '9') {
|
||||
icon = { xlinkHref: nodeJobSvgIcons.loading };
|
||||
stroke = '#0057FF';
|
||||
} else if (status === '1') {
|
||||
icon = { xlinkHref: nodeJobSvgIcons.success };
|
||||
stroke = 'green';
|
||||
}
|
||||
if (stroke) {
|
||||
if (source.attrs.body) source.attrs.body.stroke = stroke;
|
||||
else source.attrs.body = { stroke: stroke };
|
||||
}
|
||||
if (source.attrs.cdata && (source.attrs.cdata.type === CommonNodeType.SERIAL || source.attrs.cdata.type === CommonNodeType.PARALLEL)) {
|
||||
if (source.attrs.cdata.attrs.isGateway === '1') return;
|
||||
if (isJobSeparated !== '1') {
|
||||
if (icon) source.attrs.icon = icon;
|
||||
} else {
|
||||
if (icon) source.attrs.image = icon;
|
||||
}
|
||||
} else if (icon) {
|
||||
isPort ? (source.attrs.portImage = icon) : (source.attrs.image = icon);
|
||||
}
|
||||
},
|
||||
// 加载流程
|
||||
loadFlow(loadData, callback) {
|
||||
window._jfOperate.reInitFlowSetting(data.flowData, loadData, data);
|
||||
window._shapes = nodeConfig.initNodeShapes();
|
||||
window._jfOperate.handleGraphCells(loadData, 'id');
|
||||
|
||||
window._jfOperate.reInitFlowSetting(data.flowData, loadData, data)
|
||||
window._shapes = nodeConfig.initNodeShapes();
|
||||
window._jfOperate.handleGraphCells(loadData, 'id');
|
||||
methods.handleFlowNodeListInfo(loadData, () => {
|
||||
data.flowData.attrs = loadData.attrs;
|
||||
window._jfGraph.fromJSON(loadData.graph);
|
||||
if (callback) callback();
|
||||
});
|
||||
},
|
||||
handleFlowNodeListInfo(loadData, call) {
|
||||
// 流程节点实例
|
||||
let flowInstId = props.currJob.flowInstId;
|
||||
if (!flowInstId) {
|
||||
if (call) call(loadData);
|
||||
return;
|
||||
}
|
||||
defFlow.fetchComment({ flowInstId: flowInstId }).then((resp) => {
|
||||
data.comments = resp.data;
|
||||
defFlow.fetchRunJobs(flowInstId).then((resp) => {
|
||||
data.runJobs = resp.data;
|
||||
defFlow.fetchRunRejects(flowInstId).then((resp) => {
|
||||
data.runRejects = resp.data;
|
||||
// 处理节点信息
|
||||
methods.handleNodeListInfo(loadData);
|
||||
if (call) call(loadData);
|
||||
});
|
||||
});
|
||||
});
|
||||
},
|
||||
// 检测
|
||||
checkFlow() {
|
||||
let nodes = window._jfGraph.getElements();
|
||||
if (nodes.length <= 0) {
|
||||
$message.warning('流程无任何节点');
|
||||
return false;
|
||||
}
|
||||
let links = window._jfGraph.getLinks();
|
||||
if (links.length <= 0) {
|
||||
$message.warning('流程无任何连线');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
// 清除画布
|
||||
clearAll() {
|
||||
methods.removeEleTools();
|
||||
data.flowData.nodeList = [];
|
||||
data.flowData.linkList = [];
|
||||
window._jfGraph.clear();
|
||||
},
|
||||
setCurrSelect(curr) {
|
||||
data.currSelect = curr;
|
||||
},
|
||||
exportPNG() {
|
||||
window._jfOperate.exportPNG();
|
||||
},
|
||||
clearCurrSelect() {
|
||||
data.currSelect = {};
|
||||
},
|
||||
// 快捷入门
|
||||
shortcutHelper() {
|
||||
proxy.$refs.shortcutModal.open();
|
||||
},
|
||||
$refs() {
|
||||
return proxy.$refs;
|
||||
},
|
||||
};
|
||||
|
||||
methods.handleFlowNodeListInfo(loadData, () => {
|
||||
data.flowData.attrs = loadData.attrs;
|
||||
window._jfGraph.fromJSON(loadData.graph)
|
||||
if (callback) callback()
|
||||
})
|
||||
},
|
||||
handleFlowNodeListInfo(loadData, call) {
|
||||
// 流程节点实例
|
||||
let flowInstId = props.currJob.flowInstId;
|
||||
if (!flowInstId) {
|
||||
if (call) call(loadData)
|
||||
return
|
||||
}
|
||||
defFlow.fetchComment({flowInstId: flowInstId}).then(resp => {
|
||||
data.comments = resp.data
|
||||
defFlow.fetchRunJobs(flowInstId).then(resp => {
|
||||
data.runJobs = resp.data
|
||||
defFlow.fetchRunRejects(flowInstId).then(resp => {
|
||||
data.runRejects = resp.data
|
||||
// 处理节点信息
|
||||
methods.handleNodeListInfo(loadData)
|
||||
if (call) call(loadData)
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
// 检测
|
||||
checkFlow() {
|
||||
let nodes = window._jfGraph.getElements();
|
||||
if (nodes.length <= 0) {
|
||||
$message.warning("流程无任何节点");
|
||||
return false;
|
||||
}
|
||||
let links = window._jfGraph.getLinks();
|
||||
if (links.length <= 0) {
|
||||
$message.warning("流程无任何连线");
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
// 清除画布
|
||||
clearAll() {
|
||||
methods.removeEleTools()
|
||||
data.flowData.nodeList = [];
|
||||
data.flowData.linkList = [];
|
||||
window._jfGraph.clear();
|
||||
},
|
||||
setCurrSelect(curr) {
|
||||
data.currSelect = curr
|
||||
},
|
||||
exportPNG() {
|
||||
window._jfOperate.exportPNG()
|
||||
},
|
||||
clearCurrSelect() {
|
||||
data.currSelect = {}
|
||||
},
|
||||
// 快捷入门
|
||||
shortcutHelper() {
|
||||
proxy.$refs.shortcutModal.open();
|
||||
},
|
||||
$refs() {
|
||||
return proxy.$refs;
|
||||
}
|
||||
}
|
||||
const exposeObj = {
|
||||
gridConfig: data.gridConfig,
|
||||
globalValue: data.globalValue,
|
||||
setCurrSelect: methods.setCurrSelect,
|
||||
clearCurrSelect: methods.clearCurrSelect,
|
||||
removeEleTools: methods.removeEleTools,
|
||||
notifyLeft: notifyLeft,
|
||||
$refs: methods.$refs,
|
||||
currJob: props.currJob,
|
||||
};
|
||||
|
||||
const exposeObj = {
|
||||
gridConfig: data.gridConfig,
|
||||
globalValue: data.globalValue,
|
||||
setCurrSelect: methods.setCurrSelect,
|
||||
clearCurrSelect: methods.clearCurrSelect,
|
||||
removeEleTools: methods.removeEleTools,
|
||||
notifyLeft: notifyLeft,
|
||||
$refs: methods.$refs,
|
||||
currJob: props.currJob
|
||||
}
|
||||
function initJsonFlowView() {
|
||||
// 兼容移动端
|
||||
initJsonFlowViewByApp($route, props);
|
||||
// 实例化
|
||||
window._shapes = nodeConfig.initNodeShapes();
|
||||
JsonflowDesign.initFlow.initJsonFlowView(exposeObj);
|
||||
// 初始化流程图
|
||||
methods.initFlow();
|
||||
}
|
||||
|
||||
function initJsonFlowView() {
|
||||
// 兼容移动端
|
||||
initJsonFlowViewByApp($route, props)
|
||||
// 实例化
|
||||
window._shapes = nodeConfig.initNodeShapes();
|
||||
JsonflowDesign.initFlow.initJsonFlowView(exposeObj);
|
||||
// 初始化流程图
|
||||
methods.initFlow();
|
||||
}
|
||||
|
||||
onBeforeMount(() => {
|
||||
window._flowConfig = flowConfig
|
||||
window._eleTools = JsonflowDesign.eleTools.initEleTools(exposeObj);
|
||||
})
|
||||
onMounted(() => {
|
||||
methods.initClientHeight();
|
||||
})
|
||||
onBeforeMount(() => {
|
||||
window._flowConfig = flowConfig;
|
||||
window._eleTools = JsonflowDesign.eleTools.initEleTools(exposeObj);
|
||||
});
|
||||
onMounted(() => {
|
||||
methods.initClientHeight();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/designer/assets/style/flow-designer.scss";
|
||||
@import '../../../flow/designer/assets/style/flow-designer.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,282 +1,292 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.type')" prop="type">
|
||||
<el-select v-model="form.type" :placeholder="t('flowrule.inputTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_RULE_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.type')" prop="type">
|
||||
<el-select v-model="form.type" :placeholder="t('flowrule.inputTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_RULE_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.valType')" prop="type">
|
||||
<el-select v-model="form.valType" :placeholder="t('flowrule.inputValTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.VAL_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('flowrule.inputDefFlowIdTip')" clearable filterable
|
||||
@change="cascadeChange('defFlowId', ['flowNodeId', 'flowNodeRelId'])">
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="form.flowNodeId" :placeholder="t('flowrule.inputFlowNodeIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.valType')" prop="type">
|
||||
<el-select v-model="form.valType" :placeholder="t('flowrule.inputValTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.VAL_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.flowNodeRelId')" prop="flowNodeRelId">
|
||||
<el-select v-model="form.flowNodeRelId" :placeholder="t('flowrule.inputFlowNodeRelIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeRelId" :key="index" :label="item.label" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.defFlowId')" prop="defFlowId">
|
||||
<el-select
|
||||
v-model="form.defFlowId"
|
||||
:placeholder="t('flowrule.inputDefFlowIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('defFlowId', ['flowNodeId', 'flowNodeRelId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="form.flowNodeId" :placeholder="t('flowrule.inputFlowNodeIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.groupId')" prop="groupId">
|
||||
<el-input v-model="form.groupId" :placeholder="t('flowrule.inputGroupIdTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.groupsType')" prop="groupsType">
|
||||
<el-switch
|
||||
v-model="form.groupsType"
|
||||
active-value="0"
|
||||
inactive-value="1"
|
||||
inactive-text="或"
|
||||
active-text="且">
|
||||
</el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.groupType')" prop="groupType">
|
||||
<el-switch
|
||||
v-model="form.groupType"
|
||||
active-value="0"
|
||||
inactive-value="1"
|
||||
inactive-text="或"
|
||||
active-text="且">
|
||||
</el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.varKeyVal')" prop="varKeyVal">
|
||||
<el-input v-model="form.varKeyVal" :placeholder="t('flowrule.inputVarKeyValTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.flowNodeRelId')" prop="flowNodeRelId">
|
||||
<el-select v-model="form.flowNodeRelId" :placeholder="t('flowrule.inputFlowNodeRelIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeRelId" :key="index" :label="item.label" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.operator')" prop="operator">
|
||||
<el-select v-model="form.operator" :placeholder="t('flowrule.inputOperatorTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.OPERATOR" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.varVal')" prop="varVal">
|
||||
<el-input v-model="form.varVal" :placeholder="t('flowrule.inputVarValTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.groupId')" prop="groupId">
|
||||
<el-input v-model="form.groupId" :placeholder="t('flowrule.inputGroupIdTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.groupsType')" prop="groupsType">
|
||||
<el-switch v-model="form.groupsType" active-value="0" inactive-value="1" inactive-text="或" active-text="且"> </el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.groupType')" prop="groupType">
|
||||
<el-switch v-model="form.groupType" active-value="0" inactive-value="1" inactive-text="或" active-text="且"> </el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.varKeyVal')" prop="varKeyVal">
|
||||
<el-input v-model="form.varKeyVal" :placeholder="t('flowrule.inputVarKeyValTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.jobType')" prop="jobType">
|
||||
<el-select v-model="form.jobType" :placeholder="t('flowrule.inputJobTypeTip')" clearable filterable
|
||||
@change="handleRoleType">
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.operator')" prop="operator">
|
||||
<el-select v-model="form.operator" :placeholder="t('flowrule.inputOperatorTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.OPERATOR" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.varVal')" prop="varVal">
|
||||
<el-input v-model="form.varVal" :placeholder="t('flowrule.inputVarValTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.roleId')" prop="roleId">
|
||||
<el-select v-model="form.roleId" :placeholder="t('flowrule.inputRoleIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[0].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.roles" :key="index" :label="item.roleName" :value="item.roleId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[1].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.posts" :key="index" :label="item.postName" :value="item.postId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[2].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.depts" :key="index" :label="item.name" :value="item.deptId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[3].value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.jobType')" prop="jobType">
|
||||
<el-select v-model="form.jobType" :placeholder="t('flowrule.inputJobTypeTip')" clearable filterable @change="handleRoleType">
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.paramFrom')" prop="paramFrom">
|
||||
<el-select v-model="form.paramFrom" :placeholder="t('flowrule.inputParamFromTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_FROM" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.paramValType')" prop="paramValType">
|
||||
<el-select v-model="form.paramValType" :placeholder="t('flowrule.inputParamValTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_VAL_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.targetProp')" prop="targetProp">
|
||||
<el-input v-model="form.targetProp" :placeholder="t('flowrule.inputTargetPropTip')"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.paramType')" prop="paramType">
|
||||
<el-select v-model="form.paramType" :placeholder="t('flowrule.inputParamTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_TYPES" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.roleId')" prop="roleId">
|
||||
<el-select v-model="form.roleId" :placeholder="t('flowrule.inputRoleIdTip')" clearable filterable>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.users"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.userId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[0].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.roles"
|
||||
:key="index"
|
||||
:label="item.roleName"
|
||||
:value="item.roleId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[1].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.posts"
|
||||
:key="index"
|
||||
:label="item.postName"
|
||||
:value="item.postId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[2].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.depts"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.deptId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[3].value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.paramFrom')" prop="paramFrom">
|
||||
<el-select v-model="form.paramFrom" :placeholder="t('flowrule.inputParamFromTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_FROM" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.paramValType')" prop="paramValType">
|
||||
<el-select v-model="form.paramValType" :placeholder="t('flowrule.inputParamValTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_VAL_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.targetProp')" prop="targetProp">
|
||||
<el-input v-model="form.targetProp" :placeholder="t('flowrule.inputTargetPropTip')"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowrule.paramType')" prop="paramType">
|
||||
<el-select v-model="form.paramType" :placeholder="t('flowrule.inputParamTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_TYPES" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="FlowRuleDialog">
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/flow-rule'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
import {handleChangeJobType} from "/@/flow";
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/flow-rule';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
import { handleChangeJobType } from '/@/flow';
|
||||
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false)
|
||||
const loading = ref(false)
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
id: '',
|
||||
flowKey: '',
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
type: '',
|
||||
valType: '',
|
||||
groupId: '',
|
||||
groupsType: '0',
|
||||
groupType: '0',
|
||||
varKeyVal: '',
|
||||
operator: '',
|
||||
varVal: '',
|
||||
createUser: '',
|
||||
createTime: '',
|
||||
updateUser: '',
|
||||
updateTime: '',
|
||||
});
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
id: '',
|
||||
flowKey: '',
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
type: '',
|
||||
valType: '',
|
||||
groupId: '',
|
||||
groupsType: '0',
|
||||
groupType: '0',
|
||||
varKeyVal: '',
|
||||
operator: '',
|
||||
varVal: '',
|
||||
createUser: '',
|
||||
createTime: '',
|
||||
updateUser: '',
|
||||
updateTime: '',
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
type: [{required: true, message: '数据类型不能为空', trigger: 'blur'}],
|
||||
valType: [{required: true, message: '条件模式不能为空', trigger: 'blur'}],
|
||||
groupId: [{required: true, message: '同组条件ID不能为空', trigger: 'blur'}],
|
||||
groupsType: [{required: true, message: '条件组关系不能为空', trigger: 'blur'}],
|
||||
groupType: [{required: true, message: '组内条件关系不能为空', trigger: 'blur'}],
|
||||
varKeyVal: [{required: true, message: '表单字段不能为空', trigger: 'blur'}],
|
||||
operator: [{required: true, message: '运算符不能为空', trigger: 'blur'}],
|
||||
varVal: [{required: true, message: '校验值不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '数据类型不能为空', trigger: 'blur' }],
|
||||
valType: [{ required: true, message: '条件模式不能为空', trigger: 'blur' }],
|
||||
groupId: [{ required: true, message: '同组条件ID不能为空', trigger: 'blur' }],
|
||||
groupsType: [{ required: true, message: '条件组关系不能为空', trigger: 'blur' }],
|
||||
groupType: [{ required: true, message: '组内条件关系不能为空', trigger: 'blur' }],
|
||||
varKeyVal: [{ required: true, message: '表单字段不能为空', trigger: 'blur' }],
|
||||
operator: [{ required: true, message: '运算符不能为空', trigger: 'blur' }],
|
||||
varVal: [{ required: true, message: '校验值不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "defFlowId"}, {key: "users"}, {key: "roles"}, {key: "posts"}, {key: "depts"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "defFlowId", cascades: ["flowNodeId", "flowNodeRelId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'defFlowId' }, { key: 'users' }, { key: 'roles' }, { key: 'posts' }, { key: 'depts' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'defFlowId', cascades: ['flowNodeId', 'flowNodeRelId'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
if (key === 'defFlowId') {
|
||||
let find = dicData.defFlowId.find(f => f.id === form.defFlowId);
|
||||
if (find) form.flowKey = find.flowKey
|
||||
else form.flowKey = null
|
||||
}
|
||||
}
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
if (key === 'defFlowId') {
|
||||
let find = dicData.defFlowId.find((f) => f.id === form.defFlowId);
|
||||
if (find) form.flowKey = find.flowKey;
|
||||
else form.flowKey = null;
|
||||
}
|
||||
}
|
||||
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form)
|
||||
}
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form);
|
||||
}
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = async (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
// 打开弹窗
|
||||
const openDialog = async (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(async () => {
|
||||
dataFormRef.value.resetFields()
|
||||
// 获取FlowRule信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
await getFlowRuleData(id)
|
||||
await onCascade(form);
|
||||
}
|
||||
})
|
||||
};
|
||||
// 重置表单数据
|
||||
nextTick(async () => {
|
||||
dataFormRef.value.resetFields();
|
||||
// 获取FlowRule信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
await getFlowRuleData(id);
|
||||
await onCascade(form);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getFlowRuleData = async (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
let res = await getObj(id);
|
||||
Object.assign(form, res.data)
|
||||
loading.value = false
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getFlowRuleData = async (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
let res = await getObj(id);
|
||||
Object.assign(form, res.data);
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,52 +1,52 @@
|
||||
export default {
|
||||
flowrule: {
|
||||
index: '#',
|
||||
importFlowRuleTip: ' import FlowRule',
|
||||
id: 'id',
|
||||
flowKey: 'flowKey',
|
||||
defFlowId: 'defFlowId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
flowNodeRelId: 'flowNodeRelId',
|
||||
roleId: 'roleId',
|
||||
jobType: 'jobType',
|
||||
type: 'type',
|
||||
valType: 'valType',
|
||||
groupId: 'groupId',
|
||||
groupsType: 'groupsType',
|
||||
groupType: 'groupType',
|
||||
varKeyVal: 'varKeyVal',
|
||||
operator: 'operator',
|
||||
varVal: 'varVal',
|
||||
paramFrom: 'paramFrom',
|
||||
paramValType: 'paramValType',
|
||||
targetProp: 'targetProp',
|
||||
paramType: 'paramType',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
updateUser: 'updateUser',
|
||||
updateTime: 'updateTime',
|
||||
inputIdTip: 'input id',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputFlowNodeRelIdTip: 'input flowNodeRelId',
|
||||
inputRoleIdTip: 'input roleId',
|
||||
inputJobTypeTip: 'input jobType',
|
||||
inputTypeTip: 'input type',
|
||||
inputValTypeTip: 'input valType',
|
||||
inputGroupIdTip: 'input groupId',
|
||||
inputGroupsTypeTip: 'input groupsType',
|
||||
inputGroupTypeTip: 'input groupType',
|
||||
inputVarKeyValTip: 'input varKeyVal',
|
||||
inputOperatorTip: 'input operator',
|
||||
inputVarValTip: 'input varVal',
|
||||
inputParamFromTip: 'input paramFrom',
|
||||
inputParamValTypeTip: 'input paramValType',
|
||||
inputTargetPropTip: 'input targetProp',
|
||||
inputParamTypeTip: 'input paramType',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
}
|
||||
}
|
||||
flowrule: {
|
||||
index: '#',
|
||||
importFlowRuleTip: ' import FlowRule',
|
||||
id: 'id',
|
||||
flowKey: 'flowKey',
|
||||
defFlowId: 'defFlowId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
flowNodeRelId: 'flowNodeRelId',
|
||||
roleId: 'roleId',
|
||||
jobType: 'jobType',
|
||||
type: 'type',
|
||||
valType: 'valType',
|
||||
groupId: 'groupId',
|
||||
groupsType: 'groupsType',
|
||||
groupType: 'groupType',
|
||||
varKeyVal: 'varKeyVal',
|
||||
operator: 'operator',
|
||||
varVal: 'varVal',
|
||||
paramFrom: 'paramFrom',
|
||||
paramValType: 'paramValType',
|
||||
targetProp: 'targetProp',
|
||||
paramType: 'paramType',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
updateUser: 'updateUser',
|
||||
updateTime: 'updateTime',
|
||||
inputIdTip: 'input id',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputFlowNodeRelIdTip: 'input flowNodeRelId',
|
||||
inputRoleIdTip: 'input roleId',
|
||||
inputJobTypeTip: 'input jobType',
|
||||
inputTypeTip: 'input type',
|
||||
inputValTypeTip: 'input valType',
|
||||
inputGroupIdTip: 'input groupId',
|
||||
inputGroupsTypeTip: 'input groupsType',
|
||||
inputGroupTypeTip: 'input groupType',
|
||||
inputVarKeyValTip: 'input varKeyVal',
|
||||
inputOperatorTip: 'input operator',
|
||||
inputVarValTip: 'input varVal',
|
||||
inputParamFromTip: 'input paramFrom',
|
||||
inputParamValTypeTip: 'input paramValType',
|
||||
inputTargetPropTip: 'input targetProp',
|
||||
inputParamTypeTip: 'input paramType',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,52 +1,52 @@
|
||||
export default {
|
||||
flowrule: {
|
||||
index: '#',
|
||||
importFlowRuleTip: '导入条件/人员规则',
|
||||
id: '',
|
||||
flowKey: '业务KEY',
|
||||
defFlowId: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
flowNodeRelId: '连线名称',
|
||||
roleId: '参与者',
|
||||
jobType: '参与者类型',
|
||||
type: '数据类型',
|
||||
valType: '数据值类型',
|
||||
groupId: '同组条件ID',
|
||||
groupsType: '条件组关系',
|
||||
groupType: '组内条件关系',
|
||||
varKeyVal: '表单字段',
|
||||
operator: '运算符',
|
||||
varVal: '校验值',
|
||||
paramFrom: '参数来源',
|
||||
paramValType: '参数值类型',
|
||||
targetProp: '目标属性',
|
||||
paramType: '参数类型',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
updateUser: '更新人',
|
||||
updateTime: '更新时间',
|
||||
inputIdTip: '请输入',
|
||||
inputFlowKeyTip: '请输入业务KEY',
|
||||
inputDefFlowIdTip: '请选择流程名称',
|
||||
inputFlowNodeIdTip: '请先选择流程名称',
|
||||
inputFlowNodeRelIdTip: '请先选择连线名称',
|
||||
inputRoleIdTip: '请选择参与者',
|
||||
inputJobTypeTip: '请输入参与者类型',
|
||||
inputTypeTip: '请选择数据类型',
|
||||
inputValTypeTip: '请选择模式',
|
||||
inputGroupIdTip: '请输入同组条件ID',
|
||||
inputGroupsTypeTip: '请选择条件组关系',
|
||||
inputGroupTypeTip: '请选择组内条件关系',
|
||||
inputVarKeyValTip: '请输入表单字段',
|
||||
inputOperatorTip: '请选择运算符',
|
||||
inputVarValTip: '请输入校验值',
|
||||
inputParamFromTip: '请选择参数来源',
|
||||
inputParamValTypeTip: '请选择参数值类型',
|
||||
inputTargetPropTip: '请输入目标属性',
|
||||
inputParamTypeTip: '请选择参数类型',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputUpdateUserTip: '请输入更新人',
|
||||
inputUpdateTimeTip: '请输入更新时间',
|
||||
}
|
||||
}
|
||||
flowrule: {
|
||||
index: '#',
|
||||
importFlowRuleTip: '导入条件/人员规则',
|
||||
id: '',
|
||||
flowKey: '业务KEY',
|
||||
defFlowId: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
flowNodeRelId: '连线名称',
|
||||
roleId: '参与者',
|
||||
jobType: '参与者类型',
|
||||
type: '数据类型',
|
||||
valType: '数据值类型',
|
||||
groupId: '同组条件ID',
|
||||
groupsType: '条件组关系',
|
||||
groupType: '组内条件关系',
|
||||
varKeyVal: '表单字段',
|
||||
operator: '运算符',
|
||||
varVal: '校验值',
|
||||
paramFrom: '参数来源',
|
||||
paramValType: '参数值类型',
|
||||
targetProp: '目标属性',
|
||||
paramType: '参数类型',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
updateUser: '更新人',
|
||||
updateTime: '更新时间',
|
||||
inputIdTip: '请输入',
|
||||
inputFlowKeyTip: '请输入业务KEY',
|
||||
inputDefFlowIdTip: '请选择流程名称',
|
||||
inputFlowNodeIdTip: '请先选择流程名称',
|
||||
inputFlowNodeRelIdTip: '请先选择连线名称',
|
||||
inputRoleIdTip: '请选择参与者',
|
||||
inputJobTypeTip: '请输入参与者类型',
|
||||
inputTypeTip: '请选择数据类型',
|
||||
inputValTypeTip: '请选择模式',
|
||||
inputGroupIdTip: '请输入同组条件ID',
|
||||
inputGroupsTypeTip: '请选择条件组关系',
|
||||
inputGroupTypeTip: '请选择组内条件关系',
|
||||
inputVarKeyValTip: '请输入表单字段',
|
||||
inputOperatorTip: '请选择运算符',
|
||||
inputVarValTip: '请输入校验值',
|
||||
inputParamFromTip: '请选择参数来源',
|
||||
inputParamValTypeTip: '请选择参数值类型',
|
||||
inputTargetPropTip: '请输入目标属性',
|
||||
inputParamTypeTip: '请选择参数类型',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputUpdateUserTip: '请输入更新人',
|
||||
inputUpdateTimeTip: '请输入更新时间',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,260 +1,269 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="t('flowrule.type')" prop="type">
|
||||
<el-select v-model="state.queryForm.type" :placeholder="t('flowrule.inputTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_RULE_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('flowrule.valType')" prop="type">
|
||||
<el-select v-model="state.queryForm.valType" :placeholder="t('flowrule.inputValTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.VAL_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="t('flowrule.type')" prop="type">
|
||||
<el-select v-model="state.queryForm.type" :placeholder="t('flowrule.inputTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.PARAM_RULE_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('flowrule.valType')" prop="type">
|
||||
<el-select v-model="state.queryForm.valType" :placeholder="t('flowrule.inputValTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.VAL_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item :label="$t('flowrule.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="state.queryForm.defFlowId" :placeholder="t('flowrule.inputDefFlowIdTip')"
|
||||
clearable filterable @change="cascadeChange('defFlowId', ['flowNodeId', 'flowNodeRelId'])">
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('flowrule.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="state.queryForm.flowNodeId" :placeholder="t('flowrule.inputFlowNodeIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('flowrule.flowNodeRelId')" prop="flowNodeRelId">
|
||||
<el-select v-model="state.queryForm.flowNodeRelId" :placeholder="t('flowrule.inputFlowNodeRelIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeRelId" :key="index" :label="item.label" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('flowrule.defFlowId')" prop="defFlowId">
|
||||
<el-select
|
||||
v-model="state.queryForm.defFlowId"
|
||||
:placeholder="t('flowrule.inputDefFlowIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('defFlowId', ['flowNodeId', 'flowNodeRelId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('flowrule.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="state.queryForm.flowNodeId" :placeholder="t('flowrule.inputFlowNodeIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('flowrule.flowNodeRelId')" prop="flowNodeRelId">
|
||||
<el-select v-model="state.queryForm.flowNodeRelId" :placeholder="t('flowrule.inputFlowNodeRelIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeRelId" :key="index" :label="item.label" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="ml2">
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')"
|
||||
v-auth="'jsonflow_flowrule_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-form-item class="ml2">
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')" v-auth="'jsonflow_flowrule_add'"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_flowrule_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_flowrule_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<right-toolbar v-model:showSearch="showSearch" class="ml10" style="float: right;margin-right: 20px"
|
||||
:export="'jsonflow_flowrule_export'" @exportExcel="exportExcel"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column fixed="left" type="index" :label="t('flowrule.index')" width="40" />
|
||||
<el-table-column prop="type" :label="t('flowrule.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.PARAM_RULE_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="valType" :label="t('flowrule.valType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.VAL_TYPE" :value="scope.row.valType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="defFlowId" :label="t('flowrule.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.defFlowId" :value="scope.row.defFlowId"
|
||||
:valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="flowNodeId" :label="t('flowrule.flowNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.flowNodeId" :value="scope.row.flowNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="groupId" :label="t('flowrule.groupId')" show-overflow-tooltip/>
|
||||
<el-table-column prop="groupsType" :label="t('flowrule.groupsType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.OR_OR_AND" :value="scope.row.groupsType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="groupType" :label="t('flowrule.groupType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.OR_OR_AND" :value="scope.row.groupType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varKeyVal" :label="t('flowrule.varKeyVal')" show-overflow-tooltip/>
|
||||
<el-table-column prop="operator" :label="t('flowrule.operator')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.OPERATOR" :value="scope.row.operator"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varVal" :label="t('flowrule.varVal')" show-overflow-tooltip/>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
:export="'jsonflow_flowrule_export'"
|
||||
@exportExcel="exportExcel"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column fixed="left" type="index" :label="t('flowrule.index')" width="40" />
|
||||
<el-table-column prop="type" :label="t('flowrule.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.PARAM_RULE_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="valType" :label="t('flowrule.valType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.VAL_TYPE" :value="scope.row.valType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="defFlowId" :label="t('flowrule.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.defFlowId" :value="scope.row.defFlowId" :valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="flowNodeId" :label="t('flowrule.flowNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.flowNodeId" :value="scope.row.flowNodeId" :valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="groupId" :label="t('flowrule.groupId')" show-overflow-tooltip />
|
||||
<el-table-column prop="groupsType" :label="t('flowrule.groupsType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.OR_OR_AND" :value="scope.row.groupsType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="groupType" :label="t('flowrule.groupType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.OR_OR_AND" :value="scope.row.groupType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varKeyVal" :label="t('flowrule.varKeyVal')" show-overflow-tooltip />
|
||||
<el-table-column prop="operator" :label="t('flowrule.operator')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.OPERATOR" :value="scope.row.operator"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varVal" :label="t('flowrule.varVal')" show-overflow-tooltip />
|
||||
|
||||
<el-table-column prop="jobType" :label="t('flowrule.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobType" :label="t('flowrule.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="roleId" :label="t('flowrule.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name :options="{users: dicData.users, roles: dicData.roles, posts: dicData.posts, depts: dicData.depts }"
|
||||
:value="scope.row"></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('flowrule.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name
|
||||
:options="{ users: dicData.users, roles: dicData.roles, posts: dicData.posts, depts: dicData.depts }"
|
||||
:value="scope.row"
|
||||
></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="paramFrom" :label="t('flowrule.paramFrom')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.PARAM_FROM" :value="scope.row.paramFrom"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="paramValType" :label="t('flowrule.paramValType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.PARAM_VAL_TYPE" :value="scope.row.paramValType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="targetProp" :label="t('flowrule.targetProp')" show-overflow-tooltip/>
|
||||
<el-table-column prop="paramType" :label="t('flowrule.paramType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.PARAM_TYPES" :value="scope.row.paramType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="paramFrom" :label="t('flowrule.paramFrom')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.PARAM_FROM" :value="scope.row.paramFrom"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="paramValType" :label="t('flowrule.paramValType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.PARAM_VAL_TYPE" :value="scope.row.paramValType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="targetProp" :label="t('flowrule.targetProp')" show-overflow-tooltip />
|
||||
<el-table-column prop="paramType" :label="t('flowrule.paramType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.PARAM_TYPES" :value="scope.row.paramType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column :label="$t('common.action')" fixed="right" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-table-column :label="$t('common.action')" fixed="right" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="FlowRule">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/flow-rule";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/flow-rule';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n()
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "defFlowId"}, {key: "flowNodeId"}, {key: "users"}, {key: "roles"}, {key: "posts"}, {key: "depts"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "defFlowId", cascades: ["flowNodeId", "flowNodeRelId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(state.queryForm, {key: key, cascades: cascades});
|
||||
}
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'defFlowId' }, { key: 'flowNodeId' }, { key: 'users' }, { key: 'roles' }, { key: 'posts' }, { key: 'depts' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'defFlowId', cascades: ['flowNodeId', 'flowNodeRelId'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(state.queryForm, { key: key, cascades: cascades });
|
||||
}
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
queryRef.value.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
queryRef.value.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length
|
||||
}
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/flow-rule/export', state.queryForm, 'flowrule.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/flow-rule/export', state.queryForm, 'flowrule.xlsx');
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -1,147 +1,150 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="100px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="100px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowVariable.flowInstId')" prop="flowInstId">
|
||||
<el-input
|
||||
v-model="form.flowInstId"
|
||||
:placeholder="t('flowVariable.inputFlowInstIdTip')"
|
||||
clearable
|
||||
:disabled="operType !== 'add'"
|
||||
@change="cascadeChange('flowInstId', ['flowKey'])"
|
||||
>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowVariable.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('flowVariable.inputFlowInstIdTip')" clearable :disabled="operType !== 'add'"
|
||||
@change="cascadeChange('flowInstId', ['flowKey'])">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowVariable.flowKey')" prop="flowKey">
|
||||
<el-select v-model="form.flowKey" :placeholder="t('flowVariable.inputFlowKeyTip')" clearable filterable :disabled="operType !== 'add'">
|
||||
<el-option v-for="(item, index) in cascadeDic.flowKey" :key="index" :label="item.flowName" :value="item.flowKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowVariable.flowKey')" prop="flowKey">
|
||||
<el-select v-model="form.flowKey" :placeholder="t('flowVariable.inputFlowKeyTip')" clearable filterable :disabled="operType !== 'add'">
|
||||
<el-option v-for="(item, index) in cascadeDic.flowKey" :key="index" :label="item.flowName" :value="item.flowKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowVariable.varKey')" prop="varKey">
|
||||
<el-input v-model="form.varKey" :placeholder="t('flowVariable.inputVarKeyTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowVariable.varKey')" prop="varKey">
|
||||
<el-input v-model="form.varKey" :placeholder="t('flowVariable.inputVarKeyTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowVariable.varVal')" prop="varVal">
|
||||
<el-input v-model="form.varVal" :placeholder="t('flowVariable.inputVarValTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('flowVariable.varVal')" prop="varVal">
|
||||
<el-input v-model="form.varVal" :placeholder="t('flowVariable.inputVarValTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="FlowVariableDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/flow-variable';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { rule } from '/@/utils/validate';
|
||||
import { onCascadeChange } from '/@/flow/components/convert-name/convert';
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/flow-variable'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { rule } from '/@/utils/validate';
|
||||
import {onCascadeChange} from "/@/flow/components/convert-name/convert";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const cascadeDic = reactive({});
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['flowKey'] });
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const cascadeDic = reactive({});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["flowKey"]});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
}
|
||||
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
}
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowInstId: '',
|
||||
flowKey: '',
|
||||
varKey: '',
|
||||
varVal: '',
|
||||
});
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowInstId: '',
|
||||
flowKey: '',
|
||||
varKey: '',
|
||||
varVal: '',
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
flowInstId: [{ required: true, message: '流程实例ID不能为空', trigger: 'blur' }],
|
||||
flowKey: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
varKey: [{ required: true, message: '变量名不能为空', trigger: 'blur' }],
|
||||
varVal: [{ required: true, message: '变量值不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
flowInstId: [{required: true, message: '流程实例ID不能为空', trigger: 'blur'}],
|
||||
flowKey: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
varKey: [{required: true, message: '变量名不能为空', trigger: 'blur'}],
|
||||
varVal: [{required: true, message: '变量值不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取FlowVariable信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getFlowVariableData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取FlowVariable信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getFlowVariableData(id)
|
||||
}
|
||||
};
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getFlowVariableData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onCascade(form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getFlowVariableData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onCascade(form);
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,28 +1,28 @@
|
||||
export default {
|
||||
flowVariable: {
|
||||
index: '#',
|
||||
importflowVariableTip: 'import FlowVariable',
|
||||
id: 'id',
|
||||
flowInstId: 'flowInstId',
|
||||
flowKey: 'flowKey',
|
||||
varKey: 'varKey',
|
||||
varVal: 'varVal',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
code: 'code',
|
||||
updateUser: 'updateUser',
|
||||
updateTime: 'updateTime',
|
||||
tenantId: 'tenantId',
|
||||
inputIdTip: 'input id',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputVarKeyTip: 'input varKey',
|
||||
inputVarValTip: 'input varVal',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputCodeTip: 'input code',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
inputTenantIdTip: 'input tenantId',
|
||||
}
|
||||
}
|
||||
flowVariable: {
|
||||
index: '#',
|
||||
importflowVariableTip: 'import FlowVariable',
|
||||
id: 'id',
|
||||
flowInstId: 'flowInstId',
|
||||
flowKey: 'flowKey',
|
||||
varKey: 'varKey',
|
||||
varVal: 'varVal',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
code: 'code',
|
||||
updateUser: 'updateUser',
|
||||
updateTime: 'updateTime',
|
||||
tenantId: 'tenantId',
|
||||
inputIdTip: 'input id',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputVarKeyTip: 'input varKey',
|
||||
inputVarValTip: 'input varVal',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputCodeTip: 'input code',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
inputTenantIdTip: 'input tenantId',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,28 +1,27 @@
|
||||
export default {
|
||||
flowVariable: {
|
||||
index: '#',
|
||||
importflowVariableTip: '导入流程参数管理',
|
||||
id: ' id',
|
||||
flowInstId: '流程实例ID',
|
||||
flowKey: '流程名称',
|
||||
varKey: '变量名',
|
||||
varVal: '变量值',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
code: '工单编号',
|
||||
updateUser: '更新人',
|
||||
updateTime: '更新时间',
|
||||
|
||||
inputIdTip: '请输入ID',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFlowKeyTip: '请输入流程名称',
|
||||
inputVarKeyTip: '请输入变量名',
|
||||
inputVarValTip: '请输入变量值',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputCodeTip: '请输入工单编号',
|
||||
inputUpdateUserTip: '请输入更新人',
|
||||
inputUpdateTimeTip: '请输入更新时间',
|
||||
|
||||
}
|
||||
}
|
||||
flowVariable: {
|
||||
index: '#',
|
||||
importflowVariableTip: '导入流程参数管理',
|
||||
id: ' id',
|
||||
flowInstId: '流程实例ID',
|
||||
flowKey: '流程名称',
|
||||
varKey: '变量名',
|
||||
varVal: '变量值',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
code: '工单编号',
|
||||
updateUser: '更新人',
|
||||
updateTime: '更新时间',
|
||||
|
||||
inputIdTip: '请输入ID',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFlowKeyTip: '请输入流程名称',
|
||||
inputVarKeyTip: '请输入变量名',
|
||||
inputVarValTip: '请输入变量值',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputCodeTip: '请输入工单编号',
|
||||
inputUpdateUserTip: '请输入更新人',
|
||||
inputUpdateTimeTip: '请输入更新时间',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,176 +1,179 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('flowVariable.flowInstId')" prop="flowInstId" >
|
||||
<el-input :placeholder="t('flowVariable.inputFlowInstIdTip')" v-model="state.queryForm.flowInstId" clearable
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('flowVariable.code')" prop="code" >
|
||||
<el-select v-model="state.queryForm.code" :placeholder="t('flowVariable.inputCodeTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.code" :key="index" :label="item.code" :value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')"
|
||||
v-auth="'jsonflow_flowvariable_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_flowvariable_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('flowVariable.flowInstId')" prop="flowInstId">
|
||||
<el-input :placeholder="t('flowVariable.inputFlowInstIdTip')" v-model="state.queryForm.flowInstId" clearable style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('flowVariable.code')" prop="code">
|
||||
<el-select v-model="state.queryForm.code" :placeholder="t('flowVariable.inputCodeTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.code" :key="index" :label="item.code" :value="item.code"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')" v-auth="'jsonflow_flowvariable_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_flowvariable_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_flowvariable_export'"
|
||||
class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('flowVariable.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('flowVariable.flowInstId')" show-overflow-tooltip/>
|
||||
<el-table-column prop="code" :label="t('flowVariable.code')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowKey" :label="t('flowVariable.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey"
|
||||
:valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varKey" :label="t('flowVariable.varKey')" show-overflow-tooltip/>
|
||||
<el-table-column prop="varVal" :label="t('flowVariable.varVal')" show-overflow-tooltip/>
|
||||
<el-table-column prop="createUser" :label="t('flowVariable.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('flowVariable.createTime')" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_flowvariable_export'"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('flowVariable.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('flowVariable.flowInstId')" show-overflow-tooltip />
|
||||
<el-table-column prop="code" :label="t('flowVariable.code')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowKey" :label="t('flowVariable.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey" :valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="varKey" :label="t('flowVariable.varKey')" show-overflow-tooltip />
|
||||
<el-table-column prop="varVal" :label="t('flowVariable.varVal')" show-overflow-tooltip />
|
||||
<el-table-column prop="createUser" :label="t('flowVariable.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('flowVariable.createTime')" show-overflow-tooltip />
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemFlowVariable">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/flow-variable";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/flow-variable';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onLoadDicUrl, onLoaded} from "/@/flow/components/convert-name/convert";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoadDicUrl, onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n()
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "code"});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'code' });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({key: "createUser"}, {key: "flowInstId"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({ key: 'createUser' }, { key: 'flowInstId' }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -1,453 +1,442 @@
|
||||
<template>
|
||||
<div :style="props.currFlowForm ? 'width: 70%; margin-left: 15%' : ''">
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" v-loading="loading"
|
||||
:disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<div :style="props.currFlowForm ? 'width: 70%; margin-left: 15%' : ''">
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.type')" prop="type">
|
||||
<el-select v-model="form.type" :placeholder="t('formoption.inputTypeTip')" clearable filterable @change="typeChange" :disabled="true">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_DATA_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.formType')" prop="formType">
|
||||
<el-select
|
||||
v-model="form.formType"
|
||||
:placeholder="t('formoption.inputFormTypeTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="formTypeChange"
|
||||
:disabled="disabledFields.formType"
|
||||
>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.type')" prop="type">
|
||||
<el-select v-model="form.type" :placeholder="t('formoption.inputTypeTip')" clearable filterable
|
||||
@change="typeChange" :disabled="true">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_DATA_TYPE" :key="index" :label="item.label"
|
||||
:value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.formType')" prop="formType">
|
||||
<el-select v-model="form.formType" :placeholder="t('formoption.inputFormTypeTip')" clearable
|
||||
filterable
|
||||
@change="formTypeChange" :disabled="disabledFields.formType">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_TYPE" :key="index" :label="item.label"
|
||||
:value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!props.currFlowForm">
|
||||
<el-form-item :label="t('formoption.formId')" prop="formId">
|
||||
<el-select v-model="form.formId" :placeholder="t('formoption.inputFormIdTip')" clearable filterable @change="formIdChange">
|
||||
<el-option v-for="(item, index) in dicData.formIdByType" :key="index" :label="item.formName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="!props.currFlowForm">
|
||||
<el-form-item :label="t('formoption.formId')" prop="formId">
|
||||
<el-select v-model="form.formId" :placeholder="t('formoption.inputFormIdTip')" clearable
|
||||
filterable
|
||||
@change="formIdChange">
|
||||
<el-option v-for="(item, index) in dicData.formIdByType" :key="index"
|
||||
:label="item.formName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.defFlowId">
|
||||
<el-form-item :label="t('formoption.defFlowId')" prop="defFlowId">
|
||||
<el-select
|
||||
v-model="form.defFlowId"
|
||||
:placeholder="t('formoption.inputDefFlowIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('defFlowId', ['flowNodeId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.flowNodeId">
|
||||
<el-form-item :label="t('formoption.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="form.flowNodeId" :placeholder="t('formoption.inputFlowNodeIdTip')" clearable filterable @change="changeFlowNodeId">
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.defFlowId">
|
||||
<el-form-item :label="t('formoption.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('formoption.inputDefFlowIdTip')" clearable
|
||||
filterable
|
||||
@change="cascadeChange('defFlowId', ['flowNodeId'])">
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.flowNodeId">
|
||||
<el-form-item :label="t('formoption.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="form.flowNodeId" :placeholder="t('formoption.inputFlowNodeIdTip')" clearable
|
||||
filterable
|
||||
@change="changeFlowNodeId">
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index"
|
||||
:label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.flowNodeId">
|
||||
<el-form-item :label="t('formoption.resetBtn')" prop="resetBtn">
|
||||
<el-button icon="RefreshLeft" size="small" type="primary" circle @click="resetFormPerm"></el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.flowNodeId">
|
||||
<el-form-item :label="t('formoption.resetBtn')" prop="resetBtn">
|
||||
<el-button icon="RefreshLeft" size="small" type="primary" circle
|
||||
@click="resetFormPerm"></el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.printInfo">
|
||||
<el-form-item :label="t('formoption.printInfo')" prop="printInfo">
|
||||
<el-input v-model="form.printInfo" :placeholder="t('formoption.inputPrintInfoTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.printInfo">
|
||||
<el-form-item :label="t('formoption.printInfo')" prop="printInfo">
|
||||
<el-input v-model="form.printInfo" :placeholder="t('formoption.inputPrintInfoTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item :label="t('createTable.columnInfo')" prop="columns">
|
||||
<el-table :data="form.columns" border style="width: 100%" max-height="500">
|
||||
<el-table-column type="index" :label="t('createTable.index')" width="80">
|
||||
<template #header>
|
||||
<el-button icon="Plus" size="small" type="primary" circle @click="onAddItem" :disabled="disabledFields.label"></el-button>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-button icon="Minus" size="small" type="danger" circle @click="handleDelete(scope.$index, scope.row)"></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="propId" :label="t('formoption.propId')" show-overflow-tooltip v-if="!hiddenFields.propId && !props.currFlowForm">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.propId" :placeholder="t('formoption.inputPropIdTip')" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="label" :label="t('formoption.label')" show-overflow-tooltip v-if="!hiddenFields.label">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.label" :placeholder="t('formoption.inputLabelTip')" :disabled="disabledFields.label" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="prop" :label="t('formoption.prop')" show-overflow-tooltip v-if="!hiddenFields.prop">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.prop" :placeholder="t('formoption.inputPropTip')" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subForm" :label="t('formoption.subForm')" show-overflow-tooltip v-if="!hiddenFields.subForm">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.subForm" :placeholder="t('formoption.inputSubFormTip')" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="propType" :label="t('formoption.propType')" show-overflow-tooltip v-if="!hiddenFields.propType">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.propType" :placeholder="t('formoption.inputPropTypeTip')" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item :label="t('createTable.columnInfo')" prop="columns">
|
||||
<el-table :data="form.columns" border style="width: 100%" max-height="500">
|
||||
<el-table-column type="index" :label="t('createTable.index')" width="80">
|
||||
<template #header>
|
||||
<el-button icon="Plus" size="small" type="primary" circle @click="onAddItem"
|
||||
:disabled="disabledFields.label"></el-button>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-button icon="Minus" size="small" type="danger" circle
|
||||
@click="handleDelete(scope.$index, scope.row)"></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="propId" :label="t('formoption.propId')" show-overflow-tooltip
|
||||
v-if="!hiddenFields.propId && !props.currFlowForm">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.propId" :placeholder="t('formoption.inputPropIdTip')"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="label" :label="t('formoption.label')" show-overflow-tooltip
|
||||
v-if="!hiddenFields.label">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.label" :placeholder="t('formoption.inputLabelTip')"
|
||||
:disabled="disabledFields.label"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="prop" :label="t('formoption.prop')" show-overflow-tooltip
|
||||
v-if="!hiddenFields.prop">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.prop" :placeholder="t('formoption.inputPropTip')"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subForm" :label="t('formoption.subForm')" show-overflow-tooltip
|
||||
v-if="!hiddenFields.subForm">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.subForm"
|
||||
:placeholder="t('formoption.inputSubFormTip')"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="propType" :label="t('formoption.propType')" show-overflow-tooltip
|
||||
v-if="!hiddenFields.propType">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.propType"
|
||||
:placeholder="t('formoption.inputPropTypeTip')"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="permType" :label="t('formoption.permType')" show-overflow-tooltip
|
||||
v-if="!hiddenFields.permType">
|
||||
<template #default="scope">
|
||||
<el-radio-group v-model="scope.row.permType">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.FORM_PERM_TYPE" :key="index"
|
||||
:label="item.value">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<footer class="el-dialog__footer" style="text-align: center;" v-if="!props.currFlowForm">
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleSubmit()" :disabled="loading">{{
|
||||
$t('common.confirmButtonText')
|
||||
}}</el-button>
|
||||
<el-button type="primary" @click="onClearSubmit" :disabled="loading" v-if="!validateNull(form.columns)">
|
||||
清空
|
||||
</el-button>
|
||||
</span>
|
||||
</footer>
|
||||
</div>
|
||||
<el-table-column prop="permType" :label="t('formoption.permType')" show-overflow-tooltip v-if="!hiddenFields.permType">
|
||||
<template #default="scope">
|
||||
<el-radio-group v-model="scope.row.permType">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.FORM_PERM_TYPE" :key="index" :label="item.value">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<footer class="el-dialog__footer" style="text-align: center" v-if="!props.currFlowForm">
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleSubmit()" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onClearSubmit" :disabled="loading" v-if="!validateNull(form.columns)"> 清空 </el-button>
|
||||
</span>
|
||||
</footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="FormDefPerm">
|
||||
import {useMessage} from "/@/hooks/message";
|
||||
import {getObj, addObj, putObj, listFormOption} from '/@/api/jsonflow/form-option'
|
||||
import {useI18n} from "vue-i18n"
|
||||
import {setPropsNull, setPropsValue} from "/@/flow/support/common";
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
import {validateNull} from "/@/utils/validate";
|
||||
import {initFromSomeAttrs, validateRunFlowId, parseWithFunctions, notifyLeft} from "/@/flow";
|
||||
import {buildFieldPerms} from "/@/flow/utils/form-perm";
|
||||
import {DIC_PROP} from "/@/flow/support/dict-prop";
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj, listFormOption } from '/@/api/jsonflow/form-option';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { setPropsNull, setPropsValue } from '/@/flow/support/common';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
import { validateNull } from '/@/utils/validate';
|
||||
import { initFromSomeAttrs, validateRunFlowId, parseWithFunctions, notifyLeft } from '/@/flow';
|
||||
import { buildFieldPerms } from '/@/flow/utils/form-perm';
|
||||
import { DIC_PROP } from '/@/flow/support/dict-prop';
|
||||
|
||||
const emit = defineEmits(['refresh']);
|
||||
const {t} = useI18n();
|
||||
const $message = useMessage();
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
const $message = useMessage();
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const loading = ref(false)
|
||||
const operType = ref(false);
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
id: '',
|
||||
flowKey: '',
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
columns: [],
|
||||
formType: '',
|
||||
formId: '',
|
||||
formName: '',
|
||||
path: '',
|
||||
printInfo: '',
|
||||
type: '',
|
||||
});
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
id: '',
|
||||
flowKey: '',
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
columns: [],
|
||||
formType: '',
|
||||
formId: '',
|
||||
formName: '',
|
||||
path: '',
|
||||
printInfo: '',
|
||||
type: '',
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
formType: [{required: true, message: '表单来源不能为空', trigger: 'blur'}],
|
||||
formId: [{required: true, message: '表单名称不能为空', trigger: 'blur'}],
|
||||
type: [{required: true, message: '数据类型不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
formType: [{ required: true, message: '表单来源不能为空', trigger: 'blur' }],
|
||||
formId: [{ required: true, message: '表单名称不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '数据类型不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "defFlowId"}, {key: "formId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "defFlowId", cascades: ["flowNodeId"]});
|
||||
onMounted(async () => {
|
||||
await onLoad(dicData);
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'defFlowId' }, { key: 'formId' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'defFlowId', cascades: ['flowNodeId'] });
|
||||
onMounted(async () => {
|
||||
await onLoad(dicData);
|
||||
|
||||
// 判断是否设计器中
|
||||
if (props.currFlowForm) {
|
||||
await openDialog('add', null, '0')
|
||||
} else {
|
||||
let {type, id, dataType} = props.formDefPerm
|
||||
await openDialog(type, id, dataType)
|
||||
}
|
||||
});
|
||||
// 判断是否设计器中
|
||||
if (props.currFlowForm) {
|
||||
await openDialog('add', null, '0');
|
||||
} else {
|
||||
let { type, id, dataType } = props.formDefPerm;
|
||||
await openDialog(type, id, dataType);
|
||||
}
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
currFlowForm: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
formDefPerm: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
const props = defineProps({
|
||||
currFlowForm: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
formDefPerm: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
if (key === 'defFlowId') {
|
||||
let find = dicData.defFlowId.find(f => f.id === form.defFlowId);
|
||||
if (find) form.flowKey = find.flowKey
|
||||
else form.flowKey = null
|
||||
}
|
||||
}
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
if (key === 'defFlowId') {
|
||||
let find = dicData.defFlowId.find((f) => f.id === form.defFlowId);
|
||||
if (find) form.flowKey = find.flowKey;
|
||||
else form.flowKey = null;
|
||||
}
|
||||
}
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = async (type, id, dataType) => {
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
// 打开弹窗
|
||||
const openDialog = async (type, id, dataType) => {
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(async () => {
|
||||
dataFormRef.value.resetFields()
|
||||
// 获取FormOption信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
await getFormOptionData(id)
|
||||
await onCascade(form);
|
||||
}
|
||||
if (type === 'add') form.type = dataType
|
||||
typeChange(form.type);
|
||||
if (!props.currFlowForm) return
|
||||
validateRunFlowId(props, form)
|
||||
formIdChange(form.formId)
|
||||
})
|
||||
};
|
||||
// 重置表单数据
|
||||
nextTick(async () => {
|
||||
dataFormRef.value.resetFields();
|
||||
// 获取FormOption信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
await getFormOptionData(id);
|
||||
await onCascade(form);
|
||||
}
|
||||
if (type === 'add') form.type = dataType;
|
||||
typeChange(form.type);
|
||||
if (!props.currFlowForm) return;
|
||||
validateRunFlowId(props, form);
|
||||
formIdChange(form.formId);
|
||||
});
|
||||
};
|
||||
|
||||
const onClearSubmit = async () => {
|
||||
form.columns = []
|
||||
await handleSubmit()
|
||||
}
|
||||
const onClearSubmit = async () => {
|
||||
form.columns = [];
|
||||
await handleSubmit();
|
||||
};
|
||||
|
||||
const syncCurrFormInfo = (isClear) => {
|
||||
if (!isClear) props.currFlowForm.formFieldPerms = form.columns
|
||||
else props.currFlowForm.formFieldPerms = []
|
||||
}
|
||||
const syncCurrFormInfo = (isClear) => {
|
||||
if (!isClear) props.currFlowForm.formFieldPerms = form.columns;
|
||||
else props.currFlowForm.formFieldPerms = [];
|
||||
};
|
||||
|
||||
// 提交
|
||||
const handleSubmit = async (callback?) => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {
|
||||
});
|
||||
if (!valid) return false;
|
||||
// 提交
|
||||
const handleSubmit = async (callback?) => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
if (!form.formId) {
|
||||
$message.warning("请先选择表单名称")
|
||||
return
|
||||
}
|
||||
if (form.type === DIC_PROP.FORM_DATA_TYPE[1].value && !form.flowNodeId) {
|
||||
$message.warning("请先选择节点名称")
|
||||
return
|
||||
}
|
||||
if (validateColumns()) return;
|
||||
initFromSomeAttrs(props, form)
|
||||
try {
|
||||
loading.value = true;
|
||||
await addObj(form);
|
||||
notifyLeft('当前表单设计保存成功')
|
||||
emit('refresh');
|
||||
if (callback) callback()
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
if (!form.formId) {
|
||||
$message.warning('请先选择表单名称');
|
||||
return;
|
||||
}
|
||||
if (form.type === DIC_PROP.FORM_DATA_TYPE[1].value && !form.flowNodeId) {
|
||||
$message.warning('请先选择节点名称');
|
||||
return;
|
||||
}
|
||||
if (validateColumns()) return;
|
||||
initFromSomeAttrs(props, form);
|
||||
try {
|
||||
loading.value = true;
|
||||
await addObj(form);
|
||||
notifyLeft('当前表单设计保存成功');
|
||||
emit('refresh');
|
||||
if (callback) callback();
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getFormOptionData = async (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
let res = await getObj(id);
|
||||
Object.assign(form, res.data)
|
||||
loading.value = false
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getFormOptionData = async (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
let res = await getObj(id);
|
||||
Object.assign(form, res.data);
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
// 定义字段显隐
|
||||
const hiddenFields = reactive({
|
||||
defFlowId: true,
|
||||
flowNodeId: true,
|
||||
label: true,
|
||||
prop: true,
|
||||
propId: true,
|
||||
subForm: true,
|
||||
propType: true,
|
||||
permType: true,
|
||||
printInfo: true,
|
||||
});
|
||||
// 定义字段显隐
|
||||
const hiddenFields = reactive({
|
||||
defFlowId: true,
|
||||
flowNodeId: true,
|
||||
label: true,
|
||||
prop: true,
|
||||
propId: true,
|
||||
subForm: true,
|
||||
propType: true,
|
||||
permType: true,
|
||||
printInfo: true,
|
||||
});
|
||||
|
||||
// 定义字段是否可编辑
|
||||
const disabledFields = reactive({
|
||||
formType: false,
|
||||
label: false,
|
||||
});
|
||||
// 定义字段是否可编辑
|
||||
const disabledFields = reactive({
|
||||
formType: false,
|
||||
label: false,
|
||||
});
|
||||
|
||||
const formTypeChange = (value) => {
|
||||
if (value) dicData.formIdByType = dicData.formId.filter(f => f.type === value)
|
||||
else dicData.formIdByType = []
|
||||
form.columns = [];
|
||||
form.formId = null
|
||||
}
|
||||
const formTypeChange = (value) => {
|
||||
if (value) dicData.formIdByType = dicData.formId.filter((f) => f.type === value);
|
||||
else dicData.formIdByType = [];
|
||||
form.columns = [];
|
||||
form.formId = null;
|
||||
};
|
||||
|
||||
const formIdChange = (value) => {
|
||||
form.columns = [];
|
||||
setPropsNull(form, 'flowKey', 'defFlowId', 'flowNodeId')
|
||||
if (!value) return
|
||||
if (form.type === DIC_PROP.FORM_DATA_TYPE[0].value) {
|
||||
handleCustomFormDef(value, form.type)
|
||||
}
|
||||
if (props.currFlowForm) return;
|
||||
let find = dicData.formIdByType.find(f => f.id === value);
|
||||
form.formName = find.formName
|
||||
form.path = find.path
|
||||
}
|
||||
const formIdChange = (value) => {
|
||||
form.columns = [];
|
||||
setPropsNull(form, 'flowKey', 'defFlowId', 'flowNodeId');
|
||||
if (!value) return;
|
||||
if (form.type === DIC_PROP.FORM_DATA_TYPE[0].value) {
|
||||
handleCustomFormDef(value, form.type);
|
||||
}
|
||||
if (props.currFlowForm) return;
|
||||
let find = dicData.formIdByType.find((f) => f.id === value);
|
||||
form.formName = find.formName;
|
||||
form.path = find.path;
|
||||
};
|
||||
|
||||
// 查询字段信息
|
||||
function handleCustomFormDef(formId, type) {
|
||||
listFormOption({
|
||||
flowInstId: form.flowInstId,
|
||||
type: type, formType: form.formType, formId: formId
|
||||
}).then(resp => {
|
||||
let res = resp.data;
|
||||
if (!validateNull(res)) form.columns = res
|
||||
else form.columns = [];
|
||||
})
|
||||
.catch(() => {
|
||||
$message.error("获取表单字段定义失败");
|
||||
})
|
||||
}
|
||||
// 查询字段信息
|
||||
function handleCustomFormDef(formId, type) {
|
||||
listFormOption({
|
||||
flowInstId: form.flowInstId,
|
||||
type: type,
|
||||
formType: form.formType,
|
||||
formId: formId,
|
||||
})
|
||||
.then((resp) => {
|
||||
let res = resp.data;
|
||||
if (!validateNull(res)) form.columns = res;
|
||||
else form.columns = [];
|
||||
})
|
||||
.catch(() => {
|
||||
$message.error('获取表单字段定义失败');
|
||||
});
|
||||
}
|
||||
|
||||
const changeFlowNodeId = (value) => {
|
||||
if (!value) {
|
||||
form.columns = [];
|
||||
return
|
||||
}
|
||||
handleCustomFormPerm(form.defFlowId, value, form.type)
|
||||
}
|
||||
const changeFlowNodeId = (value) => {
|
||||
if (!value) {
|
||||
form.columns = [];
|
||||
return;
|
||||
}
|
||||
handleCustomFormPerm(form.defFlowId, value, form.type);
|
||||
};
|
||||
|
||||
function handleCustomFormPerm(defFlowId, flowNodeId, type) {
|
||||
listFormOption({
|
||||
type: type, formType: form.formType, formId: form.formId,
|
||||
defFlowId: defFlowId, flowInstId: form.flowInstId, flowNodeId: flowNodeId
|
||||
}).then(resp => {
|
||||
let res = resp.data;
|
||||
if (!validateNull(res)) form.columns = res
|
||||
else changeNodeFormId(form.formId)
|
||||
}).catch(() => {
|
||||
$message.error("获取表单字段权限失败");
|
||||
})
|
||||
}
|
||||
function handleCustomFormPerm(defFlowId, flowNodeId, type) {
|
||||
listFormOption({
|
||||
type: type,
|
||||
formType: form.formType,
|
||||
formId: form.formId,
|
||||
defFlowId: defFlowId,
|
||||
flowInstId: form.flowInstId,
|
||||
flowNodeId: flowNodeId,
|
||||
})
|
||||
.then((resp) => {
|
||||
let res = resp.data;
|
||||
if (!validateNull(res)) form.columns = res;
|
||||
else changeNodeFormId(form.formId);
|
||||
})
|
||||
.catch(() => {
|
||||
$message.error('获取表单字段权限失败');
|
||||
});
|
||||
}
|
||||
|
||||
function changeNodeFormId(formId) {
|
||||
// 判断审批表单
|
||||
let find;
|
||||
if (form.formType === DIC_PROP.FORM_TYPE[0].value) {
|
||||
find = dicData.formIdByType.find(f => f.id === formId);
|
||||
} else {
|
||||
form.columns = [];
|
||||
$message.warning("当前选择的系统表单无字段信息，请点击《字段定义》按钮录入")
|
||||
return;
|
||||
}
|
||||
if (validateNull(find.formInfo)) {
|
||||
form.columns = [];
|
||||
$message.warning("当前选择的设计表单无字段信息，请先在《表单设计器》中设计")
|
||||
return;
|
||||
}
|
||||
let formInfo = parseWithFunctions(find.formInfo, true)
|
||||
buildFormFieldPerms(formInfo)
|
||||
}
|
||||
function changeNodeFormId(formId) {
|
||||
// 判断审批表单
|
||||
let find;
|
||||
if (form.formType === DIC_PROP.FORM_TYPE[0].value) {
|
||||
find = dicData.formIdByType.find((f) => f.id === formId);
|
||||
} else {
|
||||
form.columns = [];
|
||||
$message.warning('当前选择的系统表单无字段信息，请点击《字段定义》按钮录入');
|
||||
return;
|
||||
}
|
||||
if (validateNull(find.formInfo)) {
|
||||
form.columns = [];
|
||||
$message.warning('当前选择的设计表单无字段信息，请先在《表单设计器》中设计');
|
||||
return;
|
||||
}
|
||||
let formInfo = parseWithFunctions(find.formInfo, true);
|
||||
buildFormFieldPerms(formInfo);
|
||||
}
|
||||
|
||||
function buildFormFieldPerms(formInfo) {
|
||||
form.columns = []
|
||||
buildFieldPerms(form.columns, formInfo.widgetList);
|
||||
}
|
||||
function buildFormFieldPerms(formInfo) {
|
||||
form.columns = [];
|
||||
buildFieldPerms(form.columns, formInfo.widgetList);
|
||||
}
|
||||
|
||||
const typeChange = (value) => {
|
||||
setPropsValue(disabledFields, false, 'formType', 'label')
|
||||
setPropsValue(hiddenFields, true, 'defFlowId', 'flowNodeId', 'propId', 'label', 'prop', 'subForm', 'propType', 'permType', 'printInfo')
|
||||
if (value === DIC_PROP.FORM_DATA_TYPE[0].value) {
|
||||
disabledFields.formType = true
|
||||
setPropsValue(hiddenFields, false, 'propId', 'label', 'prop', 'subForm', 'propType')
|
||||
form.formType = DIC_PROP.FORM_TYPE[1].value
|
||||
} else if (value === DIC_PROP.FORM_DATA_TYPE[1].value) {
|
||||
disabledFields.label = true
|
||||
setPropsValue(hiddenFields, false, 'defFlowId', 'flowNodeId', 'label', 'permType')
|
||||
} else {
|
||||
hiddenFields.printInfo = true
|
||||
}
|
||||
formTypeChange(form.formType)
|
||||
}
|
||||
const typeChange = (value) => {
|
||||
setPropsValue(disabledFields, false, 'formType', 'label');
|
||||
setPropsValue(hiddenFields, true, 'defFlowId', 'flowNodeId', 'propId', 'label', 'prop', 'subForm', 'propType', 'permType', 'printInfo');
|
||||
if (value === DIC_PROP.FORM_DATA_TYPE[0].value) {
|
||||
disabledFields.formType = true;
|
||||
setPropsValue(hiddenFields, false, 'propId', 'label', 'prop', 'subForm', 'propType');
|
||||
form.formType = DIC_PROP.FORM_TYPE[1].value;
|
||||
} else if (value === DIC_PROP.FORM_DATA_TYPE[1].value) {
|
||||
disabledFields.label = true;
|
||||
setPropsValue(hiddenFields, false, 'defFlowId', 'flowNodeId', 'label', 'permType');
|
||||
} else {
|
||||
hiddenFields.printInfo = true;
|
||||
}
|
||||
formTypeChange(form.formType);
|
||||
};
|
||||
|
||||
const resetFormPerm = () => {
|
||||
if (!form.formId) {
|
||||
$message.warning("请先选择表单名称")
|
||||
return
|
||||
}
|
||||
handleCustomFormPerm(null, null, DIC_PROP.FORM_DATA_TYPE[0].value)
|
||||
}
|
||||
const resetFormPerm = () => {
|
||||
if (!form.formId) {
|
||||
$message.warning('请先选择表单名称');
|
||||
return;
|
||||
}
|
||||
handleCustomFormPerm(null, null, DIC_PROP.FORM_DATA_TYPE[0].value);
|
||||
};
|
||||
|
||||
const onAddItem = () => {
|
||||
if (!form.formId) {
|
||||
$message.warning("请先选择表单名称")
|
||||
return
|
||||
}
|
||||
if (form.type === DIC_PROP.FORM_DATA_TYPE[1].value && !form.flowNodeId) {
|
||||
$message.warning("请先选择节点名称")
|
||||
return
|
||||
}
|
||||
if (validateColumns()) return;
|
||||
let obj = {propId: null, label: '', prop: '', subForm: null, propType: null, permType: null};
|
||||
form.columns.push(obj);
|
||||
}
|
||||
const onAddItem = () => {
|
||||
if (!form.formId) {
|
||||
$message.warning('请先选择表单名称');
|
||||
return;
|
||||
}
|
||||
if (form.type === DIC_PROP.FORM_DATA_TYPE[1].value && !form.flowNodeId) {
|
||||
$message.warning('请先选择节点名称');
|
||||
return;
|
||||
}
|
||||
if (validateColumns()) return;
|
||||
let obj = { propId: null, label: '', prop: '', subForm: null, propType: null, permType: null };
|
||||
form.columns.push(obj);
|
||||
};
|
||||
|
||||
const validateColumns = () => {
|
||||
if (!validateNull(form.columns)) {
|
||||
let find = form.columns.find(s => !s.label || !s.prop);
|
||||
if (find) {
|
||||
$message.warning("请先填写 属性名称 或 属性名")
|
||||
return true
|
||||
}
|
||||
}
|
||||
return false
|
||||
}
|
||||
const validateColumns = () => {
|
||||
if (!validateNull(form.columns)) {
|
||||
let find = form.columns.find((s) => !s.label || !s.prop);
|
||||
if (find) {
|
||||
$message.warning('请先填写 属性名称 或 属性名');
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
const handleDelete = (index: number, row: any) => {
|
||||
form.columns.splice(index, 1)
|
||||
}
|
||||
const handleDelete = (index: number, row: any) => {
|
||||
form.columns.splice(index, 1);
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog, handleSubmit, syncCurrFormInfo
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
handleSubmit,
|
||||
syncCurrFormInfo,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,265 +1,271 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.type')" prop="type">
|
||||
<el-select v-model="form.type" :placeholder="t('formoption.inputTypeTip')" clearable filterable @change="typeChange" :disabled="true">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_DATA_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.formType')" prop="formType">
|
||||
<el-select
|
||||
v-model="form.formType"
|
||||
:placeholder="t('formoption.inputFormTypeTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="formTypeChange"
|
||||
:disabled="disabledFields.formType"
|
||||
>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.type')" prop="type">
|
||||
<el-select v-model="form.type" :placeholder="t('formoption.inputTypeTip')" clearable filterable
|
||||
@change="typeChange" :disabled="true">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_DATA_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.formType')" prop="formType">
|
||||
<el-select v-model="form.formType" :placeholder="t('formoption.inputFormTypeTip')" clearable filterable
|
||||
@change="formTypeChange" :disabled="disabledFields.formType">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.formId')" prop="formId">
|
||||
<el-select v-model="form.formId" :placeholder="t('formoption.inputFormIdTip')" clearable filterable @change="formIdChange">
|
||||
<el-option v-for="(item, index) in dicData.formIdByType" :key="index" :label="item.formName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('formoption.formId')" prop="formId">
|
||||
<el-select v-model="form.formId" :placeholder="t('formoption.inputFormIdTip')" clearable filterable
|
||||
@change="formIdChange">
|
||||
<el-option v-for="(item, index) in dicData.formIdByType" :key="index"
|
||||
:label="item.formName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.defFlowId">
|
||||
<el-form-item :label="t('formoption.defFlowId')" prop="defFlowId">
|
||||
<el-select
|
||||
v-model="form.defFlowId"
|
||||
:placeholder="t('formoption.inputDefFlowIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('defFlowId', ['flowNodeId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.flowNodeId">
|
||||
<el-form-item :label="t('formoption.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="form.flowNodeId" :placeholder="t('formoption.inputFlowNodeIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.defFlowId">
|
||||
<el-form-item :label="t('formoption.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('formoption.inputDefFlowIdTip')" clearable filterable
|
||||
@change="cascadeChange('defFlowId', ['flowNodeId'])">
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.flowNodeId">
|
||||
<el-form-item :label="t('formoption.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="form.flowNodeId" :placeholder="t('formoption.inputFlowNodeIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.propId">
|
||||
<el-form-item :label="t('formoption.propId')" prop="propId">
|
||||
<el-input v-model="form.propId" :placeholder="t('formoption.inputPropIdTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.label">
|
||||
<el-form-item :label="t('formoption.label')" prop="label">
|
||||
<el-input v-model="form.label" :placeholder="t('formoption.inputLabelTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.prop">
|
||||
<el-form-item :label="t('formoption.prop')" prop="prop">
|
||||
<el-input v-model="form.prop" :placeholder="t('formoption.inputPropTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.subForm">
|
||||
<el-form-item :label="t('formoption.subForm')" prop="subForm">
|
||||
<el-input v-model="form.subForm" :placeholder="t('formoption.inputSubFormTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.propType">
|
||||
<el-form-item :label="t('formoption.propType')" prop="propType">
|
||||
<el-input v-model="form.propType" :placeholder="t('formoption.inputPropTypeTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.permType">
|
||||
<el-form-item :label="t('formoption.permType')" prop="type">
|
||||
<el-radio-group v-model="form.permType">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.FORM_PERM_TYPE" :key="index" :label="item.value">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.printInfo">
|
||||
<el-form-item :label="t('formoption.printInfo')" prop="printInfo">
|
||||
<el-input v-model="form.printInfo" :placeholder="t('formoption.inputPrintInfoTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.propId">
|
||||
<el-form-item :label="t('formoption.propId')" prop="propId">
|
||||
<el-input v-model="form.propId" :placeholder="t('formoption.inputPropIdTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.label">
|
||||
<el-form-item :label="t('formoption.label')" prop="label">
|
||||
<el-input v-model="form.label" :placeholder="t('formoption.inputLabelTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.prop">
|
||||
<el-form-item :label="t('formoption.prop')" prop="prop">
|
||||
<el-input v-model="form.prop" :placeholder="t('formoption.inputPropTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.subForm">
|
||||
<el-form-item :label="t('formoption.subForm')" prop="subForm">
|
||||
<el-input v-model="form.subForm" :placeholder="t('formoption.inputSubFormTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.propType">
|
||||
<el-form-item :label="t('formoption.propType')" prop="propType">
|
||||
<el-input v-model="form.propType" :placeholder="t('formoption.inputPropTypeTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.permType">
|
||||
<el-form-item :label="t('formoption.permType')" prop="type">
|
||||
<el-radio-group v-model="form.permType">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.FORM_PERM_TYPE" :key="index" :label="item.value">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="!hiddenFields.printInfo">
|
||||
<el-form-item :label="t('formoption.printInfo')" prop="printInfo">
|
||||
<el-input v-model="form.printInfo" :placeholder="t('formoption.inputPrintInfoTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="FormOptionDialog">
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, putObj } from '/@/api/jsonflow/form-option'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import {setPropsValue} from "/@/flow/support/common";
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
import {DIC_PROP} from "/@/flow/support/dict-prop";
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, putObj } from '/@/api/jsonflow/form-option';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { setPropsValue } from '/@/flow/support/common';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
import { DIC_PROP } from '/@/flow/support/dict-prop';
|
||||
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false)
|
||||
const loading = ref(false)
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
id: '',
|
||||
flowKey: '',
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
propId: '',
|
||||
label: '',
|
||||
prop: '',
|
||||
subForm: '',
|
||||
propType: '',
|
||||
permType: '',
|
||||
formType: '',
|
||||
formId: '',
|
||||
formName: '',
|
||||
path: '',
|
||||
printInfo: '',
|
||||
type: '',
|
||||
});
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
id: '',
|
||||
flowKey: '',
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
propId: '',
|
||||
label: '',
|
||||
prop: '',
|
||||
subForm: '',
|
||||
propType: '',
|
||||
permType: '',
|
||||
formType: '',
|
||||
formId: '',
|
||||
formName: '',
|
||||
path: '',
|
||||
printInfo: '',
|
||||
type: '',
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
formType: [{required: true, message: '表单来源不能为空', trigger: 'blur'}],
|
||||
formId: [{required: true, message: '表单名称不能为空', trigger: 'blur'}],
|
||||
type: [{required: true, message: '数据类型不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
formType: [{ required: true, message: '表单来源不能为空', trigger: 'blur' }],
|
||||
formId: [{ required: true, message: '表单名称不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '数据类型不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "defFlowId"}, {key: "formId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "defFlowId", cascades: ["flowNodeId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
if (key === 'defFlowId') {
|
||||
let find = dicData.defFlowId.find(f => f.id === form.defFlowId);
|
||||
if (find) form.flowKey = find.flowKey
|
||||
else form.flowKey = null
|
||||
}
|
||||
}
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'defFlowId' }, { key: 'formId' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'defFlowId', cascades: ['flowNodeId'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
if (key === 'defFlowId') {
|
||||
let find = dicData.defFlowId.find((f) => f.id === form.defFlowId);
|
||||
if (find) form.flowKey = find.flowKey;
|
||||
else form.flowKey = null;
|
||||
}
|
||||
}
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = async (type: string, id: string, dataType: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
// 打开弹窗
|
||||
const openDialog = async (type: string, id: string, dataType: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(async () => {
|
||||
dataFormRef.value.resetFields()
|
||||
// 获取FormOption信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
await getFormOptionData(id)
|
||||
await onCascade(form);
|
||||
}
|
||||
if (type === 'add') form.type = dataType
|
||||
typeChange(form.type);
|
||||
})
|
||||
};
|
||||
// 重置表单数据
|
||||
nextTick(async () => {
|
||||
dataFormRef.value.resetFields();
|
||||
// 获取FormOption信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
await getFormOptionData(id);
|
||||
await onCascade(form);
|
||||
}
|
||||
if (type === 'add') form.type = dataType;
|
||||
typeChange(form.type);
|
||||
});
|
||||
};
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
await putObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
try {
|
||||
loading.value = true;
|
||||
await putObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getFormOptionData = async (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
let res = await getObj(id);
|
||||
Object.assign(form, res.data)
|
||||
loading.value = false
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getFormOptionData = async (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
let res = await getObj(id);
|
||||
Object.assign(form, res.data);
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
// 定义字段显隐
|
||||
const hiddenFields = reactive({
|
||||
defFlowId: true,
|
||||
flowNodeId: true,
|
||||
label: true,
|
||||
prop: true,
|
||||
propId: true,
|
||||
subForm: true,
|
||||
propType: true,
|
||||
permType: true,
|
||||
printInfo: true,
|
||||
});
|
||||
// 定义字段显隐
|
||||
const hiddenFields = reactive({
|
||||
defFlowId: true,
|
||||
flowNodeId: true,
|
||||
label: true,
|
||||
prop: true,
|
||||
propId: true,
|
||||
subForm: true,
|
||||
propType: true,
|
||||
permType: true,
|
||||
printInfo: true,
|
||||
});
|
||||
|
||||
// 定义字段是否可编辑
|
||||
const disabledFields = reactive({
|
||||
formType: false,
|
||||
});
|
||||
// 定义字段是否可编辑
|
||||
const disabledFields = reactive({
|
||||
formType: false,
|
||||
});
|
||||
|
||||
const formTypeChange = (value) => {
|
||||
if (value) dicData.formIdByType = dicData.formId.filter(f => f.type === value)
|
||||
else dicData.formIdByType = []
|
||||
}
|
||||
const formTypeChange = (value) => {
|
||||
if (value) dicData.formIdByType = dicData.formId.filter((f) => f.type === value);
|
||||
else dicData.formIdByType = [];
|
||||
};
|
||||
|
||||
const formIdChange = (value) => {
|
||||
if (!value) return
|
||||
let find = dicData.formIdByType.find(f => f.id === value);
|
||||
form.formName = find.formName
|
||||
form.path = find.path
|
||||
}
|
||||
const formIdChange = (value) => {
|
||||
if (!value) return;
|
||||
let find = dicData.formIdByType.find((f) => f.id === value);
|
||||
form.formName = find.formName;
|
||||
form.path = find.path;
|
||||
};
|
||||
|
||||
const typeChange = (value) => {
|
||||
disabledFields.formType = false
|
||||
setPropsValue(hiddenFields, true, 'defFlowId', 'flowNodeId', 'propId', 'label', 'prop', 'subForm', 'propType', 'permType', 'printInfo')
|
||||
if (value === DIC_PROP.FORM_DATA_TYPE[0].value) {
|
||||
disabledFields.formType = true
|
||||
setPropsValue(hiddenFields, false, 'propId', 'label', 'prop', 'subForm', 'propType')
|
||||
form.formType = DIC_PROP.FORM_TYPE[1].value
|
||||
} else if (value === DIC_PROP.FORM_DATA_TYPE[1].value) {
|
||||
setPropsValue(hiddenFields, false, 'defFlowId', 'flowNodeId', 'propId', 'label', 'prop', 'subForm', 'propType', 'permType')
|
||||
} else {
|
||||
hiddenFields.printInfo = true
|
||||
}
|
||||
formTypeChange(form.formType)
|
||||
}
|
||||
const typeChange = (value) => {
|
||||
disabledFields.formType = false;
|
||||
setPropsValue(hiddenFields, true, 'defFlowId', 'flowNodeId', 'propId', 'label', 'prop', 'subForm', 'propType', 'permType', 'printInfo');
|
||||
if (value === DIC_PROP.FORM_DATA_TYPE[0].value) {
|
||||
disabledFields.formType = true;
|
||||
setPropsValue(hiddenFields, false, 'propId', 'label', 'prop', 'subForm', 'propType');
|
||||
form.formType = DIC_PROP.FORM_TYPE[1].value;
|
||||
} else if (value === DIC_PROP.FORM_DATA_TYPE[1].value) {
|
||||
setPropsValue(hiddenFields, false, 'defFlowId', 'flowNodeId', 'propId', 'label', 'prop', 'subForm', 'propType', 'permType');
|
||||
} else {
|
||||
hiddenFields.printInfo = true;
|
||||
}
|
||||
formTypeChange(form.formType);
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,39 +1,39 @@
|
||||
export default {
|
||||
formoption: {
|
||||
index: '#',
|
||||
importFormOptionTip: ' import FormOption',
|
||||
id: 'id',
|
||||
defFlowId: 'defFlowId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
flowKey: 'flowKey',
|
||||
propId: 'propId',
|
||||
label: 'label',
|
||||
prop: 'prop',
|
||||
subForm: 'subForm',
|
||||
propType: 'propType',
|
||||
printInfo: 'printInfo',
|
||||
permType: 'permType',
|
||||
formType: 'formType',
|
||||
formId: 'formId',
|
||||
formName: 'formName',
|
||||
path: 'path',
|
||||
type: 'type',
|
||||
resetBtn: 'resetPerm',
|
||||
inputIdTip: 'input id',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputPropIdTip: 'input propId',
|
||||
inputLabelTip: 'input label',
|
||||
inputPropTip: 'input prop',
|
||||
inputSubFormTip: 'input subForm',
|
||||
inputPropTypeTip: 'input propType',
|
||||
inputPermTypeTip: 'input permType',
|
||||
inputFormTypeTip: 'input formType',
|
||||
inputFormIdTip: 'input formId',
|
||||
inputFormNameTip: 'input formName',
|
||||
inputPathTip: 'input path',
|
||||
inputPrintInfoTip: 'input printInfo',
|
||||
inputTypeTip: 'input type',
|
||||
}
|
||||
}
|
||||
formoption: {
|
||||
index: '#',
|
||||
importFormOptionTip: ' import FormOption',
|
||||
id: 'id',
|
||||
defFlowId: 'defFlowId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
flowKey: 'flowKey',
|
||||
propId: 'propId',
|
||||
label: 'label',
|
||||
prop: 'prop',
|
||||
subForm: 'subForm',
|
||||
propType: 'propType',
|
||||
printInfo: 'printInfo',
|
||||
permType: 'permType',
|
||||
formType: 'formType',
|
||||
formId: 'formId',
|
||||
formName: 'formName',
|
||||
path: 'path',
|
||||
type: 'type',
|
||||
resetBtn: 'resetPerm',
|
||||
inputIdTip: 'input id',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputPropIdTip: 'input propId',
|
||||
inputLabelTip: 'input label',
|
||||
inputPropTip: 'input prop',
|
||||
inputSubFormTip: 'input subForm',
|
||||
inputPropTypeTip: 'input propType',
|
||||
inputPermTypeTip: 'input permType',
|
||||
inputFormTypeTip: 'input formType',
|
||||
inputFormIdTip: 'input formId',
|
||||
inputFormNameTip: 'input formName',
|
||||
inputPathTip: 'input path',
|
||||
inputPrintInfoTip: 'input printInfo',
|
||||
inputTypeTip: 'input type',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,39 +1,39 @@
|
||||
export default {
|
||||
formoption: {
|
||||
index: '#',
|
||||
importFormOptionTip: '导入表单操作表',
|
||||
id: '',
|
||||
flowKey: '流程KEY',
|
||||
defFlowId: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
propId: '属性唯一ID',
|
||||
label: '属性名称',
|
||||
prop: '属性名',
|
||||
subForm: '子表单属性名',
|
||||
propType: '属性类型',
|
||||
printInfo: '打印信息',
|
||||
permType: '权限类型',
|
||||
formType: '表单来源',
|
||||
formId: '表单名称',
|
||||
formName: '表单名称',
|
||||
path: '表单路径',
|
||||
type: '数据类型',
|
||||
resetBtn: '重置权限',
|
||||
inputIdTip: '请输入',
|
||||
inputFlowKeyTip: '请选择流程KEY',
|
||||
inputDefFlowIdTip: '请选择流程名称',
|
||||
inputFlowNodeIdTip: '请先选择流程名称',
|
||||
inputPropIdTip: '表单设计器的属性唯一ID',
|
||||
inputLabelTip: '例如：用户名',
|
||||
inputPropTip: '例如：userName',
|
||||
inputSubFormTip: '若是子表数据则需填写',
|
||||
inputPropTypeTip: '打印设计的属性类型，参考PRINT_FORMAT常量',
|
||||
inputPermTypeTip: '请选择权限类型',
|
||||
inputFormTypeTip: '请选择表单来源',
|
||||
inputFormIdTip: '请先选择表单名称',
|
||||
inputFormNameTip: '请输入表单名称',
|
||||
inputPathTip: '请输入表单路径',
|
||||
inputPrintInfoTip: '请输入打印信息',
|
||||
inputTypeTip: '请选择数据类型',
|
||||
}
|
||||
}
|
||||
formoption: {
|
||||
index: '#',
|
||||
importFormOptionTip: '导入表单操作表',
|
||||
id: '',
|
||||
flowKey: '流程KEY',
|
||||
defFlowId: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
propId: '属性唯一ID',
|
||||
label: '属性名称',
|
||||
prop: '属性名',
|
||||
subForm: '子表单属性名',
|
||||
propType: '属性类型',
|
||||
printInfo: '打印信息',
|
||||
permType: '权限类型',
|
||||
formType: '表单来源',
|
||||
formId: '表单名称',
|
||||
formName: '表单名称',
|
||||
path: '表单路径',
|
||||
type: '数据类型',
|
||||
resetBtn: '重置权限',
|
||||
inputIdTip: '请输入',
|
||||
inputFlowKeyTip: '请选择流程KEY',
|
||||
inputDefFlowIdTip: '请选择流程名称',
|
||||
inputFlowNodeIdTip: '请先选择流程名称',
|
||||
inputPropIdTip: '表单设计器的属性唯一ID',
|
||||
inputLabelTip: '例如：用户名',
|
||||
inputPropTip: '例如：userName',
|
||||
inputSubFormTip: '若是子表数据则需填写',
|
||||
inputPropTypeTip: '打印设计的属性类型，参考PRINT_FORMAT常量',
|
||||
inputPermTypeTip: '请选择权限类型',
|
||||
inputFormTypeTip: '请选择表单来源',
|
||||
inputFormIdTip: '请先选择表单名称',
|
||||
inputFormNameTip: '请输入表单名称',
|
||||
inputPathTip: '请输入表单路径',
|
||||
inputPrintInfoTip: '请输入打印信息',
|
||||
inputTypeTip: '请选择数据类型',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,280 +1,300 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="t('formoption.type')" prop="type">
|
||||
<el-select v-model="state.queryForm.type" :placeholder="t('formoption.inputTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_DATA_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('formoption.formType')" prop="formType">
|
||||
<el-select v-model="state.queryForm.formType" :placeholder="t('formoption.inputFormTypeTip')" clearable
|
||||
filterable
|
||||
@change="formTypeChange">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_TYPE" :key="index" :label="item.label"
|
||||
:value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('formoption.formId')" prop="formId">
|
||||
<el-select v-model="state.queryForm.formId" :placeholder="t('formoption.inputFormIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in dicData.formIdByType" :key="index"
|
||||
:label="item.formName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('formoption.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="state.queryForm.defFlowId" :placeholder="t('formoption.inputDefFlowIdTip')"
|
||||
clearable filterable @change="cascadeChange('defFlowId', ['flowNodeId'])">
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('formoption.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="state.queryForm.flowNodeId" :placeholder="t('formoption.inputFlowNodeIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-button icon="CirclePlus" type="primary" class="ml10" @click="openFormDefPerm('add', null, '0')"
|
||||
v-auth="'jsonflow_formoption_add'">字段定义
|
||||
</el-button>
|
||||
<el-button icon="Setting" type="primary" class="ml10" @click="openFormDefPerm('add', null, '1')"
|
||||
v-auth="'jsonflow_formoption_add'">权限配置
|
||||
</el-button>
|
||||
<el-button icon="Pointer" type="primary" class="ml10" @click="handlePrintTemplate"
|
||||
v-auth="'jsonflow_formoption_add'">打印设计
|
||||
</el-button>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_formoption_del'" @click="handleDelete(selectObjs)">
|
||||
{{ $t('common.delBtn') }}
|
||||
</el-button>
|
||||
<right-toolbar v-model:showSearch="showSearch" class="ml10" style="float: right;margin-right: 20px"
|
||||
:export="'jsonflow_formoption_export'" @exportExcel="exportExcel"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column fixed="left" type="index" :label="t('formoption.index')" width="40" />
|
||||
<el-table-column prop="type" :label="t('formoption.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_DATA_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="formType" :label="t('formoption.formType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_TYPE" :value="scope.row.formType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="formName" :label="t('formoption.formName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="path" :label="t('formoption.path')" show-overflow-tooltip/>
|
||||
<el-table-column prop="defFlowId" :label="t('formoption.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.defFlowId" :value="scope.row.defFlowId"
|
||||
:valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="flowNodeId" :label="t('formoption.flowNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.flowNodeId" :value="scope.row.flowNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="propId" :label="t('formoption.propId')" show-overflow-tooltip/>
|
||||
<el-table-column prop="label" :label="t('formoption.label')" show-overflow-tooltip/>
|
||||
<el-table-column prop="prop" :label="t('formoption.prop')" show-overflow-tooltip/>
|
||||
<el-table-column prop="subForm" :label="t('formoption.subForm')" show-overflow-tooltip/>
|
||||
<el-table-column prop="propType" :label="t('formoption.propType')" show-overflow-tooltip/>
|
||||
<el-table-column prop="permType" :label="t('formoption.permType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_PERM_TYPE" :value="scope.row.permType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="printInfo" :label="t('formoption.printInfo')" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" fixed="right" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="handleRowEdit(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="t('formoption.type')" prop="type">
|
||||
<el-select v-model="state.queryForm.type" :placeholder="t('formoption.inputTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_DATA_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('formoption.formType')" prop="formType">
|
||||
<el-select
|
||||
v-model="state.queryForm.formType"
|
||||
:placeholder="t('formoption.inputFormTypeTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="formTypeChange"
|
||||
>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FORM_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('formoption.formId')" prop="formId">
|
||||
<el-select v-model="state.queryForm.formId" :placeholder="t('formoption.inputFormIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in dicData.formIdByType" :key="index" :label="item.formName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('formoption.defFlowId')" prop="defFlowId">
|
||||
<el-select
|
||||
v-model="state.queryForm.defFlowId"
|
||||
:placeholder="t('formoption.inputDefFlowIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('defFlowId', ['flowNodeId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.defFlowId" :key="index" :label="item.flowName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('formoption.flowNodeId')" prop="flowNodeId">
|
||||
<el-select v-model="state.queryForm.flowNodeId" :placeholder="t('formoption.inputFlowNodeIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-button icon="CirclePlus" type="primary" class="ml10" @click="openFormDefPerm('add', null, '0')" v-auth="'jsonflow_formoption_add'"
|
||||
>字段定义
|
||||
</el-button>
|
||||
<el-button icon="Setting" type="primary" class="ml10" @click="openFormDefPerm('add', null, '1')" v-auth="'jsonflow_formoption_add'"
|
||||
>权限配置
|
||||
</el-button>
|
||||
<el-button icon="Pointer" type="primary" class="ml10" @click="handlePrintTemplate" v-auth="'jsonflow_formoption_add'">打印设计 </el-button>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_formoption_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
{{ $t('common.delBtn') }}
|
||||
</el-button>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
:export="'jsonflow_formoption_export'"
|
||||
@exportExcel="exportExcel"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column fixed="left" type="index" :label="t('formoption.index')" width="40" />
|
||||
<el-table-column prop="type" :label="t('formoption.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_DATA_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="formType" :label="t('formoption.formType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_TYPE" :value="scope.row.formType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="formName" :label="t('formoption.formName')" show-overflow-tooltip />
|
||||
<el-table-column prop="path" :label="t('formoption.path')" show-overflow-tooltip />
|
||||
<el-table-column prop="defFlowId" :label="t('formoption.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.defFlowId" :value="scope.row.defFlowId" :valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="flowNodeId" :label="t('formoption.flowNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.flowNodeId" :value="scope.row.flowNodeId" :valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="propId" :label="t('formoption.propId')" show-overflow-tooltip />
|
||||
<el-table-column prop="label" :label="t('formoption.label')" show-overflow-tooltip />
|
||||
<el-table-column prop="prop" :label="t('formoption.prop')" show-overflow-tooltip />
|
||||
<el-table-column prop="subForm" :label="t('formoption.subForm')" show-overflow-tooltip />
|
||||
<el-table-column prop="propType" :label="t('formoption.propType')" show-overflow-tooltip />
|
||||
<el-table-column prop="permType" :label="t('formoption.permType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_PERM_TYPE" :value="scope.row.permType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="printInfo" :label="t('formoption.printInfo')" show-overflow-tooltip />
|
||||
<el-table-column :label="$t('common.action')" fixed="right" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="handleRowEdit(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
|
||||
<!-- 打印模板设计器 -->
|
||||
<el-drawer class="tinymce-print-drawer" append-to-body direction="rtl"
|
||||
v-model="data.showTinymceEditor" size="100%"
|
||||
:title="data.tinymceTitle" @close="getDataList">
|
||||
<tinymce-editor v-if="data.showTinymceEditor" :currFlowForm="data.currFlowForm"></tinymce-editor>
|
||||
</el-drawer>
|
||||
<!-- 打印模板设计器 -->
|
||||
<el-drawer
|
||||
class="tinymce-print-drawer"
|
||||
append-to-body
|
||||
direction="rtl"
|
||||
v-model="data.showTinymceEditor"
|
||||
size="100%"
|
||||
:title="data.tinymceTitle"
|
||||
@close="getDataList"
|
||||
>
|
||||
<tinymce-editor v-if="data.showTinymceEditor" :currFlowForm="data.currFlowForm"></tinymce-editor>
|
||||
</el-drawer>
|
||||
|
||||
<el-dialog title="新增或修改" v-model="data.formDefPermVisible" width="80%"
|
||||
v-if="data.formDefPermVisible"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<form-def-perm :formDefPerm="data.formDefPerm" ref="formDefPermRef" @refresh="getDataList(false)" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
<el-dialog
|
||||
title="新增或修改"
|
||||
v-model="data.formDefPermVisible"
|
||||
width="80%"
|
||||
v-if="data.formDefPermVisible"
|
||||
:close-on-click-modal="false"
|
||||
draggable
|
||||
>
|
||||
<form-def-perm :formDefPerm="data.formDefPerm" ref="formDefPermRef" @refresh="getDataList(false)" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="FormOption">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/form-option";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
import {DIC_PROP} from "/@/flow/support/dict-prop";
|
||||
import {deepClone} from "/@/utils/other";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/form-option';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
import { DIC_PROP } from '/@/flow/support/dict-prop';
|
||||
import { deepClone } from '/@/utils/other';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const FormDefPerm = defineAsyncComponent(() => import('./form-def-perm.vue'));
|
||||
const TinymceEditor = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceEditor.vue'));
|
||||
const { t } = useI18n()
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const FormDefPerm = defineAsyncComponent(() => import('./form-def-perm.vue'));
|
||||
const TinymceEditor = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceEditor.vue'));
|
||||
const { t } = useI18n();
|
||||
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "defFlowId"}, {key: "flowNodeId"}, {key: "formId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "defFlowId", cascades: ["flowNodeId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(state.queryForm, {key: key, cascades: cascades});
|
||||
}
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'defFlowId' }, { key: 'flowNodeId' }, { key: 'formId' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'defFlowId', cascades: ['flowNodeId'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(state.queryForm, { key: key, cascades: cascades });
|
||||
}
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
const formDefPermRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
const formDefPermRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
queryRef.value.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
queryRef.value.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length
|
||||
}
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/form-option/export', state.queryForm, 'formoption.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/form-option/export', state.queryForm, 'formoption.xlsx');
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err);
|
||||
}
|
||||
};
|
||||
|
||||
const formTypeChange = (value) => {
|
||||
if (value) dicData.formIdByType = dicData.formId.filter(f => f.type === value)
|
||||
else dicData.formIdByType = []
|
||||
state.queryForm.formId = null
|
||||
}
|
||||
const formTypeChange = (value) => {
|
||||
if (value) dicData.formIdByType = dicData.formId.filter((f) => f.type === value);
|
||||
else dicData.formIdByType = [];
|
||||
state.queryForm.formId = null;
|
||||
};
|
||||
|
||||
function handleRowEdit(row){
|
||||
if (row.type === DIC_PROP.FORM_DATA_TYPE[2].value) {
|
||||
handlePrintTemplate(row, true)
|
||||
} else {
|
||||
formDialogRef.value.openDialog('edit', row.id)
|
||||
}
|
||||
}
|
||||
function handleRowEdit(row) {
|
||||
if (row.type === DIC_PROP.FORM_DATA_TYPE[2].value) {
|
||||
handlePrintTemplate(row, true);
|
||||
} else {
|
||||
formDialogRef.value.openDialog('edit', row.id);
|
||||
}
|
||||
}
|
||||
|
||||
const data = reactive({
|
||||
currFlowForm: {},
|
||||
showTinymceEditor: false,
|
||||
formDefPermVisible: false,
|
||||
formDefPerm: {},
|
||||
tinymceTitle: '',
|
||||
})
|
||||
const data = reactive({
|
||||
currFlowForm: {},
|
||||
showTinymceEditor: false,
|
||||
formDefPermVisible: false,
|
||||
formDefPerm: {},
|
||||
tinymceTitle: '',
|
||||
});
|
||||
|
||||
const openFormDefPerm = async (type: string, id: string, dataType: string) => {
|
||||
data.formDefPermVisible = true
|
||||
data.formDefPerm = {type, id, dataType}
|
||||
}
|
||||
|
||||
function handlePrintTemplate(row, isExist) {
|
||||
data.currFlowForm = {}
|
||||
if (isExist) {
|
||||
data.currFlowForm = deepClone(row)
|
||||
data.currFlowForm.isForm = true
|
||||
}
|
||||
data.tinymceTitle = "打印模板设计器（自定义打印格式）"
|
||||
data.showTinymceEditor = true
|
||||
}
|
||||
const openFormDefPerm = async (type: string, id: string, dataType: string) => {
|
||||
data.formDefPermVisible = true;
|
||||
data.formDefPerm = { type, id, dataType };
|
||||
};
|
||||
|
||||
function handlePrintTemplate(row, isExist) {
|
||||
data.currFlowForm = {};
|
||||
if (isExist) {
|
||||
data.currFlowForm = deepClone(row);
|
||||
data.currFlowForm.isForm = true;
|
||||
}
|
||||
data.tinymceTitle = '打印模板设计器（自定义打印格式）';
|
||||
data.showTinymceEditor = true;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,37 +1,34 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('flowApplication.formName')" prop="formName" >
|
||||
<el-input :placeholder="t('flowApplication.inputFormNameTip')" v-model="state.queryForm.formName" clearable
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('flowApplication.status')" prop="status" >
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('flowApplication.inputStatusTip')" clearable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.TEMP_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.oneBtnDesign') }}
|
||||
</template>
|
||||
<el-button v-auth="'order_flowapplication_add'" type="primary" class="ml10" icon="Pointer"
|
||||
@click="handleDesignFlow(true)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('flowApplication.formName')" prop="formName">
|
||||
<el-input :placeholder="t('flowApplication.inputFormNameTip')" v-model="state.queryForm.formName" clearable style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('flowApplication.status')" prop="status">
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('flowApplication.inputStatusTip')" clearable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.TEMP_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.oneBtnDesign') }}
|
||||
</template>
|
||||
<el-button v-auth="'order_flowapplication_add'" type="primary" class="ml10" icon="Pointer" @click="handleDesignFlow(true)"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<!-- <el-tooltip placement="top">
|
||||
<!-- <el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
@@ -40,337 +37,335 @@
|
||||
</el-button>
|
||||
</el-tooltip>-->
|
||||
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'order_flowapplication_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'order_flowapplication_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'order_flowapplication_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('flowApplication.index')" width="60" />
|
||||
<!-- <el-table-column prop="flowKey" :label="t('flowApplication.flowKey')" show-overflow-tooltip/>-->
|
||||
<el-table-column prop="icon" :label="t('flowApplication.icon')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<SvgIcon :name="scope.row.icon" :size="20" color="#409EFF"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="formName" :label="t('flowApplication.formName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="groupName" :label="t('flowApplication.groupName')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="tableName" :label="t('flowApplication.tableName')" show-overflow-tooltip/>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'order_flowapplication_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('flowApplication.index')" width="60" />
|
||||
<!-- <el-table-column prop="flowKey" :label="t('flowApplication.flowKey')" show-overflow-tooltip/>-->
|
||||
<el-table-column prop="icon" :label="t('flowApplication.icon')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<SvgIcon :name="scope.row.icon" :size="20" color="#409EFF" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="formName" :label="t('flowApplication.formName')" show-overflow-tooltip />
|
||||
<el-table-column prop="groupName" :label="t('flowApplication.groupName')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="tableName" :label="t('flowApplication.tableName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="permission" :label="t('flowApplication.permission')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.permission" :value="scope.row.permission"
|
||||
:valueKey="'roleId'" :showKey="'roleName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="remark" :label="t('flowApplication.remark')" show-overflow-tooltip/>
|
||||
<el-table-column prop="type" :label="t('flowApplication.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="t('flowApplication.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.TEMP_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="version" :label="t('flowApplication.version')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="createUser" :label="t('flowApplication.createUser')" show-overflow-tooltip>
|
||||
<el-table-column prop="remark" :label="t('flowApplication.remark')" show-overflow-tooltip />
|
||||
<el-table-column prop="type" :label="t('flowApplication.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="t('flowApplication.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.TEMP_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="version" :label="t('flowApplication.version')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="createUser" :label="t('flowApplication.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('flowApplication.createTime')" show-overflow-tooltip/>-->
|
||||
<el-table-column :label="$t('common.action')" width="200">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-table-column :label="$t('common.action')" width="200">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top" v-if="scope.row.tableName">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.viewForm') }}
|
||||
</template>
|
||||
<el-button icon="ZoomIn" text type="primary" @click="handleViewOrder(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.defFlowId">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.viewFlow') }}
|
||||
</template>
|
||||
<el-button icon="Share" text type="primary" @click="openPreview(scope.row.defFlowId)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.status === '-1' || scope.row.status === '1'">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.printTemplate') }}
|
||||
</template>
|
||||
<el-button icon="Document" text type="primary" @click="handlePrintTemplate(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.tableName">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.viewForm') }}
|
||||
</template>
|
||||
<el-button icon="ZoomIn" text type="primary" @click="handleViewOrder(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.defFlowId">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.viewFlow') }}
|
||||
</template>
|
||||
<el-button icon="Share" text type="primary" @click="openPreview(scope.row.defFlowId)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.status === '-1' || scope.row.status === '1'">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.printTemplate') }}
|
||||
</template>
|
||||
<el-button icon="Document" text type="primary" @click="handlePrintTemplate(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top" v-if="scope.row.status === '-1' || scope.row.status === '1'">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.onceMoreDesign') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="Pointer" v-auth="'order_flowapplication_edit'"
|
||||
@click.native="handleDesignFlow(true, scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<el-tooltip placement="top" v-if="scope.row.status === '-1' || scope.row.status === '1'">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.onceMoreDesign') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="Pointer" v-auth="'order_flowapplication_edit'" @click.native="handleDesignFlow(true, scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
|
||||
<!-- 表单设计 -->
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer" direction="rtl"
|
||||
append-to-body size="100%"
|
||||
v-model="data.showDesignFlow"
|
||||
:with-header="false"
|
||||
>
|
||||
<flow-form-design v-if="data.showDesignFlow" :currFlowForm="data.currFlowForm" @handleDesignFlow="handleDesignFlow"></flow-form-design>
|
||||
</el-drawer>
|
||||
<!-- 表单设计 -->
|
||||
<el-drawer class="flow-overflow-drawer" direction="rtl" append-to-body size="100%" v-model="data.showDesignFlow" :with-header="false">
|
||||
<flow-form-design v-if="data.showDesignFlow" :currFlowForm="data.currFlowForm" @handleDesignFlow="handleDesignFlow"></flow-form-design>
|
||||
</el-drawer>
|
||||
|
||||
<el-dialog v-model="data.showHandleForm"
|
||||
top="20px" width="90%"
|
||||
title="查看表单" append-to-body>
|
||||
<custom-form v-if="data.showHandleForm" :curr-job="data.currFlowForm" @onHandleForm="onHandleForm"></custom-form>
|
||||
</el-dialog>
|
||||
<el-dialog v-model="data.showHandleForm" top="20px" width="90%" title="查看表单" append-to-body>
|
||||
<custom-form v-if="data.showHandleForm" :curr-job="data.currFlowForm" @onHandleForm="onHandleForm"></custom-form>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 查看表单 -->
|
||||
<el-dialog v-model="data.showViewOrder" top="20px" width="90%"
|
||||
title="查看表单" append-to-body>
|
||||
<form-render v-if="data.showViewOrder" :currFlowForm="data.currFlowForm" :renderType="'-1'"></form-render>
|
||||
</el-dialog>
|
||||
<!-- 查看表单 -->
|
||||
<el-dialog v-model="data.showViewOrder" top="20px" width="90%" title="查看表单" append-to-body>
|
||||
<form-render v-if="data.showViewOrder" :currFlowForm="data.currFlowForm" :renderType="'-1'"></form-render>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer" direction="rtl"
|
||||
append-to-body size="90%"
|
||||
v-model="data.showFlowPic"
|
||||
>
|
||||
<flow-photo :currJob="data.currFlowForm" v-if="data.showFlowPic"></flow-photo>
|
||||
</el-drawer>
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer class="flow-overflow-drawer" direction="rtl" append-to-body size="90%" v-model="data.showFlowPic">
|
||||
<flow-photo :currJob="data.currFlowForm" v-if="data.showFlowPic"></flow-photo>
|
||||
</el-drawer>
|
||||
|
||||
<!-- 打印模板设计器 -->
|
||||
<el-drawer class="tinymce-print-drawer" append-to-body direction="rtl"
|
||||
v-model="data.showTinymceEditor" size="100%"
|
||||
:title="data.tinymceTitle" @close="getDataList">
|
||||
<tinymce-editor v-if="data.showTinymceEditor" :currFlowForm="data.currFlowForm"></tinymce-editor>
|
||||
</el-drawer>
|
||||
</div>
|
||||
<!-- 打印模板设计器 -->
|
||||
<el-drawer
|
||||
class="tinymce-print-drawer"
|
||||
append-to-body
|
||||
direction="rtl"
|
||||
v-model="data.showTinymceEditor"
|
||||
size="100%"
|
||||
:title="data.tinymceTitle"
|
||||
@close="getDataList"
|
||||
>
|
||||
<tinymce-editor v-if="data.showTinymceEditor" :currFlowForm="data.currFlowForm"></tinymce-editor>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemFlowApplication">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import {fetchList, delObjs, putObj} from "/@/api/order/flow-application";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onLoadDicUrl, onLoaded} from "/@/flow/components/convert-name/convert";
|
||||
import other, {deepClone} from '/@/utils/other';
|
||||
import {parseWithFunctions} from "/@/flow";
|
||||
import {utils} from "/@/flow/designer/utils/common";
|
||||
import {useUserInfo} from "/@/stores/userInfo";
|
||||
import {handleCustomForm, vueKey} from "/@/api/order/order-key-vue";
|
||||
import * as jsonflow from "/@/flow/designer/api/jsonflow";
|
||||
import * as defFlow from "/@/api/jsonflow/def-flow";
|
||||
import {validateNull} from "/@/utils/validate";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs, putObj } from '/@/api/order/flow-application';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoadDicUrl, onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
import other, { deepClone } from '/@/utils/other';
|
||||
import { parseWithFunctions } from '/@/flow';
|
||||
import { utils } from '/@/flow/designer/utils/common';
|
||||
import { useUserInfo } from '/@/stores/userInfo';
|
||||
import { handleCustomForm, vueKey } from '/@/api/order/order-key-vue';
|
||||
import * as jsonflow from '/@/flow/designer/api/jsonflow';
|
||||
import * as defFlow from '/@/api/jsonflow/def-flow';
|
||||
import { validateNull } from '/@/utils/validate';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('/@/flow/components/onebtn-design/form.vue'));
|
||||
const FlowFormDesign = defineAsyncComponent(() => import('/@/flow/components/onebtn-design/design.vue'));
|
||||
const FormRender = defineAsyncComponent(() => import('/@/flow/components/form-create/render.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('/@/views/jsonflow/flow-design/view.vue'));
|
||||
const CustomForm = defineAsyncComponent(() => import('/@/flow/components/custom-form/handle.vue'));
|
||||
const TinymceEditor = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceEditor.vue'));
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('/@/flow/components/onebtn-design/form.vue'));
|
||||
const FlowFormDesign = defineAsyncComponent(() => import('/@/flow/components/onebtn-design/design.vue'));
|
||||
const FormRender = defineAsyncComponent(() => import('/@/flow/components/form-create/render.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('/@/views/jsonflow/flow-design/view.vue'));
|
||||
const CustomForm = defineAsyncComponent(() => import('/@/flow/components/custom-form/handle.vue'));
|
||||
const TinymceEditor = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceEditor.vue'));
|
||||
|
||||
const userInfo = useUserInfo();
|
||||
const { t } = useI18n()
|
||||
// 定义查询字典
|
||||
const userInfo = useUserInfo();
|
||||
const { t } = useI18n();
|
||||
// 定义查询字典
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
// const onLoad = onLoadDicUrl({key: "permission"});
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
// const onLoad = onLoadDicUrl({key: "permission"});
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {
|
||||
isQueryForm: '1'
|
||||
},
|
||||
pageList: fetchList,
|
||||
// onLoaded: onLoaded({key: "createUser"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {
|
||||
isQueryForm: '1',
|
||||
},
|
||||
pageList: fetchList,
|
||||
// onLoaded: onLoaded({key: "createUser"}),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/order/flow-application/export', state.queryForm, 'flow-application.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/order/flow-application/export', state.queryForm, 'flow-application.xlsx');
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
let delIdList = []
|
||||
let delList = state.dataList.filter(f => ids.includes(f.id));
|
||||
for (const each of delList) {
|
||||
delIdList.push(each.defFlowId)
|
||||
let exists = await jsonflow.listRunFlowsByDefFlowId(each.defFlowId, each.version)
|
||||
if (!validateNull(exists.data)) {
|
||||
useMessage().error('当前删除的模型版本已存在流程实例! 请勿删除');
|
||||
return
|
||||
}
|
||||
}
|
||||
let delIdList = [];
|
||||
let delList = state.dataList.filter((f) => ids.includes(f.id));
|
||||
for (const each of delList) {
|
||||
delIdList.push(each.defFlowId);
|
||||
let exists = await jsonflow.listRunFlowsByDefFlowId(each.defFlowId, each.version);
|
||||
if (!validateNull(exists.data)) {
|
||||
useMessage().error('当前删除的模型版本已存在流程实例! 请勿删除');
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
await defFlow.delObjs(delIdList);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
await defFlow.delObjs(delIdList);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
|
||||
const data = reactive({
|
||||
showViewOrder: false,
|
||||
showDesignFlow: false,
|
||||
showFlowPic: false,
|
||||
currFlowForm: {},
|
||||
showTinymceEditor: false,
|
||||
tinymceTitle: '',
|
||||
showHandleForm: false,
|
||||
})
|
||||
const data = reactive({
|
||||
showViewOrder: false,
|
||||
showDesignFlow: false,
|
||||
showFlowPic: false,
|
||||
currFlowForm: {},
|
||||
showTinymceEditor: false,
|
||||
tinymceTitle: '',
|
||||
showHandleForm: false,
|
||||
});
|
||||
|
||||
function openPreview(defFlowId) {
|
||||
data.currFlowForm = {defFlowId: defFlowId}
|
||||
data.showFlowPic = true
|
||||
}
|
||||
function openPreview(defFlowId) {
|
||||
data.currFlowForm = { defFlowId: defFlowId };
|
||||
data.showFlowPic = true;
|
||||
}
|
||||
|
||||
function handlePrintTemplate(row) {
|
||||
data.currFlowForm = {id: row.id, formType: row.type, formId: row.id, formName: row.formName, path: row.path, isForm: true}
|
||||
data.currFlowForm.formInfo = row.formInfo
|
||||
data.tinymceTitle = "打印模板设计器（自定义《" + row.formName + "》打印格式）"
|
||||
data.showTinymceEditor = true
|
||||
}
|
||||
function handlePrintTemplate(row) {
|
||||
data.currFlowForm = { id: row.id, formType: row.type, formId: row.id, formName: row.formName, path: row.path, isForm: true };
|
||||
data.currFlowForm.formInfo = row.formInfo;
|
||||
data.tinymceTitle = '打印模板设计器（自定义《' + row.formName + '》打印格式）';
|
||||
data.showTinymceEditor = true;
|
||||
}
|
||||
|
||||
function handleDesignFlow(bool, row?: any) {
|
||||
data.showDesignFlow = bool
|
||||
if (bool === false) {
|
||||
getDataList()
|
||||
return
|
||||
}
|
||||
if (row) {
|
||||
data.currFlowForm = other.deepClone(row)
|
||||
data.currFlowForm.formInfo = parseWithFunctions(row.formInfo, true)
|
||||
data.currFlowForm.active = "formSetting";
|
||||
} else {
|
||||
data.currFlowForm = {
|
||||
id: utils.getId(),
|
||||
active: 'formSetting',
|
||||
icon: 'iconfont icon-shuxingtu',
|
||||
formName: '未命名',
|
||||
type: '0',
|
||||
isActive: '1',
|
||||
isAutoAudit: '0',
|
||||
status: '-1',
|
||||
version: 1,
|
||||
isNew: true,
|
||||
sort: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
function handleDesignFlow(bool, row?: any) {
|
||||
data.showDesignFlow = bool;
|
||||
if (bool === false) {
|
||||
getDataList();
|
||||
return;
|
||||
}
|
||||
if (row) {
|
||||
data.currFlowForm = other.deepClone(row);
|
||||
data.currFlowForm.formInfo = parseWithFunctions(row.formInfo, true);
|
||||
data.currFlowForm.active = 'formSetting';
|
||||
} else {
|
||||
data.currFlowForm = {
|
||||
id: utils.getId(),
|
||||
active: 'formSetting',
|
||||
icon: 'iconfont icon-shuxingtu',
|
||||
formName: '未命名',
|
||||
type: '0',
|
||||
isActive: '1',
|
||||
isAutoAudit: '0',
|
||||
status: '-1',
|
||||
version: 1,
|
||||
isNew: true,
|
||||
sort: 1,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function handleViewOrder(row) {
|
||||
data.currFlowForm = deepClone(row)
|
||||
// 判断是否自定义首页
|
||||
if (row.path !== vueKey.RunApplicationForm) {
|
||||
handleCustomForm(data, row)
|
||||
data.currFlowForm.operType = 'view'
|
||||
data.showHandleForm = true
|
||||
} else {
|
||||
data.showViewOrder = true
|
||||
}
|
||||
}
|
||||
function handleViewOrder(row) {
|
||||
data.currFlowForm = deepClone(row);
|
||||
// 判断是否自定义首页
|
||||
if (row.path !== vueKey.RunApplicationForm) {
|
||||
handleCustomForm(data, row);
|
||||
data.currFlowForm.operType = 'view';
|
||||
data.showHandleForm = true;
|
||||
} else {
|
||||
data.showViewOrder = true;
|
||||
}
|
||||
}
|
||||
|
||||
function onHandleForm(type) {
|
||||
data.showHandleForm = false
|
||||
}
|
||||
function onHandleForm(type) {
|
||||
data.showHandleForm = false;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,199 +1,215 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="100px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.initiatorId')" prop="initiatorId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="form.initiatorId" :placeholder="t('runFlow.inputInitiatorIdTip')" clearable filterable
|
||||
remote :remote-method="remoteMethod" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="100px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.initiatorId')" prop="initiatorId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="form.initiatorId"
|
||||
:placeholder="t('runFlow.inputInitiatorIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="remoteMethod"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.flowName')" prop="flowName">
|
||||
<el-input v-model="form.flowName" :placeholder="t('runFlow.inputFlowNameTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.flowName')" prop="flowName">
|
||||
<el-input v-model="form.flowName" :placeholder="t('runFlow.inputFlowNameTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.groupName')" prop="groupName">
|
||||
<el-input v-model="form.groupName" :placeholder="t('runFlow.inputGroupNameTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.groupName')" prop="groupName">
|
||||
<el-input v-model="form.groupName" :placeholder="t('runFlow.inputGroupNameTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.startTime')" prop="startTime">
|
||||
<el-date-picker type="datetime" :placeholder="t('runFlow.inputStartTimeTip')" v-model="form.startTime" :value-format="dateTimeStr"></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.startTime')" prop="startTime">
|
||||
<el-date-picker
|
||||
type="datetime"
|
||||
:placeholder="t('runFlow.inputStartTimeTip')"
|
||||
v-model="form.startTime"
|
||||
:value-format="dateTimeStr"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.endTime')" prop="endTime">
|
||||
<el-date-picker type="datetime" :placeholder="t('runFlow.inputEndTimeTip')" v-model="form.endTime" :value-format="dateTimeStr"></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.endTime')" prop="endTime">
|
||||
<el-date-picker
|
||||
type="datetime"
|
||||
:placeholder="t('runFlow.inputEndTimeTip')"
|
||||
v-model="form.endTime"
|
||||
:value-format="dateTimeStr"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.invalidReason')" prop="invalidReason">
|
||||
<el-input v-model="form.invalidReason" :placeholder="t('runFlow.inputInvalidReasonTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.invalidReason')" prop="invalidReason">
|
||||
<el-input v-model="form.invalidReason" :placeholder="t('runFlow.inputInvalidReasonTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.status')" prop="status">
|
||||
<el-select v-model="form.status" :placeholder="t('runFlow.inputStatusTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FLOW_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.status')" prop="status">
|
||||
<el-select v-model="form.status" :placeholder="t('runFlow.inputStatusTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FLOW_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('runFlow.inputRemarkTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('runFlow.inputRemarkTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.version')" prop="version">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.version" :placeholder="t('runFlow.inputVersionTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.version')" prop="version">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.version" :placeholder="t('runFlow.inputVersionTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.isIndependent')" prop="isIndependent">
|
||||
<el-radio-group v-model="form.isIndependent">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value" >
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runFlow.isIndependent')" prop="isIndependent">
|
||||
<el-radio-group v-model="form.isIndependent">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="RunFlowDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/run-flow';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { rule } from '/@/utils/validate';
|
||||
import { onFormLoadedUrl, onLoadDicUrl, remoteMethodByKey } from '/@/flow/components/convert-name/convert';
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/run-flow'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { rule } from '/@/utils/validate';
|
||||
import {onFormLoadedUrl, onLoadDicUrl, remoteMethodByKey} from "/@/flow/components/convert-name/convert";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
const onFormLoaded = onFormLoadedUrl({ key: 'initiatorId' });
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
initiatorId: '',
|
||||
flowName: '',
|
||||
groupName: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
invalidReason: '',
|
||||
status: '',
|
||||
version: 0,
|
||||
createUser: '',
|
||||
createTime: '',
|
||||
});
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
const onFormLoaded = onFormLoadedUrl({key: "initiatorId"});
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
initiatorId: '',
|
||||
flowName: '',
|
||||
groupName: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
invalidReason: '',
|
||||
status: '',
|
||||
version: 0,
|
||||
createUser: '',
|
||||
createTime: '',
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
initiatorId: [{ required: true, message: '流程申请人不能为空', trigger: 'blur' }],
|
||||
flowName: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
groupName: [{ required: true, message: '分组名称不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '流程状态不能为空', trigger: 'blur' }],
|
||||
version: [{ required: true, message: '版本不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
initiatorId: [{required: true, message: '流程申请人不能为空', trigger: 'blur'}],
|
||||
flowName: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
groupName: [{required: true, message: '分组名称不能为空', trigger: 'blur'}],
|
||||
status: [{required: true, message: '流程状态不能为空', trigger: 'blur'}],
|
||||
version: [{required: true, message: '版本不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取RunFlow信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getRunFlowData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取RunFlow信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getRunFlowData(id)
|
||||
}
|
||||
};
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'initiatorId');
|
||||
}
|
||||
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "initiatorId")
|
||||
}
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getRunFlowData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onFormLoaded(dicData, form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getRunFlowData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onFormLoaded(dicData, form);
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,49 +1,49 @@
|
||||
export default {
|
||||
runFlow: {
|
||||
index: '#',
|
||||
importrunFlowTip: 'import RunFlow',
|
||||
id: 'id',
|
||||
initiatorId: 'initiatorId',
|
||||
defFlowId: 'defFlowId',
|
||||
groupName: 'groupName',
|
||||
startTime: 'startTime',
|
||||
endTime: 'endTime',
|
||||
useTime: 'useTime',
|
||||
invalidReason: 'invalidReason',
|
||||
status: 'status',
|
||||
version: 'version',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
orderId: 'orderId',
|
||||
flowKey: 'flowKey',
|
||||
updateUser: 'updateUser',
|
||||
code: 'code',
|
||||
formId: 'formId',
|
||||
updateTime: 'updateTime',
|
||||
flowName: 'flowName',
|
||||
remark: 'remark',
|
||||
isIndependent: 'isIndependent',
|
||||
runFlow: {
|
||||
index: '#',
|
||||
importrunFlowTip: 'import RunFlow',
|
||||
id: 'id',
|
||||
initiatorId: 'initiatorId',
|
||||
defFlowId: 'defFlowId',
|
||||
groupName: 'groupName',
|
||||
startTime: 'startTime',
|
||||
endTime: 'endTime',
|
||||
useTime: 'useTime',
|
||||
invalidReason: 'invalidReason',
|
||||
status: 'status',
|
||||
version: 'version',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
orderId: 'orderId',
|
||||
flowKey: 'flowKey',
|
||||
updateUser: 'updateUser',
|
||||
code: 'code',
|
||||
formId: 'formId',
|
||||
updateTime: 'updateTime',
|
||||
flowName: 'flowName',
|
||||
remark: 'remark',
|
||||
isIndependent: 'isIndependent',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputInitiatorIdTip: 'input initiatorId',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputGroupNameTip: 'input groupName',
|
||||
inputStartTimeTip: 'input startTime',
|
||||
inputEndTimeTip: 'input endTime',
|
||||
inputUseTimeTip: 'input useTime',
|
||||
inputInvalidReasonTip: 'input invalidReason',
|
||||
inputStatusTip: 'input status',
|
||||
inputVersionTip: 'input version',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputOrderIdTip: 'input orderId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputCodeTip: 'input code',
|
||||
inputFormIdTip: 'input formId',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
inputFlowNameTip: 'input flowName',
|
||||
inputRemarkTip: 'input remark',
|
||||
inputIsIndependentTip: 'input isIndependent',
|
||||
}
|
||||
}
|
||||
inputIdTip: 'input id',
|
||||
inputInitiatorIdTip: 'input initiatorId',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputGroupNameTip: 'input groupName',
|
||||
inputStartTimeTip: 'input startTime',
|
||||
inputEndTimeTip: 'input endTime',
|
||||
inputUseTimeTip: 'input useTime',
|
||||
inputInvalidReasonTip: 'input invalidReason',
|
||||
inputStatusTip: 'input status',
|
||||
inputVersionTip: 'input version',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputOrderIdTip: 'input orderId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputUpdateUserTip: 'input updateUser',
|
||||
inputCodeTip: 'input code',
|
||||
inputFormIdTip: 'input formId',
|
||||
inputUpdateTimeTip: 'input updateTime',
|
||||
inputFlowNameTip: 'input flowName',
|
||||
inputRemarkTip: 'input remark',
|
||||
inputIsIndependentTip: 'input isIndependent',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,50 +1,49 @@
|
||||
export default {
|
||||
runFlow: {
|
||||
index: '#',
|
||||
importrunFlowTip: '导入流程管理',
|
||||
id: '流程实例ID',
|
||||
initiatorId: '流程申请人',
|
||||
defFlowId: '流程名称',
|
||||
groupName: '分组名称',
|
||||
startTime: '开始时间',
|
||||
endTime: '结束时间',
|
||||
useTime: '流程用时',
|
||||
invalidReason: '作废原因',
|
||||
status: '流程状态',
|
||||
version: '版本',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
orderId: '工单ID',
|
||||
flowKey: '流程KEY',
|
||||
updateUser: '更新人',
|
||||
code: '工单编号',
|
||||
formId: '表单ID',
|
||||
updateTime: '更新时间',
|
||||
flowName: '流程名称',
|
||||
remark: '备注',
|
||||
isIndependent: '配置数据独立',
|
||||
|
||||
inputIdTip: '请输入主键ID',
|
||||
inputInitiatorIdTip: '请输入流程申请人',
|
||||
inputDefFlowIdTip: '请输入流程名称',
|
||||
inputGroupNameTip: '请输入分组名称',
|
||||
inputStartTimeTip: '请输入开始时间',
|
||||
inputEndTimeTip: '请输入结束时间',
|
||||
inputUseTimeTip: '请输入流程用时',
|
||||
inputInvalidReasonTip: '请输入作废原因',
|
||||
inputStatusTip: '请输入流程状态',
|
||||
inputVersionTip: '请输入版本',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputOrderIdTip: '请输入工单ID',
|
||||
inputFlowKeyTip: '请输入流程KEY',
|
||||
inputUpdateUserTip: '请输入更新人',
|
||||
inputCodeTip: '请输入工单编号',
|
||||
inputFormIdTip: '请输入表单ID',
|
||||
inputUpdateTimeTip: '请输入更新时间',
|
||||
inputFlowNameTip: '请输入流程名称',
|
||||
inputRemarkTip: '请输入备注',
|
||||
inputIsIndependentTip: '请选择配置数据独立',
|
||||
runFlow: {
|
||||
index: '#',
|
||||
importrunFlowTip: '导入流程管理',
|
||||
id: '流程实例ID',
|
||||
initiatorId: '流程申请人',
|
||||
defFlowId: '流程名称',
|
||||
groupName: '分组名称',
|
||||
startTime: '开始时间',
|
||||
endTime: '结束时间',
|
||||
useTime: '流程用时',
|
||||
invalidReason: '作废原因',
|
||||
status: '流程状态',
|
||||
version: '版本',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
orderId: '工单ID',
|
||||
flowKey: '流程KEY',
|
||||
updateUser: '更新人',
|
||||
code: '工单编号',
|
||||
formId: '表单ID',
|
||||
updateTime: '更新时间',
|
||||
flowName: '流程名称',
|
||||
remark: '备注',
|
||||
isIndependent: '配置数据独立',
|
||||
|
||||
}
|
||||
}
|
||||
inputIdTip: '请输入主键ID',
|
||||
inputInitiatorIdTip: '请输入流程申请人',
|
||||
inputDefFlowIdTip: '请输入流程名称',
|
||||
inputGroupNameTip: '请输入分组名称',
|
||||
inputStartTimeTip: '请输入开始时间',
|
||||
inputEndTimeTip: '请输入结束时间',
|
||||
inputUseTimeTip: '请输入流程用时',
|
||||
inputInvalidReasonTip: '请输入作废原因',
|
||||
inputStatusTip: '请输入流程状态',
|
||||
inputVersionTip: '请输入版本',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputOrderIdTip: '请输入工单ID',
|
||||
inputFlowKeyTip: '请输入流程KEY',
|
||||
inputUpdateUserTip: '请输入更新人',
|
||||
inputCodeTip: '请输入工单编号',
|
||||
inputFormIdTip: '请输入表单ID',
|
||||
inputUpdateTimeTip: '请输入更新时间',
|
||||
inputFlowNameTip: '请输入流程名称',
|
||||
inputRemarkTip: '请输入备注',
|
||||
inputIsIndependentTip: '请选择配置数据独立',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,377 +1,366 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runFlow.initiatorId')" prop="initiatorId" v-if="!props.myFlow.initiatorId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="state.queryForm.initiatorId" :placeholder="t('runFlow.inputInitiatorIdTip')" clearable filterable style="max-width: 180px"
|
||||
remote :remote-method="remoteMethod" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.code')" prop="code" >
|
||||
<el-input :placeholder="t('runFlow.inputCodeTip')" v-model="state.queryForm.code" clearable
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.flowName')" prop="flowName">
|
||||
<el-input :placeholder="t('runFlow.inputFlowNameTip')" v-model="state.queryForm.flowName" clearable
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.flowKey')" prop="flowKey" >
|
||||
<el-input :placeholder="t('runFlow.inputFlowKeyTip')" v-model="state.queryForm.flowKey" clearable
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.status')" prop="status" >
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runFlow.inputStatusTip')" clearable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FLOW_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_runflow_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('runFlow.index')" width="40" />
|
||||
<el-table-column prop="id" :label="t('runFlow.id')" show-overflow-tooltip/>
|
||||
<el-table-column prop="initiatorId" :label="t('runFlow.initiatorId')" show-overflow-tooltip v-if="!props.myFlow.initiatorId">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.initiatorId" :value="scope.row.initiatorId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" :label="t('runFlow.code')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowName" :label="t('runFlow.flowName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="orderId" :label="t('flowApplication.formName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.orderId" :value="scope.row.orderId"
|
||||
:valueKey="'id'" :showKey="'formName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="groupName" :label="t('runFlow.groupName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="startTime" :label="t('runFlow.startTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="endTime" :label="t('runFlow.endTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="useTime" :label="t('runFlow.useTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="invalidReason" :label="t('runFlow.invalidReason')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="isIndependent" :label="t('runFlow.isIndependent')" show-overflow-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runFlow.initiatorId')" prop="initiatorId" v-if="!props.myFlow.initiatorId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="state.queryForm.initiatorId"
|
||||
:placeholder="t('runFlow.inputInitiatorIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
remote
|
||||
:remote-method="remoteMethod"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.code')" prop="code">
|
||||
<el-input :placeholder="t('runFlow.inputCodeTip')" v-model="state.queryForm.code" clearable style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.flowName')" prop="flowName">
|
||||
<el-input :placeholder="t('runFlow.inputFlowNameTip')" v-model="state.queryForm.flowName" clearable style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.flowKey')" prop="flowKey">
|
||||
<el-input :placeholder="t('runFlow.inputFlowKeyTip')" v-model="state.queryForm.flowKey" clearable style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.status')" prop="status">
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runFlow.inputStatusTip')" clearable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FLOW_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_runflow_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('runFlow.index')" width="40" />
|
||||
<el-table-column prop="id" :label="t('runFlow.id')" show-overflow-tooltip />
|
||||
<el-table-column prop="initiatorId" :label="t('runFlow.initiatorId')" show-overflow-tooltip v-if="!props.myFlow.initiatorId">
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.initiatorId" :value="scope.row.initiatorId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" :label="t('runFlow.code')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowName" :label="t('runFlow.flowName')" show-overflow-tooltip />
|
||||
<el-table-column prop="orderId" :label="t('flowApplication.formName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.orderId" :value="scope.row.orderId" :valueKey="'id'" :showKey="'formName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="groupName" :label="t('runFlow.groupName')" show-overflow-tooltip />
|
||||
<el-table-column prop="startTime" :label="t('runFlow.startTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="endTime" :label="t('runFlow.endTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="useTime" :label="t('runFlow.useTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="invalidReason" :label="t('runFlow.invalidReason')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="isIndependent" :label="t('runFlow.isIndependent')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.isIndependent"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="status" :label="t('runFlow.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="version" :label="t('runFlow.version')" show-overflow-tooltip/>
|
||||
<el-table-column prop="remark" :label="t('runFlow.remark')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="createUser" :label="t('runFlow.createUser')" show-overflow-tooltip>
|
||||
<el-table-column prop="status" :label="t('runFlow.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="version" :label="t('runFlow.version')" show-overflow-tooltip />
|
||||
<el-table-column prop="remark" :label="t('runFlow.remark')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="createUser" :label="t('runFlow.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('runFlow.createTime')" show-overflow-tooltip/>-->
|
||||
<el-table-column :label="$t('common.action')" width="210">
|
||||
<template #default="scope">
|
||||
<el-dropdown style="vertical-align: middle; margin-right: 10px">
|
||||
<span>
|
||||
功能
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down/>
|
||||
</el-icon>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
{{ $t('common.viewBtn') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
{{ $t('common.editBtn') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided @click="handlePrintTemplate(scope.row)"
|
||||
v-if="scope.row.isIndependent ==='1'">
|
||||
{{ $t('jfI18n.printTemplate') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided @click="methods.comment(scope.row)">
|
||||
查看审批过程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided @click="methods.remind(scope.row)"
|
||||
v-if="scope.row.status ==='0'">
|
||||
催办流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided
|
||||
v-if="scope.row.status ==='2' || scope.row.status ==='3'"
|
||||
@click="scope.row.status ==='2' ? methods.handleInvalidFlow(scope.row) : methods.handleTerminateFlow(scope.row)">
|
||||
恢复流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided v-if="scope.row.status === '0'"
|
||||
@click.native="methods.handleEarlyComplete(scope.row)">
|
||||
提前结束流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided v-if="scope.row.status === '0'"
|
||||
@click.native="methods.handleTerminateFlow(scope.row)">
|
||||
终止流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided v-if="scope.row.status === '0'"
|
||||
@click.native="methods.handleInvalidFlow(scope.row)">
|
||||
作废流程
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
查看工单
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="methods.handleJob(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" content="对已发起的流程实例图，再次可视化单独编辑配置。只对当前流程实例生效">
|
||||
<el-button text type="primary" icon="edit" @click="handleEditPhoto(true, scope.row)"
|
||||
v-auth="'jsonflow_runflow_edit'">
|
||||
编辑实例图
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<el-table-column :label="$t('common.action')" width="210">
|
||||
<template #default="scope">
|
||||
<el-dropdown style="vertical-align: middle; margin-right: 10px">
|
||||
<span>
|
||||
功能
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down />
|
||||
</el-icon>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
{{ $t('common.viewBtn') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
{{ $t('common.editBtn') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided @click="handlePrintTemplate(scope.row)" v-if="scope.row.isIndependent === '1'">
|
||||
{{ $t('jfI18n.printTemplate') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided @click="methods.comment(scope.row)"> 查看审批过程 </el-dropdown-item>
|
||||
<el-dropdown-item divided @click="methods.remind(scope.row)" v-if="scope.row.status === '0'"> 催办流程 </el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
divided
|
||||
v-if="scope.row.status === '2' || scope.row.status === '3'"
|
||||
@click="scope.row.status === '2' ? methods.handleInvalidFlow(scope.row) : methods.handleTerminateFlow(scope.row)"
|
||||
>
|
||||
恢复流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided v-if="scope.row.status === '0'" @click.native="methods.handleEarlyComplete(scope.row)">
|
||||
提前结束流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided v-if="scope.row.status === '0'" @click.native="methods.handleTerminateFlow(scope.row)">
|
||||
终止流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided v-if="scope.row.status === '0'" @click.native="methods.handleInvalidFlow(scope.row)">
|
||||
作废流程
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-tooltip placement="top">
|
||||
<template #content> 查看工单 </template>
|
||||
<el-button text type="primary" icon="view" @click="methods.handleJob(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" content="对已发起的流程实例图，再次可视化单独编辑配置。只对当前流程实例生效">
|
||||
<el-button text type="primary" icon="edit" @click="handleEditPhoto(true, scope.row)" v-auth="'jsonflow_runflow_edit'">
|
||||
编辑实例图
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer" direction="rtl"
|
||||
append-to-body size="100%"
|
||||
v-model="data.showDesignFlow"
|
||||
:with-header="false"
|
||||
>
|
||||
<flow-form-design v-if="data.showDesignFlow" :currFlowForm="data.currFlowForm" @handleDesignFlow="handleEditPhoto"></flow-form-design>
|
||||
</el-drawer>
|
||||
<el-drawer class="flow-overflow-drawer" direction="rtl" append-to-body size="100%" v-model="data.showDesignFlow" :with-header="false">
|
||||
<flow-form-design v-if="data.showDesignFlow" :currFlowForm="data.currFlowForm" @handleDesignFlow="handleEditPhoto"></flow-form-design>
|
||||
</el-drawer>
|
||||
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog
|
||||
v-model="data.showComment" v-if="data.showComment"
|
||||
top="20px"
|
||||
width="90%"
|
||||
title="查看审批过程"
|
||||
append-to-body>
|
||||
<comment :curr-job="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog v-model="data.showComment" v-if="data.showComment" top="20px" width="90%" title="查看审批过程" append-to-body>
|
||||
<comment :curr-job="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 打印模板设计器 -->
|
||||
<el-drawer class="tinymce-print-drawer" append-to-body direction="rtl"
|
||||
v-model="data.showTinymceEditor" size="100%"
|
||||
:title="data.tinymceTitle" @close="getDataList">
|
||||
<tinymce-editor v-if="data.showTinymceEditor" :currFlowForm="data.currFlowForm"></tinymce-editor>
|
||||
</el-drawer>
|
||||
</div>
|
||||
<!-- 打印模板设计器 -->
|
||||
<el-drawer
|
||||
class="tinymce-print-drawer"
|
||||
append-to-body
|
||||
direction="rtl"
|
||||
v-model="data.showTinymceEditor"
|
||||
size="100%"
|
||||
:title="data.tinymceTitle"
|
||||
@close="getDataList"
|
||||
>
|
||||
<tinymce-editor v-if="data.showTinymceEditor" :currFlowForm="data.currFlowForm"></tinymce-editor>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemRunFlow">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import * as runFlow from '/@/api/jsonflow/run-flow'
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import * as runFlow from '/@/api/jsonflow/run-flow';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onLoadDicUrl, onLoaded, remoteMethodByKey} from "/@/flow/components/convert-name/convert";
|
||||
import {parseWithFunctions} from "/@/flow";
|
||||
import * as runApplication from '/@/api/order/run-application'
|
||||
import * as flowApplication from '/@/api/order/flow-application'
|
||||
import {DIC_PROP} from "/@/flow/support/dict-prop";
|
||||
import {openFlowPreview} from "/@/flow/support/extend";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoadDicUrl, onLoaded, remoteMethodByKey } from '/@/flow/components/convert-name/convert';
|
||||
import { parseWithFunctions } from '/@/flow';
|
||||
import * as runApplication from '/@/api/order/run-application';
|
||||
import * as flowApplication from '/@/api/order/flow-application';
|
||||
import { DIC_PROP } from '/@/flow/support/dict-prop';
|
||||
import { openFlowPreview } from '/@/flow/support/extend';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowFormDesign = defineAsyncComponent(() => import('/@/flow/components/onebtn-design/design.vue'));
|
||||
const TinymceEditor = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceEditor.vue'));
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowFormDesign = defineAsyncComponent(() => import('/@/flow/components/onebtn-design/design.vue'));
|
||||
const TinymceEditor = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceEditor.vue'));
|
||||
|
||||
const { t } = useI18n()
|
||||
const $message = useMessage();
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
const { t } = useI18n();
|
||||
const $message = useMessage();
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
|
||||
const props = defineProps({
|
||||
myFlow: {
|
||||
type: Object,
|
||||
default: {},
|
||||
}
|
||||
});
|
||||
const props = defineProps({
|
||||
myFlow: {
|
||||
type: Object,
|
||||
default: {},
|
||||
},
|
||||
});
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: !props.myFlow.initiatorId ? {} : {initiatorId: props.myFlow.initiatorId},
|
||||
pageList: runFlow.fetchList,
|
||||
onLoaded: onLoaded({key: "initiatorId"}, {key: "orderId"}, {key: "createUser"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: !props.myFlow.initiatorId ? {} : { initiatorId: props.myFlow.initiatorId },
|
||||
pageList: runFlow.fetchList,
|
||||
onLoaded: onLoaded({ key: 'initiatorId' }, { key: 'orderId' }, { key: 'createUser' }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-flow/export', state.queryForm, 'run-flow.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-flow/export', state.queryForm, 'run-flow.xlsx');
|
||||
};
|
||||
|
||||
const data = reactive({
|
||||
currJob: {},
|
||||
showComment: false,
|
||||
showDesignFlow: false,
|
||||
currFlowForm: {},
|
||||
showTinymceEditor: false,
|
||||
tinymceTitle: '',
|
||||
});
|
||||
const data = reactive({
|
||||
currJob: {},
|
||||
showComment: false,
|
||||
showDesignFlow: false,
|
||||
currFlowForm: {},
|
||||
showTinymceEditor: false,
|
||||
tinymceTitle: '',
|
||||
});
|
||||
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "initiatorId")
|
||||
}
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'initiatorId');
|
||||
}
|
||||
|
||||
const getFormInfo = (row, callback) => {
|
||||
if (row.fromType === '0') {
|
||||
runApplication.getByFlowInstId(row.id)
|
||||
.then(resp => {
|
||||
data.currFlowForm = resp.data
|
||||
callback(resp)
|
||||
})
|
||||
} else {
|
||||
flowApplication.getObj(row.formId)
|
||||
.then(resp => {
|
||||
data.currFlowForm = resp.data
|
||||
data.currFlowForm.formId = resp.data.id
|
||||
data.currFlowForm.flowInstId = row.id
|
||||
callback(resp)
|
||||
})
|
||||
}
|
||||
}
|
||||
const handleEditPhoto = (bool, row?: any) => {
|
||||
if (bool === false) {
|
||||
data.showDesignFlow = bool
|
||||
getDataList()
|
||||
return
|
||||
}
|
||||
function callback(resp) {
|
||||
data.currFlowForm.formInfo = parseWithFunctions(resp.data.formInfo, true)
|
||||
data.currFlowForm.active = "formSetting";
|
||||
data.showDesignFlow = bool
|
||||
}
|
||||
const getFormInfo = (row, callback) => {
|
||||
if (row.fromType === '0') {
|
||||
runApplication.getByFlowInstId(row.id).then((resp) => {
|
||||
data.currFlowForm = resp.data;
|
||||
callback(resp);
|
||||
});
|
||||
} else {
|
||||
flowApplication.getObj(row.formId).then((resp) => {
|
||||
data.currFlowForm = resp.data;
|
||||
data.currFlowForm.formId = resp.data.id;
|
||||
data.currFlowForm.flowInstId = row.id;
|
||||
callback(resp);
|
||||
});
|
||||
}
|
||||
};
|
||||
const handleEditPhoto = (bool, row?: any) => {
|
||||
if (bool === false) {
|
||||
data.showDesignFlow = bool;
|
||||
getDataList();
|
||||
return;
|
||||
}
|
||||
function callback(resp) {
|
||||
data.currFlowForm.formInfo = parseWithFunctions(resp.data.formInfo, true);
|
||||
data.currFlowForm.active = 'formSetting';
|
||||
data.showDesignFlow = bool;
|
||||
}
|
||||
|
||||
getFormInfo(row, callback)
|
||||
}
|
||||
getFormInfo(row, callback);
|
||||
};
|
||||
|
||||
function handlePrintTemplate(row) {
|
||||
function callback(resp) {
|
||||
let row = data.currFlowForm
|
||||
data.currFlowForm = {id: row.formId, formType: row.type, formId: row.formId, formName: row.formName, path: row.path, isForm: true}
|
||||
data.currFlowForm.flowInstId = row.flowInstId
|
||||
data.currFlowForm.formInfo = row.formInfo
|
||||
data.tinymceTitle = "打印模板设计器（自定义《" + row.formName + "》打印格式）"
|
||||
data.showTinymceEditor = true
|
||||
}
|
||||
function handlePrintTemplate(row) {
|
||||
function callback(resp) {
|
||||
let row = data.currFlowForm;
|
||||
data.currFlowForm = { id: row.formId, formType: row.type, formId: row.formId, formName: row.formName, path: row.path, isForm: true };
|
||||
data.currFlowForm.flowInstId = row.flowInstId;
|
||||
data.currFlowForm.formInfo = row.formInfo;
|
||||
data.tinymceTitle = '打印模板设计器（自定义《' + row.formName + '》打印格式）';
|
||||
data.showTinymceEditor = true;
|
||||
}
|
||||
|
||||
getFormInfo(row, callback)
|
||||
}
|
||||
|
||||
const router = useRouter();
|
||||
const methods = {
|
||||
// 提前结束流程
|
||||
handleEarlyComplete(row) {
|
||||
useMessageBox().prompt("请输入提前结束流程理由")
|
||||
.then(({ value }) => {
|
||||
row.flowInstId = row.id
|
||||
row.jobBtn = DIC_PROP.JOB_BTNS[16].value
|
||||
row.invalidReason = value
|
||||
row.flowStatus = row.status
|
||||
return runFlow.earlyComplete(row)
|
||||
}).then(() => {
|
||||
$message.success('操作成功')
|
||||
getDataList();
|
||||
})
|
||||
},
|
||||
// 终止/恢复流程
|
||||
handleTerminateFlow(row) {
|
||||
let text = row.status === '0' ? "终止" : "恢复";
|
||||
useMessageBox().prompt("请输入" + text + "理由")
|
||||
.then(({ value }) => {
|
||||
row.flowInstId = row.id
|
||||
row.jobBtn = DIC_PROP.JOB_BTNS[15].value
|
||||
row.invalidReason = value
|
||||
row.flowStatus = row.status
|
||||
return runFlow.terminateFlow(row)
|
||||
}).then(() => {
|
||||
$message.success('操作成功')
|
||||
getDataList();
|
||||
})
|
||||
},
|
||||
// 作废/恢复流程
|
||||
handleInvalidFlow(row) {
|
||||
let text = row.status === '0' ? "作废" : "恢复";
|
||||
useMessageBox().prompt("请输入" + text + "理由")
|
||||
.then(({ value }) => {
|
||||
row.flowInstId = row.id
|
||||
row.jobBtn = DIC_PROP.JOB_BTNS[17].value
|
||||
row.invalidReason = value
|
||||
row.flowStatus = row.status
|
||||
return runFlow.invalidFlow(row)
|
||||
}).then(() => {
|
||||
$message.success('操作成功')
|
||||
getDataList();
|
||||
})
|
||||
},
|
||||
handleJob(row) {
|
||||
openFlowPreview(router, {flowInstId: row.id})
|
||||
},
|
||||
comment(row) {
|
||||
data.currJob = row
|
||||
data.currJob.flowInstId = row.id
|
||||
data.showComment = true
|
||||
},
|
||||
remind(row) {
|
||||
runFlow.remind(row).then(() => {
|
||||
$message.success('催办成功')
|
||||
})
|
||||
}
|
||||
}
|
||||
getFormInfo(row, callback);
|
||||
}
|
||||
|
||||
const router = useRouter();
|
||||
const methods = {
|
||||
// 提前结束流程
|
||||
handleEarlyComplete(row) {
|
||||
useMessageBox()
|
||||
.prompt('请输入提前结束流程理由')
|
||||
.then(({ value }) => {
|
||||
row.flowInstId = row.id;
|
||||
row.jobBtn = DIC_PROP.JOB_BTNS[16].value;
|
||||
row.invalidReason = value;
|
||||
row.flowStatus = row.status;
|
||||
return runFlow.earlyComplete(row);
|
||||
})
|
||||
.then(() => {
|
||||
$message.success('操作成功');
|
||||
getDataList();
|
||||
});
|
||||
},
|
||||
// 终止/恢复流程
|
||||
handleTerminateFlow(row) {
|
||||
let text = row.status === '0' ? '终止' : '恢复';
|
||||
useMessageBox()
|
||||
.prompt('请输入' + text + '理由')
|
||||
.then(({ value }) => {
|
||||
row.flowInstId = row.id;
|
||||
row.jobBtn = DIC_PROP.JOB_BTNS[15].value;
|
||||
row.invalidReason = value;
|
||||
row.flowStatus = row.status;
|
||||
return runFlow.terminateFlow(row);
|
||||
})
|
||||
.then(() => {
|
||||
$message.success('操作成功');
|
||||
getDataList();
|
||||
});
|
||||
},
|
||||
// 作废/恢复流程
|
||||
handleInvalidFlow(row) {
|
||||
let text = row.status === '0' ? '作废' : '恢复';
|
||||
useMessageBox()
|
||||
.prompt('请输入' + text + '理由')
|
||||
.then(({ value }) => {
|
||||
row.flowInstId = row.id;
|
||||
row.jobBtn = DIC_PROP.JOB_BTNS[17].value;
|
||||
row.invalidReason = value;
|
||||
row.flowStatus = row.status;
|
||||
return runFlow.invalidFlow(row);
|
||||
})
|
||||
.then(() => {
|
||||
$message.success('操作成功');
|
||||
getDataList();
|
||||
});
|
||||
},
|
||||
handleJob(row) {
|
||||
openFlowPreview(router, { flowInstId: row.id });
|
||||
},
|
||||
comment(row) {
|
||||
data.currJob = row;
|
||||
data.currJob.flowInstId = row.id;
|
||||
data.showComment = true;
|
||||
},
|
||||
remind(row) {
|
||||
runFlow.remind(row).then(() => {
|
||||
$message.success('催办成功');
|
||||
});
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,15 +1,13 @@
|
||||
<template>
|
||||
<run-flow :myFlow="{initiatorId: userInfo.userInfos.user.userId}"></run-flow>
|
||||
<run-flow :myFlow="{ initiatorId: userInfo.userInfos.user.userId }"></run-flow>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemMyFlow">
|
||||
import {useUserInfo} from "/@/stores/userInfo";
|
||||
|
||||
const userInfo = useUserInfo();
|
||||
// 引入组件
|
||||
const RunFlow = defineAsyncComponent(() => import('./index.vue'));
|
||||
import { useUserInfo } from '/@/stores/userInfo';
|
||||
|
||||
const userInfo = useUserInfo();
|
||||
// 引入组件
|
||||
const RunFlow = defineAsyncComponent(() => import('./index.vue'));
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
</style>
|
||||
<style lang="scss"></style>
|
||||
|
||||
@@ -1,409 +1,412 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runFlow.initiatorId')" prop="initiatorId" >
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="state.queryForm.initiatorId" :placeholder="t('runFlow.inputInitiatorIdTip')" clearable filterable style="max-width: 180px"
|
||||
remote :remote-method="remoteMethod" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.code')" prop="flowInstId" >
|
||||
<el-select v-model="state.queryForm.flowInstId" :placeholder="t('runFlow.inputCodeTip')" clearable filterable
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])" style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.flowInstId" :key="index" :label="item.code" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.runNodeId')" prop="runNodeId" >
|
||||
<el-select v-model="state.queryForm.runNodeId" :placeholder="t('runJob.inputRunNodeIdTip')" clearable filterable style="max-width: 180px"
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.id')" prop="id" >
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runJob.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.status')" prop="status" >
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tabs v-model="data.activeName" class="demo-tabs" @tab-click="methods.handleTabClick">
|
||||
<el-tab-pane label="全部" name="-1"></el-tab-pane>
|
||||
<el-tab-pane label="待办理" name="0"></el-tab-pane>
|
||||
<el-tab-pane label="被抄送" name="1"></el-tab-pane>
|
||||
<el-tab-pane label="待阅" name="2"></el-tab-pane>
|
||||
<el-tab-pane label="被加签" name="3"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runFlow.initiatorId')" prop="initiatorId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="state.queryForm.initiatorId"
|
||||
:placeholder="t('runFlow.inputInitiatorIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
remote
|
||||
:remote-method="remoteMethod"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.code')" prop="flowInstId">
|
||||
<el-select
|
||||
v-model="state.queryForm.flowInstId"
|
||||
:placeholder="t('runFlow.inputCodeTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])"
|
||||
style="max-width: 180px"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.flowInstId" :key="index" :label="item.code" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.runNodeId')" prop="runNodeId">
|
||||
<el-select
|
||||
v-model="state.queryForm.runNodeId"
|
||||
:placeholder="t('runJob.inputRunNodeIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.id')" prop="id">
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runJob.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.status')" prop="status">
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tabs v-model="data.activeName" class="demo-tabs" @tab-click="methods.handleTabClick">
|
||||
<el-tab-pane label="全部" name="-1"></el-tab-pane>
|
||||
<el-tab-pane label="待办理" name="0"></el-tab-pane>
|
||||
<el-tab-pane label="被抄送" name="1"></el-tab-pane>
|
||||
<el-tab-pane label="待阅" name="2"></el-tab-pane>
|
||||
<el-tab-pane label="被加签" name="3"></el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_runjob_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
:row-class-name="tableRowClassName"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('runJob.index')" width="40"/>
|
||||
<el-table-column prop="initiatorId" :label="t('runFlow.initiatorId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.initiatorId" :value="scope.row.initiatorId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" :label="t('runFlow.code')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowName" :label="t('runJob.defFlowId')" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column prop="orderId" :label="t('flowApplication.formName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.orderId" :value="scope.row.orderId"
|
||||
:valueKey="'id'" :showKey="'formName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="runNodeId" :label="t('runJob.runNodeId')" show-overflow-tooltip>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_runjob_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
:row-class-name="tableRowClassName"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="index" :label="t('runJob.index')" width="40" />
|
||||
<el-table-column prop="initiatorId" :label="t('runFlow.initiatorId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.initiatorId" :value="scope.row.initiatorId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" :label="t('runFlow.code')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowName" :label="t('runJob.defFlowId')" show-overflow-tooltip> </el-table-column>
|
||||
<el-table-column prop="orderId" :label="t('flowApplication.formName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.orderId" :value="scope.row.orderId" :valueKey="'id'" :showKey="'formName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="runNodeId" :label="t('runJob.runNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.runNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="jobName" :label="t('runJob.jobName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="jobType" :label="t('runJob.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('runJob.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name :options="{users: state.dicData.users, roles: state.dicData.roles, posts: state.dicData.posts, depts: state.dicData.depts}"
|
||||
:value="scope.row"></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="receiveTime" :label="t('runJob.startTime')" show-overflow-tooltip width="160px"/>
|
||||
<el-table-column prop="timeLimit" :label="t('runJob.timeLimit')" show-overflow-tooltip/>
|
||||
<el-table-column prop="status" :label="t('runJob.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="suspension" :label="t('runJob.suspension')" show-overflow-tooltip>
|
||||
<el-table-column prop="jobName" :label="t('runJob.jobName')" show-overflow-tooltip />
|
||||
<el-table-column prop="jobType" :label="t('runJob.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('runJob.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name
|
||||
:options="{ users: state.dicData.users, roles: state.dicData.roles, posts: state.dicData.posts, depts: state.dicData.depts }"
|
||||
:value="scope.row"
|
||||
></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="receiveTime" :label="t('runJob.startTime')" show-overflow-tooltip width="160px" />
|
||||
<el-table-column prop="timeLimit" :label="t('runJob.timeLimit')" show-overflow-tooltip />
|
||||
<el-table-column prop="status" :label="t('runJob.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="suspension" :label="t('runJob.suspension')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.suspension"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<!-- <el-table-column prop="isRead" :label="t('runJob.isRead')" show-overflow-tooltip>
|
||||
<!-- <el-table-column prop="isRead" :label="t('runJob.isRead')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.isRead"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="suspensionReason" :label="t('runJob.suspensionReason')" show-overflow-tooltip/>
|
||||
<el-table-column prop="parFlowInstId" :label="t('runJob.parFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联父流程工单信息" v-if="scope.row.parFlowInstId">
|
||||
<convert-name :options="state.dicData.parFlowInstId" :value="scope.row.parFlowInstId"
|
||||
:valueKey="'id'" :showKey="'flowName'"
|
||||
:elTagType="'primary'" @click="methods.handleJobByFlowInstId(scope.row, '1')"></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('common.action')" width="150">
|
||||
<template #default="scope">
|
||||
<el-dropdown style="vertical-align: middle; margin-right: 10px">
|
||||
<span>
|
||||
功能
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down/>
|
||||
</el-icon>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item
|
||||
@click.native="methods.handleComment(scope.row)">查看审批过程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
divided
|
||||
@click.native="methods.handleFlowPic(scope.row)">查看流程图
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.jobType !== DIC_PROP.JOB_USER_TYPE[0].value"
|
||||
divided
|
||||
@click.native="methods.handleSignForJob(scope.row, '1')"
|
||||
>签收任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[0].value && scope.row.roleId === userInfo.userInfos.user.userId"
|
||||
divided
|
||||
@click.native="methods.handleSignForJob(scope.row, '0')"
|
||||
>反签收任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.suspension === '1'"
|
||||
divided
|
||||
@click.native="methods.handleSuspension(scope.row,'0')"
|
||||
>激活任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.suspension !== '1'"
|
||||
divided
|
||||
@click.native="methods.handleSuspension(scope.row,'1')"
|
||||
>挂起任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.suspension !== '1'"
|
||||
divided
|
||||
@click.native="methods.handleJobRoleUserId(scope.row,'0')">
|
||||
转办任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided
|
||||
@click.native="methods.handleEarlyComplete(scope.row)">
|
||||
提前结束流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided
|
||||
@click.native="methods.handleTerminateFlow(scope.row)">
|
||||
终止流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided
|
||||
@click.native="methods.handleInvalidFlow(scope.row)">
|
||||
作废流程
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-button icon="Stamp" text type="primary"
|
||||
v-if="scope.row.suspension !== '1' && (scope.row.status === '0' || scope.row.status === '9') && scope.row.belongType !== '2'"
|
||||
@click="methods.handleJob(scope.row)">审批
|
||||
</el-button>
|
||||
<el-table-column prop="suspensionReason" :label="t('runJob.suspensionReason')" show-overflow-tooltip />
|
||||
<el-table-column prop="parFlowInstId" :label="t('runJob.parFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联父流程工单信息" v-if="scope.row.parFlowInstId">
|
||||
<convert-name
|
||||
:options="state.dicData.parFlowInstId"
|
||||
:value="scope.row.parFlowInstId"
|
||||
:valueKey="'id'"
|
||||
:showKey="'flowName'"
|
||||
:elTagType="'primary'"
|
||||
@click="methods.handleJobByFlowInstId(scope.row, '1')"
|
||||
></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('common.action')" width="150">
|
||||
<template #default="scope">
|
||||
<el-dropdown style="vertical-align: middle; margin-right: 10px">
|
||||
<span>
|
||||
功能
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down />
|
||||
</el-icon>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click.native="methods.handleComment(scope.row)">查看审批过程 </el-dropdown-item>
|
||||
<el-dropdown-item divided @click.native="methods.handleFlowPic(scope.row)">查看流程图 </el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.jobType !== DIC_PROP.JOB_USER_TYPE[0].value"
|
||||
divided
|
||||
@click.native="methods.handleSignForJob(scope.row, '1')"
|
||||
>签收任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[0].value && scope.row.roleId === userInfo.userInfos.user.userId"
|
||||
divided
|
||||
@click.native="methods.handleSignForJob(scope.row, '0')"
|
||||
>反签收任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item v-if="scope.row.suspension === '1'" divided @click.native="methods.handleSuspension(scope.row, '0')"
|
||||
>激活任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item v-if="scope.row.suspension !== '1'" divided @click.native="methods.handleSuspension(scope.row, '1')"
|
||||
>挂起任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item v-if="scope.row.suspension !== '1'" divided @click.native="methods.handleJobRoleUserId(scope.row, '0')">
|
||||
转办任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided @click.native="methods.handleEarlyComplete(scope.row)"> 提前结束流程 </el-dropdown-item>
|
||||
<el-dropdown-item divided @click.native="methods.handleTerminateFlow(scope.row)"> 终止流程 </el-dropdown-item>
|
||||
<el-dropdown-item divided @click.native="methods.handleInvalidFlow(scope.row)"> 作废流程 </el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-button
|
||||
icon="Stamp"
|
||||
text
|
||||
type="primary"
|
||||
v-if="scope.row.suspension !== '1' && (scope.row.status === '0' || scope.row.status === '9') && scope.row.belongType !== '2'"
|
||||
@click="methods.handleJob(scope.row)"
|
||||
>审批
|
||||
</el-button>
|
||||
|
||||
<el-button icon="Stamp" text type="primary"
|
||||
v-if="scope.row.suspension !== '1' && scope.row.belongType === '2' && scope.row.isRead === '0'"
|
||||
@click="methods.handleJob(scope.row, '0', '1')">查看
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
|
||||
v-bind="state.pagination"/>
|
||||
</div>
|
||||
<el-button
|
||||
icon="Stamp"
|
||||
text
|
||||
type="primary"
|
||||
v-if="scope.row.suspension !== '1' && scope.row.belongType === '2' && scope.row.isRead === '0'"
|
||||
@click="methods.handleJob(scope.row, '0', '1')"
|
||||
>查看
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog
|
||||
v-model="data.showComment" v-if="data.showComment"
|
||||
top="20px"
|
||||
width="90%"
|
||||
title="查看审批过程"
|
||||
append-to-body>
|
||||
<comment :curr-job="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog v-model="data.showComment" v-if="data.showComment" top="20px" width="90%" title="查看审批过程" append-to-body>
|
||||
<comment :curr-job="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer" direction="rtl"
|
||||
append-to-body size="90%"
|
||||
v-model="data.showFlowPic"
|
||||
>
|
||||
<flow-photo v-if="data.showFlowPic" :curr-job="data.currJob"></flow-photo>
|
||||
</el-drawer>
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer class="flow-overflow-drawer" direction="rtl" append-to-body size="90%" v-model="data.showFlowPic">
|
||||
<flow-photo v-if="data.showFlowPic" :curr-job="data.currJob"></flow-photo>
|
||||
</el-drawer>
|
||||
|
||||
<user-role-picker ref="userRolePicker" :isOnlyOne="true" @onSelectItems="methods.onSelectItems">
|
||||
</user-role-picker>
|
||||
|
||||
</div>
|
||||
<user-role-picker ref="userRolePicker" :isOnlyOne="true" @onSelectItems="methods.onSelectItems"> </user-role-picker>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="DoJob">
|
||||
import {BasicTableProps, useTable} from "/@/hooks/table";
|
||||
import {useMessage} from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
|
||||
import {useI18n} from "vue-i18n";
|
||||
import {onCascadeChange, onLoadDicUrl, onLoaded, remoteMethodByKey} from "/@/flow/components/convert-name/convert";
|
||||
import * as doJob from '/@/api/jsonflow/do-job'
|
||||
import {useFlowJob} from "/@/flow/stores/flowJob";
|
||||
import {useUserInfo} from "/@/stores/userInfo";
|
||||
import {handleFlowPreview} from "/@/flow/support/extend";
|
||||
import {PROP_CONST} from "/@/flow/support/prop-const";
|
||||
import {
|
||||
handleEarlyComplete, handleInvalidFlow,
|
||||
handleSignForJob,
|
||||
handleSuspension, handleTerminateFlow,
|
||||
onSignForJob, onTurnRunJob
|
||||
} from "/@/flow/components/handle-job";
|
||||
const $route = useRoute();
|
||||
const userInfo = useUserInfo();
|
||||
const $message = useMessage();
|
||||
const {proxy} = getCurrentInstance();
|
||||
// 引入组件
|
||||
const UserRolePicker = defineAsyncComponent(() => import('../../../flow/components/user-role/picker.vue'));
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('../flow-design/view.vue'));
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl, onLoaded, remoteMethodByKey } from '/@/flow/components/convert-name/convert';
|
||||
import * as doJob from '/@/api/jsonflow/do-job';
|
||||
import { useFlowJob } from '/@/flow/stores/flowJob';
|
||||
import { useUserInfo } from '/@/stores/userInfo';
|
||||
import { handleFlowPreview } from '/@/flow/support/extend';
|
||||
import { PROP_CONST } from '/@/flow/support/prop-const';
|
||||
import {
|
||||
handleEarlyComplete,
|
||||
handleInvalidFlow,
|
||||
handleSignForJob,
|
||||
handleSuspension,
|
||||
handleTerminateFlow,
|
||||
onSignForJob,
|
||||
onTurnRunJob,
|
||||
} from '/@/flow/components/handle-job';
|
||||
const $route = useRoute();
|
||||
const userInfo = useUserInfo();
|
||||
const $message = useMessage();
|
||||
const { proxy } = getCurrentInstance();
|
||||
// 引入组件
|
||||
const UserRolePicker = defineAsyncComponent(() => import('../../../flow/components/user-role/picker.vue'));
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('../flow-design/view.vue'));
|
||||
|
||||
const flowJob = useFlowJob()
|
||||
const {t} = useI18n()
|
||||
const $router = useRouter();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "flowInstId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["runNodeId"]}, {key: "runNodeId", cascades: ["runJobId"]});
|
||||
onMounted(async () => {
|
||||
let belongType = $route.query.belongType;
|
||||
if (belongType) {
|
||||
state.queryForm.belongType = belongType
|
||||
data.activeName = belongType
|
||||
}
|
||||
await onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(state.queryForm, {key: key, cascades: cascades});
|
||||
}
|
||||
const flowJob = useFlowJob();
|
||||
const { t } = useI18n();
|
||||
const $router = useRouter();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'flowInstId' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['runNodeId'] }, { key: 'runNodeId', cascades: ['runJobId'] });
|
||||
onMounted(async () => {
|
||||
let belongType = $route.query.belongType;
|
||||
if (belongType) {
|
||||
state.queryForm.belongType = belongType;
|
||||
data.activeName = belongType;
|
||||
}
|
||||
await onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(state.queryForm, { key: key, cascades: cascades });
|
||||
}
|
||||
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
|
||||
const data = reactive({
|
||||
// 0、转办
|
||||
nodeUserType: undefined,
|
||||
currJob: undefined,
|
||||
queryForm: {},
|
||||
showComment: false,
|
||||
showFlowPic: false,
|
||||
activeName: '-1'
|
||||
});
|
||||
const data = reactive({
|
||||
// 0、转办
|
||||
nodeUserType: undefined,
|
||||
currJob: undefined,
|
||||
queryForm: {},
|
||||
showComment: false,
|
||||
showFlowPic: false,
|
||||
activeName: '-1',
|
||||
});
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {belongType: data.activeName},
|
||||
pageList: doJob.fetchTodoPage,
|
||||
onLoaded: onLoaded({key: "initiatorId"}, {key: "parFlowInstId"}, {key: "orderId"}, {key: "runNodeId"}, ...PROP_CONST.LOAD_USER_ROLE),
|
||||
descs: ["receive_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: { belongType: data.activeName },
|
||||
pageList: doJob.fetchTodoPage,
|
||||
onLoaded: onLoaded({ key: 'initiatorId' }, { key: 'parFlowInstId' }, { key: 'orderId' }, { key: 'runNodeId' }, ...PROP_CONST.LOAD_USER_ROLE),
|
||||
descs: ['receive_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-job/export', state.queryForm, 'run-job.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-job/export', state.queryForm, 'run-job.xlsx');
|
||||
};
|
||||
|
||||
const tableRowClassName = ({row, rowIndex}) => {
|
||||
if (row.isRead !== '1') {
|
||||
return 'row-custom-warning'
|
||||
}
|
||||
return ''
|
||||
}
|
||||
const tableRowClassName = ({ row, rowIndex }) => {
|
||||
if (row.isRead !== '1') {
|
||||
return 'row-custom-warning';
|
||||
}
|
||||
return '';
|
||||
};
|
||||
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "initiatorId")
|
||||
}
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'initiatorId');
|
||||
}
|
||||
|
||||
const methods = {
|
||||
handleTabClick(tab) {
|
||||
if (data.activeName === tab.paneName) return
|
||||
state.queryForm.signatureType = null
|
||||
state.queryForm.belongType = null
|
||||
if (tab.paneName !== '3') {
|
||||
state.queryForm.belongType = tab.paneName
|
||||
} else {
|
||||
state.queryForm.belongType = '0'
|
||||
// 仅标识
|
||||
state.queryForm.signatureType = '-1'
|
||||
}
|
||||
getDataList(true)
|
||||
},
|
||||
handleJobByFlowInstId(row, type) {
|
||||
let find;
|
||||
if (type === '1') {
|
||||
find = state.dicData.parFlowInstId.find(f => f.id === row.parFlowInstId);
|
||||
}
|
||||
methods.handleJob({flowInstId: find.id}, '1', '0')
|
||||
},
|
||||
handleJob(row, isView?, isRead?) {
|
||||
handleFlowPreview($router, row, isView, isRead, $message, flowJob, getDataList)
|
||||
},
|
||||
handleJobRoleUserId(row, type) {
|
||||
data.currJob = row
|
||||
methods.openJobRoleUserId(type)
|
||||
},
|
||||
handleComment(row) {
|
||||
data.currJob = row
|
||||
data.showComment = true
|
||||
},
|
||||
handleFlowPic(row) {
|
||||
data.currJob = row
|
||||
data.showFlowPic = true
|
||||
},
|
||||
// 签收反签收任务
|
||||
handleSignForJob(row, type) {
|
||||
handleSignForJob(methods, $message, getDataList, row, type)
|
||||
},
|
||||
// 反签收任务
|
||||
onSignForJob(obj) {
|
||||
onSignForJob($message, flowJob, getDataList, obj)
|
||||
},
|
||||
// 挂起激活任务
|
||||
handleSuspension(row, suspension) {
|
||||
handleSuspension($message, getDataList, row, suspension)
|
||||
},
|
||||
// 选择参与者
|
||||
openJobRoleUserId(type) {
|
||||
data.nodeUserType = type
|
||||
proxy.$refs.userRolePicker.onOpen();
|
||||
},
|
||||
onSelectItems(items) {
|
||||
if (data.nodeUserType === '0') {
|
||||
methods.onTurnRunJob(items[0])
|
||||
}
|
||||
},
|
||||
// 提前结束流程
|
||||
handleEarlyComplete(row) {
|
||||
handleEarlyComplete($message, flowJob, getDataList, row)
|
||||
},
|
||||
// 终止流程
|
||||
handleTerminateFlow(row) {
|
||||
handleTerminateFlow($message, flowJob, getDataList, row)
|
||||
},
|
||||
// 作废流程
|
||||
handleInvalidFlow(row) {
|
||||
handleInvalidFlow($message, flowJob, getDataList, row)
|
||||
},
|
||||
// 转办任务
|
||||
onTurnRunJob(role) {
|
||||
onTurnRunJob($message, flowJob, getDataList, data, role)
|
||||
}
|
||||
}
|
||||
const methods = {
|
||||
handleTabClick(tab) {
|
||||
if (data.activeName === tab.paneName) return;
|
||||
state.queryForm.signatureType = null;
|
||||
state.queryForm.belongType = null;
|
||||
if (tab.paneName !== '3') {
|
||||
state.queryForm.belongType = tab.paneName;
|
||||
} else {
|
||||
state.queryForm.belongType = '0';
|
||||
// 仅标识
|
||||
state.queryForm.signatureType = '-1';
|
||||
}
|
||||
getDataList(true);
|
||||
},
|
||||
handleJobByFlowInstId(row, type) {
|
||||
let find;
|
||||
if (type === '1') {
|
||||
find = state.dicData.parFlowInstId.find((f) => f.id === row.parFlowInstId);
|
||||
}
|
||||
methods.handleJob({ flowInstId: find.id }, '1', '0');
|
||||
},
|
||||
handleJob(row, isView?, isRead?) {
|
||||
handleFlowPreview($router, row, isView, isRead, $message, flowJob, getDataList);
|
||||
},
|
||||
handleJobRoleUserId(row, type) {
|
||||
data.currJob = row;
|
||||
methods.openJobRoleUserId(type);
|
||||
},
|
||||
handleComment(row) {
|
||||
data.currJob = row;
|
||||
data.showComment = true;
|
||||
},
|
||||
handleFlowPic(row) {
|
||||
data.currJob = row;
|
||||
data.showFlowPic = true;
|
||||
},
|
||||
// 签收反签收任务
|
||||
handleSignForJob(row, type) {
|
||||
handleSignForJob(methods, $message, getDataList, row, type);
|
||||
},
|
||||
// 反签收任务
|
||||
onSignForJob(obj) {
|
||||
onSignForJob($message, flowJob, getDataList, obj);
|
||||
},
|
||||
// 挂起激活任务
|
||||
handleSuspension(row, suspension) {
|
||||
handleSuspension($message, getDataList, row, suspension);
|
||||
},
|
||||
// 选择参与者
|
||||
openJobRoleUserId(type) {
|
||||
data.nodeUserType = type;
|
||||
proxy.$refs.userRolePicker.onOpen();
|
||||
},
|
||||
onSelectItems(items) {
|
||||
if (data.nodeUserType === '0') {
|
||||
methods.onTurnRunJob(items[0]);
|
||||
}
|
||||
},
|
||||
// 提前结束流程
|
||||
handleEarlyComplete(row) {
|
||||
handleEarlyComplete($message, flowJob, getDataList, row);
|
||||
},
|
||||
// 终止流程
|
||||
handleTerminateFlow(row) {
|
||||
handleTerminateFlow($message, flowJob, getDataList, row);
|
||||
},
|
||||
// 作废流程
|
||||
handleInvalidFlow(row) {
|
||||
handleInvalidFlow($message, flowJob, getDataList, row);
|
||||
},
|
||||
// 转办任务
|
||||
onTurnRunJob(role) {
|
||||
onTurnRunJob($message, flowJob, getDataList, data, role);
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
|
||||
.el-table .row-custom-warning {
|
||||
--el-table-tr-bg-color: var(--el-color-warning-light-9);
|
||||
}
|
||||
.el-table .row-custom-warning {
|
||||
--el-table-tr-bg-color: var(--el-color-warning-light-9);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,272 +1,325 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<span style="margin-left: 30px">什么是待跳转参与者？当待跳转参与者为空时，则默认会跳转到该节点下的全部参与者。当待跳转参与者不为空时，则会跳转到该节点下指定的参与者（{{userRoleIdText}}）</span>
|
||||
<el-row :gutter="24">
|
||||
<el-divider> 参与者设置 </el-divider>
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item label="跳转参与者类型" prop="jobType">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>标识【待跳转任务】的【参与者类型】。当待跳转任务存在【参与者】时，可不选择</template>
|
||||
<el-radio-group @change="handleRoleType"
|
||||
v-model="form.jobType">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.value">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="form.jobType">
|
||||
<template #content>当待跳转任务存在【参与者】时，可不选择</template>
|
||||
<el-button text type="primary" icon="delete" @click="clearJobType">
|
||||
清空
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-divider> 任意跳转设置 </el-divider>
|
||||
<div>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<span style="margin-left: 30px"
|
||||
>什么是待跳转参与者？当待跳转参与者为空时，则默认会跳转到该节点下的全部参与者。当待跳转参与者不为空时，则会跳转到该节点下指定的参与者（{{
|
||||
userRoleIdText
|
||||
}}）</span
|
||||
>
|
||||
<el-row :gutter="24">
|
||||
<el-divider> 参与者设置 </el-divider>
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item label="跳转参与者类型" prop="jobType">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>标识【待跳转任务】的【参与者类型】。当待跳转任务存在【参与者】时，可不选择</template>
|
||||
<el-radio-group @change="handleRoleType" v-model="form.jobType">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.value">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="form.jobType">
|
||||
<template #content>当待跳转任务存在【参与者】时，可不选择</template>
|
||||
<el-button text type="primary" icon="delete" @click="clearJobType"> 清空 </el-button>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-divider> 任意跳转设置 </el-divider>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runReject.inputFlowInstIdTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runReject.inputFlowInstIdTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('runReject.inputDefFlowIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.defFlowId" :key="index" :label="item.flowName" :value="item.defFlowId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('runReject.inputDefFlowIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.defFlowId" :key="index" :label="item.flowName" :value="item.defFlowId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.toRunNodeId')" prop="toRunNodeId">
|
||||
<el-tooltip placement="top" content="若不选择具体的【待跳转参与者】，则默认会跳转到该节点下的全部参与者">
|
||||
<el-select v-model="form.toRunNodeId" :placeholder="t('runReject.inputToFlowNodeIdTip')" clearable filterable
|
||||
@change="cascadeChange('toRunNodeId', ['anyJumpUserId', 'anyJumpRoleId', 'anyJumpPostId', 'anyJumpDeptId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.toRunNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.toRunNodeId')" prop="toRunNodeId">
|
||||
<el-tooltip placement="top" content="若不选择具体的【待跳转参与者】，则默认会跳转到该节点下的全部参与者">
|
||||
<el-select
|
||||
v-model="form.toRunNodeId"
|
||||
:placeholder="t('runReject.inputToFlowNodeIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('toRunNodeId', ['anyJumpUserId', 'anyJumpRoleId', 'anyJumpPostId', 'anyJumpDeptId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.toRunNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[0].value">
|
||||
<el-form-item label="指定待跳转人员" prop="handleRoleId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{validateNull(cascadeDic.anyJumpUserId) ? roleIdText : roleIdText2}}</template>
|
||||
<el-select v-model="form.handleRoleId" placeholder="请输入用户名称进行模糊搜索" clearable filterable
|
||||
remote :remote-method="methodsRemote.remoteMethodUser" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in validateNull(cascadeDic.anyJumpUserId) ? dicData.users : cascadeDic.anyJumpUserId"
|
||||
:key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[0].value">
|
||||
<el-form-item label="指定待跳转人员" prop="handleRoleId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{ validateNull(cascadeDic.anyJumpUserId) ? roleIdText : roleIdText2 }}</template>
|
||||
<el-select
|
||||
v-model="form.handleRoleId"
|
||||
placeholder="请输入用户名称进行模糊搜索"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="methodsRemote.remoteMethodUser"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in validateNull(cascadeDic.anyJumpUserId) ? dicData.users : cascadeDic.anyJumpUserId"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.userId"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[1].value">
|
||||
<el-form-item label="指定待跳转角色" prop="handleRoleId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{validateNull(cascadeDic.anyJumpRoleId) ? roleIdText : roleIdText2}}</template>
|
||||
<el-select v-model="form.handleRoleId" placeholder="请输入角色名称进行模糊搜索" clearable filterable
|
||||
remote :remote-method="methodsRemote.remoteMethodRole" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in validateNull(cascadeDic.anyJumpRoleId) ? dicData.roles : cascadeDic.anyJumpRoleId"
|
||||
:key="index" :label="item.roleName" :value="item.roleId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[1].value">
|
||||
<el-form-item label="指定待跳转角色" prop="handleRoleId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{ validateNull(cascadeDic.anyJumpRoleId) ? roleIdText : roleIdText2 }}</template>
|
||||
<el-select
|
||||
v-model="form.handleRoleId"
|
||||
placeholder="请输入角色名称进行模糊搜索"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="methodsRemote.remoteMethodRole"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in validateNull(cascadeDic.anyJumpRoleId) ? dicData.roles : cascadeDic.anyJumpRoleId"
|
||||
:key="index"
|
||||
:label="item.roleName"
|
||||
:value="item.roleId"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[2].value">
|
||||
<el-form-item label="指定待跳转岗位" prop="handleRoleId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{validateNull(cascadeDic.anyJumpPostId) ? roleIdText : roleIdText2}}</template>
|
||||
<el-select v-model="form.handleRoleId" placeholder="请输入岗位名称进行模糊搜索" clearable filterable
|
||||
remote :remote-method="methodsRemote.remoteMethodPost" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in validateNull(cascadeDic.anyJumpPostId) ? dicData.posts : cascadeDic.anyJumpPostId"
|
||||
:key="index" :label="item.postName" :value="item.postId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20" v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[2].value">
|
||||
<el-form-item label="指定待跳转岗位" prop="handleRoleId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{ validateNull(cascadeDic.anyJumpPostId) ? roleIdText : roleIdText2 }}</template>
|
||||
<el-select
|
||||
v-model="form.handleRoleId"
|
||||
placeholder="请输入岗位名称进行模糊搜索"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="methodsRemote.remoteMethodPost"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in validateNull(cascadeDic.anyJumpPostId) ? dicData.posts : cascadeDic.anyJumpPostId"
|
||||
:key="index"
|
||||
:label="item.postName"
|
||||
:value="item.postId"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[3].value">
|
||||
<el-form-item label="指定待跳转部门" prop="handleRoleId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{validateNull(cascadeDic.anyJumpDeptId) ? roleIdText : roleIdText2}}</template>
|
||||
<el-select v-model="form.handleRoleId" placeholder="请输入部门名称进行模糊搜索" clearable filterable
|
||||
remote :remote-method="methodsRemote.remoteMethodDept" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in validateNull(cascadeDic.anyJumpDeptId) ? dicData.depts : cascadeDic.anyJumpDeptId"
|
||||
:key="index" :label="item.name" :value="item.deptId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<footer class="el-dialog__footer">
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleUpdate" :loading="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</footer>
|
||||
</div>
|
||||
<el-col :span="12" class="mb20" v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[3].value">
|
||||
<el-form-item label="指定待跳转部门" prop="handleRoleId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{ validateNull(cascadeDic.anyJumpDeptId) ? roleIdText : roleIdText2 }}</template>
|
||||
<el-select
|
||||
v-model="form.handleRoleId"
|
||||
placeholder="请输入部门名称进行模糊搜索"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="methodsRemote.remoteMethodDept"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in validateNull(cascadeDic.anyJumpDeptId) ? dicData.depts : cascadeDic.anyJumpDeptId"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.deptId"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<footer class="el-dialog__footer">
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleUpdate" :loading="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="RunAnyJumpForm">
|
||||
import { useI18n } from "vue-i18n"
|
||||
import {
|
||||
onCascadeChange,
|
||||
onLoadDicUrl,
|
||||
remoteMethodByKey
|
||||
} from "/@/flow/components/convert-name/convert";
|
||||
import {validateNull} from "/@/utils/validate";
|
||||
import {useMessage} from "/@/hooks/message";
|
||||
import {handleChangeJobType} from "/@/flow";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl, remoteMethodByKey } from '/@/flow/components/convert-name/convert';
|
||||
import { validateNull } from '/@/utils/validate';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { handleChangeJobType } from '/@/flow';
|
||||
|
||||
const { t } = useI18n();
|
||||
const $message = useMessage();
|
||||
const $emit = defineEmits(['onAnyJumpJob']);
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const { t } = useI18n();
|
||||
const $message = useMessage();
|
||||
const $emit = defineEmits(['onAnyJumpJob']);
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["defFlowId"]}, {prefix: "runJob", key: "flowInstId", cascades: ["toRunNodeId"]}, {key: "toRunNodeId"
|
||||
, cascades: ["anyJumpUserId", "anyJumpRoleId", "anyJumpPostId", "anyJumpDeptId"]});
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
const onCascade = onCascadeChange(
|
||||
cascadeDic,
|
||||
{ key: 'flowInstId', cascades: ['defFlowId'] },
|
||||
{ prefix: 'runJob', key: 'flowInstId', cascades: ['toRunNodeId'] },
|
||||
{ key: 'toRunNodeId', cascades: ['anyJumpUserId', 'anyJumpRoleId', 'anyJumpPostId', 'anyJumpDeptId'] }
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
|
||||
function cascadeChange(key, cascades){
|
||||
cascadeDic.anyJumpUserId = null
|
||||
cascadeDic.anyJumpRoleId = null
|
||||
cascadeDic.anyJumpPostId = null
|
||||
cascadeDic.anyJumpDeptId = null
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
handleToFlowNodeId(form[key])
|
||||
}
|
||||
function cascadeChange(key, cascades) {
|
||||
cascadeDic.anyJumpUserId = null;
|
||||
cascadeDic.anyJumpRoleId = null;
|
||||
cascadeDic.anyJumpPostId = null;
|
||||
cascadeDic.anyJumpDeptId = null;
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
handleToFlowNodeId(form[key]);
|
||||
}
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
defFlowId: '',
|
||||
flowInstId: '',
|
||||
toRunNodeId: '',
|
||||
handleRoleId: '',
|
||||
runRejectVO: {},
|
||||
jobType: '',
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
defFlowId: '',
|
||||
flowInstId: '',
|
||||
toRunNodeId: '',
|
||||
handleRoleId: '',
|
||||
runRejectVO: {},
|
||||
jobType: '',
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
flowInstId: [{required: true, message: '流程实例ID不能为空', trigger: 'blur'}],
|
||||
toRunNodeId: [{required: true, message: '到达节点名称不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
flowInstId: [{ required: true, message: '流程实例ID不能为空', trigger: 'blur' }],
|
||||
toRunNodeId: [{ required: true, message: '到达节点名称不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
}
|
||||
});
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const roleIdText = '注：当前待跳转节点下可候选待跳转参与者为空，请指定待跳转参与者即为其分配参与者'
|
||||
const roleIdText2 = '注：当待跳转参与者为空时，则默认会跳转到当前节点显示的全部参与者'
|
||||
const userRoleIdText = '注：当待跳转节点下任务不存在参与者时，请指定待跳转参与者即为其分配参与者'
|
||||
const roleIdText = '注：当前待跳转节点下可候选待跳转参与者为空，请指定待跳转参与者即为其分配参与者';
|
||||
const roleIdText2 = '注：当待跳转参与者为空时，则默认会跳转到当前节点显示的全部参与者';
|
||||
const userRoleIdText = '注：当待跳转节点下任务不存在参与者时，请指定待跳转参与者即为其分配参与者';
|
||||
|
||||
function handleToFlowNodeId(val) {
|
||||
if (!val) return
|
||||
const runNode = cascadeDic.toRunNodeId.find(f => f.id === val)
|
||||
form.runRejectVO.toRunNodeId = runNode.id
|
||||
form.runRejectVO.toFlowNodeId = runNode.flowNodeId
|
||||
}
|
||||
function handleToFlowNodeId(val) {
|
||||
if (!val) return;
|
||||
const runNode = cascadeDic.toRunNodeId.find((f) => f.id === val);
|
||||
form.runRejectVO.toRunNodeId = runNode.id;
|
||||
form.runRejectVO.toFlowNodeId = runNode.flowNodeId;
|
||||
}
|
||||
|
||||
function initJobData() {
|
||||
Object.assign(form, props.currJob)
|
||||
onCascade(form)
|
||||
}
|
||||
function initJobData() {
|
||||
Object.assign(form, props.currJob);
|
||||
onCascade(form);
|
||||
}
|
||||
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form)
|
||||
form.handleRoleId = null
|
||||
}
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form);
|
||||
form.handleRoleId = null;
|
||||
}
|
||||
|
||||
function clearJobType() {
|
||||
form.jobType = ''
|
||||
form.handleRoleId = null
|
||||
}
|
||||
function clearJobType() {
|
||||
form.jobType = '';
|
||||
form.handleRoleId = null;
|
||||
}
|
||||
|
||||
const methodsRemote = {
|
||||
remoteMethodUser(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "users")
|
||||
},
|
||||
remoteMethodRole(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'roleName', "roles")
|
||||
},
|
||||
remoteMethodPost(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'postName', "posts")
|
||||
},
|
||||
remoteMethodDept(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'deptName', "depts")
|
||||
},
|
||||
}
|
||||
const methodsRemote = {
|
||||
remoteMethodUser(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'users');
|
||||
},
|
||||
remoteMethodRole(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'roleName', 'roles');
|
||||
},
|
||||
remoteMethodPost(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'postName', 'posts');
|
||||
},
|
||||
remoteMethodDept(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'deptName', 'depts');
|
||||
},
|
||||
};
|
||||
|
||||
async function handleUpdate() {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
async function handleUpdate() {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
let b = validateNull(cascadeDic.anyJumpUserId) && validateNull(cascadeDic.anyJumpRoleId)
|
||||
&& validateNull(cascadeDic.anyJumpPostId) && validateNull(cascadeDic.anyJumpDeptId) && !form.handleRoleId;
|
||||
let b =
|
||||
validateNull(cascadeDic.anyJumpUserId) &&
|
||||
validateNull(cascadeDic.anyJumpRoleId) &&
|
||||
validateNull(cascadeDic.anyJumpPostId) &&
|
||||
validateNull(cascadeDic.anyJumpDeptId) &&
|
||||
!form.handleRoleId;
|
||||
|
||||
if (b) {
|
||||
$message.warning(roleIdText)
|
||||
return
|
||||
}
|
||||
if (b) {
|
||||
$message.warning(roleIdText);
|
||||
return;
|
||||
}
|
||||
|
||||
// 为空则跳转到显示的全部参与者
|
||||
if (form.jobType) {
|
||||
form.runRejectVO.handleRoleId = form.handleRoleId
|
||||
form.runRejectVO.jobType = form.jobType
|
||||
}
|
||||
// 为空则跳转到显示的全部参与者
|
||||
if (form.jobType) {
|
||||
form.runRejectVO.handleRoleId = form.handleRoleId;
|
||||
form.runRejectVO.jobType = form.jobType;
|
||||
}
|
||||
|
||||
props.currJob.runRejectVO = form.runRejectVO
|
||||
props.currJob.runRejectVO = form.runRejectVO;
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
$emit('onAnyJumpJob', props.currJob)
|
||||
setTimeout(() => { // 异步异常
|
||||
loading.value = false
|
||||
}, 3000)
|
||||
} catch (e) {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
loading.value = true;
|
||||
try {
|
||||
$emit('onAnyJumpJob', props.currJob);
|
||||
setTimeout(() => {
|
||||
// 异步异常
|
||||
loading.value = false;
|
||||
}, 3000);
|
||||
} catch (e) {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听双向绑定
|
||||
watch(
|
||||
() => props.currJob.id,
|
||||
(val) => {
|
||||
initJobData();
|
||||
}
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
initJobData();
|
||||
});
|
||||
// 监听双向绑定
|
||||
watch(
|
||||
() => props.currJob.id,
|
||||
(val) => {
|
||||
initJobData();
|
||||
}
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
initJobData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-dialog__footer {
|
||||
text-align: center;
|
||||
.el-dialog__footer {
|
||||
text-align: center;
|
||||
|
||||
.dialog-footer {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.dialog-footer {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,95 +1,139 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="150px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-dialog :title="title" v-model="visible" width="60%" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="150px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('runJob.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runJob.inputFlowInstIdTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('runJob.flowInstId')" prop="flowInstId" >
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runJob.inputFlowInstIdTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('runJob.inputDefFlowIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.defFlowId" :key="index" :label="item.flowName" :value="item.defFlowId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('runJob.inputDefFlowIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.defFlowId" :key="index" :label="item.flowName" :value="item.defFlowId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.runNodeId')" prop="runNodeId">
|
||||
<el-select v-model="form.runNodeId" :placeholder="t('runJob.inputRunNodeIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.runNodeId')" prop="runNodeId">
|
||||
<el-select v-model="form.runNodeId" :placeholder="t('runJob.inputRunNodeIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.jobName')" prop="jobName">
|
||||
<el-input v-model="form.jobName" :placeholder="t('runJob.inputJobNameTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.jobName')" prop="jobName">
|
||||
<el-input v-model="form.jobName" :placeholder="t('runJob.inputJobNameTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.jobType')" prop="jobType">
|
||||
<el-select v-model="form.jobType" :placeholder="t('runJob.inputJobTypeTip')" clearable filterable @change="handleRoleType">
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_NONE_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.jobType')" prop="jobType">
|
||||
<el-select v-model="form.jobType" :placeholder="t('runJob.inputJobTypeTip')" clearable filterable
|
||||
@change="handleRoleType">
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_NONE_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.roleId')" prop="roleId">
|
||||
<el-tooltip content="请输入名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="form.roleId"
|
||||
:placeholder="t('runJob.inputRoleIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="(query) => remoteMethodAll(query, form.jobType)"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.users"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.userId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[0].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.roles"
|
||||
:key="index"
|
||||
:label="item.roleName"
|
||||
:value="item.roleId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[1].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.posts"
|
||||
:key="index"
|
||||
:label="item.postName"
|
||||
:value="item.postId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[2].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.depts"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.deptId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[3].value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.roleId')" prop="roleId">
|
||||
<el-tooltip content="请输入名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="form.roleId" :placeholder="t('runJob.inputRoleIdTip')" clearable filterable
|
||||
remote :remote-method="(query) => remoteMethodAll(query, form.jobType)" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[0].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.roles" :key="index" :label="item.roleName" :value="item.roleId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[1].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.posts" :key="index" :label="item.postName" :value="item.postId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[2].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.depts" :key="index" :label="item.name" :value="item.deptId"
|
||||
v-if="form.jobType === DIC_PROP.JOB_USER_TYPE[3].value"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.userId')" prop="userId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="form.userId"
|
||||
:placeholder="t('runJob.inputUserIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="remoteMethod"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.userId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.userId')" prop="userId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="form.userId" :placeholder="t('runJob.inputUserIdTip')" clearable filterable
|
||||
remote :remote-method="remoteMethod" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.userId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.startTime')" prop="startTime">
|
||||
<el-date-picker
|
||||
disabled
|
||||
type="datetime"
|
||||
:placeholder="t('runJob.inputStartTimeTip')"
|
||||
v-model="form.startTime"
|
||||
:value-format="dateTimeStr"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.startTime')" prop="startTime">
|
||||
<el-date-picker disabled type="datetime" :placeholder="t('runJob.inputStartTimeTip')" v-model="form.startTime" :value-format="dateTimeStr"></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.endTime')" prop="endTime">
|
||||
<el-date-picker
|
||||
disabled
|
||||
type="datetime"
|
||||
:placeholder="t('runJob.inputEndTimeTip')"
|
||||
v-model="form.endTime"
|
||||
:value-format="dateTimeStr"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.endTime')" prop="endTime">
|
||||
<el-date-picker disabled type="datetime" :placeholder="t('runJob.inputEndTimeTip')" v-model="form.endTime" :value-format="dateTimeStr"></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.userKey')" prop="userKey">
|
||||
<el-select v-model="form.userKey" :placeholder="t('runJob.inputUserKeyTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in dicData.userKey" :key="index" :label="item.userKey" :value="item.userKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.userKey')" prop="userKey">
|
||||
<el-select v-model="form.userKey" :placeholder="t('runJob.inputUserKeyTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in dicData.userKey" :key="index" :label="item.userKey" :value="item.userKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- <el-col :span="12" class="mb20">
|
||||
<!-- <el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.distFlowNodeId')" prop="distFlowNodeId">
|
||||
<el-select v-model="form.distFlowNodeId" :placeholder="t('runJob.inputDistFlowNodeIdTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.flowNodeId"></el-option>
|
||||
@@ -97,47 +141,47 @@
|
||||
</el-form-item>
|
||||
</el-col>-->
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.status')" prop="status">
|
||||
<el-select disabled v-model="form.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.status')" prop="status">
|
||||
<el-select disabled v-model="form.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.timeout')" prop="timeout">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.timeout" :placeholder="t('runJob.inputTimeoutTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.timeout')" prop="timeout">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.timeout" :placeholder="t('runJob.inputTimeoutTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.suspension')" prop="suspension">
|
||||
<el-radio-group v-model="form.suspension">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.suspension')" prop="suspension">
|
||||
<el-radio-group v-model="form.suspension">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.suspensionReason')" prop="suspensionReason">
|
||||
<el-input v-model="form.suspensionReason" :placeholder="t('runJob.inputSuspensionReasonTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.suspensionReason')" prop="suspensionReason">
|
||||
<el-input v-model="form.suspensionReason" :placeholder="t('runJob.inputSuspensionReasonTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.isSkipRejected')" prop="isSkipRejected">
|
||||
<el-radio-group v-model="form.isSkipRejected">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.isSkipRejected')" prop="isSkipRejected">
|
||||
<el-radio-group v-model="form.isSkipRejected">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- <el-col :span="12" class="mb20">
|
||||
<!-- <el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.isNowRun')" prop="isNowRun">
|
||||
<el-radio-group disabled v-model="form.isNowRun">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
@@ -147,165 +191,160 @@
|
||||
</el-form-item>
|
||||
</el-col>-->
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('runJob.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runJob.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('runJob.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="RunJobDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/run-job';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onFormLoadedUrl, onLoadDicUrl, remoteMethodAllByKey, remoteMethodByKey } from '/@/flow/components/convert-name/convert';
|
||||
import { handleChangeJobType } from '/@/flow';
|
||||
import { PROP_CONST } from '/@/flow/support/prop-const';
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/run-job'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import {
|
||||
onCascadeChange,
|
||||
onFormLoadedUrl,
|
||||
onLoadDicUrl,
|
||||
remoteMethodAllByKey, remoteMethodByKey
|
||||
} from "/@/flow/components/convert-name/convert";
|
||||
import {handleChangeJobType} from "/@/flow";
|
||||
import {PROP_CONST} from "/@/flow/support/prop-const";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
nodeJobId: '',
|
||||
jobType: '',
|
||||
roleId: '',
|
||||
userId: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
userKey: '',
|
||||
distFlowNodeId: '',
|
||||
timeout: 0,
|
||||
status: '',
|
||||
suspension: '',
|
||||
suspensionReason: '',
|
||||
isSkipRejected: '0',
|
||||
createUser: '',
|
||||
flowKey: '',
|
||||
flowInstId: '',
|
||||
runNodeId: '',
|
||||
isNowRun: '0',
|
||||
sort: 1,
|
||||
});
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
nodeJobId: '',
|
||||
jobType: '',
|
||||
roleId: '',
|
||||
userId: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
userKey: '',
|
||||
distFlowNodeId: '',
|
||||
timeout: 0,
|
||||
status: '',
|
||||
suspension: '',
|
||||
suspensionReason: '',
|
||||
isSkipRejected: '0',
|
||||
createUser: '',
|
||||
flowKey: '',
|
||||
flowInstId: '',
|
||||
runNodeId: '',
|
||||
isNowRun: '0',
|
||||
sort: 1,
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
flowNodeId: [{ required: true, message: '节点名称不能为空', trigger: 'blur' }],
|
||||
nodeJobId: [{ required: true, message: '任务名称不能为空', trigger: 'blur' }],
|
||||
jobType: [{ required: true, message: '参与者类型不能为空', trigger: 'blur' }],
|
||||
timeout: [{ required: true, message: '任务时限不能为空', trigger: 'blur' }],
|
||||
isSkipRejected: [{ required: true, message: '被驳回是否可跳过不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
flowNodeId: [{required: true, message: '节点名称不能为空', trigger: 'blur'}],
|
||||
nodeJobId: [{required: true, message: '任务名称不能为空', trigger: 'blur'}],
|
||||
jobType: [{required: true, message: '参与者类型不能为空', trigger: 'blur'}],
|
||||
timeout: [{required: true, message: '任务时限不能为空', trigger: 'blur'}],
|
||||
isSkipRejected: [{required: true, message: '被驳回是否可跳过不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'userKey' });
|
||||
const onFormLoaded = onFormLoadedUrl({ key: 'userId' }, ...PROP_CONST.LOAD_USER_ROLE);
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['defFlowId'] }, { key: 'flowInstId', cascades: ['runNodeId'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
}
|
||||
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "userKey"});
|
||||
const onFormLoaded = onFormLoadedUrl({key: "userId"}, ...PROP_CONST.LOAD_USER_ROLE);
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["defFlowId"]}, {key: "flowInstId", cascades: ["runNodeId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
}
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'userId');
|
||||
}
|
||||
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "userId")
|
||||
}
|
||||
function remoteMethodAll(query: string, jobType) {
|
||||
remoteMethodAllByKey(onLoad, dicData, query, jobType);
|
||||
}
|
||||
|
||||
function remoteMethodAll(query: string, jobType) {
|
||||
remoteMethodAllByKey(onLoad, dicData, query, jobType)
|
||||
}
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form);
|
||||
}
|
||||
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, form)
|
||||
}
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取RunJob信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getRunJobData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取RunJob信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getRunJobData(id)
|
||||
}
|
||||
};
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getRunJobData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onFormLoaded(dicData, form);
|
||||
onCascade(form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getRunJobData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onFormLoaded(dicData, form);
|
||||
onCascade(form);
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,311 +1,330 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runFlow.initiatorId')" prop="initiatorId" >
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="state.queryForm.initiatorId" :placeholder="t('runFlow.inputInitiatorIdTip')" clearable filterable style="max-width: 180px"
|
||||
remote :remote-method="remoteMethod" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.code')" prop="flowInstId" >
|
||||
<el-select v-model="state.queryForm.flowInstId" :placeholder="t('runFlow.inputCodeTip')" clearable filterable
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])" style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.flowInstId" :key="index" :label="item.code" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.runNodeId')" prop="runNodeId" >
|
||||
<el-select v-model="state.queryForm.runNodeId" :placeholder="t('runJob.inputRunNodeIdTip')" clearable filterable style="max-width: 180px"
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.id')" prop="id" >
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runJob.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.status')" prop="status" >
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.flowStatus')" prop="status" >
|
||||
<el-select v-model="state.queryForm.flowStatus" :placeholder="t('runJob.inputFlowStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FLOW_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tabs v-model="data.activeName" class="demo-tabs" @tab-click="methods.handleTabClick">
|
||||
<el-tab-pane label="全部" name="-1"></el-tab-pane>
|
||||
<el-tab-pane label="已办理" name="0"></el-tab-pane>
|
||||
<el-tab-pane label="被抄送" name="1"></el-tab-pane>
|
||||
<el-tab-pane label="已阅" name="2"></el-tab-pane>
|
||||
<el-tab-pane label="被加签" name="3"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_runjob_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('runJob.index')" width="40"/>
|
||||
<el-table-column prop="initiatorId" :label="t('runFlow.initiatorId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.initiatorId" :value="scope.row.initiatorId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" :label="t('runFlow.code')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowName" :label="t('runJob.defFlowId')" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column prop="orderId" :label="t('flowApplication.formName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.orderId" :value="scope.row.orderId"
|
||||
:valueKey="'id'" :showKey="'formName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="runNodeId" :label="t('runJob.runNodeId')" show-overflow-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runFlow.initiatorId')" prop="initiatorId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="state.queryForm.initiatorId"
|
||||
:placeholder="t('runFlow.inputInitiatorIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
remote
|
||||
:remote-method="remoteMethod"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.code')" prop="flowInstId">
|
||||
<el-select
|
||||
v-model="state.queryForm.flowInstId"
|
||||
:placeholder="t('runFlow.inputCodeTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])"
|
||||
style="max-width: 180px"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.flowInstId" :key="index" :label="item.code" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.runNodeId')" prop="runNodeId">
|
||||
<el-select
|
||||
v-model="state.queryForm.runNodeId"
|
||||
:placeholder="t('runJob.inputRunNodeIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.id')" prop="id">
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runJob.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.status')" prop="status">
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.flowStatus')" prop="status">
|
||||
<el-select
|
||||
v-model="state.queryForm.flowStatus"
|
||||
:placeholder="t('runJob.inputFlowStatusTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
>
|
||||
<el-option v-for="(item, index) in DIC_PROP.FLOW_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tabs v-model="data.activeName" class="demo-tabs" @tab-click="methods.handleTabClick">
|
||||
<el-tab-pane label="全部" name="-1"></el-tab-pane>
|
||||
<el-tab-pane label="已办理" name="0"></el-tab-pane>
|
||||
<el-tab-pane label="被抄送" name="1"></el-tab-pane>
|
||||
<el-tab-pane label="已阅" name="2"></el-tab-pane>
|
||||
<el-tab-pane label="被加签" name="3"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_runjob_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('runJob.index')" width="40" />
|
||||
<el-table-column prop="initiatorId" :label="t('runFlow.initiatorId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.initiatorId" :value="scope.row.initiatorId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" :label="t('runFlow.code')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowName" :label="t('runJob.defFlowId')" show-overflow-tooltip> </el-table-column>
|
||||
<el-table-column prop="orderId" :label="t('flowApplication.formName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.orderId" :value="scope.row.orderId" :valueKey="'id'" :showKey="'formName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="runNodeId" :label="t('runJob.runNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.runNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="jobName" :label="t('runJob.jobName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="jobType" :label="t('runJob.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('runJob.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name :options="{users: state.dicData.users, roles: state.dicData.roles, posts: state.dicData.posts, depts: state.dicData.depts }"
|
||||
:value="scope.row"></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('runJob.userId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="startTime" :label="t('runJob.startTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="endTime" :label="t('runJob.endTime')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="timeLimit" :label="t('runJob.timeLimit')" show-overflow-tooltip/>-->
|
||||
<el-table-column prop="useTime" :label="t('runJob.useTime')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="suspensionReason" :label="t('runJob.suspensionReason')" show-overflow-tooltip/>
|
||||
<el-table-column prop="jobName" :label="t('runJob.jobName')" show-overflow-tooltip />
|
||||
<el-table-column prop="jobType" :label="t('runJob.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('runJob.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name
|
||||
:options="{ users: state.dicData.users, roles: state.dicData.roles, posts: state.dicData.posts, depts: state.dicData.depts }"
|
||||
:value="scope.row"
|
||||
></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('runJob.userId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="startTime" :label="t('runJob.startTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="endTime" :label="t('runJob.endTime')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="timeLimit" :label="t('runJob.timeLimit')" show-overflow-tooltip/>-->
|
||||
<el-table-column prop="useTime" :label="t('runJob.useTime')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="suspensionReason" :label="t('runJob.suspensionReason')" show-overflow-tooltip/>
|
||||
<el-table-column prop="invalidReason" :label="t('runJob.invalidReason')" show-overflow-tooltip/>
|
||||
<el-table-column prop="status" :label="t('runJob.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="flowStatus" :label="t('runJob.flowStatus')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.flowStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="parFlowInstId" :label="t('runJob.parFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联父流程工单信息" v-if="scope.row.parFlowInstId">
|
||||
<convert-name :options="state.dicData.parFlowInstId" :value="scope.row.parFlowInstId"
|
||||
:valueKey="'id'" :showKey="'flowName'"
|
||||
:elTagType="'primary'" @click="methods.handleJobByFlowInstId(scope.row, '1')"></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subFlowInstId" :label="t('runJob.subFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联子流程工单信息" v-if="scope.row.subFlowInstId">
|
||||
<convert-name :options="state.dicData.subFlowInstId" :value="scope.row.subFlowInstId"
|
||||
:valueKey="'id'" :showKey="'flowName'"
|
||||
:elTagType="'primary'" @click="methods.handleJobByFlowInstId(scope.row, '2')"></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('common.action')" width="120">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
查看工单
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="methods.handleJob(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
查看审批过程
|
||||
</template>
|
||||
<el-button text type="primary" icon="Operation" @click="methods.handleComment(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
查看流程图
|
||||
</template>
|
||||
<el-button text type="primary" icon="Share" @click="methods.handleFlowPic(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.flowStatus === '0' && scope.row.belongType !== '2'">
|
||||
<template #content>
|
||||
取回任务
|
||||
</template>
|
||||
<el-button text type="primary" icon="CirclePlus" @click="methods.handleRetakeJob(scope.row, '1')">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
|
||||
v-bind="state.pagination"/>
|
||||
</div>
|
||||
<el-table-column prop="flowStatus" :label="t('runJob.flowStatus')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.flowStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="parFlowInstId" :label="t('runJob.parFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联父流程工单信息" v-if="scope.row.parFlowInstId">
|
||||
<convert-name
|
||||
:options="state.dicData.parFlowInstId"
|
||||
:value="scope.row.parFlowInstId"
|
||||
:valueKey="'id'"
|
||||
:showKey="'flowName'"
|
||||
:elTagType="'primary'"
|
||||
@click="methods.handleJobByFlowInstId(scope.row, '1')"
|
||||
></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subFlowInstId" :label="t('runJob.subFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联子流程工单信息" v-if="scope.row.subFlowInstId">
|
||||
<convert-name
|
||||
:options="state.dicData.subFlowInstId"
|
||||
:value="scope.row.subFlowInstId"
|
||||
:valueKey="'id'"
|
||||
:showKey="'flowName'"
|
||||
:elTagType="'primary'"
|
||||
@click="methods.handleJobByFlowInstId(scope.row, '2')"
|
||||
></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('common.action')" width="120">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content> 查看工单 </template>
|
||||
<el-button text type="primary" icon="view" @click="methods.handleJob(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content> 查看审批过程 </template>
|
||||
<el-button text type="primary" icon="Operation" @click="methods.handleComment(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content> 查看流程图 </template>
|
||||
<el-button text type="primary" icon="Share" @click="methods.handleFlowPic(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.flowStatus === '0' && scope.row.belongType !== '2'">
|
||||
<template #content> 取回任务 </template>
|
||||
<el-button text type="primary" icon="CirclePlus" @click="methods.handleRetakeJob(scope.row, '1')"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog v-model="data.showComment" v-if="data.showComment"
|
||||
top="20px" width="90%"
|
||||
title="查看审批过程" append-to-body>
|
||||
<comment :currJob="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog v-model="data.showComment" v-if="data.showComment" top="20px" width="90%" title="查看审批过程" append-to-body>
|
||||
<comment :currJob="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer" direction="rtl"
|
||||
append-to-body size="90%"
|
||||
v-model="data.showFlowPic"
|
||||
>
|
||||
<flow-photo v-if="data.showFlowPic" :currJob="data.currJob"></flow-photo>
|
||||
</el-drawer>
|
||||
|
||||
</div>
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer class="flow-overflow-drawer" direction="rtl" append-to-body size="90%" v-model="data.showFlowPic">
|
||||
<flow-photo v-if="data.showFlowPic" :currJob="data.currJob"></flow-photo>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="HiJob">
|
||||
import {BasicTableProps, useTable} from "/@/hooks/table";
|
||||
import {fetchToDonePage, retakeJob} from '/@/api/jsonflow/hi-job'
|
||||
import {useMessage, useMessageBox} from "/@/hooks/message";
|
||||
import {useI18n} from "vue-i18n";
|
||||
import {onCascadeChange, onLoadDicUrl, onLoaded, remoteMethodByKey} from "/@/flow/components/convert-name/convert";
|
||||
import {openFlowPreview} from "/@/flow/support/extend";
|
||||
import {PROP_CONST} from "/@/flow/support/prop-const";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchToDonePage, retakeJob } from '/@/api/jsonflow/hi-job';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl, onLoaded, remoteMethodByKey } from '/@/flow/components/convert-name/convert';
|
||||
import { openFlowPreview } from '/@/flow/support/extend';
|
||||
import { PROP_CONST } from '/@/flow/support/prop-const';
|
||||
|
||||
const $message = useMessage();
|
||||
const {proxy} = getCurrentInstance();
|
||||
const router = useRouter();
|
||||
// 引入组件
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('../flow-design/view.vue'));
|
||||
const {t} = useI18n()
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "flowInstId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["runNodeId"]}, {key: "runNodeId", cascades: ["runJobId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(state.queryForm, {key: key, cascades: cascades});
|
||||
}
|
||||
const $message = useMessage();
|
||||
const { proxy } = getCurrentInstance();
|
||||
const router = useRouter();
|
||||
// 引入组件
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('../flow-design/view.vue'));
|
||||
const { t } = useI18n();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'flowInstId' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['runNodeId'] }, { key: 'runNodeId', cascades: ['runJobId'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(state.queryForm, { key: key, cascades: cascades });
|
||||
}
|
||||
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
|
||||
const data = reactive({
|
||||
currJob: {},
|
||||
showComment: false,
|
||||
showFlowPic: false,
|
||||
activeName: '-1'
|
||||
});
|
||||
const data = reactive({
|
||||
currJob: {},
|
||||
showComment: false,
|
||||
showFlowPic: false,
|
||||
activeName: '-1',
|
||||
});
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {queryJobType: '0', belongType: data.activeName},
|
||||
pageList: fetchToDonePage,
|
||||
onLoaded: onLoaded({key: "userId"}, {key: "initiatorId"}, {key: "parFlowInstId"}, {key: "subFlowInstId"}, {key: "orderId"}, {key: "runNodeId"}, ...PROP_CONST.LOAD_USER_ROLE),
|
||||
descs: ["end_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: { queryJobType: '0', belongType: data.activeName },
|
||||
pageList: fetchToDonePage,
|
||||
onLoaded: onLoaded(
|
||||
{ key: 'userId' },
|
||||
{ key: 'initiatorId' },
|
||||
{ key: 'parFlowInstId' },
|
||||
{ key: 'subFlowInstId' },
|
||||
{ key: 'orderId' },
|
||||
{ key: 'runNodeId' },
|
||||
...PROP_CONST.LOAD_USER_ROLE
|
||||
),
|
||||
descs: ['end_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-job/export', state.queryForm, 'run-job.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-job/export', state.queryForm, 'run-job.xlsx');
|
||||
};
|
||||
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "initiatorId")
|
||||
}
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'initiatorId');
|
||||
}
|
||||
|
||||
const methods = {
|
||||
handleTabClick(tab) {
|
||||
if (data.activeName === tab.paneName) return
|
||||
state.queryForm.signatureType = null
|
||||
state.queryForm.belongType = null
|
||||
if (tab.paneName !== '3') {
|
||||
state.queryForm.belongType = tab.paneName
|
||||
} else {
|
||||
state.queryForm.belongType = '0'
|
||||
// 仅标识
|
||||
state.queryForm.signatureType = '-1'
|
||||
}
|
||||
getDataList(true)
|
||||
},
|
||||
handleJobByFlowInstId(row, type) {
|
||||
let find;
|
||||
if (type === '1') {
|
||||
find = state.dicData.parFlowInstId.find(f => f.id === row.parFlowInstId);
|
||||
} else {
|
||||
find = state.dicData.subFlowInstId.find(f => f.id === row.subFlowInstId);
|
||||
}
|
||||
methods.handleJob({flowInstId: find.id})
|
||||
},
|
||||
handleJob(row) {
|
||||
openFlowPreview(router, row)
|
||||
},
|
||||
handleRetakeJob(row) {
|
||||
retakeJob(row).then(() => {
|
||||
getDataList();
|
||||
})
|
||||
},
|
||||
handleComment(row) {
|
||||
data.currJob = row
|
||||
data.showComment = true
|
||||
},
|
||||
handleFlowPic(row) {
|
||||
data.currJob = row
|
||||
data.showFlowPic = true
|
||||
}
|
||||
}
|
||||
const methods = {
|
||||
handleTabClick(tab) {
|
||||
if (data.activeName === tab.paneName) return;
|
||||
state.queryForm.signatureType = null;
|
||||
state.queryForm.belongType = null;
|
||||
if (tab.paneName !== '3') {
|
||||
state.queryForm.belongType = tab.paneName;
|
||||
} else {
|
||||
state.queryForm.belongType = '0';
|
||||
// 仅标识
|
||||
state.queryForm.signatureType = '-1';
|
||||
}
|
||||
getDataList(true);
|
||||
},
|
||||
handleJobByFlowInstId(row, type) {
|
||||
let find;
|
||||
if (type === '1') {
|
||||
find = state.dicData.parFlowInstId.find((f) => f.id === row.parFlowInstId);
|
||||
} else {
|
||||
find = state.dicData.subFlowInstId.find((f) => f.id === row.subFlowInstId);
|
||||
}
|
||||
methods.handleJob({ flowInstId: find.id });
|
||||
},
|
||||
handleJob(row) {
|
||||
openFlowPreview(router, row);
|
||||
},
|
||||
handleRetakeJob(row) {
|
||||
retakeJob(row).then(() => {
|
||||
getDataList();
|
||||
});
|
||||
},
|
||||
handleComment(row) {
|
||||
data.currJob = row;
|
||||
data.showComment = true;
|
||||
},
|
||||
handleFlowPic(row) {
|
||||
data.currJob = row;
|
||||
data.showFlowPic = true;
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
</style>
|
||||
|
||||
|
||||
@@ -1,68 +1,68 @@
|
||||
export default {
|
||||
runJob: {
|
||||
index: '#',
|
||||
importrunJobTip: 'import RunJob',
|
||||
id: 'id',
|
||||
sort: 'sort',
|
||||
defFlowId: 'defFlowId',
|
||||
parFlowInstId: 'parFlowInstId',
|
||||
subFlowInstId: 'subFlowInstId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
nodeJobId: 'nodeJobId',
|
||||
jobType: 'jobType',
|
||||
roleId: 'roleId',
|
||||
userId: 'userId',
|
||||
startTime: 'startTime',
|
||||
endTime: 'endTime',
|
||||
timeLimit: 'timeLimit',
|
||||
useTime: 'useTime',
|
||||
userKey: 'userKey',
|
||||
jobName: 'jobName',
|
||||
distFlowNodeId: 'distFlowNodeId',
|
||||
timeout: 'timeout',
|
||||
status: 'status',
|
||||
suspension: 'suspension',
|
||||
suspensionReason: 'suspensionReason',
|
||||
invalidReason: 'invalidReason',
|
||||
flowStatus: 'flowStatus',
|
||||
isSkipRejected: 'isSkipRejected',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowKey: 'flowKey',
|
||||
flowInstId: 'flowInstId',
|
||||
runNodeId: 'runNodeId',
|
||||
isNowRun: 'isNowRun',
|
||||
signatureType: 'signatureType',
|
||||
isRead: 'isRead',
|
||||
runJob: {
|
||||
index: '#',
|
||||
importrunJobTip: 'import RunJob',
|
||||
id: 'id',
|
||||
sort: 'sort',
|
||||
defFlowId: 'defFlowId',
|
||||
parFlowInstId: 'parFlowInstId',
|
||||
subFlowInstId: 'subFlowInstId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
nodeJobId: 'nodeJobId',
|
||||
jobType: 'jobType',
|
||||
roleId: 'roleId',
|
||||
userId: 'userId',
|
||||
startTime: 'startTime',
|
||||
endTime: 'endTime',
|
||||
timeLimit: 'timeLimit',
|
||||
useTime: 'useTime',
|
||||
userKey: 'userKey',
|
||||
jobName: 'jobName',
|
||||
distFlowNodeId: 'distFlowNodeId',
|
||||
timeout: 'timeout',
|
||||
status: 'status',
|
||||
suspension: 'suspension',
|
||||
suspensionReason: 'suspensionReason',
|
||||
invalidReason: 'invalidReason',
|
||||
flowStatus: 'flowStatus',
|
||||
isSkipRejected: 'isSkipRejected',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowKey: 'flowKey',
|
||||
flowInstId: 'flowInstId',
|
||||
runNodeId: 'runNodeId',
|
||||
isNowRun: 'isNowRun',
|
||||
signatureType: 'signatureType',
|
||||
isRead: 'isRead',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputSortTip: 'input sort',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputParFlowInstIdTip: 'input parFlowInstId',
|
||||
inputSubFlowInstIdTip: 'input subFlowInstId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputNodeJobIdTip: 'input nodeJobId',
|
||||
inputJobTypeTip: 'input jobType',
|
||||
inputRoleIdTip: 'input roleId',
|
||||
inputUserIdTip: 'input userId',
|
||||
inputStartTimeTip: 'input startTime',
|
||||
inputEndTimeTip: 'input endTime',
|
||||
inputUserKeyTip: 'input userKey',
|
||||
inputJobNameTip: 'input jobName',
|
||||
inputDistFlowNodeIdTip: 'input distFlowNodeId',
|
||||
inputTimeoutTip: 'input timeout',
|
||||
inputStatusTip: 'input status',
|
||||
inputFlowStatusTip: 'input flowStatus',
|
||||
inputSuspensionTip: 'input suspension',
|
||||
inputSuspensionReasonTip: 'input suspensionReason',
|
||||
inputIsSkipRejectedTip: 'input isSkipRejected',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputRunNodeIdTip: 'input runNodeId',
|
||||
inputIsNowRunTip: 'input isNowRun',
|
||||
inputSignatureTypeTip: 'input signatureType',
|
||||
inputIsReadTip: 'input isRead',
|
||||
}
|
||||
}
|
||||
inputIdTip: 'input id',
|
||||
inputSortTip: 'input sort',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputParFlowInstIdTip: 'input parFlowInstId',
|
||||
inputSubFlowInstIdTip: 'input subFlowInstId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputNodeJobIdTip: 'input nodeJobId',
|
||||
inputJobTypeTip: 'input jobType',
|
||||
inputRoleIdTip: 'input roleId',
|
||||
inputUserIdTip: 'input userId',
|
||||
inputStartTimeTip: 'input startTime',
|
||||
inputEndTimeTip: 'input endTime',
|
||||
inputUserKeyTip: 'input userKey',
|
||||
inputJobNameTip: 'input jobName',
|
||||
inputDistFlowNodeIdTip: 'input distFlowNodeId',
|
||||
inputTimeoutTip: 'input timeout',
|
||||
inputStatusTip: 'input status',
|
||||
inputFlowStatusTip: 'input flowStatus',
|
||||
inputSuspensionTip: 'input suspension',
|
||||
inputSuspensionReasonTip: 'input suspensionReason',
|
||||
inputIsSkipRejectedTip: 'input isSkipRejected',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputRunNodeIdTip: 'input runNodeId',
|
||||
inputIsNowRunTip: 'input isNowRun',
|
||||
inputSignatureTypeTip: 'input signatureType',
|
||||
inputIsReadTip: 'input isRead',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,68 +1,68 @@
|
||||
export default {
|
||||
runJob: {
|
||||
index: '#',
|
||||
importrunJobTip: '导入任务记录',
|
||||
id: ' 任务名称',
|
||||
sort: '排序值',
|
||||
defFlowId: '流程名称',
|
||||
parFlowInstId: '关联父流程',
|
||||
subFlowInstId: '关联子流程',
|
||||
flowNodeId: '节点名称',
|
||||
nodeJobId: '任务名称',
|
||||
jobType: '参与者类型',
|
||||
roleId: '参与者',
|
||||
userId: '审批人',
|
||||
startTime: '开始时间',
|
||||
endTime: '结束时间',
|
||||
timeLimit: '任务时限',
|
||||
useTime: '任务用时',
|
||||
userKey: '参与者KEY',
|
||||
jobName: '任务名称',
|
||||
distFlowNodeId: '待分配参与者节点',
|
||||
timeout: '任务时限(分钟)',
|
||||
status: '任务状态',
|
||||
suspension: '是否挂起',
|
||||
suspensionReason: '挂起原因',
|
||||
invalidReason: '作废原因',
|
||||
flowStatus: '流程状态',
|
||||
isSkipRejected: '被驳回是否可跳过',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowKey: '工单流程KEY',
|
||||
flowInstId: '流程实例ID',
|
||||
runNodeId: '节点名称',
|
||||
isNowRun: '被分配后是否立即运行',
|
||||
signatureType: '加签类型',
|
||||
isRead: '是否已阅',
|
||||
runJob: {
|
||||
index: '#',
|
||||
importrunJobTip: '导入任务记录',
|
||||
id: ' 任务名称',
|
||||
sort: '排序值',
|
||||
defFlowId: '流程名称',
|
||||
parFlowInstId: '关联父流程',
|
||||
subFlowInstId: '关联子流程',
|
||||
flowNodeId: '节点名称',
|
||||
nodeJobId: '任务名称',
|
||||
jobType: '参与者类型',
|
||||
roleId: '参与者',
|
||||
userId: '审批人',
|
||||
startTime: '开始时间',
|
||||
endTime: '结束时间',
|
||||
timeLimit: '任务时限',
|
||||
useTime: '任务用时',
|
||||
userKey: '参与者KEY',
|
||||
jobName: '任务名称',
|
||||
distFlowNodeId: '待分配参与者节点',
|
||||
timeout: '任务时限(分钟)',
|
||||
status: '任务状态',
|
||||
suspension: '是否挂起',
|
||||
suspensionReason: '挂起原因',
|
||||
invalidReason: '作废原因',
|
||||
flowStatus: '流程状态',
|
||||
isSkipRejected: '被驳回是否可跳过',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowKey: '工单流程KEY',
|
||||
flowInstId: '流程实例ID',
|
||||
runNodeId: '节点名称',
|
||||
isNowRun: '被分配后是否立即运行',
|
||||
signatureType: '加签类型',
|
||||
isRead: '是否已阅',
|
||||
|
||||
inputIdTip: '请输入任务名称',
|
||||
inputSortTip: '请输入排序值',
|
||||
inputDefFlowIdTip: '请输入流程名称',
|
||||
inputParFlowInstIdTip: '请输入关联父流程',
|
||||
inputSubFlowInstIdTip: '请输入关联子流程',
|
||||
inputFlowNodeIdTip: '请输入节点名称',
|
||||
inputNodeJobIdTip: '请输入任务名称',
|
||||
inputJobTypeTip: '请输入参与者类型',
|
||||
inputRoleIdTip: '请输入参与者',
|
||||
inputUserIdTip: '请输入审批人',
|
||||
inputStartTimeTip: '请输入开始时间',
|
||||
inputEndTimeTip: '请输入结束时间',
|
||||
inputUserKeyTip: '请输入参与者KEY',
|
||||
inputJobNameTip: '请输入任务名称',
|
||||
inputDistFlowNodeIdTip: '请输入待分配参与者节点',
|
||||
inputTimeoutTip: '请输入任务时限',
|
||||
inputStatusTip: '请输入任务状态',
|
||||
inputFlowStatusTip: '请输入流程状态',
|
||||
inputSuspensionTip: '请输入是否挂起',
|
||||
inputSuspensionReasonTip: '请输入挂起原因',
|
||||
inputIsSkipRejectedTip: '请输入被驳回是否可跳过',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowKeyTip: '请输入工单流程KEY',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputRunNodeIdTip: '请输入节点名称',
|
||||
inputIsNowRunTip: '请输入被分配后是否立即运行',
|
||||
inputSignatureTypeTip: '请输入加签类型',
|
||||
inputIsReadTip: '请输入是否已阅',
|
||||
}
|
||||
}
|
||||
inputIdTip: '请输入任务名称',
|
||||
inputSortTip: '请输入排序值',
|
||||
inputDefFlowIdTip: '请输入流程名称',
|
||||
inputParFlowInstIdTip: '请输入关联父流程',
|
||||
inputSubFlowInstIdTip: '请输入关联子流程',
|
||||
inputFlowNodeIdTip: '请输入节点名称',
|
||||
inputNodeJobIdTip: '请输入任务名称',
|
||||
inputJobTypeTip: '请输入参与者类型',
|
||||
inputRoleIdTip: '请输入参与者',
|
||||
inputUserIdTip: '请输入审批人',
|
||||
inputStartTimeTip: '请输入开始时间',
|
||||
inputEndTimeTip: '请输入结束时间',
|
||||
inputUserKeyTip: '请输入参与者KEY',
|
||||
inputJobNameTip: '请输入任务名称',
|
||||
inputDistFlowNodeIdTip: '请输入待分配参与者节点',
|
||||
inputTimeoutTip: '请输入任务时限',
|
||||
inputStatusTip: '请输入任务状态',
|
||||
inputFlowStatusTip: '请输入流程状态',
|
||||
inputSuspensionTip: '请输入是否挂起',
|
||||
inputSuspensionReasonTip: '请输入挂起原因',
|
||||
inputIsSkipRejectedTip: '请输入被驳回是否可跳过',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowKeyTip: '请输入工单流程KEY',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputRunNodeIdTip: '请输入节点名称',
|
||||
inputIsNowRunTip: '请输入被分配后是否立即运行',
|
||||
inputSignatureTypeTip: '请输入加签类型',
|
||||
inputIsReadTip: '请输入是否已阅',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,140 +1,200 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="t('runJob.jobType')" prop="jobType">
|
||||
<el-select v-model="state.queryForm.jobType" :placeholder="t('runJob.inputJobTypeTip')" clearable filterable style="max-width: 180px"
|
||||
@change="handleRoleType">
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('runJob.roleId')" prop="roleId">
|
||||
<el-tooltip content="请输入名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="state.queryForm.roleId" :placeholder="t('runJob.inputRoleIdTip')" clearable filterable style="max-width: 180px"
|
||||
remote :remote-method="(query) => remoteMethodAll(query, state.queryForm.jobType)" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.users" :key="index" :label="item.name" :value="item.userId"
|
||||
v-if="state.queryForm.jobType === DIC_PROP.JOB_USER_TYPE[0].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.roles" :key="index" :label="item.roleName" :value="item.roleId"
|
||||
v-if="state.queryForm.jobType === DIC_PROP.JOB_USER_TYPE[1].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.posts" :key="index" :label="item.postName" :value="item.postId"
|
||||
v-if="state.queryForm.jobType === DIC_PROP.JOB_USER_TYPE[2].value"></el-option>
|
||||
<el-option v-for="(item, index) in dicData.depts" :key="index" :label="item.name" :value="item.deptId"
|
||||
v-if="state.queryForm.jobType === DIC_PROP.JOB_USER_TYPE[3].value"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="t('runJob.jobType')" prop="jobType">
|
||||
<el-select
|
||||
v-model="state.queryForm.jobType"
|
||||
:placeholder="t('runJob.inputJobTypeTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
@change="handleRoleType"
|
||||
>
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_USER_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('runJob.roleId')" prop="roleId">
|
||||
<el-tooltip content="请输入名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="state.queryForm.roleId"
|
||||
:placeholder="t('runJob.inputRoleIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
remote
|
||||
:remote-method="(query) => remoteMethodAll(query, state.queryForm.jobType)"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.users"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.userId"
|
||||
v-if="state.queryForm.jobType === DIC_PROP.JOB_USER_TYPE[0].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.roles"
|
||||
:key="index"
|
||||
:label="item.roleName"
|
||||
:value="item.roleId"
|
||||
v-if="state.queryForm.jobType === DIC_PROP.JOB_USER_TYPE[1].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.posts"
|
||||
:key="index"
|
||||
:label="item.postName"
|
||||
:value="item.postId"
|
||||
v-if="state.queryForm.jobType === DIC_PROP.JOB_USER_TYPE[2].value"
|
||||
></el-option>
|
||||
<el-option
|
||||
v-for="(item, index) in dicData.depts"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.deptId"
|
||||
v-if="state.queryForm.jobType === DIC_PROP.JOB_USER_TYPE[3].value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item :label="$t('runJob.flowInstId')" prop="flowInstId" >
|
||||
<el-input :placeholder="t('runJob.inputFlowInstIdTip')" v-model="state.queryForm.flowInstId"
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])"
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.runNodeId')" prop="runNodeId" >
|
||||
<el-select v-model="state.queryForm.runNodeId" :placeholder="t('runJob.inputRunNodeIdTip')" clearable filterable style="max-width: 180px"
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.id')" prop="id" >
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runJob.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.status')" prop="status" >
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')"
|
||||
v-auth="'jsonflow_runjob_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_runjob_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_runjob_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
:row-class-name="tableRowClassName"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('runJob.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('runJob.flowInstId')" show-overflow-tooltip/>
|
||||
<el-table-column prop="defFlowId" :label="t('runJob.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.defFlowId"
|
||||
:valueKey="'defFlowId'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runNodeId" :label="t('runJob.runNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.runNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobName" :label="t('runJob.jobName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="jobType" :label="t('runJob.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('runJob.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name :options="{users: state.dicData.users, roles: state.dicData.roles, posts: state.dicData.posts, depts: state.dicData.depts }"
|
||||
:value="scope.row"></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('runJob.userId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="startTime" :label="t('runJob.startTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="endTime" :label="t('runJob.endTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="userKey" :label="t('runJob.userKey')" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="distFlowNodeId" :label="t('runJob.distFlowNodeId')" show-overflow-tooltip>
|
||||
<el-form-item :label="$t('runJob.flowInstId')" prop="flowInstId">
|
||||
<el-input
|
||||
:placeholder="t('runJob.inputFlowInstIdTip')"
|
||||
v-model="state.queryForm.flowInstId"
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])"
|
||||
style="max-width: 180px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.runNodeId')" prop="runNodeId">
|
||||
<el-select
|
||||
v-model="state.queryForm.runNodeId"
|
||||
:placeholder="t('runJob.inputRunNodeIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.id')" prop="id">
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runJob.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.status')" prop="status">
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')" v-auth="'jsonflow_runjob_add'"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_runjob_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_runjob_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
:row-class-name="tableRowClassName"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="index" :label="t('runJob.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('runJob.flowInstId')" show-overflow-tooltip />
|
||||
<el-table-column prop="defFlowId" :label="t('runJob.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name
|
||||
:options="state.dicData.flowInstId"
|
||||
:value="scope.row.defFlowId"
|
||||
:valueKey="'defFlowId'"
|
||||
:showKey="'flowName'"
|
||||
></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="runNodeId" :label="t('runJob.runNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.runNodeId" :valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobName" :label="t('runJob.jobName')" show-overflow-tooltip />
|
||||
<el-table-column prop="jobType" :label="t('runJob.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_USER_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="roleId" :label="t('runJob.roleId')">
|
||||
<template #default="scope">
|
||||
<convert-role-name
|
||||
:options="{ users: state.dicData.users, roles: state.dicData.roles, posts: state.dicData.posts, depts: state.dicData.depts }"
|
||||
:value="scope.row"
|
||||
></convert-role-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('runJob.userId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="startTime" :label="t('runJob.startTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="endTime" :label="t('runJob.endTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="userKey" :label="t('runJob.userKey')" show-overflow-tooltip> </el-table-column>
|
||||
<!-- <el-table-column prop="distFlowNodeId" :label="t('runJob.distFlowNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.distFlowNodeId"
|
||||
:valueKey="'flowNodeId'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="timeout" :label="t('runJob.timeout')" show-overflow-tooltip/>
|
||||
<el-table-column prop="status" :label="t('runJob.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="suspension" :label="t('runJob.suspension')" show-overflow-tooltip>
|
||||
<el-table-column prop="timeout" :label="t('runJob.timeout')" show-overflow-tooltip />
|
||||
<el-table-column prop="status" :label="t('runJob.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="suspension" :label="t('runJob.suspension')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.suspension"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="suspensionReason" :label="t('runJob.suspensionReason')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="isSkipRejected" :label="t('runJob.isSkipRejected')" show-overflow-tooltip>
|
||||
<el-table-column prop="suspensionReason" :label="t('runJob.suspensionReason')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="isSkipRejected" :label="t('runJob.isSkipRejected')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.isSkipRejected"></dict-tag>
|
||||
</template>
|
||||
@@ -151,360 +211,327 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('runJob.createTime')" show-overflow-tooltip/>-->
|
||||
<el-table-column prop="flowStatus" :label="t('runJob.flowStatus')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.flowStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sort" :label="t('runJob.sort')" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" width="180">
|
||||
<template #default="scope">
|
||||
<el-dropdown style="vertical-align: middle; margin-right: 10px">
|
||||
<span>
|
||||
功能
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down/>
|
||||
</el-icon>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item
|
||||
@click.native="methods.handleComment(scope.row)">查看审批过程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
divided
|
||||
@click.native="methods.handleFlowPic(scope.row)">查看流程图
|
||||
</el-dropdown-item>
|
||||
<template v-if="DIC_PROP.FLOW_STATUS[2].value === scope.row.flowStatus">
|
||||
<template v-if="scope.row.status === '0' || scope.row.status === '9'">
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.jobType !== DIC_PROP.JOB_USER_TYPE[0].value"
|
||||
divided
|
||||
@click.native="methods.handleSignForJob(scope.row, '1')"
|
||||
>签收任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[0].value && scope.row.roleId"
|
||||
divided
|
||||
@click.native="methods.handleSignForJob(scope.row, '0')"
|
||||
>反签收任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.suspension === '1'"
|
||||
divided
|
||||
@click.native="methods.handleSuspension(scope.row,'0')"
|
||||
>激活任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.suspension !== '1'"
|
||||
divided
|
||||
@click.native="methods.handleSuspension(scope.row,'1')"
|
||||
>挂起任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.suspension !== '1' && scope.row.roleId"
|
||||
divided
|
||||
@click.native="methods.handleJobRoleUserId(scope.row,'0')">
|
||||
转办任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.suspension !== '1' && !scope.row.roleId"
|
||||
divided
|
||||
@click.native="methods.handleJobRoleUserId(scope.row,'1')">
|
||||
指派人员
|
||||
</el-dropdown-item>
|
||||
</template>
|
||||
<el-dropdown-item divided
|
||||
@click.native="methods.handleEarlyComplete(scope.row)">
|
||||
提前结束流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided
|
||||
@click.native="methods.handleTerminateFlow(scope.row)">
|
||||
终止流程
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided
|
||||
@click.native="methods.handleInvalidFlow(scope.row)">
|
||||
作废流程
|
||||
</el-dropdown-item>
|
||||
</template>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-table-column prop="flowStatus" :label="t('runJob.flowStatus')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.flowStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sort" :label="t('runJob.sort')" show-overflow-tooltip />
|
||||
<el-table-column :label="$t('common.action')" width="180">
|
||||
<template #default="scope">
|
||||
<el-dropdown style="vertical-align: middle; margin-right: 10px">
|
||||
<span>
|
||||
功能
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down />
|
||||
</el-icon>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click.native="methods.handleComment(scope.row)">查看审批过程 </el-dropdown-item>
|
||||
<el-dropdown-item divided @click.native="methods.handleFlowPic(scope.row)">查看流程图 </el-dropdown-item>
|
||||
<template v-if="DIC_PROP.FLOW_STATUS[2].value === scope.row.flowStatus">
|
||||
<template v-if="scope.row.status === '0' || scope.row.status === '9'">
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.jobType !== DIC_PROP.JOB_USER_TYPE[0].value"
|
||||
divided
|
||||
@click.native="methods.handleSignForJob(scope.row, '1')"
|
||||
>签收任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.jobType === DIC_PROP.JOB_USER_TYPE[0].value && scope.row.roleId"
|
||||
divided
|
||||
@click.native="methods.handleSignForJob(scope.row, '0')"
|
||||
>反签收任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item v-if="scope.row.suspension === '1'" divided @click.native="methods.handleSuspension(scope.row, '0')"
|
||||
>激活任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item v-if="scope.row.suspension !== '1'" divided @click.native="methods.handleSuspension(scope.row, '1')"
|
||||
>挂起任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.suspension !== '1' && scope.row.roleId"
|
||||
divided
|
||||
@click.native="methods.handleJobRoleUserId(scope.row, '0')"
|
||||
>
|
||||
转办任务
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="scope.row.suspension !== '1' && !scope.row.roleId"
|
||||
divided
|
||||
@click.native="methods.handleJobRoleUserId(scope.row, '1')"
|
||||
>
|
||||
指派人员
|
||||
</el-dropdown-item>
|
||||
</template>
|
||||
<el-dropdown-item divided @click.native="methods.handleEarlyComplete(scope.row)"> 提前结束流程 </el-dropdown-item>
|
||||
<el-dropdown-item divided @click.native="methods.handleTerminateFlow(scope.row)"> 终止流程 </el-dropdown-item>
|
||||
<el-dropdown-item divided @click.native="methods.handleInvalidFlow(scope.row)"> 作废流程 </el-dropdown-item>
|
||||
</template>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<template v-if="!scope.row.roleId || (scope.row.status !== '0' && scope.row.status !== '9')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
查看工单
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="methods.handleHiJob(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<template v-if="scope.row.roleId && DIC_PROP.FLOW_STATUS[2].value === scope.row.flowStatus">
|
||||
<el-button icon="Stamp" text type="primary"
|
||||
v-if="scope.row.suspension !== '1' && (scope.row.status === '0' || scope.row.status === '9') && scope.row.belongType !== '2'"
|
||||
@click="methods.handleJob(scope.row)">审批
|
||||
</el-button>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<template v-if="!scope.row.roleId || (scope.row.status !== '0' && scope.row.status !== '9')">
|
||||
<el-tooltip placement="top">
|
||||
<template #content> 查看工单 </template>
|
||||
<el-button text type="primary" icon="view" @click="methods.handleHiJob(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<template v-if="scope.row.roleId && DIC_PROP.FLOW_STATUS[2].value === scope.row.flowStatus">
|
||||
<el-button
|
||||
icon="Stamp"
|
||||
text
|
||||
type="primary"
|
||||
v-if="scope.row.suspension !== '1' && (scope.row.status === '0' || scope.row.status === '9') && scope.row.belongType !== '2'"
|
||||
@click="methods.handleJob(scope.row)"
|
||||
>审批
|
||||
</el-button>
|
||||
|
||||
<el-button icon="Stamp" text type="primary"
|
||||
v-if="scope.row.suspension !== '1' && scope.row.belongType === '2' && scope.row.isRead === '0'"
|
||||
@click="methods.handleJob(scope.row, '0', '1')">查看
|
||||
</el-button>
|
||||
</template>
|
||||
<el-button
|
||||
icon="Stamp"
|
||||
text
|
||||
type="primary"
|
||||
v-if="scope.row.suspension !== '1' && scope.row.belongType === '2' && scope.row.isRead === '0'"
|
||||
@click="methods.handleJob(scope.row, '0', '1')"
|
||||
>查看
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
<!-- <el-tooltip placement="top">
|
||||
<!-- <el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>-->
|
||||
<!-- <el-tooltip placement="top">
|
||||
<!-- <el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>-->
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog
|
||||
v-model="data.showComment" v-if="data.showComment"
|
||||
top="20px"
|
||||
width="90%"
|
||||
title="查看审批过程"
|
||||
append-to-body>
|
||||
<comment :curr-job="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog v-model="data.showComment" v-if="data.showComment" top="20px" width="90%" title="查看审批过程" append-to-body>
|
||||
<comment :curr-job="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer" direction="rtl"
|
||||
append-to-body size="90%"
|
||||
v-model="data.showFlowPic"
|
||||
>
|
||||
<flow-photo v-if="data.showFlowPic" :curr-job="data.currJob"></flow-photo>
|
||||
</el-drawer>
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer class="flow-overflow-drawer" direction="rtl" append-to-body size="90%" v-model="data.showFlowPic">
|
||||
<flow-photo v-if="data.showFlowPic" :curr-job="data.currJob"></flow-photo>
|
||||
</el-drawer>
|
||||
|
||||
<user-role-picker ref="userRolePicker" :isOnlyOne="true" @onSelectItems="methods.onSelectItems">
|
||||
</user-role-picker>
|
||||
|
||||
</div>
|
||||
<user-role-picker ref="userRolePicker" :isOnlyOne="true" @onSelectItems="methods.onSelectItems"> </user-role-picker>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemRunJob">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/run-job";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/run-job';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {
|
||||
onCascadeChange,
|
||||
onLoadDicUrl,
|
||||
onLoaded,
|
||||
remoteMethodAllByKey,
|
||||
} from "/@/flow/components/convert-name/convert";
|
||||
import {handleFlowPreview, openFlowPreview} from "/@/flow/support/extend";
|
||||
import {useFlowJob} from "/@/flow/stores/flowJob";
|
||||
import {PROP_CONST} from "/@/flow/support/prop-const";
|
||||
import {handleChangeJobType} from "/@/flow";
|
||||
import {
|
||||
handleEarlyComplete, handleInvalidFlow,
|
||||
handleSignForJob,
|
||||
handleSuspension,
|
||||
handleTerminateFlow, onJobNextUserRole,
|
||||
onSignForJob, onTurnRunJob
|
||||
} from "/@/flow/components/handle-job";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl, onLoaded, remoteMethodAllByKey } from '/@/flow/components/convert-name/convert';
|
||||
import { handleFlowPreview, openFlowPreview } from '/@/flow/support/extend';
|
||||
import { useFlowJob } from '/@/flow/stores/flowJob';
|
||||
import { PROP_CONST } from '/@/flow/support/prop-const';
|
||||
import { handleChangeJobType } from '/@/flow';
|
||||
import {
|
||||
handleEarlyComplete,
|
||||
handleInvalidFlow,
|
||||
handleSignForJob,
|
||||
handleSuspension,
|
||||
handleTerminateFlow,
|
||||
onJobNextUserRole,
|
||||
onSignForJob,
|
||||
onTurnRunJob,
|
||||
} from '/@/flow/components/handle-job';
|
||||
|
||||
const $message = useMessage();
|
||||
const {proxy} = getCurrentInstance();
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const UserRolePicker = defineAsyncComponent(() => import('../../../flow/components/user-role/picker.vue'));
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('../flow-design/view.vue'));
|
||||
const $message = useMessage();
|
||||
const { proxy } = getCurrentInstance();
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const UserRolePicker = defineAsyncComponent(() => import('../../../flow/components/user-role/picker.vue'));
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('../flow-design/view.vue'));
|
||||
|
||||
const flowJob = useFlowJob()
|
||||
const {t} = useI18n()
|
||||
const $router = useRouter();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["runNodeId"]}, {key: "runNodeId", cascades: ["runJobId"]});
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(state.queryForm, {key: key, cascades: cascades});
|
||||
}
|
||||
const flowJob = useFlowJob();
|
||||
const { t } = useI18n();
|
||||
const $router = useRouter();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl();
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['runNodeId'] }, { key: 'runNodeId', cascades: ['runJobId'] });
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(state.queryForm, { key: key, cascades: cascades });
|
||||
}
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
const data = reactive({
|
||||
// 0、转办 1、指派
|
||||
nodeUserType: undefined,
|
||||
currJob: undefined,
|
||||
queryForm: {},
|
||||
showComment: false,
|
||||
showFlowPic: false,
|
||||
activeName: '-1'
|
||||
});
|
||||
const data = reactive({
|
||||
// 0、转办 1、指派
|
||||
nodeUserType: undefined,
|
||||
currJob: undefined,
|
||||
queryForm: {},
|
||||
showComment: false,
|
||||
showFlowPic: false,
|
||||
activeName: '-1',
|
||||
});
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({key: "userId"}, {key: "flowInstId"}, {key: "runNodeId"}, ...PROP_CONST.LOAD_USER_ROLE),
|
||||
descs: ["receive_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({ key: 'userId' }, { key: 'flowInstId' }, { key: 'runNodeId' }, ...PROP_CONST.LOAD_USER_ROLE),
|
||||
descs: ['receive_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-job/export', state.queryForm, 'run-job.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-job/export', state.queryForm, 'run-job.xlsx');
|
||||
};
|
||||
|
||||
const tableRowClassName = ({row, rowIndex}) => {
|
||||
if (row.isRead !== '1') {
|
||||
return 'row-custom-warning'
|
||||
}
|
||||
return ''
|
||||
}
|
||||
const tableRowClassName = ({ row, rowIndex }) => {
|
||||
if (row.isRead !== '1') {
|
||||
return 'row-custom-warning';
|
||||
}
|
||||
return '';
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
|
||||
function remoteMethodAll(query: string, jobType) {
|
||||
remoteMethodAllByKey(onLoad, dicData, query, jobType)
|
||||
}
|
||||
function remoteMethodAll(query: string, jobType) {
|
||||
remoteMethodAllByKey(onLoad, dicData, query, jobType);
|
||||
}
|
||||
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, state.queryForm)
|
||||
}
|
||||
function handleRoleType() {
|
||||
handleChangeJobType(dicData, state.queryForm);
|
||||
}
|
||||
|
||||
const methods = {
|
||||
handleHiJob(row) {
|
||||
openFlowPreview($router, row)
|
||||
},
|
||||
handleJob(row, isView?, isRead?) {
|
||||
handleFlowPreview($router, row, isView, isRead, $message, flowJob, getDataList)
|
||||
},
|
||||
handleJobRoleUserId(row, type) {
|
||||
data.currJob = row
|
||||
methods.openJobRoleUserId(type)
|
||||
},
|
||||
// 指定任务参与者
|
||||
onJobNextUserRole(items) {
|
||||
onJobNextUserRole($message, items, getDataList, data)
|
||||
},
|
||||
handleComment(row) {
|
||||
data.currJob = row
|
||||
data.showComment = true
|
||||
},
|
||||
handleFlowPic(row) {
|
||||
data.currJob = row
|
||||
data.showFlowPic = true
|
||||
},
|
||||
// 签收反签收任务
|
||||
handleSignForJob(row, type) {
|
||||
handleSignForJob(methods, $message, getDataList, row, type)
|
||||
},
|
||||
// 反签收任务
|
||||
onSignForJob(obj) {
|
||||
onSignForJob($message, flowJob, getDataList, obj)
|
||||
},
|
||||
// 挂起激活任务
|
||||
handleSuspension(row, suspension) {
|
||||
handleSuspension($message, getDataList, row, suspension)
|
||||
},
|
||||
// 选择参与者
|
||||
openJobRoleUserId(type) {
|
||||
data.nodeUserType = type
|
||||
proxy.$refs.userRolePicker.onOpen();
|
||||
},
|
||||
onSelectItems(items) {
|
||||
if (data.nodeUserType === '0') {
|
||||
methods.onTurnRunJob(items[0])
|
||||
} else {
|
||||
methods.onJobNextUserRole(items)
|
||||
}
|
||||
},
|
||||
// 提前结束流程
|
||||
handleEarlyComplete(row) {
|
||||
handleEarlyComplete($message, flowJob, getDataList, row)
|
||||
},
|
||||
// 终止流程
|
||||
handleTerminateFlow(row) {
|
||||
handleTerminateFlow($message, flowJob, getDataList, row)
|
||||
},
|
||||
// 作废流程
|
||||
handleInvalidFlow(row) {
|
||||
handleInvalidFlow($message, flowJob, getDataList, row)
|
||||
},
|
||||
// 转办任务
|
||||
onTurnRunJob(role) {
|
||||
onTurnRunJob($message, flowJob, getDataList, data, role)
|
||||
}
|
||||
}
|
||||
const methods = {
|
||||
handleHiJob(row) {
|
||||
openFlowPreview($router, row);
|
||||
},
|
||||
handleJob(row, isView?, isRead?) {
|
||||
handleFlowPreview($router, row, isView, isRead, $message, flowJob, getDataList);
|
||||
},
|
||||
handleJobRoleUserId(row, type) {
|
||||
data.currJob = row;
|
||||
methods.openJobRoleUserId(type);
|
||||
},
|
||||
// 指定任务参与者
|
||||
onJobNextUserRole(items) {
|
||||
onJobNextUserRole($message, items, getDataList, data);
|
||||
},
|
||||
handleComment(row) {
|
||||
data.currJob = row;
|
||||
data.showComment = true;
|
||||
},
|
||||
handleFlowPic(row) {
|
||||
data.currJob = row;
|
||||
data.showFlowPic = true;
|
||||
},
|
||||
// 签收反签收任务
|
||||
handleSignForJob(row, type) {
|
||||
handleSignForJob(methods, $message, getDataList, row, type);
|
||||
},
|
||||
// 反签收任务
|
||||
onSignForJob(obj) {
|
||||
onSignForJob($message, flowJob, getDataList, obj);
|
||||
},
|
||||
// 挂起激活任务
|
||||
handleSuspension(row, suspension) {
|
||||
handleSuspension($message, getDataList, row, suspension);
|
||||
},
|
||||
// 选择参与者
|
||||
openJobRoleUserId(type) {
|
||||
data.nodeUserType = type;
|
||||
proxy.$refs.userRolePicker.onOpen();
|
||||
},
|
||||
onSelectItems(items) {
|
||||
if (data.nodeUserType === '0') {
|
||||
methods.onTurnRunJob(items[0]);
|
||||
} else {
|
||||
methods.onJobNextUserRole(items);
|
||||
}
|
||||
},
|
||||
// 提前结束流程
|
||||
handleEarlyComplete(row) {
|
||||
handleEarlyComplete($message, flowJob, getDataList, row);
|
||||
},
|
||||
// 终止流程
|
||||
handleTerminateFlow(row) {
|
||||
handleTerminateFlow($message, flowJob, getDataList, row);
|
||||
},
|
||||
// 作废流程
|
||||
handleInvalidFlow(row) {
|
||||
handleInvalidFlow($message, flowJob, getDataList, row);
|
||||
},
|
||||
// 转办任务
|
||||
onTurnRunJob(role) {
|
||||
onTurnRunJob($message, flowJob, getDataList, data, role);
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
|
||||
.el-table .row-custom-warning {
|
||||
--el-table-tr-bg-color: var(--el-color-warning-light-9);
|
||||
}
|
||||
.el-table .row-custom-warning {
|
||||
--el-table-tr-bg-color: var(--el-color-warning-light-9);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,85 +1,106 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runFlow.initiatorId')" prop="initiatorId" >
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select v-model="state.queryForm.initiatorId" :placeholder="t('runFlow.inputInitiatorIdTip')" clearable filterable style="max-width: 180px"
|
||||
remote :remote-method="remoteMethod" :reserve-keyword="false">
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.code')" prop="flowInstId" >
|
||||
<el-select v-model="state.queryForm.flowInstId" :placeholder="t('runFlow.inputCodeTip')" clearable filterable
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])" style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in dicData.flowInstId" :key="index" :label="item.code" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.runNodeId')" prop="runNodeId" >
|
||||
<el-select v-model="state.queryForm.runNodeId" :placeholder="t('runJob.inputRunNodeIdTip')" clearable filterable style="max-width: 180px"
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.id')" prop="id" >
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runJob.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.status')" prop="status" >
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('runJob.flowStatus')" prop="status" >
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runFlow.initiatorId')" prop="initiatorId">
|
||||
<el-tooltip content="请输入用户名称进行模糊搜索" placement="top">
|
||||
<el-select
|
||||
v-model="state.queryForm.initiatorId"
|
||||
:placeholder="t('runFlow.inputInitiatorIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
remote
|
||||
:remote-method="remoteMethod"
|
||||
:reserve-keyword="false"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.initiatorId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runFlow.code')" prop="flowInstId">
|
||||
<el-select
|
||||
v-model="state.queryForm.flowInstId"
|
||||
:placeholder="t('runFlow.inputCodeTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])"
|
||||
style="max-width: 180px"
|
||||
>
|
||||
<el-option v-for="(item, index) in dicData.flowInstId" :key="index" :label="item.code" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.runNodeId')" prop="runNodeId">
|
||||
<el-select
|
||||
v-model="state.queryForm.runNodeId"
|
||||
:placeholder="t('runJob.inputRunNodeIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
style="max-width: 180px"
|
||||
@change="cascadeChange('runNodeId', ['runJobId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.id')" prop="id">
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runJob.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runJobId" :key="index" :label="item.jobName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runJob.status')" prop="status">
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runJob.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('runJob.flowStatus')" prop="status" >
|
||||
<el-select v-model="state.queryForm.flowStatus" :placeholder="t('runJob.inputFlowStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.FLOW_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>-->
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_runjob_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('runJob.index')" width="40"/>
|
||||
<el-table-column prop="initiatorId" :label="t('runFlow.initiatorId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.initiatorId" :value="scope.row.initiatorId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" :label="t('runFlow.code')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowName" :label="t('runJob.defFlowId')" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column prop="orderId" :label="t('flowApplication.formName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.orderId" :value="scope.row.orderId"
|
||||
:valueKey="'id'" :showKey="'formName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="runNodeId" :label="t('runJob.runNodeId')" show-overflow-tooltip>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_runjob_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" :label="t('runJob.index')" width="40" />
|
||||
<el-table-column prop="initiatorId" :label="t('runFlow.initiatorId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.initiatorId" :value="scope.row.initiatorId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="code" :label="t('runFlow.code')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowName" :label="t('runJob.defFlowId')" show-overflow-tooltip> </el-table-column>
|
||||
<el-table-column prop="orderId" :label="t('flowApplication.formName')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.orderId" :value="scope.row.orderId" :valueKey="'id'" :showKey="'formName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="runNodeId" :label="t('runJob.runNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.runNodeId" :value="scope.row.runNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="jobName" :label="t('runJob.jobName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="startTime" :label="t('runJob.startTime')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="timeLimit" :label="t('runJob.timeLimit')" show-overflow-tooltip/>
|
||||
<el-table-column prop="jobName" :label="t('runJob.jobName')" show-overflow-tooltip />
|
||||
<el-table-column prop="startTime" :label="t('runJob.startTime')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="timeLimit" :label="t('runJob.timeLimit')" show-overflow-tooltip/>
|
||||
<el-table-column prop="status" :label="t('runJob.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
@@ -91,203 +112,177 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="suspensionReason" :label="t('runJob.suspensionReason')" show-overflow-tooltip/>-->
|
||||
<el-table-column prop="flowStatus" :label="t('runJob.flowStatus')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.flowStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="parFlowInstId" :label="t('runJob.parFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联父流程工单信息" v-if="scope.row.parFlowInstId">
|
||||
<convert-name :options="state.dicData.parFlowInstId" :value="scope.row.parFlowInstId"
|
||||
:valueKey="'id'" :showKey="'flowName'"
|
||||
:elTagType="'primary'" @click="methods.handleJobByFlowInstId(scope.row, '1')"></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('common.action')" width="150">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
查看工单
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="methods.handleJob(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
查看审批过程
|
||||
</template>
|
||||
<el-button text type="primary" icon="Operation" @click="methods.handleComment(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
查看流程图
|
||||
</template>
|
||||
<el-button text type="primary" icon="Share" @click="methods.handleFlowPic(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-table-column prop="flowStatus" :label="t('runJob.flowStatus')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FLOW_STATUS" :value="scope.row.flowStatus"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="parFlowInstId" :label="t('runJob.parFlowInstId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top" content="点击可查看关联父流程工单信息" v-if="scope.row.parFlowInstId">
|
||||
<convert-name
|
||||
:options="state.dicData.parFlowInstId"
|
||||
:value="scope.row.parFlowInstId"
|
||||
:valueKey="'id'"
|
||||
:showKey="'flowName'"
|
||||
:elTagType="'primary'"
|
||||
@click="methods.handleJobByFlowInstId(scope.row, '1')"
|
||||
></convert-name>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('common.action')" width="150">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content> 查看工单 </template>
|
||||
<el-button text type="primary" icon="view" @click="methods.handleJob(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content> 查看审批过程 </template>
|
||||
<el-button text type="primary" icon="Operation" @click="methods.handleComment(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content> 查看流程图 </template>
|
||||
<el-button text type="primary" icon="Share" @click="methods.handleFlowPic(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top" v-if="validateStatus(scope.row)">
|
||||
<template #content>
|
||||
指派人员
|
||||
</template>
|
||||
<el-button text type="primary" icon="Pointer" @click="methods.handleAppointUser(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="validateStatus(scope.row)">
|
||||
<template #content>
|
||||
签收任务
|
||||
</template>
|
||||
<el-button text type="primary" icon="CirclePlus" @click="methods.handleSignForJob(scope.row, '1')">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
|
||||
v-bind="state.pagination"/>
|
||||
</div>
|
||||
<el-tooltip placement="top" v-if="validateStatus(scope.row)">
|
||||
<template #content> 指派人员 </template>
|
||||
<el-button text type="primary" icon="Pointer" @click="methods.handleAppointUser(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="validateStatus(scope.row)">
|
||||
<template #content> 签收任务 </template>
|
||||
<el-button text type="primary" icon="CirclePlus" @click="methods.handleSignForJob(scope.row, '1')"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog v-model="data.showComment" v-if="data.showComment"
|
||||
top="20px" width="90%"
|
||||
title="查看审批过程" append-to-body>
|
||||
<comment :currJob="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
<!-- 查看审批过程 -->
|
||||
<el-dialog v-model="data.showComment" v-if="data.showComment" top="20px" width="90%" title="查看审批过程" append-to-body>
|
||||
<comment :currJob="data.currJob"></comment>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer" direction="rtl"
|
||||
append-to-body size="90%"
|
||||
v-model="data.showFlowPic"
|
||||
>
|
||||
<flow-photo v-if="data.showFlowPic" :currJob="data.currJob"></flow-photo>
|
||||
</el-drawer>
|
||||
<!-- 查看流程图 -->
|
||||
<el-drawer class="flow-overflow-drawer" direction="rtl" append-to-body size="90%" v-model="data.showFlowPic">
|
||||
<flow-photo v-if="data.showFlowPic" :currJob="data.currJob"></flow-photo>
|
||||
</el-drawer>
|
||||
|
||||
<user-role-picker ref="userRolePicker" :isOnlyOne="true" @onSelectItems="methods.onJobNextUserRole">
|
||||
</user-role-picker>
|
||||
|
||||
</div>
|
||||
<user-role-picker ref="userRolePicker" :isOnlyOne="true" @onSelectItems="methods.onJobNextUserRole"> </user-role-picker>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="HiJob">
|
||||
import {BasicTableProps, useTable} from "/@/hooks/table";
|
||||
import {fetchToDonePage} from '/@/api/jsonflow/hi-job'
|
||||
import {useMessage, useMessageBox} from "/@/hooks/message";
|
||||
import {useI18n} from "vue-i18n";
|
||||
import {onCascadeChange, onLoadDicUrl, onLoaded, remoteMethodByKey} from "/@/flow/components/convert-name/convert";
|
||||
import {signForJob, appointUser} from "/@/api/jsonflow/do-job";
|
||||
import {openFlowPreview} from "/@/flow/support/extend";
|
||||
import {onJobNextUserRole} from "/@/flow/components/handle-job";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchToDonePage } from '/@/api/jsonflow/hi-job';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl, onLoaded, remoteMethodByKey } from '/@/flow/components/convert-name/convert';
|
||||
import { signForJob, appointUser } from '/@/api/jsonflow/do-job';
|
||||
import { openFlowPreview } from '/@/flow/support/extend';
|
||||
import { onJobNextUserRole } from '/@/flow/components/handle-job';
|
||||
|
||||
const $message = useMessage();
|
||||
const {proxy} = getCurrentInstance();
|
||||
// 引入组件
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('../flow-design/view.vue'));
|
||||
const UserRolePicker = defineAsyncComponent(() => import('../../../flow/components/user-role/picker.vue'));
|
||||
const {t} = useI18n()
|
||||
const router = useRouter();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "flowInstId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["runNodeId"]}, {key: "runNodeId", cascades: ["runJobId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(state.queryForm, {key: key, cascades: cascades});
|
||||
}
|
||||
const $message = useMessage();
|
||||
const { proxy } = getCurrentInstance();
|
||||
// 引入组件
|
||||
const Comment = defineAsyncComponent(() => import('../comment/timeline.vue'));
|
||||
const FlowPhoto = defineAsyncComponent(() => import('../flow-design/view.vue'));
|
||||
const UserRolePicker = defineAsyncComponent(() => import('../../../flow/components/user-role/picker.vue'));
|
||||
const { t } = useI18n();
|
||||
const router = useRouter();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'flowInstId' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['runNodeId'] }, { key: 'runNodeId', cascades: ['runJobId'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(state.queryForm, { key: key, cascades: cascades });
|
||||
}
|
||||
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
|
||||
const data = reactive({
|
||||
currJob: {},
|
||||
showComment: false,
|
||||
showFlowPic: false
|
||||
});
|
||||
const data = reactive({
|
||||
currJob: {},
|
||||
showComment: false,
|
||||
showFlowPic: false,
|
||||
});
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {queryJobType: '1', flowStatus: '0'},
|
||||
pageList: fetchToDonePage,
|
||||
onLoaded: onLoaded({key: "initiatorId"}, {key: "parFlowInstId"}, {key: "orderId"}, {key: "runNodeId"}),
|
||||
descs: ["start_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: { queryJobType: '1', flowStatus: '0' },
|
||||
pageList: fetchToDonePage,
|
||||
onLoaded: onLoaded({ key: 'initiatorId' }, { key: 'parFlowInstId' }, { key: 'orderId' }, { key: 'runNodeId' }),
|
||||
descs: ['start_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-job/export', state.queryForm, 'run-job.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/jsonflow/run-job/export', state.queryForm, 'run-job.xlsx');
|
||||
};
|
||||
|
||||
function validateStatus(row) {
|
||||
return (row.status === '0' || row.status === '9') && !row.roleId && row.flowStatus === '0';
|
||||
}
|
||||
function validateStatus(row) {
|
||||
return (row.status === '0' || row.status === '9') && !row.roleId && row.flowStatus === '0';
|
||||
}
|
||||
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', "initiatorId")
|
||||
}
|
||||
function remoteMethod(query: string) {
|
||||
remoteMethodByKey(query, onLoad, dicData, 'userName', 'initiatorId');
|
||||
}
|
||||
|
||||
const methods = {
|
||||
handleJobByFlowInstId(row, type) {
|
||||
let find;
|
||||
if (type === '1') {
|
||||
find = state.dicData.parFlowInstId.find(f => f.id === row.parFlowInstId);
|
||||
}
|
||||
methods.handleJob({flowInstId: find.id})
|
||||
},
|
||||
handleJob(row) {
|
||||
openFlowPreview(router, row)
|
||||
},
|
||||
// 指派任务
|
||||
handleAppointUser(row) {
|
||||
data.currJob = row
|
||||
proxy.$refs.userRolePicker.onOpen();
|
||||
},
|
||||
// 指定任务参与者
|
||||
onJobNextUserRole(items) {
|
||||
onJobNextUserRole($message, items, getDataList, data)
|
||||
},
|
||||
// 签收任务
|
||||
handleSignForJob(row, type) {
|
||||
let obj = {id: row.id, signForType: type};
|
||||
signForJob(obj).then(() => {
|
||||
$message.success('操作成功');
|
||||
getDataList();
|
||||
})
|
||||
},
|
||||
handleComment(row) {
|
||||
data.currJob = row
|
||||
data.showComment = true
|
||||
},
|
||||
handleFlowPic(row) {
|
||||
data.currJob = row
|
||||
data.showFlowPic = true
|
||||
}
|
||||
}
|
||||
const methods = {
|
||||
handleJobByFlowInstId(row, type) {
|
||||
let find;
|
||||
if (type === '1') {
|
||||
find = state.dicData.parFlowInstId.find((f) => f.id === row.parFlowInstId);
|
||||
}
|
||||
methods.handleJob({ flowInstId: find.id });
|
||||
},
|
||||
handleJob(row) {
|
||||
openFlowPreview(router, row);
|
||||
},
|
||||
// 指派任务
|
||||
handleAppointUser(row) {
|
||||
data.currJob = row;
|
||||
proxy.$refs.userRolePicker.onOpen();
|
||||
},
|
||||
// 指定任务参与者
|
||||
onJobNextUserRole(items) {
|
||||
onJobNextUserRole($message, items, getDataList, data);
|
||||
},
|
||||
// 签收任务
|
||||
handleSignForJob(row, type) {
|
||||
let obj = { id: row.id, signForType: type };
|
||||
signForJob(obj).then(() => {
|
||||
$message.success('操作成功');
|
||||
getDataList();
|
||||
});
|
||||
},
|
||||
handleComment(row) {
|
||||
data.currJob = row;
|
||||
data.showComment = true;
|
||||
},
|
||||
handleFlowPic(row) {
|
||||
data.currJob = row;
|
||||
data.showFlowPic = true;
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
</style>
|
||||
|
||||
|
||||
@@ -1,239 +1,246 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="140px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="140px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('runNode.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runNode.inputFlowInstIdTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('runNode.flowInstId')" prop="flowInstId" >
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runNode.inputFlowInstIdTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('runNode.inputDefFlowIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.defFlowId" :key="index" :label="item.flowName" :value="item.defFlowId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('runNode.inputDefFlowIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.defFlowId" :key="index" :label="item.flowName" :value="item.defFlowId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.nodeName')" prop="nodeName">
|
||||
<el-input v-model="form.nodeName" :placeholder="t('runNode.inputNodeNameTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.nodeName')" prop="nodeName">
|
||||
<el-input v-model="form.nodeName" :placeholder="t('runNode.inputNodeNameTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.startTime')" prop="startTime">
|
||||
<el-date-picker
|
||||
type="datetime"
|
||||
:placeholder="t('runNode.inputStartTimeTip')"
|
||||
v-model="form.startTime"
|
||||
:value-format="dateTimeStr"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.startTime')" prop="startTime">
|
||||
<el-date-picker type="datetime" :placeholder="t('runNode.inputStartTimeTip')" v-model="form.startTime" :value-format="dateTimeStr"></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.endTime')" prop="endTime">
|
||||
<el-date-picker
|
||||
type="datetime"
|
||||
:placeholder="t('runNode.inputEndTimeTip')"
|
||||
v-model="form.endTime"
|
||||
:value-format="dateTimeStr"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.endTime')" prop="endTime">
|
||||
<el-date-picker type="datetime" :placeholder="t('runNode.inputEndTimeTip')" v-model="form.endTime" :value-format="dateTimeStr"></el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.nodeType')" prop="nodeType">
|
||||
<el-select v-model="form.nodeType" :placeholder="t('runNode.inputNodeTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.nodeType')" prop="nodeType">
|
||||
<el-select v-model="form.nodeType" :placeholder="t('runNode.inputNodeTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.nodeApproveMethod')" prop="nodeApproveMethod">
|
||||
<el-select v-model="form.nodeApproveMethod" :placeholder="t('runNode.inputNodeApproveMethodTip')">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_APPROVE_METHOD" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.nodeApproveMethod')" prop="nodeApproveMethod">
|
||||
<el-select v-model="form.nodeApproveMethod" :placeholder="t('runNode.inputNodeApproveMethodTip')">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_APPROVE_METHOD" :key="item.value" :label="item.label" :value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.rejectType')" prop="rejectType">
|
||||
<el-radio-group v-model="form.rejectType">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.REJECT_TYPE" :key="index" :label="item.value">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.rejectType')" prop="rejectType">
|
||||
<el-radio-group v-model="form.rejectType">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.REJECT_TYPE" :key="index" :label="item.value">
|
||||
{{ item.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.timeout')" prop="timeout">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.timeout" :placeholder="t('runNode.inputTimeoutTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.timeout')" prop="timeout">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.timeout" :placeholder="t('runNode.inputTimeoutTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.status')" prop="status">
|
||||
<el-select disabled v-model="form.status" :placeholder="t('runNode.inputStatusTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.status')" prop="status">
|
||||
<el-select disabled v-model="form.status" :placeholder="t('runNode.inputStatusTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.isAutoNext')" prop="isAutoNext">
|
||||
<el-radio-group v-model="form.isAutoNext">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.isAutoNext')" prop="isAutoNext">
|
||||
<el-radio-group v-model="form.isAutoNext">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.isContinue')" prop="isContinue">
|
||||
<el-radio-group v-model="form.isContinue">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.isContinue')" prop="isContinue">
|
||||
<el-radio-group v-model="form.isContinue">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.suspension')" prop="suspension">
|
||||
<el-radio-group v-model="form.suspension">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.suspension')" prop="suspension">
|
||||
<el-radio-group v-model="form.suspension">
|
||||
<el-radio v-for="(item, index) in DIC_PROP.YES_OR_NO" :key="index" :label="item.value">
|
||||
{{ getLabelByLanguage(item) }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('runNode.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runNode.sort')" prop="sort">
|
||||
<el-input-number :min="1" :max="1000" v-model="form.sort" :placeholder="t('runNode.inputSortTip')"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="RunNodeDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/run-node';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { rule } from '/@/utils/validate';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/run-node'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { rule } from '/@/utils/validate';
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const cascadeDic = reactive({});
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['defFlowId'] });
|
||||
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const cascadeDic = reactive({});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["defFlowId"]});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
}
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
sort: 0,
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
nodeType: '',
|
||||
nodeApproveMethod: '',
|
||||
rejectType: '',
|
||||
timeout: 0,
|
||||
status: '',
|
||||
isAutoNext: '',
|
||||
isContinue: '',
|
||||
suspension: '',
|
||||
});
|
||||
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
}
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
sort: 0,
|
||||
defFlowId: '',
|
||||
flowNodeId: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
nodeType: '',
|
||||
nodeApproveMethod: '',
|
||||
rejectType: '',
|
||||
timeout: 0,
|
||||
status: '',
|
||||
isAutoNext: '',
|
||||
isContinue: '',
|
||||
suspension: '',
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
flowNodeId: [{ required: true, message: '节点名称不能为空', trigger: 'blur' }],
|
||||
nodeType: [{ required: true, message: '节点类型不能为空', trigger: 'blur' }],
|
||||
nodeApproveMethod: [{ required: true, message: '多节点审批方式不能为空', trigger: 'blur' }],
|
||||
rejectType: [{ required: true, message: '被驳回后再次提交时不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '节点状态不能为空', trigger: 'blur' }],
|
||||
isAutoNext: [{ required: true, message: '是否自动流转下一节点不能为空', trigger: 'blur' }],
|
||||
isContinue: [{ required: true, message: '是否继续下一节点不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
flowNodeId: [{required: true, message: '节点名称不能为空', trigger: 'blur'}],
|
||||
nodeType: [{required: true, message: '节点类型不能为空', trigger: 'blur'}],
|
||||
nodeApproveMethod: [{required: true, message: '多节点审批方式不能为空', trigger: 'blur'}],
|
||||
rejectType: [{required: true, message: '被驳回后再次提交时不能为空', trigger: 'blur'}],
|
||||
status: [{required: true, message: '节点状态不能为空', trigger: 'blur'}],
|
||||
isAutoNext: [{required: true, message: '是否自动流转下一节点不能为空', trigger: 'blur'}],
|
||||
isContinue: [{required: true, message: '是否继续下一节点不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取RunNode信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getRunNodeData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取RunNode信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getRunNodeData(id)
|
||||
}
|
||||
};
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getRunNodeData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onCascade(form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getRunNodeData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onCascade(form);
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,50 +1,49 @@
|
||||
export default {
|
||||
runNode: {
|
||||
index: '#',
|
||||
importrunNodeTip: 'import RunNode',
|
||||
id: 'id',
|
||||
sort: 'sort',
|
||||
defFlowId: 'defFlowId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
startTime: 'startTime',
|
||||
endTime: 'endTime',
|
||||
nodeType: 'nodeType',
|
||||
nodeName: 'nodeName',
|
||||
subDefFlowId: 'subDefFlowId',
|
||||
subFlowVersion: 'subFlowVersion',
|
||||
nodeApproveMethod: 'nodeApproveMethod',
|
||||
rejectType: 'rejectType',
|
||||
timeout: 'timeout',
|
||||
status: 'status',
|
||||
isAutoNext: 'isAutoNext',
|
||||
isContinue: 'isContinue',
|
||||
suspension: 'suspension',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowInstId: 'flowInstId',
|
||||
flowKey: 'flowKey',
|
||||
runNode: {
|
||||
index: '#',
|
||||
importrunNodeTip: 'import RunNode',
|
||||
id: 'id',
|
||||
sort: 'sort',
|
||||
defFlowId: 'defFlowId',
|
||||
flowNodeId: 'flowNodeId',
|
||||
startTime: 'startTime',
|
||||
endTime: 'endTime',
|
||||
nodeType: 'nodeType',
|
||||
nodeName: 'nodeName',
|
||||
subDefFlowId: 'subDefFlowId',
|
||||
subFlowVersion: 'subFlowVersion',
|
||||
nodeApproveMethod: 'nodeApproveMethod',
|
||||
rejectType: 'rejectType',
|
||||
timeout: 'timeout',
|
||||
status: 'status',
|
||||
isAutoNext: 'isAutoNext',
|
||||
isContinue: 'isContinue',
|
||||
suspension: 'suspension',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
flowInstId: 'flowInstId',
|
||||
flowKey: 'flowKey',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputSortTip: 'input sort',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputStartTimeTip: 'input startTime',
|
||||
inputEndTimeTip: 'input endTime',
|
||||
inputNodeTypeTip: 'input nodeType',
|
||||
inputNodeNameTip: 'input nodeName',
|
||||
inputSubDefFlowIdTip: 'input subDefFlowId',
|
||||
inputSubFlowVersionTip: 'input subFlowVersion',
|
||||
inputNodeApproveMethodTip: 'input nodeApproveMethod',
|
||||
inputRejectTypeTip: 'input rejectType',
|
||||
inputTimeoutTip: 'input timeout',
|
||||
inputStatusTip: 'input status',
|
||||
inputIsAutoNextTip: 'input isAutoNext',
|
||||
inputIsContinueTip: 'input isContinue',
|
||||
inputSuspensionTip: 'input suspension',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
|
||||
}
|
||||
}
|
||||
inputIdTip: 'input id',
|
||||
inputSortTip: 'input sort',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowNodeIdTip: 'input flowNodeId',
|
||||
inputStartTimeTip: 'input startTime',
|
||||
inputEndTimeTip: 'input endTime',
|
||||
inputNodeTypeTip: 'input nodeType',
|
||||
inputNodeNameTip: 'input nodeName',
|
||||
inputSubDefFlowIdTip: 'input subDefFlowId',
|
||||
inputSubFlowVersionTip: 'input subFlowVersion',
|
||||
inputNodeApproveMethodTip: 'input nodeApproveMethod',
|
||||
inputRejectTypeTip: 'input rejectType',
|
||||
inputTimeoutTip: 'input timeout',
|
||||
inputStatusTip: 'input status',
|
||||
inputIsAutoNextTip: 'input isAutoNext',
|
||||
inputIsContinueTip: 'input isContinue',
|
||||
inputSuspensionTip: 'input suspension',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,50 +1,49 @@
|
||||
export default {
|
||||
runNode: {
|
||||
index: '#',
|
||||
importrunNodeTip: '导入运行节点管理',
|
||||
id: '节点名称',
|
||||
sort: '排序值',
|
||||
defFlowId: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
startTime: '开始时间',
|
||||
endTime: '结束时间',
|
||||
nodeType: '节点类型',
|
||||
nodeName: '节点名称',
|
||||
subDefFlowId: '关联子流程',
|
||||
subFlowVersion: '子流程版本',
|
||||
nodeApproveMethod: '多节点审批方式',
|
||||
rejectType: '被驳回后再次提交时',
|
||||
timeout: '节点时限(分钟)',
|
||||
status: '节点状态',
|
||||
isAutoNext: '是否自动流转下一节点',
|
||||
isContinue: '是否继续下一节点',
|
||||
suspension: '是否挂起',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowInstId: '流程实例ID',
|
||||
flowKey: '业务KEY',
|
||||
runNode: {
|
||||
index: '#',
|
||||
importrunNodeTip: '导入运行节点管理',
|
||||
id: '节点名称',
|
||||
sort: '排序值',
|
||||
defFlowId: '流程名称',
|
||||
flowNodeId: '节点名称',
|
||||
startTime: '开始时间',
|
||||
endTime: '结束时间',
|
||||
nodeType: '节点类型',
|
||||
nodeName: '节点名称',
|
||||
subDefFlowId: '关联子流程',
|
||||
subFlowVersion: '子流程版本',
|
||||
nodeApproveMethod: '多节点审批方式',
|
||||
rejectType: '被驳回后再次提交时',
|
||||
timeout: '节点时限(分钟)',
|
||||
status: '节点状态',
|
||||
isAutoNext: '是否自动流转下一节点',
|
||||
isContinue: '是否继续下一节点',
|
||||
suspension: '是否挂起',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
flowInstId: '流程实例ID',
|
||||
flowKey: '业务KEY',
|
||||
|
||||
inputIdTip: '请输入节点名称',
|
||||
inputSortTip: '请输入排序值',
|
||||
inputDefFlowIdTip: '请输入流程名称',
|
||||
inputFlowNodeIdTip: '请输入节点名称',
|
||||
inputStartTimeTip: '请输入开始时间',
|
||||
inputEndTimeTip: '请输入结束时间',
|
||||
inputNodeTypeTip: '请输入节点类型',
|
||||
inputNodeNameTip: '请输入节点名称',
|
||||
inputSubDefFlowIdTip: '请输入关联子流程',
|
||||
inputSubFlowVersionTip: '请输入子流程版本',
|
||||
inputNodeApproveMethodTip: '请输入多节点审批方式',
|
||||
inputRejectTypeTip: '请输入被驳回后再次提交时',
|
||||
inputTimeoutTip: '请输入任务时限',
|
||||
inputStatusTip: '请输入节点状态',
|
||||
inputIsAutoNextTip: '请输入是否自动流转下一节点',
|
||||
inputIsContinueTip: '请输入是否继续下一节点',
|
||||
inputSuspensionTip: '请输入是否挂起',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFlowKeyTip: '请输入业务KEY',
|
||||
|
||||
}
|
||||
}
|
||||
inputIdTip: '请输入节点名称',
|
||||
inputSortTip: '请输入排序值',
|
||||
inputDefFlowIdTip: '请输入流程名称',
|
||||
inputFlowNodeIdTip: '请输入节点名称',
|
||||
inputStartTimeTip: '请输入开始时间',
|
||||
inputEndTimeTip: '请输入结束时间',
|
||||
inputNodeTypeTip: '请输入节点类型',
|
||||
inputNodeNameTip: '请输入节点名称',
|
||||
inputSubDefFlowIdTip: '请输入关联子流程',
|
||||
inputSubFlowVersionTip: '请输入子流程版本',
|
||||
inputNodeApproveMethodTip: '请输入多节点审批方式',
|
||||
inputRejectTypeTip: '请输入被驳回后再次提交时',
|
||||
inputTimeoutTip: '请输入任务时限',
|
||||
inputStatusTip: '请输入节点状态',
|
||||
inputIsAutoNextTip: '请输入是否自动流转下一节点',
|
||||
inputIsContinueTip: '请输入是否继续下一节点',
|
||||
inputSuspensionTip: '请输入是否挂起',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFlowKeyTip: '请输入业务KEY',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,98 +1,118 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runNode.flowInstId')" prop="flowInstId" >
|
||||
<el-input :placeholder="t('runNode.inputFlowInstIdTip')" v-model="state.queryForm.flowInstId"
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])"
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runNode.id')" prop="id" >
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runNode.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runNode.status')" prop="status" >
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runNode.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')"
|
||||
v-auth="'jsonflow_runnode_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_runnode_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runNode.flowInstId')" prop="flowInstId">
|
||||
<el-input
|
||||
:placeholder="t('runNode.inputFlowInstIdTip')"
|
||||
v-model="state.queryForm.flowInstId"
|
||||
@change="cascadeChange('flowInstId', ['runNodeId'])"
|
||||
style="max-width: 180px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runNode.id')" prop="id">
|
||||
<el-select v-model="state.queryForm.id" :placeholder="t('runNode.inputIdTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in cascadeDic.runNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runNode.status')" prop="status">
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runNode.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.NODE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')" v-auth="'jsonflow_runnode_add'"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_runnode_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_runnode_export'"
|
||||
class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('runNode.index')" width="40" />
|
||||
<el-table-column prop="sort" :label="t('runNode.sort')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowInstId" :label="t('runNode.flowInstId')" show-overflow-tooltip/>
|
||||
<el-table-column prop="defFlowId" :label="t('runNode.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.defFlowId"
|
||||
:valueKey="'defFlowId'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="nodeName" :label="t('runNode.nodeName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="startTime" :label="t('runNode.startTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="endTime" :label="t('runNode.endTime')" show-overflow-tooltip/>
|
||||
<el-table-column prop="nodeType" :label="t('runNode.nodeType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_TYPE" :value="scope.row.nodeType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subDefFlowId" :label="t('runNode.subDefFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.defFlowId" :value="scope.row.subDefFlowId"
|
||||
:valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="nodeApproveMethod" :label="t('runNode.nodeApproveMethod')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_APPROVE_METHOD" :value="scope.row.nodeApproveMethod"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="rejectType" :label="t('runNode.rejectType')" show-overflow-tooltip>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_runnode_export'"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('runNode.index')" width="40" />
|
||||
<el-table-column prop="sort" :label="t('runNode.sort')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowInstId" :label="t('runNode.flowInstId')" show-overflow-tooltip />
|
||||
<el-table-column prop="defFlowId" :label="t('runNode.defFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name
|
||||
:options="state.dicData.flowInstId"
|
||||
:value="scope.row.defFlowId"
|
||||
:valueKey="'defFlowId'"
|
||||
:showKey="'flowName'"
|
||||
></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="nodeName" :label="t('runNode.nodeName')" show-overflow-tooltip />
|
||||
<el-table-column prop="startTime" :label="t('runNode.startTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="endTime" :label="t('runNode.endTime')" show-overflow-tooltip />
|
||||
<el-table-column prop="nodeType" :label="t('runNode.nodeType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_TYPE" :value="scope.row.nodeType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="subDefFlowId" :label="t('runNode.subDefFlowId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="dicData.defFlowId" :value="scope.row.subDefFlowId" :valueKey="'id'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="nodeApproveMethod" :label="t('runNode.nodeApproveMethod')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_APPROVE_METHOD" :value="scope.row.nodeApproveMethod"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="rejectType" :label="t('runNode.rejectType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.REJECT_TYPE" :value="scope.row.rejectType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="timeout" :label="t('runNode.timeout')" show-overflow-tooltip/>
|
||||
<el-table-column prop="status" :label="t('runNode.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="isAutoNext" :label="t('runNode.isAutoNext')" show-overflow-tooltip>
|
||||
<el-table-column prop="timeout" :label="t('runNode.timeout')" show-overflow-tooltip />
|
||||
<el-table-column prop="status" :label="t('runNode.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NODE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="isAutoNext" :label="t('runNode.isAutoNext')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.isAutoNext"></dict-tag>
|
||||
</template>
|
||||
@@ -102,146 +122,133 @@
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.isContinue"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="suspension" :label="t('runNode.suspension')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.suspension"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="createUser" :label="t('runNode.createUser')" show-overflow-tooltip>
|
||||
<el-table-column prop="suspension" :label="t('runNode.suspension')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.suspension"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="createUser" :label="t('runNode.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('runNode.createTime')" show-overflow-tooltip/>-->
|
||||
<el-table-column :label="$t('common.action')" width="120">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-table-column :label="$t('common.action')" width="120">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top" v-if="scope.row.status ==='0' || scope.row.status ==='9'">
|
||||
<template #content>
|
||||
催办节点
|
||||
</template>
|
||||
<el-button icon="Bell" text type="primary" @click="remind(scope.row, '0')">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.status === '0' || scope.row.status === '9'">
|
||||
<template #content> 催办节点 </template>
|
||||
<el-button icon="Bell" text type="primary" @click="remind(scope.row, '0')"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemRunNode">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/run-node";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/run-node';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onCascadeChange, onLoadDicUrl, onLoaded} from "/@/flow/components/convert-name/convert";
|
||||
import * as runNode from "/@/api/jsonflow/run-node";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl, onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
import * as runNode from '/@/api/jsonflow/run-node';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n()
|
||||
const $message = useMessage();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "defFlowId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["runNodeId"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(state.queryForm, {key: key, cascades: cascades});
|
||||
}
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
const $message = useMessage();
|
||||
// 定义查询字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'defFlowId' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['runNodeId'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(state.queryForm, { key: key, cascades: cascades });
|
||||
}
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({key: "createUser"}, {key: "flowInstId"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({ key: 'createUser' }, { key: 'flowInstId' }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
|
||||
function remind(row, type) {
|
||||
row.remindType = type
|
||||
runNode.remind(row).then(() => {
|
||||
$message.success('催办成功')
|
||||
})
|
||||
}
|
||||
function remind(row, type) {
|
||||
row.remindType = type;
|
||||
runNode.remind(row).then(() => {
|
||||
$message.success('催办成功');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,173 +1,190 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<span style="margin-left: 30px">什么是被驳回人？当被驳回人为空时，则默认会驳回到该节点下的全部审批人。当被驳回人不为空时，则会驳回到该节点下指定的审批人员（{{userRoleIdText}}）</span>
|
||||
<el-row :gutter="24">
|
||||
<el-divider> 任意驳回选择 </el-divider>
|
||||
<div>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<span style="margin-left: 30px"
|
||||
>什么是被驳回人？当被驳回人为空时，则默认会驳回到该节点下的全部审批人。当被驳回人不为空时，则会驳回到该节点下指定的审批人员（{{
|
||||
userRoleIdText
|
||||
}}）</span
|
||||
>
|
||||
<el-row :gutter="24">
|
||||
<el-divider> 任意驳回选择 </el-divider>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runReject.inputFlowInstIdTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runReject.inputFlowInstIdTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('runReject.inputDefFlowIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.defFlowId" :key="index" :label="item.flowName" :value="item.defFlowId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.defFlowId')" prop="defFlowId">
|
||||
<el-select v-model="form.defFlowId" :placeholder="t('runReject.inputDefFlowIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.defFlowId" :key="index" :label="item.flowName" :value="item.defFlowId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.toRunNodeId')" prop="toRunNodeId">
|
||||
<el-tooltip placement="top" content="若不选择具体的【指定被驳回人】，则默认会驳回到该节点下的全部审批人">
|
||||
<el-select v-model="form.toRunNodeId" :placeholder="t('runReject.inputToFlowNodeIdTip')" clearable filterable
|
||||
@change="cascadeChange('toRunNodeId', ['handleUserId'])">
|
||||
<el-option v-for="(item, index) in cascadeDic.toRunNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.toRunNodeId')" prop="toRunNodeId">
|
||||
<el-tooltip placement="top" content="若不选择具体的【指定被驳回人】，则默认会驳回到该节点下的全部审批人">
|
||||
<el-select
|
||||
v-model="form.toRunNodeId"
|
||||
:placeholder="t('runReject.inputToFlowNodeIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="cascadeChange('toRunNodeId', ['handleUserId'])"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.toRunNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20" v-if="form.runRejectVO.nodeType !== DIC_PROP.NODE_TYPE[4].value">
|
||||
<el-form-item :label="t('runReject.handleUserId')" prop="handleUserId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{validateNull(cascadeDic.handleUserId) ? userIdText : userIdText2}}</template>
|
||||
<el-select v-model="form.handleUserId" :placeholder="t('runReject.inputHandleUserIdTip')" clearable filterable
|
||||
@change="handleUserIdChange">
|
||||
<el-option v-for="(item, index) in cascadeDic.handleUserId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<footer class="el-dialog__footer">
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleUpdate" :loading="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</footer>
|
||||
</div>
|
||||
<el-col :span="12" class="mb20" v-if="form.runRejectVO.nodeType !== DIC_PROP.NODE_TYPE[4].value">
|
||||
<el-form-item :label="t('runReject.handleUserId')" prop="handleUserId">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>{{ validateNull(cascadeDic.handleUserId) ? userIdText : userIdText2 }}</template>
|
||||
<el-select
|
||||
v-model="form.handleUserId"
|
||||
:placeholder="t('runReject.inputHandleUserIdTip')"
|
||||
clearable
|
||||
filterable
|
||||
@change="handleUserIdChange"
|
||||
>
|
||||
<el-option v-for="(item, index) in cascadeDic.handleUserId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<footer class="el-dialog__footer">
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleUpdate" :loading="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="RunRejectForm">
|
||||
import { useI18n } from "vue-i18n"
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
import {validateNull} from "/@/utils/validate";
|
||||
import {useMessage} from "/@/hooks/message";
|
||||
import {DIC_PROP} from "/@/flow/support/dict-prop";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
import { validateNull } from '/@/utils/validate';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { DIC_PROP } from '/@/flow/support/dict-prop';
|
||||
|
||||
const { t } = useI18n();
|
||||
const $message = useMessage();
|
||||
const $emit = defineEmits(['onRejectJob']);
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const { t } = useI18n();
|
||||
const $message = useMessage();
|
||||
const $emit = defineEmits(['onRejectJob']);
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
// const onLoad = onLoadDicUrl({key: "userId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["defFlowId"]}, {prefix: "runReject", key: "flowInstId", cascades: ["toRunNodeId"]},
|
||||
{key: "toRunNodeId", cascades: ["handleUserId"]});
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades){
|
||||
onCascade(form, {key: key, cascades: cascades});
|
||||
handleToFlowNodeId(form[key])
|
||||
}
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
// const onLoad = onLoadDicUrl({key: "userId"});
|
||||
const onCascade = onCascadeChange(
|
||||
cascadeDic,
|
||||
{ key: 'flowInstId', cascades: ['defFlowId'] },
|
||||
{ prefix: 'runReject', key: 'flowInstId', cascades: ['toRunNodeId'] },
|
||||
{ key: 'toRunNodeId', cascades: ['handleUserId'] }
|
||||
);
|
||||
onMounted(() => {
|
||||
// onLoad(dicData);
|
||||
});
|
||||
function cascadeChange(key, cascades) {
|
||||
onCascade(form, { key: key, cascades: cascades });
|
||||
handleToFlowNodeId(form[key]);
|
||||
}
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
defFlowId: '',
|
||||
flowInstId: '',
|
||||
toRunNodeId: '',
|
||||
handleUserId: '',
|
||||
runRejectVO: {},
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
defFlowId: '',
|
||||
flowInstId: '',
|
||||
toRunNodeId: '',
|
||||
handleUserId: '',
|
||||
runRejectVO: {},
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
flowInstId: [{required: true, message: '流程实例ID不能为空', trigger: 'blur'}],
|
||||
toRunNodeId: [{required: true, message: '达到节点名称不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
defFlowId: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
flowInstId: [{ required: true, message: '流程实例ID不能为空', trigger: 'blur' }],
|
||||
toRunNodeId: [{ required: true, message: '达到节点名称不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
}
|
||||
});
|
||||
const props = defineProps({
|
||||
currJob: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const userIdText = '注：当前被驳回节点下可候选被驳回人为空不可驳回，请使用【任意跳转】'
|
||||
const userIdText2 = '注：当被驳回人为空时，则默认会驳回到当前节点显示的全部审批人'
|
||||
const userRoleIdText = '注：被驳回节点下的任务需审批过存在审批人才可驳回，否则请使用【任意跳转】'
|
||||
const userIdText = '注：当前被驳回节点下可候选被驳回人为空不可驳回，请使用【任意跳转】';
|
||||
const userIdText2 = '注：当被驳回人为空时，则默认会驳回到当前节点显示的全部审批人';
|
||||
const userRoleIdText = '注：被驳回节点下的任务需审批过存在审批人才可驳回，否则请使用【任意跳转】';
|
||||
|
||||
function handleToFlowNodeId(val) {
|
||||
if (!val) return
|
||||
const runNode = cascadeDic.toRunNodeId.find(f => f.id === val)
|
||||
form.runRejectVO.toRunNodeId = runNode.id
|
||||
form.runRejectVO.toFlowNodeId = runNode.flowNodeId
|
||||
form.runRejectVO.nodeType = runNode.nodeType
|
||||
}
|
||||
function handleToFlowNodeId(val) {
|
||||
if (!val) return;
|
||||
const runNode = cascadeDic.toRunNodeId.find((f) => f.id === val);
|
||||
form.runRejectVO.toRunNodeId = runNode.id;
|
||||
form.runRejectVO.toFlowNodeId = runNode.flowNodeId;
|
||||
form.runRejectVO.nodeType = runNode.nodeType;
|
||||
}
|
||||
|
||||
function handleUserIdChange(val) {
|
||||
form.runRejectVO.handleUserId = val
|
||||
}
|
||||
function handleUserIdChange(val) {
|
||||
form.runRejectVO.handleUserId = val;
|
||||
}
|
||||
|
||||
function initJobData() {
|
||||
Object.assign(form, props.currJob)
|
||||
onCascade(form)
|
||||
}
|
||||
function initJobData() {
|
||||
Object.assign(form, props.currJob);
|
||||
onCascade(form);
|
||||
}
|
||||
|
||||
async function handleUpdate() {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
async function handleUpdate() {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
if (validateNull(cascadeDic.handleUserId) && form.runRejectVO.nodeType !== DIC_PROP.NODE_TYPE[4].value) {
|
||||
$message.warning(userIdText)
|
||||
return
|
||||
}
|
||||
if (validateNull(cascadeDic.handleUserId) && form.runRejectVO.nodeType !== DIC_PROP.NODE_TYPE[4].value) {
|
||||
$message.warning(userIdText);
|
||||
return;
|
||||
}
|
||||
|
||||
props.currJob.runRejectVO = form.runRejectVO
|
||||
form.runRejectVO.remark = props.currJob.comment
|
||||
props.currJob.runRejectVO = form.runRejectVO;
|
||||
form.runRejectVO.remark = props.currJob.comment;
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
$emit('onRejectJob', props.currJob)
|
||||
setTimeout(() => { // 异步异常
|
||||
loading.value = false
|
||||
}, 3000)
|
||||
} catch (e) {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
loading.value = true;
|
||||
try {
|
||||
$emit('onRejectJob', props.currJob);
|
||||
setTimeout(() => {
|
||||
// 异步异常
|
||||
loading.value = false;
|
||||
}, 3000);
|
||||
} catch (e) {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听双向绑定
|
||||
watch(
|
||||
() => props.currJob.id,
|
||||
(val) => {
|
||||
initJobData();
|
||||
}
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
initJobData();
|
||||
});
|
||||
// 监听双向绑定
|
||||
watch(
|
||||
() => props.currJob.id,
|
||||
(val) => {
|
||||
initJobData();
|
||||
}
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
initJobData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-dialog__footer {
|
||||
text-align: center;
|
||||
.el-dialog__footer {
|
||||
text-align: center;
|
||||
|
||||
.dialog-footer {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.dialog-footer {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,158 +1,156 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('runReject.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runReject.inputFlowInstIdTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('runReject.flowInstId')" prop="flowInstId" >
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('runReject.inputFlowInstIdTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.flowKey')" prop="flowKey">
|
||||
<el-select v-model="form.flowKey" :placeholder="t('runReject.inputFlowKeyTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowKey" :key="index" :label="item.flowName" :value="item.flowKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.flowKey')" prop="flowKey">
|
||||
<el-select v-model="form.flowKey" :placeholder="t('runReject.inputFlowKeyTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowKey" :key="index" :label="item.flowName" :value="item.flowKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.fromRunNodeId')" prop="fromRunNodeId">
|
||||
<el-select v-model="form.fromRunNodeId" :placeholder="t('runReject.inputFromRunNodeIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.fromRunNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.fromRunNodeId')" prop="fromRunNodeId">
|
||||
<el-select v-model="form.fromRunNodeId" :placeholder="t('runReject.inputFromRunNodeIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.fromRunNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.toRunNodeId')" prop="toRunNodeId">
|
||||
<el-select v-model="form.toRunNodeId" :placeholder="t('runReject.inputToRunNodeIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.toRunNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.toRunNodeId')" prop="toRunNodeId">
|
||||
<el-select v-model="form.toRunNodeId" :placeholder="t('runReject.inputToRunNodeIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.toRunNodeId" :key="index" :label="item.nodeName" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.status')" prop="status">
|
||||
<el-select v-model="form.status" :placeholder="t('runReject.inputStatusTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.REJECT_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.status')" prop="status">
|
||||
<el-select v-model="form.status" :placeholder="t('runReject.inputStatusTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.REJECT_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('runReject.inputRemarkTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('runReject.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :placeholder="t('runReject.inputRemarkTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="RunRejectDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/run-reject';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { rule } from '/@/utils/validate';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/run-reject'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { rule } from '/@/utils/validate';
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const cascadeDic = reactive({});
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['flowKey', 'fromRunNodeId', 'toRunNodeId'] });
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowKey: '',
|
||||
fromRunNodeId: '',
|
||||
toRunNodeId: '',
|
||||
status: '',
|
||||
});
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const cascadeDic = reactive({});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["flowKey", "fromRunNodeId", "toRunNodeId"]});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowKey: '',
|
||||
fromRunNodeId: '',
|
||||
toRunNodeId: '',
|
||||
status: '',
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
flowKey: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
|
||||
fromRunNodeId: [{ required: true, message: '来源节点名称不能为空', trigger: 'blur' }],
|
||||
toRunNodeId: [{ required: true, message: '到达节点名称不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
flowKey: [{required: true, message: '流程名称不能为空', trigger: 'blur'}],
|
||||
fromRunNodeId: [{required: true, message: '来源节点名称不能为空', trigger: 'blur'}],
|
||||
toRunNodeId: [{required: true, message: '到达节点名称不能为空', trigger: 'blur'}],
|
||||
status: [{required: true, message: '状态不能为空', trigger: 'blur'}],
|
||||
})
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取RunReject信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getRunRejectData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取RunReject信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getRunRejectData(id)
|
||||
}
|
||||
};
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getRunRejectData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onCascade(form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getRunRejectData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onCascade(form);
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,38 +1,37 @@
|
||||
export default {
|
||||
runReject: {
|
||||
index: '#',
|
||||
importrunRejectTip: 'import RunReject',
|
||||
id: 'id',
|
||||
flowKey: 'flowKey',
|
||||
fromFlowNodeId: 'fromFlowNodeId',
|
||||
toFlowNodeId: 'toFlowNodeId',
|
||||
handleUserId: 'handleUserId',
|
||||
status: 'status',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
defFlowId: 'defFlowId',
|
||||
flowInstId: 'flowInstId',
|
||||
fromRunNodeId: 'fromRunNodeId',
|
||||
fromRunJobId: 'fromRunJobId',
|
||||
toRunNodeId: 'toRunNodeId',
|
||||
toRunJobId: 'toRunJobId',
|
||||
remark: 'remark',
|
||||
runReject: {
|
||||
index: '#',
|
||||
importrunRejectTip: 'import RunReject',
|
||||
id: 'id',
|
||||
flowKey: 'flowKey',
|
||||
fromFlowNodeId: 'fromFlowNodeId',
|
||||
toFlowNodeId: 'toFlowNodeId',
|
||||
handleUserId: 'handleUserId',
|
||||
status: 'status',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
defFlowId: 'defFlowId',
|
||||
flowInstId: 'flowInstId',
|
||||
fromRunNodeId: 'fromRunNodeId',
|
||||
fromRunJobId: 'fromRunJobId',
|
||||
toRunNodeId: 'toRunNodeId',
|
||||
toRunJobId: 'toRunJobId',
|
||||
remark: 'remark',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputFromFlowNodeIdTip: 'input fromFlowNodeId',
|
||||
inputToFlowNodeIdTip: 'input toFlowNodeId',
|
||||
inputHandleUserIdTip: 'input handleUserId',
|
||||
inputStatusTip: 'input status',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFromRunNodeIdTip: 'input fromRunNodeId',
|
||||
inputFromRunJobIdTip: 'input fromRunJobId',
|
||||
inputToRunNodeIdTip: 'input toRunNodeId',
|
||||
inputToRunJobIdTip: 'input toRunJobId',
|
||||
inputRemarkTip: 'input remark',
|
||||
|
||||
}
|
||||
}
|
||||
inputIdTip: 'input id',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputFromFlowNodeIdTip: 'input fromFlowNodeId',
|
||||
inputToFlowNodeIdTip: 'input toFlowNodeId',
|
||||
inputHandleUserIdTip: 'input handleUserId',
|
||||
inputStatusTip: 'input status',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
inputDefFlowIdTip: 'input defFlowId',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFromRunNodeIdTip: 'input fromRunNodeId',
|
||||
inputFromRunJobIdTip: 'input fromRunJobId',
|
||||
inputToRunNodeIdTip: 'input toRunNodeId',
|
||||
inputToRunJobIdTip: 'input toRunJobId',
|
||||
inputRemarkTip: 'input remark',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,38 +1,37 @@
|
||||
export default {
|
||||
runReject: {
|
||||
index: '#',
|
||||
importrunRejectTip: '导入驳回任务记录',
|
||||
id: ' id',
|
||||
flowKey: '流程名称',
|
||||
fromFlowNodeId: '来源节点名称',
|
||||
toFlowNodeId: '到达节点名称',
|
||||
handleUserId: '指定被驳回人',
|
||||
status: '状态',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
defFlowId: '流程名称',
|
||||
flowInstId: '流程实例ID',
|
||||
fromRunNodeId: '来源节点名称',
|
||||
fromRunJobId: '来源任务名称',
|
||||
toRunNodeId: '到达节点名称',
|
||||
toRunJobId: '达到任务名称',
|
||||
remark: '驳回意见',
|
||||
runReject: {
|
||||
index: '#',
|
||||
importrunRejectTip: '导入驳回任务记录',
|
||||
id: ' id',
|
||||
flowKey: '流程名称',
|
||||
fromFlowNodeId: '来源节点名称',
|
||||
toFlowNodeId: '到达节点名称',
|
||||
handleUserId: '指定被驳回人',
|
||||
status: '状态',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
defFlowId: '流程名称',
|
||||
flowInstId: '流程实例ID',
|
||||
fromRunNodeId: '来源节点名称',
|
||||
fromRunJobId: '来源任务名称',
|
||||
toRunNodeId: '到达节点名称',
|
||||
toRunJobId: '达到任务名称',
|
||||
remark: '驳回意见',
|
||||
|
||||
inputIdTip: '请输入ID',
|
||||
inputFlowKeyTip: '请输入流程名称',
|
||||
inputFromFlowNodeIdTip: '请输入来源节点名称',
|
||||
inputToFlowNodeIdTip: '请输入到达节点名称',
|
||||
inputHandleUserIdTip: '请输入指定被驳回人',
|
||||
inputStatusTip: '请输入节点状态',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputDefFlowIdTip: '请输入流程定义ID',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFromRunNodeIdTip: '请输入来源节点名称',
|
||||
inputFromRunJobIdTip: '请输入来源任务名称',
|
||||
inputToRunNodeIdTip: '请输入到达节点名称',
|
||||
inputToRunJobIdTip: '请输入达到任务名称',
|
||||
inputRemarkTip: '请输入驳回意见',
|
||||
|
||||
}
|
||||
}
|
||||
inputIdTip: '请输入ID',
|
||||
inputFlowKeyTip: '请输入流程名称',
|
||||
inputFromFlowNodeIdTip: '请输入来源节点名称',
|
||||
inputToFlowNodeIdTip: '请输入到达节点名称',
|
||||
inputHandleUserIdTip: '请输入指定被驳回人',
|
||||
inputStatusTip: '请输入节点状态',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
inputDefFlowIdTip: '请输入流程定义ID',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFromRunNodeIdTip: '请输入来源节点名称',
|
||||
inputFromRunJobIdTip: '请输入来源任务名称',
|
||||
inputToRunNodeIdTip: '请输入到达节点名称',
|
||||
inputToRunJobIdTip: '请输入达到任务名称',
|
||||
inputRemarkTip: '请输入驳回意见',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,132 +1,127 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runReject.flowInstId')" prop="flowInstId" >
|
||||
<el-input :placeholder="t('runReject.inputFlowInstIdTip')" v-model="state.queryForm.flowInstId"
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runReject.status')" prop="status" >
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runReject.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.REJECT_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar v-model:showSearch="showSearch" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('runReject.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('runReject.flowInstId')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowKey" :label="t('runReject.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey"
|
||||
:valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="fromRunNodeId" :label="t('runReject.fromRunNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.fromRunNodeId" :value="scope.row.fromRunNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="toRunNodeId" :label="t('runReject.toRunNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.toRunNodeId" :value="scope.row.toRunNodeId"
|
||||
:valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="t('runReject.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.REJECT_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" :label="t('runReject.remark')" show-overflow-tooltip/>
|
||||
<el-table-column prop="createUser" :label="t('runReject.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('runReject.createTime')" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" width="80">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('runReject.flowInstId')" prop="flowInstId">
|
||||
<el-input :placeholder="t('runReject.inputFlowInstIdTip')" v-model="state.queryForm.flowInstId" style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('runReject.status')" prop="status">
|
||||
<el-select v-model="state.queryForm.status" :placeholder="t('runReject.inputStatusTip')" clearable filterable style="max-width: 180px">
|
||||
<el-option v-for="(item, index) in DIC_PROP.REJECT_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('runReject.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('runReject.flowInstId')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowKey" :label="t('runReject.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey" :valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="fromRunNodeId" :label="t('runReject.fromRunNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name
|
||||
:options="state.dicData.fromRunNodeId"
|
||||
:value="scope.row.fromRunNodeId"
|
||||
:valueKey="'id'"
|
||||
:showKey="'nodeName'"
|
||||
></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="toRunNodeId" :label="t('runReject.toRunNodeId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.toRunNodeId" :value="scope.row.toRunNodeId" :valueKey="'id'" :showKey="'nodeName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="t('runReject.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.REJECT_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" :label="t('runReject.remark')" show-overflow-tooltip />
|
||||
<el-table-column prop="createUser" :label="t('runReject.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('runReject.createTime')" show-overflow-tooltip />
|
||||
<el-table-column :label="$t('common.action')" width="80">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemRunReject">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/run-reject";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/run-reject';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onLoadDicUrl, onLoaded} from "/@/flow/components/convert-name/convert";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoadDicUrl, onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n()
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({key: "createUser"}, {key: "flowInstId"}, {key: "fromRunNodeId"}, {key: "toRunNodeId"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({ key: 'createUser' }, { key: 'flowInstId' }, { key: 'fromRunNodeId' }, { key: 'toRunNodeId' }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
} = useTable(state)
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
getDataList()
|
||||
}
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
getDataList();
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -1,67 +1,80 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('tabsOption.formName')" prop="formName" >
|
||||
<el-input :placeholder="t('tabsOption.inputFormNameTip')" v-model="state.queryForm.formName" clearable
|
||||
style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.oneBtnDesign') }}
|
||||
</template>
|
||||
<el-button v-auth="'jsonflow_tabsoption_add'" type="primary" class="ml10" icon="Pointer"
|
||||
@click="handleDesignTabs(true)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('tabsOption.formName')" prop="formName">
|
||||
<el-input :placeholder="t('tabsOption.inputFormNameTip')" v-model="state.queryForm.formName" clearable style="max-width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.oneBtnDesign') }}
|
||||
</template>
|
||||
<el-button v-auth="'jsonflow_tabsoption_add'" type="primary" class="ml10" icon="Pointer" @click="handleDesignTabs(true)"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')"
|
||||
v-auth="'jsonflow_tabsoption_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.addBtn') }}
|
||||
</template>
|
||||
<el-button icon="Plus" type="primary" class="ml10" @click="formDialogRef.openDialog('add')" v-auth="'jsonflow_tabsoption_add'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
|
||||
v-auth="'jsonflow_tabsoption_del'" @click="handleDelete(selectObjs)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
v-auth="'jsonflow_tabsoption_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_tabsoption_export'"
|
||||
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('tabsOption.index')" width="60" />
|
||||
<el-table-column prop="icon" :label="t('tabsOption.icon')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<SvgIcon :name="scope.row.icon" :size="20" color="#409EFF"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="formName" :label="t('tabsOption.formName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="groupName" :label="t('tabsOption.groupName')" show-overflow-tooltip/>
|
||||
<el-table-column prop="path" :label="t('tabsOption.path')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="isActive" :label="t('tabsOption.isActive')" show-overflow-tooltip>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_tabsoption_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('tabsOption.index')" width="60" />
|
||||
<el-table-column prop="icon" :label="t('tabsOption.icon')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<SvgIcon :name="scope.row.icon" :size="20" color="#409EFF" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="formName" :label="t('tabsOption.formName')" show-overflow-tooltip />
|
||||
<el-table-column prop="groupName" :label="t('tabsOption.groupName')" show-overflow-tooltip />
|
||||
<el-table-column prop="path" :label="t('tabsOption.path')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="isActive" :label="t('tabsOption.isActive')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.isActive"></dict-tag>
|
||||
</template>
|
||||
@@ -71,228 +84,225 @@
|
||||
<dict-tag :options="DIC_PROP.YES_OR_NO" :value="scope.row.isAutoAudit"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>-->
|
||||
<el-table-column prop="type" :label="t('tabsOption.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="t('tabsOption.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.TEMP_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sort" :label="t('tabsOption.sort')" show-overflow-tooltip/>
|
||||
<el-table-column prop="version" :label="t('tabsOption.version')" show-overflow-tooltip/>
|
||||
<!-- <el-table-column prop="createTime" :label="t('tabsOption.createTime')" show-overflow-tooltip/>-->
|
||||
<el-table-column :label="$t('common.action')" width="180">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)" v-auth="'jsonflow_tabsoption_view'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" v-auth="'jsonflow_tabsoption_edit'" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" v-auth="'jsonflow_tabsoption_del'" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.printTemplate') }}
|
||||
</template>
|
||||
<el-button icon="Document" text type="primary" @click="handlePrintTemplate(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-table-column prop="type" :label="t('tabsOption.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.FORM_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="t('tabsOption.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.TEMP_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sort" :label="t('tabsOption.sort')" show-overflow-tooltip />
|
||||
<el-table-column prop="version" :label="t('tabsOption.version')" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="createTime" :label="t('tabsOption.createTime')" show-overflow-tooltip/>-->
|
||||
<el-table-column :label="$t('common.action')" width="180">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)" v-auth="'jsonflow_tabsoption_view'">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button
|
||||
icon="edit-pen"
|
||||
text
|
||||
type="primary"
|
||||
v-auth="'jsonflow_tabsoption_edit'"
|
||||
@click="formDialogRef.openDialog('edit', scope.row.id)"
|
||||
>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" v-auth="'jsonflow_tabsoption_del'" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.printTemplate') }}
|
||||
</template>
|
||||
<el-button icon="Document" text type="primary" @click="handlePrintTemplate(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top" v-if="scope.row.formInfo">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.viewPageBtn') }}
|
||||
</template>
|
||||
<el-button icon="ZoomIn" text type="primary" @click="openPreview(scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" v-if="scope.row.formInfo">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.viewPageBtn') }}
|
||||
</template>
|
||||
<el-button icon="ZoomIn" text type="primary" @click="openPreview(scope.row)"> </el-button>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.onceMoreDesign') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="Pointer" v-auth="'jsonflow_tabsoption_edit'"
|
||||
@click.native="handleDesignTabs(true, scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('jfI18n.onceMoreDesign') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="Pointer" v-auth="'jsonflow_tabsoption_edit'" @click.native="handleDesignTabs(true, scope.row)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
|
||||
<!-- 表单设计 -->
|
||||
<el-drawer
|
||||
class="flow-overflow-drawer" direction="rtl"
|
||||
append-to-body size="100%"
|
||||
v-model="data.showDesignTabs"
|
||||
:with-header="false">
|
||||
<tabs-form-design v-if="data.showDesignTabs" :currFlowForm="data.currFlowForm" @handleDesignTabs="handleDesignTabs"></tabs-form-design>
|
||||
</el-drawer>
|
||||
<!-- 表单设计 -->
|
||||
<el-drawer class="flow-overflow-drawer" direction="rtl" append-to-body size="100%" v-model="data.showDesignTabs" :with-header="false">
|
||||
<tabs-form-design v-if="data.showDesignTabs" :currFlowForm="data.currFlowForm" @handleDesignTabs="handleDesignTabs"></tabs-form-design>
|
||||
</el-drawer>
|
||||
|
||||
<!-- 查看表单 -->
|
||||
<el-dialog v-model="data.showViewOrder" top="20px" width="80%"
|
||||
title="查看表单" append-to-body>
|
||||
<form-render :currFlowForm="data.currFlowForm" v-if="data.showViewOrder" :renderType="'-1'"></form-render>
|
||||
</el-dialog>
|
||||
<!-- 查看表单 -->
|
||||
<el-dialog v-model="data.showViewOrder" top="20px" width="80%" title="查看表单" append-to-body>
|
||||
<form-render :currFlowForm="data.currFlowForm" v-if="data.showViewOrder" :renderType="'-1'"></form-render>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 打印模板设计器 -->
|
||||
<el-drawer class="tinymce-print-drawer" append-to-body direction="rtl"
|
||||
v-model="data.showTinymceEditor" size="100%"
|
||||
:title="data.tinymceTitle" @close="getDataList">
|
||||
<tinymce-editor v-if="data.showTinymceEditor" :currFlowForm="data.currFlowForm"></tinymce-editor>
|
||||
</el-drawer>
|
||||
</div>
|
||||
<!-- 打印模板设计器 -->
|
||||
<el-drawer
|
||||
class="tinymce-print-drawer"
|
||||
append-to-body
|
||||
direction="rtl"
|
||||
v-model="data.showTinymceEditor"
|
||||
size="100%"
|
||||
:title="data.tinymceTitle"
|
||||
@close="getDataList"
|
||||
>
|
||||
<tinymce-editor v-if="data.showTinymceEditor" :currFlowForm="data.currFlowForm"></tinymce-editor>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemTabsOption">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs, putObj } from "/@/api/order/flow-application";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs, putObj } from '/@/api/order/flow-application';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import other from '/@/utils/other';
|
||||
import {parseWithFunctions} from "/@/flow";
|
||||
import {utils} from "/@/flow/designer/utils/common";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import other from '/@/utils/other';
|
||||
import { parseWithFunctions } from '/@/flow';
|
||||
import { utils } from '/@/flow/designer/utils/common';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('/@/flow/components/tabs-option/form.vue'));
|
||||
const TabsFormDesign = defineAsyncComponent(() => import('/@/flow/components/tabs-option/design.vue'));
|
||||
const FormRender = defineAsyncComponent(() => import('/@/flow/components/form-create/render.vue'));
|
||||
const TinymceEditor = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceEditor.vue'));
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('/@/flow/components/tabs-option/form.vue'));
|
||||
const TabsFormDesign = defineAsyncComponent(() => import('/@/flow/components/tabs-option/design.vue'));
|
||||
const FormRender = defineAsyncComponent(() => import('/@/flow/components/form-create/render.vue'));
|
||||
const TinymceEditor = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceEditor.vue'));
|
||||
|
||||
const { t } = useI18n()
|
||||
// 定义查询字典
|
||||
const { t } = useI18n();
|
||||
// 定义查询字典
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any;
|
||||
const multiple = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
// 清空多选
|
||||
selectObjs.value = [];
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/order/flow-application/export', state.queryForm, 'flow-application.xlsx')
|
||||
}
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile('/order/flow-application/export', state.queryForm, 'flow-application.xlsx');
|
||||
};
|
||||
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
// 多选事件
|
||||
const handleSelectionChange = (objs: any) => {
|
||||
selectObjs.value = objs.map(({ id }) => id);
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
|
||||
const data = reactive({
|
||||
showDesignTabs: false,
|
||||
showViewOrder: false,
|
||||
currFlowForm: {},
|
||||
showTinymceEditor: false,
|
||||
tinymceTitle: '',
|
||||
})
|
||||
const data = reactive({
|
||||
showDesignTabs: false,
|
||||
showViewOrder: false,
|
||||
currFlowForm: {},
|
||||
showTinymceEditor: false,
|
||||
tinymceTitle: '',
|
||||
});
|
||||
|
||||
function handlePrintTemplate(row) {
|
||||
data.currFlowForm = {id: row.id, formType: row.type, formId: row.id, formName: row.formName, path: row.path, isForm: true}
|
||||
data.currFlowForm.formInfo = row.formInfo
|
||||
data.tinymceTitle = "打印模板设计器（自定义《" + row.formName + "》打印格式）"
|
||||
data.showTinymceEditor = true
|
||||
}
|
||||
function handlePrintTemplate(row) {
|
||||
data.currFlowForm = { id: row.id, formType: row.type, formId: row.id, formName: row.formName, path: row.path, isForm: true };
|
||||
data.currFlowForm.formInfo = row.formInfo;
|
||||
data.tinymceTitle = '打印模板设计器（自定义《' + row.formName + '》打印格式）';
|
||||
data.showTinymceEditor = true;
|
||||
}
|
||||
|
||||
// 一键设计
|
||||
const handleDesignTabs = async (bool: boolean, row?: any) => {
|
||||
data.showDesignTabs = bool
|
||||
if (bool === false) {
|
||||
getDataList()
|
||||
return
|
||||
}
|
||||
if (row) {
|
||||
data.currFlowForm = other.deepClone(row)
|
||||
data.currFlowForm.formInfo = parseWithFunctions(row.formInfo, true)
|
||||
data.currFlowForm.active = "tabsSetting";
|
||||
} else {
|
||||
data.currFlowForm = {
|
||||
id: utils.getId(),
|
||||
active: 'tabsSetting',
|
||||
icon: 'iconfont icon-shuxingtu',
|
||||
formName: '未命名',
|
||||
type: '0',
|
||||
isActive: '1',
|
||||
isAutoAudit: '0',
|
||||
status: '-1',
|
||||
version: 1,
|
||||
isNew: true,
|
||||
sort: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
// 查看表单
|
||||
const openPreview = async (row: any) => {
|
||||
data.currFlowForm = other.deepClone(row)
|
||||
data.showViewOrder = true
|
||||
}
|
||||
// 一键设计
|
||||
const handleDesignTabs = async (bool: boolean, row?: any) => {
|
||||
data.showDesignTabs = bool;
|
||||
if (bool === false) {
|
||||
getDataList();
|
||||
return;
|
||||
}
|
||||
if (row) {
|
||||
data.currFlowForm = other.deepClone(row);
|
||||
data.currFlowForm.formInfo = parseWithFunctions(row.formInfo, true);
|
||||
data.currFlowForm.active = 'tabsSetting';
|
||||
} else {
|
||||
data.currFlowForm = {
|
||||
id: utils.getId(),
|
||||
active: 'tabsSetting',
|
||||
icon: 'iconfont icon-shuxingtu',
|
||||
formName: '未命名',
|
||||
type: '0',
|
||||
isActive: '1',
|
||||
isAutoAudit: '0',
|
||||
status: '-1',
|
||||
version: 1,
|
||||
isNew: true,
|
||||
sort: 1,
|
||||
};
|
||||
}
|
||||
};
|
||||
// 查看表单
|
||||
const openPreview = async (row: any) => {
|
||||
data.currFlowForm = other.deepClone(row);
|
||||
data.showViewOrder = true;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "../../../flow/components/style/flow-drawer.scss";
|
||||
@import '../../../flow/components/style/flow-drawer.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,168 +1,166 @@
|
||||
<template>
|
||||
<el-dialog :title="title" v-model="visible" width="60%"
|
||||
:close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="90px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('wsNotice.flowInstId')" prop="flowInstId" >
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('wsNotice.inputFlowInstIdTip')" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-dialog :title="title" v-model="visible" width="60%" :close-on-click-modal="false" draggable>
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="90px" v-loading="loading" :disabled="operType === 'view'">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="$t('wsNotice.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="form.flowInstId" :placeholder="t('wsNotice.inputFlowInstIdTip')" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.flowKey')" prop="flowKey">
|
||||
<el-select v-model="form.flowKey" :placeholder="t('wsNotice.inputFlowKeyTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowKey" :key="index" :label="item.flowName" :value="item.flowKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.flowKey')" prop="flowKey">
|
||||
<el-select v-model="form.flowKey" :placeholder="t('wsNotice.inputFlowKeyTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in cascadeDic.flowKey" :key="index" :label="item.flowName" :value="item.flowKey"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.userId')" prop="userId">
|
||||
<el-select v-model="form.userId" :placeholder="t('wsNotice.inputUserIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in dicData.userId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.userId')" prop="userId">
|
||||
<el-select v-model="form.userId" :placeholder="t('wsNotice.inputUserIdTip')" clearable filterable disabled>
|
||||
<el-option v-for="(item, index) in dicData.userId" :key="index" :label="item.name" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.type')" prop="type">
|
||||
<el-radio-group v-model="form.type">
|
||||
<el-radio :label="item.value" v-for="(item, index) in DIC_PROP.MSG_TYPE" :key="index">{{ item.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.type')" prop="type">
|
||||
<el-radio-group v-model="form.type">
|
||||
<el-radio :label="item.value" v-for="(item, index) in DIC_PROP.MSG_TYPE" :key="index">{{ item.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.jobType')" prop="jobType">
|
||||
<el-select v-model="form.jobType" :placeholder="t('wsNotice.inputJobTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_MSG_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.jobType')" prop="jobType">
|
||||
<el-select v-model="form.jobType" :placeholder="t('wsNotice.inputJobTypeTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.JOB_MSG_TYPE" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.status')" prop="status">
|
||||
<el-select v-model="form.status" :placeholder="t('wsNotice.inputStatusTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.NOTICE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.status')" prop="status">
|
||||
<el-select v-model="form.status" :placeholder="t('wsNotice.inputStatusTip')" clearable filterable>
|
||||
<el-option v-for="(item, index) in DIC_PROP.NOTICE_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.data')" prop="data">
|
||||
<el-input v-model="form.data" type="textarea" :placeholder="t('wsNotice.inputDataTip')"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item :label="t('wsNotice.data')" prop="data">
|
||||
<el-input v-model="form.data" type="textarea" :placeholder="t('wsNotice.inputDataTip')" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer v-if="operType !== 'view'">
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="WsNoticeDialog">
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/ws-notice';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { rule } from '/@/utils/validate';
|
||||
import { onCascadeChange, onLoadDicUrl } from '/@/flow/components/convert-name/convert';
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/jsonflow/ws-notice'
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { rule } from '/@/utils/validate';
|
||||
import {onCascadeChange, onLoadDicUrl} from "/@/flow/components/convert-name/convert";
|
||||
const emit = defineEmits(['refresh']);
|
||||
const { t } = useI18n();
|
||||
|
||||
const { t } = useI18n();
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({ key: 'userId' });
|
||||
const onCascade = onCascadeChange(cascadeDic, { key: 'flowInstId', cascades: ['flowKey'] });
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowKey: '',
|
||||
userId: '',
|
||||
type: '',
|
||||
jobType: '',
|
||||
status: '',
|
||||
data: '',
|
||||
});
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const operType = ref(false);
|
||||
const title = ref('');
|
||||
// 定义字典
|
||||
const dicData = reactive({});
|
||||
const cascadeDic = reactive({});
|
||||
const onLoad = onLoadDicUrl({key: "userId"});
|
||||
const onCascade = onCascadeChange(cascadeDic, {key: "flowInstId", cascades: ["flowKey"]});
|
||||
onMounted(() => {
|
||||
onLoad(dicData);
|
||||
});
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
flowKey: '',
|
||||
userId: '',
|
||||
type: '',
|
||||
jobType: '',
|
||||
status: '',
|
||||
data: '',
|
||||
});
|
||||
// 定义校验规则
|
||||
const dataRules = ref({});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
})
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true;
|
||||
operType.value = type;
|
||||
form.id = '';
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (type: string, id: string) => {
|
||||
visible.value = true
|
||||
operType.value = type;
|
||||
form.id = ''
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
|
||||
if (type === 'add') {
|
||||
title.value = t('common.addBtn');
|
||||
} else if (type === 'edit') {
|
||||
title.value = t('common.editBtn');
|
||||
} else if (type === 'view') {
|
||||
title.value = t('common.viewBtn');
|
||||
}
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 重置表单数据
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 获取WsNotice信息
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getWsNoticeData(id);
|
||||
}
|
||||
};
|
||||
|
||||
// 获取WsNotice信息
|
||||
if (id) {
|
||||
form.id = id
|
||||
getWsNoticeData(id)
|
||||
}
|
||||
};
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
form.id ? await putObj(form) : await addObj(form);
|
||||
useMessage().success(t(form.id ? 'common.editSuccessText' : 'common.addSuccessText'));
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
// 初始化表单数据
|
||||
const getWsNoticeData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
Object.assign(form, res.data);
|
||||
onCascade(form);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 初始化表单数据
|
||||
const getWsNoticeData = (id: string) => {
|
||||
// 获取数据
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
Object.assign(form, res.data)
|
||||
onCascade(form)
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
};
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
});
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,28 +1,27 @@
|
||||
export default {
|
||||
wsNotice: {
|
||||
index: '#',
|
||||
importwsNoticeTip: 'import WsNotice',
|
||||
id: 'id',
|
||||
flowInstId: 'flowInstId',
|
||||
flowKey: 'flowKey',
|
||||
userId: 'userId',
|
||||
type: 'type',
|
||||
jobType: 'jobType',
|
||||
status: 'status',
|
||||
data: 'data',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputUserIdTip: 'input userId',
|
||||
inputTypeTip: 'input type',
|
||||
inputJobTypeTip: 'input jobType',
|
||||
inputStatusTip: 'input status',
|
||||
inputDataTip: 'input data',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
|
||||
}
|
||||
}
|
||||
wsNotice: {
|
||||
index: '#',
|
||||
importwsNoticeTip: 'import WsNotice',
|
||||
id: 'id',
|
||||
flowInstId: 'flowInstId',
|
||||
flowKey: 'flowKey',
|
||||
userId: 'userId',
|
||||
type: 'type',
|
||||
jobType: 'jobType',
|
||||
status: 'status',
|
||||
data: 'data',
|
||||
createUser: 'createUser',
|
||||
createTime: 'createTime',
|
||||
|
||||
inputIdTip: 'input id',
|
||||
inputFlowInstIdTip: 'input flowInstId',
|
||||
inputFlowKeyTip: 'input flowKey',
|
||||
inputUserIdTip: 'input userId',
|
||||
inputTypeTip: 'input type',
|
||||
inputJobTypeTip: 'input jobType',
|
||||
inputStatusTip: 'input status',
|
||||
inputDataTip: 'input data',
|
||||
inputCreateUserTip: 'input createUser',
|
||||
inputCreateTimeTip: 'input createTime',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,28 +1,27 @@
|
||||
export default {
|
||||
wsNotice: {
|
||||
index: '#',
|
||||
importwsNoticeTip: '导入消息通知管理',
|
||||
id: 'ID',
|
||||
flowInstId: '流程实例ID',
|
||||
flowKey: '流程名称',
|
||||
userId: '通知人',
|
||||
type: '消息类型',
|
||||
jobType: '任务类型',
|
||||
status: '通知状态',
|
||||
data: '消息数据',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
|
||||
inputIdTip: '请输入ID',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFlowKeyTip: '请选择流程名称',
|
||||
inputUserIdTip: '请输入通知人',
|
||||
inputTypeTip: '请输入消息类型',
|
||||
inputJobTypeTip: '请输入任务类型',
|
||||
inputStatusTip: '请输入通知状态',
|
||||
inputDataTip: '请输入消息数据',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
|
||||
}
|
||||
}
|
||||
wsNotice: {
|
||||
index: '#',
|
||||
importwsNoticeTip: '导入消息通知管理',
|
||||
id: 'ID',
|
||||
flowInstId: '流程实例ID',
|
||||
flowKey: '流程名称',
|
||||
userId: '通知人',
|
||||
type: '消息类型',
|
||||
jobType: '任务类型',
|
||||
status: '通知状态',
|
||||
data: '消息数据',
|
||||
createUser: '创建人',
|
||||
createTime: '创建时间',
|
||||
|
||||
inputIdTip: '请输入ID',
|
||||
inputFlowInstIdTip: '请输入流程实例ID',
|
||||
inputFlowKeyTip: '请选择流程名称',
|
||||
inputUserIdTip: '请输入通知人',
|
||||
inputTypeTip: '请输入消息类型',
|
||||
inputJobTypeTip: '请输入任务类型',
|
||||
inputStatusTip: '请输入通知状态',
|
||||
inputDataTip: '请输入消息数据',
|
||||
inputCreateUserTip: '请输入创建人',
|
||||
inputCreateTimeTip: '请输入创建时间',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,155 +1,146 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('wsNotice.flowInstId')" prop="flowInstId" >
|
||||
<el-input v-model="state.queryForm.flowInstId" :placeholder="t('wsNotice.inputFlowInstIdTip')"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar v-model:showSearch="showSearch" :export="'jsonflow_wsnotice_export'"
|
||||
class="ml10" style="float: right;margin-right: 20px"
|
||||
@queryTable="getDataList"></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('wsNotice.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('wsNotice.flowInstId')" show-overflow-tooltip/>
|
||||
<el-table-column prop="flowKey" :label="t('wsNotice.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey"
|
||||
:valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('wsNotice.userId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="type" :label="t('wsNotice.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.MSG_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobType" :label="t('wsNotice.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_MSG_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="t('wsNotice.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NOTICE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="data" type="textarea" :label="t('wsNotice.data')" show-overflow-tooltip/>
|
||||
<el-table-column prop="createUser" :label="t('wsNotice.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
|
||||
:valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('wsNotice.createTime')" show-overflow-tooltip/>
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item :label="$t('wsNotice.flowInstId')" prop="flowInstId">
|
||||
<el-input v-model="state.queryForm.flowInstId" :placeholder="t('wsNotice.inputFlowInstIdTip')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">
|
||||
{{ $t('common.queryBtn') }}
|
||||
</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'jsonflow_wsnotice_export'"
|
||||
class="ml10"
|
||||
style="float: right; margin-right: 20px"
|
||||
@queryTable="getDataList"
|
||||
></right-toolbar>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%" @sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" :label="t('wsNotice.index')" width="40" />
|
||||
<el-table-column prop="flowInstId" :label="t('wsNotice.flowInstId')" show-overflow-tooltip />
|
||||
<el-table-column prop="flowKey" :label="t('wsNotice.flowKey')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.flowInstId" :value="scope.row.flowKey" :valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="userId" :label="t('wsNotice.userId')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.userId" :value="scope.row.userId" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="type" :label="t('wsNotice.type')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.MSG_TYPE" :value="scope.row.type"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobType" :label="t('wsNotice.jobType')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.JOB_MSG_TYPE" :value="scope.row.jobType"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="t('wsNotice.status')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<dict-tag :options="DIC_PROP.NOTICE_STATUS" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="data" type="textarea" :label="t('wsNotice.data')" show-overflow-tooltip />
|
||||
<el-table-column prop="createUser" :label="t('wsNotice.createUser')" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser" :valueKey="'userId'" :showKey="'name'"></convert-name>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" :label="t('wsNotice.createTime')" show-overflow-tooltip />
|
||||
<el-table-column :label="$t('common.action')" width="100">
|
||||
<template #default="scope">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.viewBtn') }}
|
||||
</template>
|
||||
<el-button text type="primary" icon="view" @click="formDialogRef.openDialog('view', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.editBtn') }}
|
||||
</template>
|
||||
<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog('edit', scope.row.id)"> </el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('common.delBtn') }}
|
||||
</template>
|
||||
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])"> </el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemWsNotice">
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObjs } from "/@/api/jsonflow/ws-notice";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObjs } from '/@/api/jsonflow/ws-notice';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {onLoaded} from "/@/flow/components/convert-name/convert";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onLoaded } from '/@/flow/components/convert-name/convert';
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n()
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const { t } = useI18n();
|
||||
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 定义变量内容
|
||||
const formDialogRef = ref();
|
||||
// 搜索变量
|
||||
const queryRef = ref();
|
||||
const showSearch = ref(true);
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({key: "createUser"}, {key: "userId"}, {key: "flowInstId"}),
|
||||
descs: ["create_time"]
|
||||
})
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
onLoaded: onLoaded({ key: 'createUser' }, { key: 'userId' }, { key: 'flowInstId' }),
|
||||
descs: ['create_time'],
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
downBlobFile
|
||||
} = useTable(state)
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile } = useTable(state);
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
getDataList()
|
||||
}
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields();
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm(t('common.delConfirmText'));
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
try {
|
||||
await delObjs(ids);
|
||||
getDataList();
|
||||
useMessage().success(t('common.delSuccessText'));
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user