formatting

This commit is contained in:
Peter Morton 2023-07-10 04:23:44 +01:00
parent c497cad9ac
commit 0104776529
2 changed files with 24 additions and 17 deletions

View File

@ -6,16 +6,16 @@ import * as align from "d3-sankey";
import { sankey, sankeyLinkHorizontal } from "d3-sankey"; import { sankey, sankeyLinkHorizontal } from "d3-sankey";
import { v4 as uuidv4 } from "uuid"; import { v4 as uuidv4 } from "uuid";
const filterOptions = ['Channel', 'SubChannel', 'Queue', 'Outcome'] const filterOptions = ["Channel", "SubChannel", "Queue", "Outcome"];
const multiSelected = ref(filterOptions) const multiSelected = ref(filterOptions);
const alignOptions = ['Left', 'Center', 'Right', 'Justify'] const alignOptions = ["Left", "Center", "Right", "Justify"];
const alignSelected = ref('Left') const alignSelected = ref("Left");
const errorMessage = ref(null); const errorMessage = ref(null);
onMounted(() => { onMounted(() => {
fetchData() fetchData();
}); });
function fetchData() { function fetchData() {
@ -23,7 +23,9 @@ function fetchData() {
errorMessage.value = null; errorMessage.value = null;
fetch( fetch(
`${import.meta.env.VITE_EO_SERVICES_URL}/api/interactions-flow?filter=${multiSelected.value}`, `${import.meta.env.VITE_EO_SERVICES_URL}/api/interactions-flow?filter=${
multiSelected.value
}`,
{ {
credentials: "include", // fetch won't send cookies unless you set credentials credentials: "include", // fetch won't send cookies unless you set credentials
} }
@ -46,7 +48,6 @@ function fetchData() {
} }
function generateSankey(data) { function generateSankey(data) {
// filter data // filter data
// const filteredData // const filteredData
@ -63,7 +64,7 @@ function generateSankey(data) {
// ["target", "target"] // ["target", "target"]
// clear the old svg // clear the old svg
d3.select("#chart").select("svg").remove() d3.select("#chart").select("svg").remove();
// Create a SVG container. // Create a SVG container.
const svg = d3 const svg = d3
@ -77,7 +78,13 @@ function generateSankey(data) {
// Constructs and configures a Sankey generator. // Constructs and configures a Sankey generator.
const sankeyGen = sankey() const sankeyGen = sankey()
.nodeId((d) => d.name) .nodeId((d) => d.name)
.nodeAlign(align[`sankey${alignSelected.value[0].toUpperCase()}${alignSelected.value.slice(1)}`]) // d3.sankeyLeft, etc. .nodeAlign(
align[
`sankey${alignSelected.value[0].toUpperCase()}${alignSelected.value.slice(
1
)}`
]
) // d3.sankeyLeft, etc.
.nodeWidth(15) .nodeWidth(15)
.nodePadding(10) .nodePadding(10)
.extent([ .extent([
@ -178,7 +185,7 @@ function generateSankey(data) {
<option v-for="item in alignOptions" :key="item">{{ item }}</option> <option v-for="item in alignOptions" :key="item">{{ item }}</option>
</select> </select>
<select v-model="multiSelected" multiple style="width:200px; height:90px"> <select v-model="multiSelected" multiple style="width: 200px; height: 90px">
<option disabled value="">Please select nodes</option> <option disabled value="">Please select nodes</option>
<option v-for="item in filterOptions" :key="item">{{ item }}</option> <option v-for="item in filterOptions" :key="item">{{ item }}</option>
</select> </select>

View File

@ -18,9 +18,9 @@ function fetchData() {
errorMessage.value = null; errorMessage.value = null;
contactData.value = null; contactData.value = null;
fetch( fetch(
`${import.meta.env.VITE_EO_SERVICES_URL}/api/unified-data-gateway?referenceId=${ `${
referenceId.value import.meta.env.VITE_EO_SERVICES_URL
}`, }/api/unified-data-gateway?referenceId=${referenceId.value}`,
{ {
credentials: "include", // fetch won't send cookies unless you set credentials credentials: "include", // fetch won't send cookies unless you set credentials
} }