cloud-web/src/views/components/task/formJoin.vue

136 lines
4.0 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div>
<!-- 联查模块表单-->
<span v-if="taskInputJoin">
<el-form label-width="80px" :model="formJoin" ref="queryForm" :inline="true" class="demo-form-inline" size="small">
<el-form-item label="联查方式">
<el-select v-model="formJoin.joinType" placeholder="请选择">
<el-option style="height: 100%" label="左联查" value="1"/>
<el-option style="height: 100%" label="右联查" value="2"/>
<el-option style="height: 100%" label="内联查" value="3"/>
</el-select>
</el-form-item>
<br>
<el-form-item label="关联字段">
<el-select v-model="formJoin.leftJoinField" placeholder="请选择">
<span v-for="item in oneFieldList.split(',')">
<el-option style="height: 100%"
:label="item"
:value="item"
:key="item"/>
</span>
</el-select>
<el-select v-model="formJoin.rightJoinField" placeholder="请选择">
<span v-for="item in twoFieldList.split(',')">
<el-option style="height: 100%"
:label="item"
:value="item"
:key="item"/>
</span>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="taskInputJoin == false">取消</el-button>
<el-button type="primary" @click="saveTaskJoin()">确 定</el-button>
</div>
<!-- <div slot="footer" class="dialog-footer">-->
<!-- <el-button @click="taskInputAdd = false">取 消</el-button>-->
<!-- <el-button type="primary" @click="addTaskInput()"></el-button>-->
<!-- </div>-->
</span>
</div>
</template>
<script>
import { addTaskJoin, findByNodeId } from '@/api/task/task'
//这里可以导入其他文件比如组件工具js第三方插件jsjson文件图片文件等等,
//例如import 《组件名称》 from '《组件路径》,
export default {
//import引入的组件需要注入到对象中才能使用"
components: {},
props:['graph','nodeId','nodeName','taskId','taskInputJoin','neighbors'],
data() {
//这里存放数据"
return {
taskInputJoin: true,
formJoin: {},
oneFieldList:'',
twoFieldList:'',
};
},
//计算属性 类似于data概念",
computed: {},
//监控data中的数据变化",
watch: {},
//方法集合",
methods: {
//添加任务联查方式
saveTaskJoin(){
this.taskInputJoin = false;
this.$emit('saveTaskJoin', false);
addTaskJoin(
{
"nodeId":this.nodeId,
"nodeName":this.nodeName,
"taskId":this.taskId,
"joinType":this.formJoin.joinType,
"leftJoinField":this.formJoin.leftJoinField,
"rightJoinField":this.formJoin.rightJoinField
}
).then(res=>{
})
},
//拿到连线节点的数据
findAllTable(){
alert(this.neighbors)
findByNodeId(this.neighbors[0]).then(res=>{
this.oneFieldList = res.data.tableAsField;
console.log(this.oneFieldList)
})
findByNodeId(this.neighbors[1]).then(res=>{
this.twoFieldList = res.data.tableAsField;
console.log(this.twoFieldList)
})
},
},
//生命周期 - 创建完成可以访问当前this实例",
created() {
this.findAllTable();
},
//生命周期 - 挂载完成可以访问DOM元素",
mounted() {
},
beforeCreate() {
}, //生命周期 - 创建之前",
beforeMount() {
}, //生命周期 - 挂载之前",
beforeUpdate() {
}, //生命周期 - 更新之前",
updated() {
}, //生命周期 - 更新之后",
beforeDestroy() {
}, //生命周期 - 销毁之前",
destroyed() {
}, //生命周期 - 销毁完成",
activated() {
} //如果页面有keep-alive缓存功能这个函数会触发",
};
</script>
<style scoped>
</style>