fucking finally figured out why excerpt not showing, template had item.index as they key in two different places inside the template which apparently fucks everything up

This commit is contained in:
2020-04-08 21:56:38 +00:00
parent 5e62a838d6
commit d8f7aa9c0a
2 changed files with 90 additions and 26 deletions

View File

@@ -36,36 +36,58 @@
</v-col>
<v-col cols="12">
<p v-if="!results.length">{{ $ay.t("NoResults") }}</p>
<v-card v-if="results.length" max-width="900">
<ul>
<template v-for="item in items">
<li :key="item.index">
{{ item
}}<v-btn icon @click="getExcerpt(item)">
<v-icon color="grey lighten-1" large
>fa-info-circle</v-icon
>
</v-btn>
</li>
</template>
</ul>
<v-btn @click="testBuild()">
TEST BUILD
</v-btn>
</v-col>
<v-col cols="12">
<p v-if="!items.length">{{ $ay.t("NoResults") }}</p>
<v-card v-if="items.length" max-width="900">
<v-list>
<v-subheader v-if="maxResultsReturned">
<span>({{ $ay.t("TooManyResults") }})</span>
</v-subheader>
<template v-for="(item, i) in results">
<v-subheader :key="i" v-if="item.subheader"
<template v-for="(item,ind) in items">
<v-subheader :key="ind" v-if="item.subheader"
><v-icon large class="mr-2">{{ item.icon }}</v-icon
><span class="title">{{
item.subheader
}}</span></v-subheader
>
<v-list-item link :key="i">
<v-list-item link :key="item.index">
<v-list-item-content>
<v-list-item-title
@click="openItem"
v-text="item.name"
></v-list-item-title>
<v-list-item-subtitle>{{
item.info
}}</v-list-item-subtitle>
</v-list-item-content>
<v-list-item-action>
<v-btn icon @click="getExcerpt">
<v-btn icon @click="getExcerpt(item)">
<v-icon color="grey lighten-1" large
>fa-info-circle</v-icon
>
</v-btn>
</v-list-item-action>
</v-list-item>
<!-- {{ item }} -->
</template>
</v-list>
</v-card>
@@ -74,6 +96,7 @@
</v-form>
</v-col>
</v-row>
{{ items }}
</v-container>
</template>
@@ -142,13 +165,32 @@ export default {
searchPhrase: null,
searchObjectType: 0,
results: [],
items: [
{
name: "Awesome Plastic Car 32",
type: 2,
id: 7,
info: null,
index: 1
},
{
name: "Handcrafted Metal Towels 117",
type: 2,
id: 92,
subheader: "Widget",
icon: "fa-vial",
info: null,
index: 2
},
{ name: "Awesome Plastic Car 32", type: 2, id: 7, info: null, index: 3 }
],
maxResultsReturned: false,
formState: {
ready: false,
dirty: false,
valid: true,
readOnly: false,
loading: true,
loading: false,
errorBoxMessage: null,
appError: null,
serverError: {}
@@ -158,15 +200,37 @@ export default {
},
methods: {
test(item) {
item.name = "NEW NAME";
},
testBuild() {
console.log("TEST BUILD");
for (let i = 4; i < 10; i++) {
console.log("Pushing item ", i);
this.items.push({
name: "Awesome Plastic Car" + i,
type: 2,
id: 7,
info: null,
index: i
});
}
},
openItem(item) {
console.log("open item", item);
},
getExcerpt(item) {
console.log("get excerpt", item);
item.info = "***NEW INFO HERE****";
this.$forceUpdate();
// let v = this.results[i];
// console.log("getExcerpt results before:", this.results[i].info);
// v.info = "NEW INFO HERE";
// console.log("getExcerpt v after:", this.results[i].info);
// Vue.set(this.results, i, v);
},
getDataFromApi() {
let vm = this;
if (!vm.searchPhrase) {
if (!vm.searchPhrase || vm.formState.loading) {
return;
}
@@ -181,6 +245,7 @@ export default {
}
*
*/
console.log("Searching...");
window.$gz.api
.upsert(API_BASE_URL, {
phrase: vm.searchPhrase,
@@ -194,16 +259,17 @@ export default {
vm.formState.serverError = res.error;
window.$gz.form.setErrorBoxErrors(vm);
} else {
console.log("Results returned, processing...");
vm.maxResultsReturned =
res.data.searchResults.length == MAX_RESULTS;
//vm.results = res.data.searchResults;
vm.items = [];
let newResults = [];
let nDex = 0;
let lastType = -1;
for (let i = 0; i < res.data.searchResults.length; i++) {
let item = res.data.searchResults[i];
if (item.type != lastType) {
//change of type, set subheader props
let tsub = window.$gz._.find(vm.selectLists.objectTypes, [
@@ -211,20 +277,23 @@ export default {
item.type
]);
if (tsub != null) {
item["subheader"] = tsub.name;
} else {
item["subheader"] = "TYPE " + item.type;
}
//this is breaking shit
// if (tsub != null) {
// item.subheader = tsub.name;
// } else {
// item.subheader = "TYPE " + item.type;
// }
item["icon"] = window.$gz.util.iconForCoreType(item.type);
item.icon = window.$gz.util.iconForCoreType(item.type);
lastType = item.type;
}
item.info = null;
item.index = ++nDex;
newResults.push(item);
}
console.log(newResults);
vm.results = newResults;
console.log("Pusshing newResults into items now...");
vm.items = newResults;
//Update the form status
window.$gz.form.setFormState({