add topping recipe display & fix bugs

This commit is contained in:
pakintada@gmail.com 2024-02-07 15:39:19 +07:00
parent 7d6988f581
commit ece4cef205
8 changed files with 421 additions and 33 deletions

View file

@ -154,22 +154,6 @@ export class MaterialSettingsComponent implements OnInit {
// - find matching form
// - if not exist, create new form
let pushableFlag = false;
let foundFlag = false;
// this.materialSetting.controls.forEach((control, index) => {
// console.log("different id", "checkon value", control.value,control.value.id, id);
// if(foundFlag){
// continue;
// }
// if (control == undefined ||(control.value as any).id == id) {
// pushableFlag = false;
// foundFormIndex = index;
// } else {
// // set to last index, if not found. Meaning this is new form
// foundFormIndex = this.materialSetting.length;
// }
// });
// filter find index
let foundFormIndex = this.materialSetting.controls.findIndex((control) => {

View file

@ -1,3 +1,7 @@
<div class="justify-center w-full flex flex-row sticky top-0 z-10">
<button class="btn w-1/2" (click)="addRow()">Add</button>
<button class="btn w-1/2" (click)="removeRow()">Remove</button>
</div>
<table class="table" [formGroup]="recipeListForm">
<thead>
<tr class="bg-gray-200">
@ -13,11 +17,10 @@
*ngFor="let mat of recipeListData.controls; let i = index"
>
<tr
class="bg-white border-b max-h-4"
class="bg-white border-b max-h-4"
[ngClass]="{
'bg-red-400': selectedRecipeList.includes(i)
}"
formGroupName="{{ i }}"
(click)="addToSelection(i)"
(mousedown)="initHoldEvent()"
@ -194,10 +197,7 @@
</tr>
</tbody>
</table>
<div class="justify-center w-full flex flex-row sticky bottom-0">
<button class="btn w-1/2" (click)="addRow()">Add</button>
<button class="btn w-1/2" (click)="removeRow()">Remove</button>
</div>
<!-- show string param modal -->

View file

@ -45,6 +45,7 @@ import Lang from 'src/app/shared/helpers/lang';
export class RecipeListComponent implements OnInit {
@Input({ required: true }) productCode!: string;
@Input() noFetch: boolean = false;
@Input() recipeList: any | undefined = undefined;
@Output() recipeListFormChange = new EventEmitter<unknown[]>();
materialList: MaterialCode[] = [];
@ -117,10 +118,24 @@ export class RecipeListComponent implements OnInit {
(await this._materialService.getFullMaterialDetail()).subscribe((materials) => {
this.fullMaterialList = materials;
this.categoriedMaterial = this.ListCategory();
// console.log(this.categoriedMaterial);
});
console.log(this.categoriedMaterial);
// remapping missing material attr to recipeListData
this.recipeListData.controls.forEach((recipeList: any, index: number) => {
// console.log("recipeList", recipeList);
// do map name
let materialName = this.fullMaterialList!.find(
(mat) => mat.materialId.toString() == recipeList.get('materialPathId').value.toString()
);
if(materialName){
recipeList.get('name').setValue(materialName.name);
}
})
});
// this do not fetch recipe list when initialized
// use when doing `topping`
if(!this.noFetch){
@ -251,6 +266,120 @@ export class RecipeListComponent implements OnInit {
});
this.isMatLoaded = true;
});
} else if(this.recipeList != undefined){
this.recipeList.forEach( (recipeDetailMat: RecipeDetailMat, index: number) => {
// StringParam
if (
recipeDetailMat.StringParam != '' ||
recipeDetailMat.StringParam != null
) {
let currStringParam = new StringParam(recipeDetailMat.StringParam);
let stringParamList = currStringParam.extract().as_list();
let stringParamListTransform: any[] = [];
for (let param of stringParamList) {
// boolean transform
if (param.pvalue == 'true') {
param.pvalue = true;
} else if (param.pvalue == 'false') {
param.pvalue = false;
}
}
this.stringParamData.push(
this._formBuilder.array(stringParamListTransform)
)
this.stringParams[index] = stringParamList;
}
// --------------- mapping missing data ---------------
// map name
console.log("use recipeList input; ", recipeDetailMat);
this.recipeListData.push(
this._formBuilder.group({
StringParam: [
{
value: recipeDetailMat.StringParam,
disabled: !this.isEditable(),
},
],
isUse: [
{ value: recipeDetailMat.isUse, disabled: !this.isEditable() },
],
materialPathId: [
{
value: recipeDetailMat.materialPathId,
disabled: !this.isEditable(),
},
],
name: [{ value: recipeDetailMat.name, disabled: true }],
mixOrder: [
{
value: recipeDetailMat.mixOrder,
disabled: !this.isEditable(),
},
],
stirTime: [
{
value: recipeDetailMat.stirTime / 10,
disabled: !this.isEditable(),
},
],
powderGram: [
{
value: recipeDetailMat.powderGram,
disabled: !this.isEditable(),
},
],
powderTime: [
{
value: recipeDetailMat.powderTime,
disabled: !this.isEditable(),
},
],
syrupGram: [
{
value: recipeDetailMat.syrupGram,
disabled: !this.isEditable(),
},
],
syrupTime: [
{
value: recipeDetailMat.syrupTime,
disabled: !this.isEditable(),
},
],
waterCold: [
{
value: recipeDetailMat.waterCold,
disabled: !this.isEditable(),
},
],
waterYield: [
{
value: recipeDetailMat.waterYield,
disabled: !this.isEditable(),
},
],
feedPattern: [
{
value: recipeDetailMat.feedPattern,
disabled: !this.isEditable(),
}
],
feedParameter: [
{
value: recipeDetailMat.feedParameter,
disabled: !this.isEditable(),
}
]
})
);
});
}
// event listener
@ -374,7 +503,7 @@ export class RecipeListComponent implements OnInit {
return;
}
this.selectedRecipeList.push(i);
// console.log("selected recipe list", this.selectedRecipeList);
console.log("selected recipe list", this.selectedRecipeList);
}

