Skip to content

GitLab

W
WidgetUI
Commit 8202bda1 authored by WuFeiyang's avatar WuFeiyang
Browse files
Options

增加broadcast 初步

parent c47ee566
Hide whitespace changes
Inline Side-by-side
Showing with 492 additions and 1 deletion
package-lock.json
View file @ 8202bda1
......@@ -1210,6 +1210,11 @@
"@types/d3": "^3"
}
},
"@types/pubsub-js": {
"version": "1.5.18",
"resolved": "https://registry.npmjs.org/@types/pubsub-js/-/pubsub-js-1.5.18.tgz",
"integrity": "sha512-1xFx7o/DKwbDm5UwjnkkeAVk+U1puh0odDkY+NpTCuQfbhcGh4+fjQSuKVHLPP1F9osj3/lDtnr71kud9u3ZYA=="
},
"@types/q": {
"version": "1.5.2",
"resolved": "https://registry.npm.taobao.org/@types/q/download/@types/q-1.5.2.tgz",
......@@ -10531,6 +10536,11 @@
"safe-buffer": "^5.1.2"
}
},
"pubsub-js": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/pubsub-js/-/pubsub-js-1.7.0.tgz",
"integrity": "sha512-Pb68P9qFZxnvDipHMuj9oT1FoIgBcXJ9C9eWdHCLZAnulaUoJ3+Y87RhGMYilWpun6DMWVmvK70T4RP4drZMSA=="
},
"pump": {
"version": "3.0.0",
"resolved": "https://registry.npm.taobao.org/pump/download/pump-3.0.0.tgz",
......
src/components/AutoBroadcast/AutoBroadcast.vue 0 → 100644
View file @ 8202bda1
<template>
<b-container class="bv-example-row">
<b-row style="margin-top:10px">
<b-col>
<span style="float:left;" class="smallFont">path: {{ config.data.url }}</span>
</b-col>
<b-col>
<b-button @click="showPathConfig" variant="primary" style="float:right">
<span class="glyphicon glyphicon-cog"></span>
</b-button>
</b-col>
</b-row>
<br />
<b-row>
<b-col>
<div
style="width:100%;overflow:auto;border-style: solid; border-width: 1px;"
>
<p style="float:left;margin:0px" class="largeFont">{{ StatusValue }}</p>
</div>
</b-col>
</b-row>
<br />
<b-row>
<b-col>
<b-input-group size="lg" prepend="path" v-show="isShowPath">
<b-form-input v-model="config.data.url"></b-form-input>
<b-input-group-append>
<b-button @click="updateUI" text="Button" variant="primary">OK</b-button>
<b-button variant="info" @click="pathPoke">poke</b-button>
</b-input-group-append>
</b-input-group>
</b-col>
</b-row>
<b-row>
<b-col>
<WidgetParams
ref="WidgetParams"
v-show="isShowParams"
action="get"
@updataVariables="viewLoad"
></WidgetParams>
</b-col>
</b-row>
<br />
<b-row>
<b-col>
<Navigation ref="FamilyLink" :url="config.data.url"></Navigation>
</b-col>
</b-row>
</b-container>
</template>
<script lang="ts">
import Vue from "vue";
import { VueSvgGauge } from "vue-svg-gauge";
import Component from "vue-class-component";
import { Prop, Watch } from "vue-property-decorator";
import { WidgetConfig } from "@/models/WidgetConfig";
import { UpdatePayload } from "@/models/UpdatePayload";
import { Widget } from "@/models/widget";
import { ResourceInfo } from "@/models/Customview";
import WidgetParams from "@/components/Common/WidgetParams.vue";
import axios from "axios";
import PathProcessor from "@/models/PathProcessor";
import StrMapObjChange from "@/models/StrMapObjChange";
import { forEach } from "typescript-collections/dist/lib/arrays";
import { map } from "d3";
import Navigation from "@/components/Common/Navigation.vue";
@Component({
components: {
WidgetParams,
Navigation
}
})
export default class VarBroadcast extends Widget {
pathProcessor = new PathProcessor();
strMapObjChange = new StrMapObjChange();
WidgetComponentName: string = "Status";
StatusValue: string = "";
pathId: string = "";
userInputData = new Map<string, string>();
pathwithVar: string = "";
timer?: number;
isShowPath: boolean = false;
isShowParams: boolean = false;
config: WidgetConfig = {
WidgetComponentName: "Status",
data: {
url: "",
userInputData: ""
}
};
created() {
this.config.data.userInputData = this.strMapObjChange.strMapToObj(
this.userInputData
);
}
mounted() {
this.timer = setInterval(this.refresh, 1000);
}
destroyed() {
clearInterval(this.timer);
}
updateUI() {
this.isShowPath = false;
this.isShowParams = true;
var url = this.config.data.url;
this.pathId = url.slice(0, url.indexOf("/"));
(this.$refs.WidgetParams as WidgetParams).setVariableList(
this.pathProcessor.extractVarFromPath(url)
);
}
showPathConfig() {
this.isShowPath = !this.isShowPath;
}
getConfig(): WidgetConfig {
// this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
this.config.data.userInputData = this.strMapObjChange.strMapToObj(
(this.$refs.WidgetParams as WidgetParams).getVariableValues()
);
return this.config;
}
setConfig(widgetConfig: WidgetConfig): void {
this.config = widgetConfig;
this.updateUI();
//map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
var temp = this.config.data.userInputData;
temp = JSON.parse(JSON.stringify(temp));
temp = this.strMapObjChange.objToStrMap(temp);
this.userInputData = temp;
(this.$refs.WidgetParams as WidgetParams).setVariableInput(
this.userInputData
);
}
samplePoke(sample: any) {
var samplePath = sample.CFET2CORE_SAMPLE_PATH;
var pokedPath: string;
pokedPath = samplePath;
var count: number = 0;
var temp = sample.Actions.get.Parameters;
temp = JSON.parse(JSON.stringify(temp));
temp = this.strMapObjChange.objToStrMap(temp);
var Parameters: Map<string, string>;
Parameters = temp;
Parameters.forEach((value, key) => {
count++;
if (count == 1) {
pokedPath = pokedPath + "?";
}
pokedPath = pokedPath + key + "=$" + key + "$&";
});
if (count != 0) {
pokedPath = pokedPath.substring(0, pokedPath.length - 1);
}
this.config.data.url = pokedPath;
}
pathPoke() {
var pokepath = this.config.data.url;
axios.get(pokepath, {
headers: {
'Pragma': 'no-cache',
'Cache-Control': 'no-cache'
}
}).then(response => {
this.samplePoke(response.data);
this.updateUI();
});
}
replaceStartPath(startPath: string): void {
this.config.data.url.replace("$startPath$", startPath);
}
parentUpdate(payload: UpdatePayload): void {}
refresh() {
var Args: UpdatePayload = {
action: "get",
variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
target: ["self"]
};
this.viewLoad(Args);
}
async getData(url: string) {
var apiLoad = url;
await axios
.get(apiLoad, {
headers: {
Pragma: "no-cache",
"Cache-Control": "no-cache"
}
})
.then(response => {
this.StatusValue = response.data.CFET2CORE_SAMPLE_VAL;
if(this.StatusValue == undefined)
{
this.StatusValue = "undefined";
}
});
}
//called when widgetParams action clicked
async viewLoad(Args: UpdatePayload) {
// this.config.data.userInputData = Args.variables;
this.userInputData = Args.variables;
this.pathwithVar = this.pathProcessor.FillPathWithVar(
// this.config.data.userInputData,
this.userInputData,
this.config.data.url
);
await this.getData(this.pathwithVar);
}
}
</script>
<style scoped>
.waveView {
width: 100%;
height: auto;
}
</style>
\ No newline at end of file
src/components/VarBroadcast/VarBroadcast.vue 0 → 100644
View file @ 8202bda1
<template>
<b-container class="bv-example-row">
<b-row style="margin-top:10px">
<b-col>
<span style="float:left;" class="smallFont">path: {{ config.data.url }}</span>
</b-col>
<b-col>
<b-button @click="showPathConfig" variant="primary" style="float:right">
<span class="glyphicon glyphicon-cog"></span>
</b-button>
</b-col>
</b-row>
<br />
<b-row>
<b-col>
<div
style="width:100%;overflow:auto;border-style: solid; border-width: 1px;"
>
<p style="float:left;margin:0px" class="largeFont">{{ StatusValue }}</p>
</div>
</b-col>
</b-row>
<br />
<b-row>
<b-col>
<b-input-group size="lg" prepend="path" v-show="isShowPath">
<b-form-input v-model="config.data.url"></b-form-input>
<b-input-group-append>
<b-button @click="updateUI" text="Button" variant="primary">OK</b-button>
</b-input-group-append>
</b-input-group>
</b-col>
</b-row>
<b-row>
<b-col>
<WidgetParams
ref="WidgetParams"
v-show="isShowParams"
action="broadcast"
@updataVariables="viewLoad"
></WidgetParams>
</b-col>
</b-row>
<br />
</b-container>
</template>
<script lang="ts">
import Vue from "vue";
import PubSub from 'pubsub-js';
import { VueSvgGauge } from "vue-svg-gauge";
import Component from "vue-class-component";
import { Prop, Watch } from "vue-property-decorator";
import { WidgetConfig } from "@/models/WidgetConfig";
import { UpdatePayload } from "@/models/UpdatePayload";
import { Widget } from "@/models/widget";
import { ResourceInfo } from "@/models/Customview";
import WidgetParams from "@/components/Common/WidgetParams.vue";
import axios from "axios";
import PathProcessor from "@/models/PathProcessor";
import StrMapObjChange from "@/models/StrMapObjChange";
import { forEach } from "typescript-collections/dist/lib/arrays";
import { map } from "d3";
import Navigation from "@/components/Common/Navigation.vue";
@Component({
components: {
WidgetParams,
Navigation
}
})
export default class VarBroadcast extends Widget {
pathProcessor = new PathProcessor();
strMapObjChange = new StrMapObjChange();
WidgetComponentName: string = "Status";
StatusValue: string = "";
pathId: string = "";
userInputData = new Map<string, string>();
pathwithVar: string = "";
timer?: number;
isShowPath: boolean = false;
isShowParams: boolean = false;
config: WidgetConfig = {
WidgetComponentName: "Status",
data: {
url: "",
userInputData: ""
}
};
created() {
this.config.data.userInputData = this.strMapObjChange.strMapToObj(
this.userInputData
);
}
mounted() {
this.timer = setInterval(this.refresh, 1000);
}
destroyed() {
clearInterval(this.timer);
}
updateUI() {
this.isShowPath = false;
this.isShowParams = true;
var url = this.config.data.url;
this.pathId = url.slice(0, url.indexOf("/"));
(this.$refs.WidgetParams as WidgetParams).setVariableList(
this.pathProcessor.extractVarFromPath(url)
);
}
showPathConfig() {
this.isShowPath = !this.isShowPath;
}
getConfig(): WidgetConfig {
// this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
this.config.data.userInputData = this.strMapObjChange.strMapToObj(
(this.$refs.WidgetParams as WidgetParams).getVariableValues()
);
return this.config;
}
setConfig(widgetConfig: WidgetConfig): void {
this.config = widgetConfig;
this.updateUI();
//map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
var temp = this.config.data.userInputData;
temp = JSON.parse(JSON.stringify(temp));
temp = this.strMapObjChange.objToStrMap(temp);
this.userInputData = temp;
(this.$refs.WidgetParams as WidgetParams).setVariableInput(
this.userInputData
);
}
samplePoke(sample: any) {
var samplePath = sample.CFET2CORE_SAMPLE_PATH;
var pokedPath: string;
pokedPath = samplePath;
var count: number = 0;
var temp = sample.Actions.get.Parameters;
temp = JSON.parse(JSON.stringify(temp));
temp = this.strMapObjChange.objToStrMap(temp);
var Parameters: Map<string, string>;
Parameters = temp;
Parameters.forEach((value, key) => {
count++;
if (count == 1) {
pokedPath = pokedPath + "?";
}
pokedPath = pokedPath + key + "=$" + key + "$&";
});
if (count != 0) {
pokedPath = pokedPath.substring(0, pokedPath.length - 1);
}
this.config.data.url = pokedPath;
}
pathPoke() {
var pokepath = this.config.data.url;
axios.get(pokepath, {
headers: {
'Pragma': 'no-cache',
'Cache-Control': 'no-cache'
}
}).then(response => {
this.samplePoke(response.data);
this.updateUI();
});
}
replaceStartPath(startPath: string): void {
this.config.data.url.replace("$startPath$", startPath);
}
parentUpdate(payload: UpdatePayload): void {}
refresh() {
var Args: UpdatePayload = {
action: "get",
variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
target: ["self"]
};
this.viewLoad(Args);
}
async getData(url: string) {
var apiLoad = url;
await axios
.get(apiLoad, {
headers: {
Pragma: "no-cache",
"Cache-Control": "no-cache"
}
})
.then(response => {
this.StatusValue = response.data.CFET2CORE_SAMPLE_VAL;
if(this.StatusValue == undefined)
{
this.StatusValue = "undefined";
}
});
}
//called when widgetParams action clicked
viewLoad(Args: UpdatePayload) {
// this.config.data.userInputData = Args.variables;
PubSub.publish('VarBroadcast',Args);
}
}
</script>
<style scoped>
.waveView {
width: 100%;
height: auto;
}
</style>
\ No newline at end of file
src/models/PathProcessor.ts
View file @ 8202bda1
......@@ -23,7 +23,10 @@ export default class PathProcessor {
const result = path.match(urlRegExp);
if (result != null) {
result.forEach((element: string) => {
inputLabel.push(element);
if(element != "")
{
inputLabel.push(element);
}
});
}
return inputLabel;
......
src/shims-vue.d.ts
View file @ 8202bda1
......@@ -2,3 +2,4 @@ declare module '*.vue' {
import Vue from 'vue';
export default Vue;
}
declare module 'pubsub-js'
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment