提交 ecd5cac1 authored 作者: jianglw's avatar jianglw

组态bug修复

上级 2fb24839
<template>
<a-input :placeholder="placeholder" :value="inputVal" @input="backValue"></a-input>
</template>
<script>
const JINPUT_QUERY_LIKE = 'like';
const JINPUT_QUERY_NE = 'ne';
const JINPUT_QUERY_GE = 'ge'; //大于等于
const JINPUT_QUERY_LE = 'le'; //小于等于
export default {
name: 'JInput',
props:{
value:{
type:String,
required:false
},
type:{
type:String,
required:false,
default:JINPUT_QUERY_LIKE
},
placeholder:{
type:String,
required:false,
default:''
}
},
watch:{
value:{
immediate:true,
handler:function(){
this.initVal();
}
}
},
model: {
prop: 'value',
event: 'change'
},
data(){
return {
inputVal:''
}
},
methods:{
initVal(){
if(!this.value){
this.inputVal = ''
}else{
let text = this.value
switch (this.type) {
case JINPUT_QUERY_LIKE:
text = text.substring(1,text.length-1);
break;
case JINPUT_QUERY_NE:
text = text.substring(1);
break;
case JINPUT_QUERY_GE:
text = text.substring(2);
break;
case JINPUT_QUERY_LE:
text = text.substring(2);
break;
default:
}
this.inputVal = text
}
},
backValue(e){
let text = e.target.value
switch (this.type) {
case JINPUT_QUERY_LIKE:
text = "*"+text+"*";
break;
case JINPUT_QUERY_NE:
text = "!"+text;
break;
case JINPUT_QUERY_GE:
text = ">="+text;
break;
case JINPUT_QUERY_LE:
text = "<="+text;
break;
default:
}
this.$emit("change",text)
}
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
...@@ -867,22 +867,22 @@ export default { ...@@ -867,22 +867,22 @@ export default {
type: Object, type: Object,
}, },
}, },
watch: { // watch: {
// node:{ // // node:{
// deep: true, // // deep: true,
// handler(n,v){ // // handler(n,v){
// // }
// // },
// data: {
// handler(n, v) {
// if (n.data) {
// this.data = n.data;
// } // }
// }, // },
data: { // deep: true,
handler(n, v) { // },
if (n.data) { // },
this.data = n.data;
}
},
deep: true,
},
},
components: { components: {
AddEvent, AddEvent,
AddWheres, AddWheres,
......
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
<a-input <a-input
placeholder="请输图文名称" placeholder="请输图文名称"
v-model="canvasData.name" v-model="canvasData.name"
@change="changeData" @blur="changeData"
/> />
</a-form-item> </a-form-item>
</a-col> </a-col>
...@@ -67,7 +67,7 @@ ...@@ -67,7 +67,7 @@
:wrapper-col="formItemLayout.wrapperCol" :wrapper-col="formItemLayout.wrapperCol"
label="网格大小" label="网格大小"
> >
<a-input v-model="canvasData.gridSize" @input="changeData" /> <a-input v-model="canvasData.gridSize" @blur="changeData" />
</a-form-item> </a-form-item>
</a-col> </a-col>
...@@ -121,7 +121,7 @@ ...@@ -121,7 +121,7 @@
<div style="text-align: left; margin: 5px 3%">Websocket地址</div> <div style="text-align: left; margin: 5px 3%">Websocket地址</div>
<a-divider /> <a-divider />
<div style="text-align: left; margin: 5px"> <div style="text-align: left; margin: 5px">
<a-input v-model="canvasData.websocket" @change="changeData" /> <a-input v-model="canvasData.websocket" @blur="changeData" />
</div> </div>
<!-- <div style="text-align: left; margin: 0 10%; color: #c4c4c4"> <!-- <div style="text-align: left; margin: 0 10%; color: #c4c4c4">
用于Pen“事件”中的websocket使用。 消息格式为json字符串: {event: 用于Pen“事件”中的websocket使用。 消息格式为json字符串: {event:
...@@ -206,7 +206,7 @@ ...@@ -206,7 +206,7 @@
type="textarea" type="textarea"
rows="10" rows="10"
v-model="canvasData.socketFn" v-model="canvasData.socketFn"
@change="changeData" @blur="changeData"
/> />
</a-form-item> </a-form-item>
</a-form> </a-form>
...@@ -236,79 +236,10 @@ export default { ...@@ -236,79 +236,10 @@ export default {
components: { components: {
InputColor, InputColor,
}, },
watch: {
canvas: {
handler(n, o) {
if (!!n) {
if (n.mqttOptions) {
if (n.mqttOptions.clientId) {
this.mqttOptions.clientId = n.mqttOptions.clientId;
}
if (n.mqttOptions.username) {
this.mqttOptions.username = n.mqttOptions.username;
}
if (n.mqttOptions.password) {
this.mqttOptions.password = n.mqttOptions.password;
}
}
this.canvasData = pick(
Object.assign({}, n),
"name",
"bkColor",
"grid",
"gridColor",
"gridSize",
"rule",
"ruleColor",
"websocket",
"mqttUrl",
"mqttTopics",
"socketFn"
);
}
},
immediate: true,
deep: true,
},
bkColor: {
handler(n, o) {
this.canvasData.bkColor = n;
this.changeData(n);
},
deep: true,
},
gridColor: {
handler(n, o) {
this.canvasData.gridColor = n;
this.changeData(n);
},
deep: true,
},
ruleColor: {
handler(n, o) {
this.canvasData.ruleColor = n;
this.changeData(n);
},
deep: true,
},
},
data() { data() {
return { return {
formItemLayout, formItemLayout,
canvasData: { canvasData: {},
name: "",
bkColor: "",
grid: false,
gridColor: "",
gridSize: 0,
rule: false,
ruleColor: "",
websocket: "",
mqttUrl: "",
mqttTopics: "",
socketEvent: true,
socketFn: "",
},
form: { form: {
mqttUrl: "", mqttUrl: "",
mqttTopics: "", mqttTopics: "",
...@@ -324,6 +255,22 @@ export default { ...@@ -324,6 +255,22 @@ export default {
}; };
}, },
methods: { methods: {
init(data) {
if (data) {
if (data.data.mqttOptions) {
if (data.data.mqttOptions.clientId) {
this.mqttOptions.clientId = data.data.mqttOptions.clientId;
}
if (data.data.mqttOptions.username) {
this.mqttOptions.username = data.data.mqttOptions.username;
}
if (data.data.mqttOptions.password) {
this.mqttOptions.password = data.data.mqttOptions.password;
}
}
this.canvasData = Object.assign({}, data.data);
}
},
handleSubmit(e) { handleSubmit(e) {
if (!this.form.mqttUrl) { if (!this.form.mqttUrl) {
this.$message.warning("请填写mqttURL"); this.$message.warning("请填写mqttURL");
...@@ -338,20 +285,7 @@ export default { ...@@ -338,20 +285,7 @@ export default {
this.changeData(""); this.changeData("");
}, },
changeData(val) { changeData(val) {
let params = Object.assign({}, this.canvas); let params = Object.assign({}, this.canvasData);
params.name = this.canvasData.name;
params.bkColor = this.canvasData.bkColor;
params.grid = this.canvasData.grid;
params.gridColor = this.canvasData.gridColor;
params.gridSize = this.canvasData.gridSize;
params.rule = this.canvasData.rule;
params.ruleColor = this.canvasData.ruleColor;
params.websocket = this.canvasData.websocket;
params.mqttUrl = this.canvasData.mqttUrl;
params.mqttTopics = this.canvasData.mqttTopics;
params.mqttOptions = this.mqttOptions;
params.socketEvent = this.canvasData.socketEvent;
params.socketFn = this.canvasData.socketFn;
this.$emit("ok", params); this.$emit("ok", params);
}, },
}, },
......
...@@ -9,6 +9,7 @@ import router from './router' ...@@ -9,6 +9,7 @@ import router from './router'
import store from './store' import store from './store'
import Antd from 'ant-design-vue'; import Antd from 'ant-design-vue';
import 'ant-design-vue/dist/antd.css'; import 'ant-design-vue/dist/antd.css';
import JInput from '@/components/hcomponents/JInput'
import { parseTime, resetForm,selectDictLabel, selectDictLabels,addDateRange } from "@/utils/ruoyi"; import { parseTime, resetForm,selectDictLabel, selectDictLabels,addDateRange } from "@/utils/ruoyi";
//topology //topology
...@@ -20,6 +21,7 @@ import { getDicts } from "@/api/dict/data"; ...@@ -20,6 +21,7 @@ import { getDicts } from "@/api/dict/data";
Vue.config.productionTip = false Vue.config.productionTip = false
Vue.use(Antd); Vue.use(Antd);
Vue.use(ElementUI) Vue.use(ElementUI)
import Pagination from "@/components/Pagination"; import Pagination from "@/components/Pagination";
Vue.prototype.msgSuccess = function (msg) { Vue.prototype.msgSuccess = function (msg) {
this.$message({ showClose: true, message: msg, type: "success" }); this.$message({ showClose: true, message: msg, type: "success" });
...@@ -33,6 +35,8 @@ Vue.prototype.msgInfo = function (msg) { ...@@ -33,6 +35,8 @@ Vue.prototype.msgInfo = function (msg) {
this.$message.info(msg); this.$message.info(msg);
} }
Vue.component('Pagination', Pagination) Vue.component('Pagination', Pagination)
Vue.component('JInput', JInput)
// Vue.use(JInput)
Vue.prototype.parseTime = parseTime Vue.prototype.parseTime = parseTime
Vue.prototype.resetForm = resetForm Vue.prototype.resetForm = resetForm
Vue.prototype.getDicts = getDicts Vue.prototype.getDicts = getDicts
......
...@@ -199,6 +199,7 @@ ...@@ -199,6 +199,7 @@
<space-view <space-view
v-if="opt == 'space'" v-if="opt == 'space'"
:canvas="canvas.data" :canvas="canvas.data"
ref="space"
@ok="uploadCanvasData" @ok="uploadCanvasData"
></space-view> ></space-view>
<node-view <node-view
...@@ -234,9 +235,7 @@ import { register as registerFlow } from "@topology/flow-diagram"; ...@@ -234,9 +235,7 @@ import { register as registerFlow } from "@topology/flow-diagram";
import { register as registerActivity } from "@topology/activity-diagram"; import { register as registerActivity } from "@topology/activity-diagram";
import { register as registerClass } from "@topology/class-diagram"; import { register as registerClass } from "@topology/class-diagram";
import { register as registerSequence } from "@topology/sequence-diagram"; import { register as registerSequence } from "@topology/sequence-diagram";
import { import { register as registerChart } from "@topology/chart-diagram";
register as registerChart
} from "@topology/chart-diagram";
import { layout, alignNodes, spaceBetween } from "@topology/layout"; import { layout, alignNodes, spaceBetween } from "@topology/layout";
import { import {
headMenu, headMenu,
...@@ -320,11 +319,11 @@ export default { ...@@ -320,11 +319,11 @@ export default {
computed: { computed: {
scalecom: { scalecom: {
get() { get() {
return Math.round(this.scale * 100); return parseInt(this.scale * 100);
}, },
set(val) { set(val) {
this.scale = val / 100; this.scale = parseInt(val / 100);
this.canvas.scaleTo(val / 100); this.canvas.scaleTo(parseInt(val / 100));
}, },
}, },
lineWidthcom: { lineWidthcom: {
...@@ -337,12 +336,16 @@ export default { ...@@ -337,12 +336,16 @@ export default {
}, },
}, },
}, },
watch: {
$route(val) {
this.open();
},
},
methods: { methods: {
initSpace() {
if (this.opt != "space") {
this.opt = "space";
let that = this;
this.$nextTick(() => {
that.$refs.space.init(this.canvas);
});
}
},
allowDrop(event) { allowDrop(event) {
event.preventDefault(); event.preventDefault();
}, },
...@@ -462,6 +465,11 @@ export default { ...@@ -462,6 +465,11 @@ export default {
this.fromArrow = this.canvas.data.fromArrow; this.fromArrow = this.canvas.data.fromArrow;
this.lineName = this.canvas.data.lineName; this.lineName = this.canvas.data.lineName;
this.canvas.lock(0); this.canvas.lock(0);
this.opt = "space";
let that = this;
this.$nextTick(() => {
that.$refs.space.init(this.canvas);
});
this.canvas.closeSocket(); this.canvas.closeSocket();
this.canvas.closeMqtt(); this.canvas.closeMqtt();
} }
...@@ -513,7 +521,7 @@ export default { ...@@ -513,7 +521,7 @@ export default {
handle_replace() { handle_replace() {
const input = document.createElement("input"); const input = document.createElement("input");
input.type = "file"; input.type = "file";
let that=this; let that = this;
input.onchange = (event) => { input.onchange = (event) => {
const elem = event.srcElement || event.target; const elem = event.srcElement || event.target;
if (elem.files && elem.files[0]) { if (elem.files && elem.files[0]) {
...@@ -522,7 +530,7 @@ export default { ...@@ -522,7 +530,7 @@ export default {
reader.readAsText(elem.files[0]); reader.readAsText(elem.files[0]);
reader.onload = function () { reader.onload = function () {
//读取完成后,数据保存在对象的result属性中 //读取完成后,数据保存在对象的result属性中
if(this.result){ if (this.result) {
that.topologyData = JSON.stringify(JSON.parse(this.result)); that.topologyData = JSON.stringify(JSON.parse(this.result));
that.canvas.open(that.topologyData); that.canvas.open(that.topologyData);
that.canvas.render(); that.canvas.render();
...@@ -609,7 +617,7 @@ export default { ...@@ -609,7 +617,7 @@ export default {
}, },
uploadCanvasData(data) { uploadCanvasData(data) {
this.canvas.open(data); this.canvas.open(data);
this.canvas.render(); this.canvas.render(1);
}, },
updatePens(params) { updatePens(params) {
layout(this.pens, params); layout(this.pens, params);
...@@ -663,10 +671,10 @@ export default { ...@@ -663,10 +671,10 @@ export default {
break; break;
case "locked": case "locked":
this.locked = data; this.locked = data;
this.opt = "space"; this.initSpace();
break; break;
case "space": case "space":
this.opt = event; this.initSpace();
break; break;
case "node": case "node":
this.opt = event; this.opt = event;
...@@ -687,7 +695,7 @@ export default { ...@@ -687,7 +695,7 @@ export default {
this.pens = data; this.pens = data;
break; break;
case "delete": case "delete":
this.opt = "space"; this.initSpace();
break; break;
} }
}, },
......
...@@ -1071,10 +1071,10 @@ ...@@ -1071,10 +1071,10 @@
resolved "https://registry.npmmirror.com/@topology/class-diagram/-/class-diagram-0.3.0.tgz#aee3709cd657cd29f1bbaedfca1da98d328ff3de" resolved "https://registry.npmmirror.com/@topology/class-diagram/-/class-diagram-0.3.0.tgz#aee3709cd657cd29f1bbaedfca1da98d328ff3de"
integrity sha512-J+qKEg/+3EyyZotP2TbZtM+NcOeRh2PIEwzBZGS6KOU5RvBi4NMRO2DQNN++q8Zpb7RG7WYGAaTB2H4+YcXJzA== integrity sha512-J+qKEg/+3EyyZotP2TbZtM+NcOeRh2PIEwzBZGS6KOU5RvBi4NMRO2DQNN++q8Zpb7RG7WYGAaTB2H4+YcXJzA==
"@topology/core@0.5.38": "@topology/core@0.5.40":
version "0.5.38" version "0.5.40"
resolved "https://registry.npmmirror.com/@topology/core/-/core-0.5.38.tgz#ed92a2502ba489401e0a5f9566448e51f2b10ef0" resolved "https://registry.npmmirror.com/@topology/core/-/core-0.5.40.tgz#128ccf42fe28caaa800e198d2e0218e360431992"
integrity sha512-a4IA++DDn8YFqdsfhpTvgGxhRBm//JoX637aJspXXRq0G51XMgUbiJ+SqfACykqbvZI4lG++1feWlnNqv+8KTg== integrity sha512-rvIGARAsxgmBn+bso+rjjf7EoylwhttdwWZyFgCbdIAVie7Hsun7cg80DjyZSg3qayYUvJ85LZqmHVPb8dkrig==
dependencies: dependencies:
le5le-store "^1.0.7" le5le-store "^1.0.7"
mitt "^2.1.0" mitt "^2.1.0"
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论