View file

@ -1,4 +1,4 @@
<main class="relative overflow-auto max-h-[80%] h-[88vh] bg-stone-100">
<main class="relative overflow-auto max-h-[80%] h-[88vh] w-[84vw] bg-stone-100">
<div class="w-full m-4 space-x-4 sticky top-0 bg-stone-100 z-10">
<!-- topping builder -->
<button class="btn" onclick="topping_builder_modal.showModal()">
@ -123,7 +123,7 @@
<th>Other Name</th>
<th>Desciption</th>
<!-- <th>Default</th> -->
<th>Default</th>
<!-- <th>Default</th> -->
</tr>
</thead>
@ -131,7 +131,7 @@
formArrayName="toppingGroup"
*ngFor="let tpg of toppingGroup.controls; let i = index"
>
<tr formGroupName="{{ i }}">
<tr class="hover:bg-gray-300" formGroupName="{{ i }}" (click)="showToppingList(tpg.value.groupID)">
<td>
<input class="toggle" type="checkbox" formControlName="inUse" />
</td>
@ -154,10 +154,10 @@
<input class="input input-sm input-bordered" formControlName="Desc" />
</td>
<!-- <td>{{tpg.idDefault}}</td> -->
<div class="tooltip tooltip-warning" data-tip="Default select id not in group or does not set" *ngIf="!isDefaultInMember(getAttrFromForm(i, 'groupID'), getAttrFromForm(i, 'idDefault'))">
<!-- <div class="tooltip tooltip-warning" data-tip="Default select id not in group or does not set" *ngIf="!isDefaultInMember(getAttrFromForm(i, 'groupID'), getAttrFromForm(i, 'idDefault'))">
<p class="text-red-500 text-5xl">⚠️</p>
</div>
<td class="grid grid-flow-row grid-cols-3 rounded-md gap-2">
</div> -->
<!-- <td class="grid grid-flow-row grid-cols-3 rounded-md gap-2">
@ -179,10 +179,64 @@
}}
({{ m }})
</button>
<!-- <button>Edit</button> -->
</div>
</td>
</td> -->
</tr>
</tbody>
</table>
<dialog id="topping_list_modal" class="modal">
<div class="modal-box max-w-screen-2xl">
<!-- topping list data here -->
<div *ngIf="currentMembersData != undefined">
<div [formGroup]="currentMemberDataForm">
<div formArrayName="currentMembersOfToppingGroup" *ngFor="let m of currentMembersOfToppingGroup.controls; let i = index">
<div formGroupName="{{i}}">
<details class="collapse collapse-arrow space-y-4 p-2">
<summary class="collapse-title">{{currentMembersData[i]['name']}}</summary>
<div class="flex space-x-4">
<div class="flex items-center space-x-2 p-2">
<p>ID</p>
<input class="input input-bordered" type="text" formControlName="id">
</div>
<div class="flex items-center space-x-2 p-2">
<p>Name</p>
<input class="input input-bordered" type="text" formControlName="name">
</div>
</div>
<app-recipe-list
[productCode]="productCode!"
[noFetch]="true"
[recipeList]="currentMembersData[i]['recipes']"
(recipeListFormChange)="onRecipeListFormChange($event)"
>
</app-recipe-list>
</details>
</div>
</div>
</div>
</div>
<div class="modal-action sticky bottom-0 right-0">
<form method="dialog">
<button class="btn btn-warning">Close</button>
</form>
</div>
</div>
</dialog>
</main>

