Преглед изворни кода

增加规则编排列表页面的增删改查,及编辑操作到规则引擎的跳转

yanglzh пре 3 година
родитељ
комит
7a9c402baa

+ 14 - 0
src/api/rule/index.ts

@@ -0,0 +1,14 @@
+import { get, del, post, put } from '/@/utils/request';
+
+export default {
+  // 添加规则实例管理
+  detail: (id: string) => get('/rule-engine/instance/get', { id }),
+  // 获取规则实例管理列表
+  getList: (data: object) => get('/rule-engine/instance/list', data),
+  // 删除规则实例管理
+  del: (ids: string[]) => del('/rule-engine/instance/delete', { ids }),
+  // 添加规则实例管理
+  add: (data: any) => post('/rule-engine/instance/add', data),
+  // 编辑规则实例管理
+  edit: (data: any) => put('/rule-engine/instance/edit', data),
+}

+ 98 - 0
src/views/rule-engine/edit.vue

@@ -0,0 +1,98 @@
+<template>
+	<el-dialog
+		class="api-edit"
+		v-model="showDialog"
+		:title="`${formData.id ? '编辑规则' : '新增规则'}`"
+		width="600px"
+		:close-on-click-modal="false"
+		:close-on-press-escape="false"
+	>
+		<el-form ref="formRef" :model="formData" :rules="ruleForm" label-width="80px">
+			<el-form-item label="规则名称" prop="name">
+				<el-input v-model="formData.name" placeholder="输入接口名称" />
+			</el-form-item>
+			<el-form-item label="说明" prop="expound">
+				<el-input v-model="formData.expound" type="textarea" :rows="3" />
+			</el-form-item>
+		</el-form>
+		<template #footer>
+			<div class="dialog-footer">
+				<el-button @click="showDialog = false">取消</el-button>
+				<el-button type="primary" @click="onSubmit">确定</el-button>
+			</div>
+		</template>
+	</el-dialog>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive, nextTick } from 'vue';
+import api from '/@/api/rule';
+import axios from 'axios';
+import { ruleRequired } from '/@/utils/validator';
+import { ElMessage } from 'element-plus';
+
+const emit = defineEmits(['getList']);
+
+const showDialog = ref(false);
+const formRef = ref();
+
+const baseForm = {
+	id: undefined,
+	name: '',
+	types: 0,
+	flowId: '',
+	expound: '',
+};
+
+const formData = reactive({
+	...baseForm,
+});
+
+const ruleForm = {
+	name: [ruleRequired('规则名称不能为空')],
+};
+
+const onSubmit = async () => {
+  await formRef.value.validate();
+
+	if (!formData.id) {
+		const { data } = await axios.post(
+			window.location.hostname + ':1880/flow',
+			{
+				label: formData.name,
+				nodes: [],
+			},
+			{
+				headers: {
+					Authorization: 'Bearer ' + JSON.parse(sessionStorage.token),
+				},
+			}
+		);
+    formData.flowId = data.id
+	}
+
+	const theApi = formData.id ? api.edit : api.add;
+
+	await theApi(formData);
+
+	ElMessage.success('操作成功');
+	resetForm();
+	showDialog.value = false;
+	emit('getList');
+};
+
+const resetForm = async () => {
+	Object.assign(formData, { ...baseForm });
+	formRef.value && formRef.value.resetFields();
+};
+
+const open = async (row: any) => {
+	resetForm();
+	showDialog.value = true;
+	nextTick(() => {
+		Object.assign(formData, { ...row });
+	});
+};
+
+defineExpose({ open });
+</script>

+ 84 - 0
src/views/rule-engine/index.vue

