github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-02 12:14:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: update data

Browse Source
This commit is contained in:
Qiuxia Fan 2021-12-27 15:47:28 +08:00
parent e8f23d9ead
commit 227ef4f092
3 changed files with 25 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/Selector.vue
View File

@ -14,10 +14,9 @@ See the License for the specific language governing permissions and
limitations under the License. --> limitations under the License. -->
<template> <template>
<el-select <el-select
size="small" :size="size"
v-model="selected" v-model="selected"
:placeholder="placeholder" :placeholder="placeholder"
class="selectors"
@change="changeSelected" @change="changeSelected"
> >
<el-option <el-option
@ -49,8 +48,10 @@ const props = defineProps({
placeholder: { type: String, default: "Select a option" }, placeholder: { type: String, default: "Select a option" },
}); });
const selected = ref<string>(""); const selected = ref<string>("");
function changeSelected(val: string) { function changeSelected() {
const optionSele = props.options.filter((d: Option) => d.value === val); const optionSele = props.options.filter(
(d: Option) => d.value === selected.value
)[0];
emit("change", optionSele); emit("change", optionSele);
} }
</script> </script>

19
src/views/dashboard/New.vue
View File

@ -19,7 +19,7 @@ limitations under the License. -->
<div class="label">{{ t("name") }}</div> <div class="label">{{ t("name") }}</div>
<el-input <el-input
size="small" size="small"
v-model="state.name" v-model="states.name"
placeholder="Please input name" placeholder="Please input name"
/> />
</div> </div>
@ -30,6 +30,7 @@ limitations under the License. -->
size="small" size="small"
placeholder="Select a layer" placeholder="Select a layer"
@change="changeLayer" @change="changeLayer"
class="selectors"
/> />
</div> </div>
<div class="item"> <div class="item">
@ -39,6 +40,7 @@ limitations under the License. -->
size="small" size="small"
placeholder="Select a entity" placeholder="Select a entity"
@change="changeEntity" @change="changeEntity"
class="selectors"
/> />
</div> </div>
<div class="btn"> <div class="btn">
@ -59,22 +61,22 @@ import uuid from "@/utils/uuid";
const { t } = useI18n(); const { t } = useI18n();
const selectorStore = useSelectorStore(); const selectorStore = useSelectorStore();
const state = reactive({ const states = reactive({
name: "", name: "",
layer: "", layer: "",
entity: EntityType[0].value, entity: EntityType[0].value,
}); });
const onCreate = () => { const onCreate = () => {
const id = uuid(); const id = uuid();
const path = `/dashboard/edit/${state.layer}/${state.entity}/${id}`; const path = `/dashboard/edit/${states.layer}/${states.entity}/${id}`;
router.push(path); router.push(path);
}; };
selectorStore.fetchServices("general"); selectorStore.fetchServices("general");
function changeLayer(val: { label: string; value: string }) { function changeLayer(opt: { label: string; value: string }) {
state.layer = val.value; states.layer = opt.value;
} }
function changeEntity(val: { label: string; value: string }) { function changeEntity(opt: { label: string; value: string }) {
state.entity = val.value; states.entity = opt.value;
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -93,8 +95,7 @@ function changeEntity(val: { label: string; value: string }) {
} }
.new-dashboard, .new-dashboard,
.selectors, .selectors {
.el-cascader-menu {
width: 600px; width: 600px;
} }

12
src/views/dashboard/data.ts
View File

@ -19,8 +19,16 @@ export const EntityType = [
{ value: "all", label: "All" }, { value: "all", label: "All" },
{ value: "endpoint", label: "Service Endpoint" }, { value: "endpoint", label: "Service Endpoint" },
{ value: "serviceInstance", label: "Service Instance" }, { value: "serviceInstance", label: "Service Instance" },
{ value: "serviceRelation", label: "Service Relation" }, { value: "serviceRelationClient", label: "Service Relation(client)" },
{ value: "serviceInstanceRelation", label: "Service Instance Relation" }, { value: "serviceRelationServer", label: "Service Relation(server)" },
{
value: "serviceInstanceRelationClient",
label: "Service Instance Relation(client)",
},
{
value: "serviceInstanceRelationServer",
label: "Service Instance Relation(server)",
},
{ value: "endpointRelation", label: "Endpoint Relation" }, { value: "endpointRelation", label: "Endpoint Relation" },
]; ];
export const Options = [ export const Options = [