View file

@ -42,6 +42,7 @@ export class ToppingsComponent implements OnInit {
// topping list keys
toppingListKeys: string[] = [];
// modals controller
showToppingBuilder: boolean = false;
// forms
@ -55,10 +56,20 @@ export class ToppingsComponent implements OnInit {
productCode: string | undefined;
addingNewRecipeList: boolean = false;
// current data variables
currentMembersData: { [key: string]: any }[] | undefined = undefined;
currentMemberDataForm: FormGroup = this._formBuilder.group({
currentMembersOfToppingGroup: this._formBuilder.array([]),
});
get toppingGroup(): FormArray {
return this.toppingGroupForm.get('toppingGroup') as FormArray;
}
get currentMembersOfToppingGroup(): FormArray {
return this.currentMemberDataForm.get('currentMembersOfToppingGroup') as FormArray;
}
// ----------------------------------------------------------------------------
constructor(
@ -219,4 +230,68 @@ export class ToppingsComponent implements OnInit {
return this.getMemberByGroupId(group).includes(member.toString());
};
// topping list form structure
createToppingListForm = (data: ToppingList) => {
return this._formBuilder.group({
ExtendID: data.ExtendID,
OnTOP: data.OnTOP,
MenuStatus: data.MenuStatus,
cashPrice: data.cashPrice,
disable: data.disable,
disable_by_cup: data.disable_by_cup,
disable_by_ice: data.disable_by_ice,
EncoderCount: data.EncoderCount,
id: data.id,
isUse: data.isUse,
isShow: data.isShow,
StringParam: data.StringParam,
name: data.name,
nonCashPrice: data.nonCashPrice,
otherName: data.otherName,
productCode: data.productCode,
recipes: data.recipes,
total_time: data.total_time,
total_weight: data.total_weight,
useGram: data.useGram,
weight_float: data.weight_float,
})
}
// use when selected a group, show its member data
showToppingList = (groupID: string) => {
// check empty
console.log("toppingList.empty", this.toppingLists, "groupMembersMap.empty", this.groupMembersMap);
// do another mapping, just to make sure data is included
this.mapNameToMember();
if(this.currentMembersData != undefined){
this.currentMembersData = undefined;
this.currentMembersOfToppingGroup.clear();
}
let members = this.groupMembersMap[groupID]['members'];
members.forEach((member_id: string) => {
// get each member data from group
let member_data = this.getMemberData(groupID, member_id);
if(this.currentMembersData == undefined){
this.currentMembersData = [];
}
this.currentMembersData!.push(member_data);
this.currentMembersOfToppingGroup.push(this.createToppingListForm(member_data));
});
// this.isShowToppingList = true;
// query selector
let toppingListModal = document.getElementById('topping_list_modal') as any;
toppingListModal?.showModal();
console.log('current members data', this.currentMembersData);
console.log("current members of topping group", this.currentMembersOfToppingGroup);
}
}

View file

@ -499,6 +499,85 @@ func (d *Data) SetValuesToRecipe(base_recipe []models.Recipe01, recipe models.Re
}
}
func (d *Data) SetValuesToMaterialSetting(base_mat_setting []models.MaterialSetting, updated_mat_setting models.MaterialSetting) {
not_found := false
global_idx := 0
for index, v := range base_mat_setting {
// find matched id
if v.ID == updated_mat_setting.ID {
// change only changed values
for k, v := range updated_mat_setting.ToMap() {
if !reflect.DeepEqual(base_mat_setting[index].ToMap()[k], v) {
d.taoLogger.Log.Debug("SetValuesToMaterialSetting", zap.Any("key", k), zap.Any("old", base_mat_setting[index].ToMap()[k]), zap.Any("new", v))
base_mat_setting[index].ToMap()[k] = v
}
}
} else {
not_found = true
global_idx = index
}
}
// is new value
if not_found {
base_mat_setting[global_idx+1] = updated_mat_setting
}
}
func (d *Data) SetValuesToToppingList(base_topping_list []models.ToppingList, updated_topping_list models.ToppingList) {
not_found := false
global_idx := 0
for index, v := range base_topping_list {
// find matched id
if v.ID == updated_topping_list.ID {
// change only changed values
for k, v := range updated_topping_list.ToMap() {
if !reflect.DeepEqual(base_topping_list[index].ToMap()[k], v) {
d.taoLogger.Log.Debug("SetValuesToToppingList", zap.Any("key", k), zap.Any("old", base_topping_list[index].ToMap()[k]), zap.Any("new", v))
base_topping_list[index].ToMap()[k] = v
}
}
} else {
not_found = true
global_idx = index
}
}
// is new value
if not_found {
base_topping_list[global_idx+1] = updated_topping_list
}
}
func (d *Data) SetValuesToToppingGroupList(base_topping_group_list []models.ToppingGroup, updated_topping_group_list models.ToppingGroup) {
not_found := false
global_idx := 0
for index, v := range base_topping_group_list {
// find matched id
if v.GroupID == updated_topping_group_list.GroupID {
// change only changed values
for k, v := range updated_topping_group_list.ToMap() {
if !reflect.DeepEqual(base_topping_group_list[index].ToMap()[k], v) {
d.taoLogger.Log.Debug("SetValuesToToppingGroup", zap.Any("key", k), zap.Any("old", base_topping_group_list[index].ToMap()[k]), zap.Any("new", v))
base_topping_group_list[index].ToMap()[k] = v
}
}
} else {
not_found = true
global_idx = index
}
}
// is new value
if not_found {
base_topping_group_list[global_idx+1] = updated_topping_group_list
}
}
func (d *Data) GetMaterialSetting(countryID, filename string) []models.MaterialSetting {
result := make([]models.MaterialSetting, 0)

View file

@ -57,6 +57,19 @@ type MaterialSetting struct {
RawMaterialUnit string `json:"RawMaterialUnit"`
}
func (r *MaterialSetting) ToMap() map[string]interface{} {
var m map[string]interface{}
recipeRecord, _ := json.Marshal(r)
json.Unmarshal(recipeRecord, &m)
return m
}
func (r *MaterialSetting) FromMap(m MaterialSetting) MaterialSetting {
recipeRecord, _ := json.Marshal(m)
json.Unmarshal(recipeRecord, &r)
return *r
}
type Recipe01 struct {
Description string `json:"Description"`
ExtendID int `json:"ExtendID"`
@ -140,6 +153,19 @@ type ToppingGroup struct {
OtherName string `json:"otherName"`
}
func (r *ToppingGroup) ToMap() map[string]interface{} {
var m map[string]interface{}
recipeRecord, _ := json.Marshal(r)
json.Unmarshal(recipeRecord, &m)
return m
}
func (r *ToppingGroup) FromMap(m map[string]interface{}) ToppingGroup {
recipeRecord, _ := json.Marshal(m)
json.Unmarshal(recipeRecord, &r)
return *r
}
type ToppingList struct {
ExtendID int `json:"ExtendID"`
OnTOP bool `json:"OnTOP"`
@ -163,3 +189,16 @@ type ToppingList struct {
UseGram bool `json:"useGram"`
Weight_float int `json:"weight_float"`
}
func (r *ToppingList) ToMap() map[string]interface{} {
var m map[string]interface{}
recipeRecord, _ := json.Marshal(r)
json.Unmarshal(recipeRecord, &m)
return m
}
func (r *ToppingList) FromMap(m map[string]interface{}) ToppingList {
recipeRecord, _ := json.Marshal(m)
json.Unmarshal(recipeRecord, &r)
return *r
}

View file

@ -504,6 +504,34 @@ func (rr *RecipeRouter) updateRecipe(w http.ResponseWriter, r *http.Request) {
})
}
func (rr *RecipeRouter) updateMaterialSetting(w http.ResponseWriter, r *http.Request) {
w.Header().Add("Content-Type", "application/json")
country := r.URL.Query().Get("country")
filename := r.URL.Query().Get("filename")
rr.taoLogger.Log.Debug("RecipeRouter.updateMaterialSetting", zap.Any("country", country), zap.Any("filename", filename))
countryID, err := rr.data.GetCountryIDByName(country)
if err != nil {
http.Error(w, fmt.Sprintf("Country Name: %s not found!!!", country), http.StatusNotFound)
return
}
updateMutex.Lock()
defer updateMutex.Unlock()
// get material setting
materialSetting := rr.data.GetMaterialSetting(countryID, filename)
if len(materialSetting) == 0 {
http.Error(w, fmt.Sprintf("Recipe country: %s file: %s found empty settings.", country, filename), http.StatusNotFound)
return
}
// TODO: create commit and set change
}
func (rr *RecipeRouter) getSavedRecipes(w http.ResponseWriter, r *http.Request) {
file_version := chi.URLParam(r, "filename_version_only")