632 lines
15 KiB
Vue
632 lines
15 KiB
Vue
<template>
|
|
<div v-if="formState.ready">
|
|
<gz-error :error-box-message="formState.errorBoxMessage"></gz-error>
|
|
<div>
|
|
<v-row dense>
|
|
<v-col cols="12" sm="6" lg="4" xl="3">
|
|
<v-select
|
|
ref="ayaType"
|
|
v-model="ayaType"
|
|
dense
|
|
:items="selectLists.importableAyaTypes"
|
|
item-text="name"
|
|
item-value="id"
|
|
:label="$ay.t('AyaType')"
|
|
data-cy="ayaType"
|
|
></v-select>
|
|
</v-col>
|
|
|
|
<v-col v-if="ayaType != 0" cols="12" sm="6" lg="4" xl="3">
|
|
<v-checkbox
|
|
v-model="doImport"
|
|
dense
|
|
:label="$ay.t('ImportNewRecords')"
|
|
></v-checkbox>
|
|
<v-checkbox
|
|
v-if="ayaType != 67"
|
|
v-model="doUpdate"
|
|
dense
|
|
:label="$ay.t('UpdateExistingRecords')"
|
|
color="warning"
|
|
></v-checkbox>
|
|
</v-col>
|
|
|
|
<v-col
|
|
v-if="ayaType != 0 && (doImport || doUpdate)"
|
|
cols="12"
|
|
sm="6"
|
|
lg="4"
|
|
xl="3"
|
|
>
|
|
<v-file-input
|
|
v-model="uploadFile"
|
|
dense
|
|
:label="$ay.t('FileToImport')"
|
|
accept=".json, .csv, application/json, text/csv"
|
|
prepend-icon="$ayiFileUpload"
|
|
show-size
|
|
></v-file-input
|
|
><v-btn
|
|
v-if="importable"
|
|
:loading="uploading"
|
|
color="primary"
|
|
text
|
|
@click="process"
|
|
>{{ $ay.t("Import") }}</v-btn
|
|
>
|
|
</v-col>
|
|
|
|
<v-col v-if="outputText != null" cols="12">
|
|
<v-textarea
|
|
v-model="outputText"
|
|
dense
|
|
full-width
|
|
readonly
|
|
auto-grow
|
|
data-cy="outputText"
|
|
></v-textarea>
|
|
</v-col>
|
|
</v-row>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import Papa from "papaparse";
|
|
const FORM_KEY = "adm-import";
|
|
export default {
|
|
data() {
|
|
return {
|
|
selectLists: {
|
|
importableAyaTypes: []
|
|
},
|
|
uploadFile: [],
|
|
ayaType: 0,
|
|
doImport: false,
|
|
doUpdate: false,
|
|
outputText: null,
|
|
rights: window.$gz.role.defaultRightsObject(),
|
|
uploading: false,
|
|
formState: {
|
|
ready: false,
|
|
dirty: false,
|
|
valid: true,
|
|
readOnly: false,
|
|
loading: true,
|
|
errorBoxMessage: null,
|
|
appError: null,
|
|
serverError: {}
|
|
}
|
|
};
|
|
},
|
|
computed: {
|
|
importable() {
|
|
return (
|
|
(this.doImport || this.doUpdate) &&
|
|
this.uploadFile &&
|
|
this.uploadFile.name &&
|
|
this.ayaType != 0
|
|
);
|
|
}
|
|
},
|
|
async created() {
|
|
//NOTE:Global is what is checked for initialize to show this form and at server to allow import
|
|
this.rights = window.$gz.role.getRights(window.$gz.type.Global);
|
|
window.$gz.eventBus.$on("menu-click", clickHandler);
|
|
await fetchTranslatedText(this);
|
|
await populateSelectionLists(this);
|
|
generateMenu(this);
|
|
this.formState.ready = true;
|
|
},
|
|
beforeDestroy() {
|
|
window.$gz.eventBus.$off("menu-click", clickHandler);
|
|
},
|
|
methods: {
|
|
async process() {
|
|
if (this.uploading) {
|
|
return;
|
|
}
|
|
if (!this.uploadFile) {
|
|
return;
|
|
}
|
|
this.uploading = true;
|
|
this.outputText = null;
|
|
try {
|
|
let fileName = this.uploadFile.name.toLowerCase();
|
|
if (!fileName.includes("csv") && !fileName.includes("json")) {
|
|
window.$gz.store.commit(
|
|
"logItem",
|
|
`administration -> import unrecognized import file, name: ${this.uploadFile.name}, type: ${this.uploadFile.type}, size: ${this.uploadFile.size}`
|
|
);
|
|
throw new Error("Not supported file type, must be .csv or .json");
|
|
}
|
|
const isCSV = fileName.includes("csv");
|
|
let dat = null;
|
|
if (isCSV) {
|
|
let res = await parseCSVFile(this.uploadFile);
|
|
if (res.errors.length > 0) {
|
|
this.outputText =
|
|
"LT:CSV parsing errors:\n" + JSON.stringify(res.errors);
|
|
throw new Error("LT:Errors in CSV file import can not proceed");
|
|
}
|
|
if (res.data) {
|
|
dat = res.data;
|
|
}
|
|
//transform the input csv if it's not a direct match to json (part assembly etc)
|
|
transform(dat, this.ayaType);
|
|
} else {
|
|
dat = await parseJSONFile(this.uploadFile);
|
|
}
|
|
|
|
//strip out any unsupported fields before transmission
|
|
cleanData(dat, this.ayaType);
|
|
|
|
// console.log(
|
|
// "CSV FORMAT:\n",
|
|
// Papa.unparse(dat)
|
|
// );
|
|
|
|
//upload the data
|
|
await this.upload(dat);
|
|
} catch (error) {
|
|
window.$gz.errorHandler.handleFormError(error);
|
|
} finally {
|
|
this.uploading = false;
|
|
}
|
|
},
|
|
async upload(dat) {
|
|
try {
|
|
if (this.doUpdate == true) {
|
|
let dialogResult = await window.$gz.dialog.confirmGeneric(
|
|
"AdminImportUpdateWarning",
|
|
"warning"
|
|
);
|
|
if (dialogResult == false) {
|
|
return;
|
|
}
|
|
}
|
|
|
|
const res = await window.$gz.api.post("import", {
|
|
data: dat,
|
|
atype: this.ayaType,
|
|
doImport: this.doImport,
|
|
doUpdate: this.doUpdate
|
|
});
|
|
if (res.error) {
|
|
window.$gz.errorHandler.handleFormError(res.error);
|
|
} else {
|
|
//result is an array of strings
|
|
let outText = "";
|
|
res.data.forEach(function appendImportResultItem(value) {
|
|
outText += value + "\n";
|
|
});
|
|
outText += "LT:ProcessCompleted\n";
|
|
this.outputText = await window.$gz.translation.translateStringWithMultipleKeysAsync(
|
|
outText
|
|
);
|
|
}
|
|
} catch (error) {
|
|
window.$gz.errorHandler.handleFormError(error);
|
|
}
|
|
},
|
|
handleSelected() {}
|
|
}
|
|
};
|
|
|
|
/////////////////////////////
|
|
//
|
|
//
|
|
function clickHandler(menuItem) {
|
|
if (!menuItem) {
|
|
return;
|
|
}
|
|
const m = window.$gz.menu.parseMenuItem(menuItem);
|
|
if (m.owner == FORM_KEY && !m.disabled) {
|
|
switch (m.key) {
|
|
default:
|
|
window.$gz.eventBus.$emit(
|
|
"notify-warning",
|
|
FORM_KEY + "::context click: [" + m.key + "]"
|
|
);
|
|
}
|
|
}
|
|
}
|
|
|
|
//////////////////////
|
|
//
|
|
//
|
|
function generateMenu() {
|
|
const menuOptions = {
|
|
isMain: true,
|
|
icon: "$ayiFileImport",
|
|
title: "Import",
|
|
helpUrl: "adm-import",
|
|
menuItems: []
|
|
};
|
|
|
|
window.$gz.eventBus.$emit("menu-change", menuOptions);
|
|
}
|
|
|
|
//////////////////////////////////////////////////////////
|
|
//
|
|
// Ensures UI translated text is available
|
|
//
|
|
async function fetchTranslatedText() {
|
|
await window.$gz.translation.cacheTranslations([
|
|
"AyaType",
|
|
"ImportNewRecords",
|
|
"UpdateExistingRecords",
|
|
"AdminImportUpdateWarning",
|
|
"FileToImport",
|
|
"ProcessCompleted"
|
|
]);
|
|
}
|
|
|
|
//////////////////////
|
|
//
|
|
//
|
|
async function populateSelectionLists(vm) {
|
|
await window.$gz.enums.fetchEnumList("importable");
|
|
vm.selectLists.importableAyaTypes = window.$gz.enums.getSelectionList(
|
|
"importable"
|
|
);
|
|
}
|
|
|
|
//////////////////////////////////////////////////////////
|
|
//
|
|
// Parse csv and return results as JSON, handle errors if any
|
|
//
|
|
async function parseCSVFile(file) {
|
|
return new Promise(function(complete, error) {
|
|
Papa.parse(file, {
|
|
header: true,
|
|
skipEmptyLines: true,
|
|
// dynamicTyping: true,
|
|
worker: true,
|
|
complete,
|
|
error
|
|
});
|
|
});
|
|
}
|
|
|
|
//////////////////////////////////////////////////////////
|
|
//
|
|
// reformat JSON that was imported for types that need
|
|
// to be transformed (partassembly etc)
|
|
//
|
|
function transform(dat, atype) {
|
|
switch (atype) {
|
|
case window.$gz.type.PartAssembly:
|
|
//json from csv needs reformatting
|
|
dat.forEach(z => {
|
|
var newItems = [];
|
|
z.Items.split(",").forEach(x => {
|
|
let o = x.split("|");
|
|
newItems.push({
|
|
PartNameViz: o[0],
|
|
Quantity: Number.parseFloat(o[1])
|
|
});
|
|
});
|
|
z.Items = newItems;
|
|
});
|
|
break;
|
|
case window.$gz.type.TaskGroup:
|
|
dat.forEach(z => {
|
|
var newItems = [];
|
|
z.Items.split(",").forEach((x, i) => {
|
|
newItems.push({
|
|
Sequence: i + 1,
|
|
Task: x
|
|
});
|
|
});
|
|
z.Items = newItems;
|
|
});
|
|
break;
|
|
}
|
|
}
|
|
|
|
//////////////////////////////////////////////////////////
|
|
//
|
|
// Open local json file, read, parse and return results as JSON, handle errors if any
|
|
//
|
|
async function parseJSONFile(file) {
|
|
return new Promise(function(complete) {
|
|
const reader = new FileReader();
|
|
reader.addEventListener(
|
|
"load",
|
|
() => {
|
|
// this will then display a text file
|
|
complete(JSON.parse(reader.result));
|
|
},
|
|
false
|
|
);
|
|
if (file) {
|
|
reader.readAsText(file);
|
|
}
|
|
});
|
|
}
|
|
|
|
//////////////////////////////////////////////////////////
|
|
//
|
|
// remove unsupported props from data
|
|
//
|
|
function cleanData(dat, atype) {
|
|
var allowedProps = [];
|
|
//Note: convention here is any ID field that is linked object we want to support gets renamed here to replace *id with *viz if viz not already present
|
|
//at back end it will attempt to match up but not create if not existing
|
|
switch (atype) {
|
|
case window.$gz.type.Customer:
|
|
allowedProps.push(
|
|
...[
|
|
"Name",
|
|
"Active",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"WebAddress",
|
|
"AlertNotes",
|
|
"BillHeadOffice",
|
|
"HeadOfficeViz",
|
|
"TechNotes",
|
|
"AccountNumber",
|
|
"ContractViz",
|
|
"ContractExpires",
|
|
"Phone1",
|
|
"Phone2",
|
|
"Phone3",
|
|
"Phone4",
|
|
"Phone5",
|
|
"EmailAddress",
|
|
"PostAddress",
|
|
"PostCity",
|
|
"PostRegion",
|
|
"PostCountry",
|
|
"PostCode",
|
|
"Address",
|
|
"City",
|
|
"Region",
|
|
"Country",
|
|
"Latitude",
|
|
"Longitude"
|
|
]
|
|
);
|
|
break;
|
|
case window.$gz.type.HeadOffice:
|
|
allowedProps.push(
|
|
...[
|
|
"Name",
|
|
"Active",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"WebAddress",
|
|
"TechNotes",
|
|
"AccountNumber",
|
|
"ContractViz",
|
|
"ContractExpires",
|
|
"Phone1",
|
|
"Phone2",
|
|
"Phone3",
|
|
"Phone4",
|
|
"Phone5",
|
|
"EmailAddress",
|
|
"PostAddress",
|
|
"PostCity",
|
|
"PostRegion",
|
|
"PostCountry",
|
|
"PostCode",
|
|
"Address",
|
|
"City",
|
|
"Region",
|
|
"Country",
|
|
"Latitude",
|
|
"Longitude"
|
|
]
|
|
);
|
|
break;
|
|
case window.$gz.type.Part:
|
|
allowedProps.push(
|
|
...[
|
|
"Name",
|
|
"Active",
|
|
"Description",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"ManufacturerViz",
|
|
"ManufacturerNumber",
|
|
"WholeSalerViz",
|
|
"WholeSalerNumber",
|
|
"AlternativeWholeSalerViz",
|
|
"AlternativeWholeSalerNumber",
|
|
"Cost",
|
|
"Retail",
|
|
"UnitOfMeasure",
|
|
"UPC",
|
|
"PartSerialsViz"
|
|
]
|
|
);
|
|
break;
|
|
case window.$gz.type.PartAssembly:
|
|
allowedProps.push(
|
|
...[
|
|
"Name",
|
|
"Active",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"Items",
|
|
"PartNameViz",
|
|
"Quantity"
|
|
]
|
|
);
|
|
break;
|
|
case window.$gz.type.PartInventory:
|
|
allowedProps.push(
|
|
...["Description", "PartViz", "PartWarehouseViz", "Quantity"]
|
|
);
|
|
break;
|
|
|
|
case window.$gz.type.PartWarehouse:
|
|
allowedProps.push(...["Name", "Active", "Notes", "Wiki", "Tags"]);
|
|
break;
|
|
case window.$gz.type.Project:
|
|
allowedProps.push(
|
|
...[
|
|
"Name",
|
|
"Active",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"DateStarted",
|
|
"DateCompleted",
|
|
"ProjectOverseerViz",
|
|
"AccountNumber"
|
|
]
|
|
);
|
|
break;
|
|
case window.$gz.type.ServiceRate:
|
|
allowedProps.push(
|
|
...[
|
|
"Name",
|
|
"Active",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"AccountNumber",
|
|
"Cost",
|
|
"Charge",
|
|
"Unit",
|
|
"ContractOnly"
|
|
]
|
|
);
|
|
break;
|
|
case window.$gz.type.TaskGroup:
|
|
allowedProps.push(...["Name", "Active", "Notes", "Items"]);
|
|
break;
|
|
case window.$gz.type.TravelRate:
|
|
allowedProps.push(
|
|
...[
|
|
"Name",
|
|
"Active",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"AccountNumber",
|
|
"Cost",
|
|
"Charge",
|
|
"Unit",
|
|
"ContractOnly"
|
|
]
|
|
);
|
|
break;
|
|
case window.$gz.type.Unit:
|
|
allowedProps.push(
|
|
...[
|
|
"Serial",
|
|
"Active",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"CustomerViz",
|
|
"ParentUnitViz",
|
|
"UnitModelNameViz",
|
|
"UnitHasOwnAddress",
|
|
"BoughtHere",
|
|
"PurchasedFromVendorViz",
|
|
"Receipt",
|
|
"PurchasedDate",
|
|
"Description",
|
|
"ReplacedByUnitViz",
|
|
"OverrideModelWarranty",
|
|
"WarrantyLength",
|
|
"WarrantyTerms",
|
|
"ContractViz",
|
|
"ContractExpires",
|
|
"Metered",
|
|
"LifeTimeWarranty",
|
|
"Text1",
|
|
"Text2",
|
|
"Text3",
|
|
"Text4",
|
|
"Address",
|
|
"City",
|
|
"Region",
|
|
"Country",
|
|
"Latitude",
|
|
"Longitude"
|
|
]
|
|
);
|
|
break;
|
|
case window.$gz.type.UnitModel:
|
|
allowedProps.push(
|
|
...[
|
|
"Name",
|
|
"Active",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"VendorViz",
|
|
"UPC",
|
|
"LifeTimeWarranty",
|
|
"IntroducedDate",
|
|
"Discontinued",
|
|
"DiscontinuedDate",
|
|
"WarrantyLength",
|
|
"WarrantyTerms"
|
|
]
|
|
);
|
|
break;
|
|
case window.$gz.type.Vendor:
|
|
allowedProps.push(
|
|
...[
|
|
"Name",
|
|
"Active",
|
|
"Notes",
|
|
"Wiki",
|
|
"Tags",
|
|
"Contact",
|
|
"ContactNotes",
|
|
"AlertNotes",
|
|
"WebAddress",
|
|
"AccountNumber",
|
|
"Phone1",
|
|
"Phone2",
|
|
"Phone3",
|
|
"Phone4",
|
|
"Phone5",
|
|
"EmailAddress",
|
|
"PostAddress",
|
|
"PostCity",
|
|
"PostRegion",
|
|
"PostCountry",
|
|
"PostCode",
|
|
"Address",
|
|
"City",
|
|
"Region",
|
|
"Country",
|
|
"Latitude",
|
|
"Longitude"
|
|
]
|
|
);
|
|
break;
|
|
}
|
|
|
|
//Strip out any records that have fields not on our allowed list
|
|
dat.forEach(z => {
|
|
for (const prop in z) {
|
|
if (allowedProps.includes(prop) == false) {
|
|
delete z[prop];
|
|
} else {
|
|
if (prop == "Tags") {
|
|
//if it's coming from csv then Tags will be a string with comma separated items like this: blue,white,red
|
|
//if it's json it will already be an array
|
|
if (z.Tags && typeof z.Tags === "string") {
|
|
z.Tags = z.Tags.split(",");
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
</script>
|