hzya
/
middleground_code_v2
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

集成任务部署开发完成(curd)

This commit is contained in:
hyt 2024-05-08 08:56:31 +08:00
parent 97e527fc0b
commit 4f26dec9a4
3 changed files with 770 additions and 736 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/views/intergrationTask/compoments/baseMenuTree.vue
View File

@ -375,7 +375,6 @@ export default {
}, },
// 点击事件 // 点击事件
handleNodeClick(data,b,c) { handleNodeClick(data,b,c) {
console.log(data,b,c)
this.$emit("handleNodeClick", data); this.$emit("handleNodeClick", data);
}, },
}, },

565
src/views/intergrationTask/index.vue
View File

@ -2,32 +2,32 @@
<div class="wraaap"> <div class="wraaap">
<div class="left"> <div class="left">
<BaseMenuTree <BaseMenuTree
:menuData="treeData" :menuData="treeData"
:filterShow="true" :filterShow="true"
:Allshow="false" :Allshow="false"
:treeButton="true" :treeButton="false"
:filterButtonShow="true" :filterButtonShow="false"
style="height: 100%" style="height: 100%"
:treeProps="treeProps" :treeProps="treeProps"
@handleNodeClick="homeHandleNodeClick" @handleNodeClick="homeHandleNodeClick"
ref="menuTree" ref="menuTree"
@add="treeAddHandle" @add="treeAddHandle"
@append="treeAppendHandle" @append="treeAppendHandle"
@revise="treeReviseHandle" @revise="treeReviseHandle"
@remove="treeRemoveHandle" @remove="treeRemoveHandle"
></BaseMenuTree> ></BaseMenuTree>
</div> </div>
<div class="right"> <div class="right">
<header style="background: #fff; padding: 20px"> <header style="background: #fff; padding: 20px">
<div class="search"> <div class="search">
<BaseNewForm <BaseNewForm
:spanNumber="8" :spanNumber="8"
refName="searchForm" refName="searchForm"
:formRow="SearchformRow" :formRow="SearchformRow"
:formRule="false" :formRule="false"
:ruleForm="searchForm" :ruleForm="searchForm"
:newFlag="true" :newFlag="true"
:isFunBtn="false" :isFunBtn="false"
></BaseNewForm> ></BaseNewForm>
</div> </div>
<div class="btn"> <div class="btn">
@ -41,39 +41,46 @@
</div> </div>
<div> <div>
<BaseTable <BaseTable
ref="mainTable" ref="mainTable"
:tableData="tableData" :tableData="tableData"
:tableColumn="tableColumn" :tableColumn="tableColumn"
:funData="funData" :funData="funData"
:funWidth="funWidth" :funWidth="funWidth"
:showIndex="true" :showIndex="true"
:tabLoading="mainTabLoading" :tabLoading="mainTabLoading"
@onFunc="tableButtonHandle" @onFunc="tableButtonHandle"
:tableHeight="'60vh'" :tableHeight="'53vh'"
:border="false" :border="false"
></BaseTable> >
<template #taskStatus="{row}">
{{ row.taskStatus == 1 ? '启用' : '停用' }}
</template>
<template #taskPlugin="{row}">
{{ pluginDist[row.taskPlugin] }}
</template>
</BaseTable>
</div> </div>
</main> </main>
<footer> <footer>
<basePage <basePage
:pageModel="pageModel" :pageModel="pageModel"
@update:pageModel="currentChangeHandle" @update:pageModel="currentChangeHandle"
></basePage> ></basePage>
</footer> </footer>
</div> </div>
<baseRightDialog <baseRightDialog
@handleConfirmClick="handleConfirmClick" @handleConfirmClick="handleConfirmClick"
:dialogVisible="rightDialogSwitch" :dialogVisible="rightDialogSwitch"
:title="treeTitle" :title="treeTitle"
@handleClose="rightDialogSwitch = false" @handleClose="rightDialogSwitch = false"
> >
<div class="treeChunk" v-if="treeRuleForm.class_superiors_name"> <div class="treeChunk" v-if="treeRuleForm.class_superiors_name">
<div class="text">上级节点：</div> <div class="text">上级节点：</div>
<div class="input"> <div class="input">
<el-input <el-input
:disabled="true" :disabled="true"
v-model="treeRuleForm.class_superiors_name" v-model="treeRuleForm.class_superiors_name"
placeholder="" placeholder=""
></el-input> ></el-input>
</div> </div>
</div> </div>
@ -81,8 +88,8 @@
<div class="text">节点名：</div> <div class="text">节点名：</div>
<div class="input"> <div class="input">
<el-input <el-input
v-model="treeRuleForm.class_name" v-model="treeRuleForm.class_name"
placeholder="请输入节点名" placeholder="请输入节点名"
></el-input> ></el-input>
</div> </div>
</div> </div>
@ -91,12 +98,14 @@
</template> </template>
<script> <script>
import basePage from "./compoments/basePage.vue"; import basePage from './compoments/basePage.vue'
import BaseMenuTree from "./compoments/baseMenuTree"; import BaseMenuTree from './compoments/baseMenuTree'
import BaseNewForm from "./compoments/baseNewForm"; import BaseNewForm from './compoments/baseNewForm'
import BaseTable from "./compoments/baseTable"; import BaseTable from './compoments/baseTable'
import { getUserModuleApi } from "@/api/integrationOption/integrationOption.js"; import { getUserModuleApi } from '@/api/integrationOption/integrationOption.js'
import baseRightDialog from "@/components/base/baseRightDialog"; import baseRightDialog from '@/components/base/baseRightDialog'
import { authApi } from '@/api/apis/auth'
export default { export default {
data() { data() {
return { return {
@ -107,326 +116,375 @@ export default {
//页码控制 //页码控制
pageIndex: 1, pageIndex: 1,
total: 10, total: 10,
limit: 10, limit: 10
}, },
mainTabLoading: false, //表格loding控制 mainTabLoading: false, //表格loding控制
treeData: [ treeData: [
//左侧分类数据 //左侧分类数据
{ {
label: "测试", label: '测试',
id: 1, id: 1,
children: [ children: [
{ {
id: 3, id: 3,
label: "哈哈", label: '哈哈'
}, }
], ]
}, }
], ],
treeForm: { class_name: "", class_superiors: "", class_code: "" }, treeForm: { class_name: '', class_superiors: '', class_code: '' },
searchForm: {}, //搜索框数据 searchForm: {}, //搜索框数据
SearchformRow: [ SearchformRow: [
//搜索框数据 //搜索框数据
{ {
elCol: [ elCol: [
{ {
type: "input", type: 'input',
title: "任务编码", title: '任务编码',
id: "task_code", id: 'taskCode',
row: 8, row: 8
}, },
{ {
type: "input", type: 'input',
title: "任务名称", title: '任务名称',
id: "task_name", id: 'taskName',
row: 8, row: 8
}, },
], {
}, type: 'radio',
title: '任务状态',
id: 'taskStatus',
row: 8,
options: [
{
label: '启用',
id: '1'
},
{
label: '停用',
id: '2'
}
]
}
]
}
,
{
elCol: [
{
type: 'select',
title: '插件',
id: 'taskPlugin',
row: 8,
options: []
}
]
}
], ],
funData: [ funData: [
//table操作 //table操作
{ {
type: "edit", type: 'edit',
text: "编辑", text: '编辑',
color: "#5a9cf8", color: '#5a9cf8'
}, },
{ {
type: "view", type: 'view',
text: "查看", text: '查看',
color: "#5a9cf8", color: '#5a9cf8'
}, },
{ {
type: "dele", type: 'dele',
text: "删除", text: '删除',
color: "#e47470", color: '#e47470'
}, }
], ],
tableData: [{ taskCode: "测试", taskName: "123" }], //table主表数据 tableData: [], //table主表数据
tableColumn: [ tableColumn: [
//数据咧数据 //数据咧数据
{ {
id: "task_code", id: 'taskName',
title: "任务编码", title: '任务名称'
}, },
{ {
id: "task_name", id: 'taskCode',
title: "任务名称", title: '任务编码'
}, },
{ {
id: "task_classes", id: 'taskStatus',
title: "任务分类", title: '任务状态'
}, },
{ {
id: "task_cron", id: 'taskPlugin',
title: "任务策略", title: '插件'
}, },
{ {
id: "fun_info", id: 'taskCron',
title: "功能介绍", title: '任务策略'
}, }
{
id: "remark",
title: "备注",
},
], ],
treeProps: { treeProps: {
children: "childClassifications", children: 'childClassifications',
label: "class_name", label: 'name'
}, },
treeTitle: "", treeTitle: '',
treeRuleForm: {}, treeRuleForm: {},
treeAddFlag: false, treeAddFlag: false,
}; appId: '',//左侧树id
pluginDist: {}//插件字典用于列表显示
}
}, },
methods: { methods: {
// 右dialog提交 // 右dialog提交
async handleConfirmClick() { async handleConfirmClick() {
if (!this.treeRuleForm.class_name) { if (!this.treeRuleForm.class_name) {
this.$message({ this.$message({
type: "error", type: 'error',
message: "请输入树名称", message: '请输入树名称'
}); })
return; return
} }
if (this.treeAddFlag) { if (this.treeAddFlag) {
const res = await getUserModuleApi( const res = await getUserModuleApi(
{ {
tl: "integrationTaskClassificationService", tl: 'integrationTaskClassificationService',
as: "integrationTaskClassification", as: 'integrationTaskClassification',
dj: "saveTaskClassification", dj: 'saveTaskClassification'
}, },
this.treeRuleForm this.treeRuleForm
); )
if (res.status == 200) { if (res.status == 200) {
this.$message({ this.$message({
type: "success", type: 'success',
message: "保存成功", message: '保存成功'
}); })
this.rightDialogSwitch = false; this.rightDialogSwitch = false
this.initTreeData(); this.initTreeData()
} }
} else { } else {
const res = await getUserModuleApi( const res = await getUserModuleApi(
{ {
tl: "integrationTaskClassificationService", tl: 'integrationTaskClassificationService',
as: "integrationTaskClassification", as: 'integrationTaskClassification',
dj: "updateTaskClassification", dj: 'updateTaskClassification'
}, },
this.treeRuleForm this.treeRuleForm
); )
if (res.status == 200) { if (res.status == 200) {
this.$message({ this.$message({
type: "success", type: 'success',
message: "保存成功", message: '保存成功'
}); })
this.rightDialogSwitch = false; this.rightDialogSwitch = false
this.initTreeData(); this.initTreeData()
} }
} }
}, },
// 树初始化 // 树初始化
async initTreeData() { async initTreeData() {
const res = await getUserModuleApi( const res = await getUserModuleApi(
{ {
tl: "integrationTaskClassificationService", tl: 'sysApplicationService',
as: "integrationTaskClassification", as: '',
dj: "queryTaskClassification", dj: 'queryEntity'
}, },
{} {}
); )
if (res.status == 200) { if (res.status == 200) {
this.treeData = res.attribute; console.log(res)
this.treeData = res.attribute
this.$nextTick(() => {
this.$refs.menuTree.clickFirst()
})
} }
console.log(res, "🌲"); console.log(res, '🌲')
}, },
// 树添加 // 树添加
treeAppendHandle(data) { treeAppendHandle(data) {
this.treeRuleForm = {}; this.treeRuleForm = {}
this.treeTitle = "子节点增加"; this.treeTitle = '子节点增加'
this.treeAddFlag = true; this.treeAddFlag = true
this.$set(this.treeRuleForm, "class_superiors_name", data.class_name); this.$set(this.treeRuleForm, 'class_superiors_name', data.class_name)
this.$set(this.treeRuleForm, "class_superiors", data.id); this.$set(this.treeRuleForm, 'class_superiors', data.id)
this.$set(this.treeRuleForm, "class_code", data.class_code); this.$set(this.treeRuleForm, 'class_code', data.class_code)
this.$set(this.treeRuleForm, "lvl", String(data.lvl * 1 + 1)); this.$set(this.treeRuleForm, 'lvl', String(data.lvl * 1 + 1))
this.rightDialogSwitch = true; this.rightDialogSwitch = true
}, },
treeReviseHandle(data) { treeReviseHandle(data) {
this.treeRuleForm = {}; this.treeRuleForm = {}
this.treeAddFlag = false; this.treeAddFlag = false
this.rightDialogSwitch = true; this.rightDialogSwitch = true
this.$set(this.treeRuleForm, "id", data.id); this.$set(this.treeRuleForm, 'id', data.id)
this.$set(this.treeRuleForm, "class_code", data.class_code); this.$set(this.treeRuleForm, 'class_code', data.class_code)
this.$set(this.treeRuleForm, "class_name", data.class_name); this.$set(this.treeRuleForm, 'class_name', data.class_name)
this.$set(this.treeRuleForm, "lvl", String(data.lvl)); this.$set(this.treeRuleForm, 'lvl', String(data.lvl))
this.treeTitle = "子节点编辑"; this.treeTitle = '子节点编辑'
}, },
treeRemoveHandle(data) { treeRemoveHandle(data) {
this.$confirm("确认删除？") this.$confirm('确认删除？')
.then(async () => { .then(async() => {
console.log(1); console.log(1)
const res = await getUserModuleApi( const res = await getUserModuleApi(
{ {
tl: "integrationTaskClassificationService", tl: 'integrationTaskClassificationService',
as: "integrationTaskClassification", as: 'integrationTaskClassification',
dj: "updateTaskClassificationSts", dj: 'updateTaskClassificationSts'
}, },
{ {
id: data.id, //任务id id: data.id //任务id
}
)
console.log(res)
if (res.status == 200) {
this.$nextTick(() => {
this.initTreeData()
})
} }
); })
console.log(res); .catch(() => {
if (res.status == 200) { })
this.$nextTick(() => {
this.initTreeData();
});
}
})
.catch(() => {});
}, },
// 左侧树加号点击事件 // 左侧树加号点击事件
treeAddHandle() { treeAddHandle() {
this.treeRuleForm = {}; this.treeRuleForm = {}
this.treeAddFlag = true; this.treeAddFlag = true
this.rightDialogSwitch = true; this.rightDialogSwitch = true
this.treeTitle = "根节点增加"; this.treeTitle = '根节点增加'
this.$set(this.treeRuleForm, "class_code", new Date().getTime()); this.$set(this.treeRuleForm, 'class_code', new Date().getTime())
this.$set(this.treeRuleForm, "lvl", "0"); this.$set(this.treeRuleForm, 'lvl', '0')
}, },
// 初始化表单 // 初始化表单
async initTableData(obj = {}) { async initTableData(obj = {}) {
const res = await getUserModuleApi( const res = await getUserModuleApi(
{ {
tl: "integrationTaskService", tl: 'integrationTaskService',
as: "integrationTask", as: '',
dj: "queryListJson", dj: 'queryEntityPage'
}, },
{ {
pageNum: this.pageModel.pageIndex, pageNum: this.pageModel.pageIndex,
pageSize: this.pageModel.limit, pageSize: this.pageModel.limit,
query_condition: { ...obj }, task_app: this.appId,
} ...obj,
); }
console.log(res); )
console.log(res, 'tabledata')
if (res.status == 200) { if (res.status == 200) {
this.tableData = res.attribute; this.tableData = res.attribute.list
this.pageModel.total = res.attribute.total
} }
}, },
// 搜索按钮 // 搜索按钮
searchHandle() { searchHandle() {
this.initTableData({ ...this.searchForm }); this.initTableData({ ...this.searchForm })
}, },
// 重置按钮 // 重置按钮
resizeSearchHandle() { resizeSearchHandle() {
this.searchForm = {}; this.searchForm = {}
}, },
// 新建路由跳转 // 新建路由跳转
newPage() { newPage() {
this.$router.push({ name: "taskAdd" }); this.$router.push({ name: 'taskAdd' })
}, },
// 暂无作用 // 树点击事件
homeHandleNodeClick(data) { homeHandleNodeClick(data) {
this.pageModel.pageIndex = 1; console.log(data, 'data')
this.pageModel.total = 0; this.pageModel.pageIndex = 1
this.pageModel.limit = 10; this.pageModel.total = 0
this.searchForm = {}; this.pageModel.limit = 10
this.tableData = []; this.appId = data.id
this.lookFlag = false; this.searchForm = {}
this.newFlag = false; this.tableData = []
this.lookFlag = false
this.newFlag = false
//树点击完毕后调用插件查询接口
this.plugSelectInit()
//初始化表单
this.initTableData()
},
//查询条件下啦接口
async plugSelectInit() {
const res = await authApi('sysApplicationPluginService', '', 'queryEntity', '', {
appId: this.appId
})
if (res.status === '200') {
this.pluginDist = {}
res.attribute.forEach(item => {
item.label = item.pluginName
this.$set(this.pluginDist, item.id, item.label)
})
this.SearchformRow[1].elCol[0].options = res.attribute
console.log(this.SearchformRow[1].elCol[0], 'this.SearchformRow[1].elCol[0]')
}
console.log(res, '拿到插件列表')
}, },
// 页面 // 页面
currentChangeHandle(pageModel) { currentChangeHandle(pageModel) {
this.pageModel = pageModel; this.pageModel = pageModel
this.$nextTick(() => { this.$nextTick(() => {
this.initTableData({ ...this.searchForm }); this.initTableData({ ...this.searchForm })
}); })
}, },
// 表格按钮 // 表格按钮
tableButtonHandle(val, item) { tableButtonHandle(val, item) {
if (item.type === "view") { if (item.type === 'view') {
this.$router.push({ this.$router.push({
name: "taskAdd", name: 'taskAdd',
query: { id: val.id, lookFlag: true }, query: { id: val.id, lookFlag: true }
}); })
} else if (item.type === "dele") { } else if (item.type === 'dele') {
console.log(111); console.log(111)
this.$confirm("确认删除？") this.$confirm('确认删除？')
.then(async () => { .then(async() => {
const res = await getUserModuleApi( const res = await getUserModuleApi(
{ {
tl: "integrationTaskService", tl: 'integrationTaskService',
as: "integrationTask", as: 'integrationTask',
dj: "updateIntegrationTaskSts", dj: 'updateIntegrationTaskSts'
}, },
{ {
id: val.id, //任务id id: val.id //任务id
}
)
if (res.status == 200) {
if (
this.pageModel.total - 1 + this.pageModel.limit <=
this.pageModel.pageIndex * this.pageModel.limit
) {
this.pageModel.pageIndex--
}
this.$nextTick(() => {
this.initTableData({ ...this.searchForm })
})
} }
); })
if (res.status == 200) { .catch((err) => {
if ( console.log(err)
this.pageModel.total - 1 + this.pageModel.limit <= })
this.pageModel.pageIndex * this.pageModel.limit } else if (item.type === 'edit') {
) { this.$router.push({ name: 'taskAdd', query: { id: val.id } })
this.pageModel.pageIndex--;
}
this.$nextTick(() => {
this.initTableData({ ...this.searchForm });
});
}
})
.catch((err) => {
console.log(err);
});
} else if (item.type === "edit") {
this.$router.push({ name: "taskAdd", query: { id: val.id } });
} }
}, }
}, },
components: { components: {
BaseMenuTree, BaseMenuTree,
BaseNewForm, BaseNewForm,
BaseTable, BaseTable,
basePage, basePage,
baseRightDialog, baseRightDialog
},
computed: {
// 操作框的宽度
funWidth() {
return this.funData.length * 70;
},
}, },
mounted() { mounted() {
// this.$refs.menuTree.clickFirst(); // this.$refs.menuTree.clickFirst();
this.initTableData(); // this.initTableData()
this.initTreeData(); this.initTreeData()
}, },
computed: { computed: {
// 操作框的宽度 // 操作框的宽度
funWidth() { funWidth() {
return this.funData.length * 70; return this.funData.length * 70
}, }
}, }
}; }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
@ -434,36 +492,45 @@ export default {
padding: 20px; padding: 20px;
display: flex; display: flex;
align-items: center; align-items: center;
> .text { > .text {
flex: 1; flex: 1;
} }
> .input { > .input {
flex: 5; flex: 5;
} }
} }
.wraaap { .wraaap {
display: flex; display: flex;
.right { .right {
width: 85%; width: 85%;
margin-left: 20px; margin-left: 20px;
border-radius: 20px !important; border-radius: 20px !important;
} }
.left { .left {
border-radius: 20px; border-radius: 20px;
width: 15%; width: 15%;
background-color: #fff; background-color: #fff;
} }
.btn { .btn {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
} }
main { main {
margin-top: 20px; margin-top: 20px;
border-radius: 20px; border-radius: 20px;
} }
footer { footer {
margin-top: 15px; margin-top: 15px;
} }
header { header {
border-radius: 20px; border-radius: 20px;
} }

938
src/views/intergrationTask/taskAdd.vue
View File

File diff suppressed because it is too large Load Diff