@@ -0,0 +1,84 @@
+<template>
+	<el-card shadow="hover">
+		<div class="search">
+			<el-form :inline="true">
+				<el-form-item>
+					<!-- <el-button size="default" type="primary" class="ml10" @click="getList(1)">
+							<el-icon>
+								<ele-Search />
+							</el-icon>
+							查询
+						</el-button> -->
+					<el-button type="success" @click="addOrEdit()">
+						<el-icon>
+							<ele-FolderAdd />
+						</el-icon>
+						新增规则编排
+					</el-button>
+				</el-form-item>
+			</el-form>
+		</div>
+		<el-table :data="tableData" style="width: 100%" v-loading="loading">
+			<el-table-column type="index" label="序号" width="80" align="center" />
+			<el-table-column prop="flowId" label="流程ID" show-overflow-tooltip></el-table-column>
+			<el-table-column prop="name" label="项目名称" show-overflow-tooltip></el-table-column>
+			<el-table-column prop="createdAt" label="创建时间" min-width="100" align="center"></el-table-column>
+			<el-table-column prop="status" label="状态" width="100" align="center">
+          <template #default="scope">
+            <el-tag type="success" size="small" v-if="scope.row.status==1">已启动</el-tag>
+            <el-tag type="info" size="small" v-else>已停止</el-tag>
+          </template>
+        </el-table-column>
+			<el-table-column label="操作" width="150" align="center">
+				<template #default="scope">
+					<!-- <el-button size="small" text type="primary" @click="preview(scope.row)">启动</el-button> -->
+					<el-button size="small" text type="warning" @click="edit(scope.row)">编辑</el-button>
+					<el-button size="small" text type="danger" @click="onDel(scope.row)">删除</el-button>
+				</template>
+			</el-table-column>
+		</el-table>
+		<pagination v-if="params.total" :total="params.total" v-model:page="params.pageNum" v-model:limit="params.pageSize" @pagination="getList()" />
+		<EditForm ref="editFormRef" @getList="getList()"></EditForm>
+	</el-card>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue';
+import api from '/@/api/rule';
+import { ElMessageBox, ElMessage } from 'element-plus';
+import { useSearch } from '/@/hooks/useCommon';
+import { Session } from '/@/utils/storage';
+import EditForm from './edit.vue';
+
+const editFormRef = ref();
+
+const { params, tableData, getList, loading } = useSearch<any[]>(api.getList, 'Data', { name: '', address: '' });
+
+getList();
+
+const addOrEdit = async (row?: any) => {
+	if (row) {
+		editFormRef.value.open(row);
+		return;
+	} else {
+		editFormRef.value.open();
+	}
+};
+
+const edit = async (row: any) => {
+	const url = window.location.hostname + ':1880/?access_token=' + Session.get('token') + '#/flow/' + row.flowId;
+	window.open(url);
+};
+
+const onDel = (row: any) => {
+	ElMessageBox.confirm(`此操作将删除:“${row.name}”,是否继续?`, '提示', {
+		confirmButtonText: '确认',
+		cancelButtonText: '取消',
+		type: 'warning',
+	}).then(async () => {
+		await api.del([row.id as string]);
+		ElMessage.success('删除成功');
+		getList();
+	});
+};
+</script>

+ 6 - 0
src/views/rule-engine/send.vue

@@ -0,0 +1,6 @@
+<template>
+	开发中...
+</template>
+
+<script lang="ts" setup>
+</script>

+ 2 - 2
src/views/screen/index.vue

@@ -18,7 +18,7 @@
 				</el-form-item>
 			</el-form>
 		</div>
-		<el-table :data="tableData" style="width: 100%">
+		<el-table :data="tableData" style="width: 100%" v-loading="loading">
 			<el-table-column type="index" label="序号" width="60" align="center" />
 			<el-table-column prop="id" label="ID" show-overflow-tooltip></el-table-column>
 			<el-table-column prop="projectName" label="项目名称" show-overflow-tooltip></el-table-column>
@@ -42,7 +42,7 @@ import { ElMessageBox, ElMessage } from 'element-plus';
 import { useSearch } from '/@/hooks/useCommon';
 import { Session } from '/@/utils/storage';
 
-const { params, tableData, getList } = useSearch<any[]>(api.getList, 'Data', { name: '', address: '' });
+const { params, tableData, getList, loading } = useSearch<any[]>(api.getList, 'Data', { name: '', address: '' });
 
 getList();
 

+ 1 - 0
src/views/system/org/index.vue

@@ -38,6 +38,7 @@
 				v-loading="tableData.loading"
 			>
 				<el-table-column prop="name" label="组织名称" show-overflow-tooltip> </el-table-column>
+				<el-table-column prop="number" label="组织编号" show-overflow-tooltip> </el-table-column>
 				<el-table-column prop="status" label="组织状态" align="center" min-width="120">
 					<template #default="scope">
 						<el-tag type="success" size="small" v-if="scope.row.status === 1">启用</el-tag>