{
	"name": "form/nc/nc-work-center/nc-work-center.json",
	"layout": {
		"component": "nc-form",
		"attribute": {
			"id": "nc-work-center"
		},
		"element": [
			{
				"component": "nc-modal",
				"attribute": {
					":closeOnClick": "true",
					":header": "hdr.work_center.preview_modal?.header",
					":ok-text": "hdr.work_center.preview_modal?.ok",
					":show": "rec.document_preview_modal === true",
					"v-on:modal-ok": "openDocumentPreview('close')"
				},
				"element": [
					{
						"component": "nc-document-preview",
						"attribute": {
							"id": "nc-document-preview-modal-canvas",
							":loadable": "rec.document_loadable",
							":name": "rec.document_name",
							":src": "rec.document_data",
							":viewStyle": "rec.document_style_fullpage"
						}
					}
				]
			},
			{
				"component": "nc-row",
				"attribute": {
					":style": "{'margin-top': '-1.25em', 'height': rec.tab_open ? '4.5em' : '0.1em'}"
				},
				"element": [
					{
						"component": "nc-col",
						"attribute": {
							"width": "0.5em",
							"style": "margin-left: -1.25em",
							"v-on:click": "tabChanged('open')"
						},
						"element": [
							{
								"component": "nc-icon",
								"attribute": {
									":icon": "rec.tab_open ? 'caret-down' : 'caret-right'",
									":style": "rec.tab_open ? 'margin-top: -1.9em; margin-left: -0.20em' : 'margin-top: 0.4em; '"
								}
							}
						]
					},
					{
						"component": "nc-col",
						"attribute": {
							"v-if": "rec.tab_open",
							"width": "auto",
							"style": "margin-bottom: 0.5em;"
						},
						"element": [
							{
								"component": "nc-tab",
								"attribute": {
									"model": "rec.tab",
									"v-on:change": "tabChanged('tab')"
								}
							}
						]
					},
					{
						"component": "nc-col",
						"attribute": {
							"v-if": "rec.tab_open",
							"width": "20em",
							"class": ["nc-margin-left"]
						},
						"element": [
							{
								"component": "nc-label-dropdown",
								"text": "Connection",
								"attribute": {
									"model": "rec.connection",
									"v-on:change": "tabChanged('tab')"
								}
							}
						]
					}
				]
			},
			{
				"component": "nc-row",
				"attribute": {
					"v-if": "rec.tab !== 'work-center'"
				},
				"element": [
					{
						"component": "nc-grid",
						"attribute": {
							"id": "external",
							"model": "grid.external",
							":doesExternalFilterPass-": "doesExternalFilterPass",
							":isExternalFilterPresent-": "isExternalFilterPresent",
							"height": "90.5vh",
							":style": "{width: '100%'}",
							"v-on:grid-row-clicked": "gridRowClicked",
							"v-on:grid-row-double-clicked": "gridRowDoubleClicked"
						}
					}
				]
			},
			{
				"component": "nc-row",
				"attribute": {
					"v-if": "rec.tab === 'work-center'"
				},
				"element": [
					{
						"component": "transition",
						"attribute": {
							"name": "nc-slide-down",
							"v-on:after-enter": "slideDownAfterEnter",
							"v-on:after-leave": "slideDownAfterLeave",
							"v-on:before-enter": "slideDownBeforeEnter",
							"v-on:before-leave": "slideDownBeforeLeave",
							"v-on:enter": "slideDownEnter",
							"v-on:leave": "slideDownLeave"
						},
						"element": [
							{
								"component": "nc-row",
								"attribute": {
									"id": "edit"
								},
								"element": [
									{
										"component": "nc-col",
										"attribute": {
											"width": "21em"
										},
										"element": [
											{
												"component": "nc-row",
												"element": [
													{
														"component": "nc-label-dropdown",
														"text": "Person",
														"attribute": {
															"label-style": "width: 5em;",
															"model": "rec.person",
															":dropdown-style": "!rec.person ? 'border-color: Crimson' : ''",
															"v-on:change": "gridRowClicked('work', null, null, true)"
														}
													}
												]
											},
											{
												"component": "nc-row",
												"element": [
													{
														"component": "nc-label-dropdown",
														"text": "Machine",
														"attribute": {
															"label-style": "width: 5em;",
															"model": "rec.resource",
															"v-on:change": "update('work')"
														}
													}
												]
											}
										]
									},
									{
										"component": "nc-col",
										"attribute": {
											"v-if": "false",
											"width": "2em",
											"class": ["nc-margin-right"]
										},
										"element": [
											{
												"component": "nc-button",
												"attribute": {
													"id": "clear-person-button",
													"v-on:click": "emptyPersonState()",
													"size": "tiny",
													"style": "width: 2em; padding-left: 0.3em",
													":disabled": "!rec.person",
													"icon": "backspace"
												}
											}
										]
									},
									{
										"component": "nc-col",
										"attribute": {
											"width": "55em",
											"class": ["work-center-button-group", "nc-align-top"]
										},
										"element": [
											{
												"component": "nc-row",
												"attribute": {
													"class": ["nc-align-top"]
												},
												"element": [
													{
														"component": "nc-col",
														"attribute": {
															"width": "18em"
														},
														"element": [
															{
																"component": "nc-label-input",
																"text": "Start amount",
																"attribute": {
																	"v-if": "rec.person_in_production",
																	":input-class-": "rec.current.enterable && !rec.current.unproductive && rec.current.started_amount == '' ? 'not-valid-input' : ''",
																	":disabled": "rec.current.unproductive !== '' && rec.focus_field === '' || !rec.current.enterable",
																	"label-style": "width: 7em; text-align: right;",
																	"v-on:change": "fixAmount()",
																	"v-on:focus": "rec.focus_field = 'started_amount'",
																	"v-on:blur": "amountAndInfo()",
																	"model": "rec.current.started_amount"
																}
															},
															{
																"component": "nc-label-dropdown",
																"text": "Unproductive",
																"attribute": {
																	"v-if": "!rec.person_in_production",
																	":disabled": "!rec.current.enterable",
																	"v-on:click": "rec.person_state_unproductive_idx = nc.recordArrayIndex(arr.person_state_unproductive, 'value', rec.person_state_unproductive) || 0",
																	"label-style": "width: 7em; text-align: right;",
																	"model": "rec.person_state_unproductive"
																}
															}
														]
													},
													{
														"component": "nc-col",
														"attribute": {
															"width": "auto"
														},
														"element": [
															{
																"component": "nc-button-group",
																"attribute": {
																	"v-if": "rec.person_in_production"
																},
																"element": [
																	{
																		"component": "nc-button",
																		"attribute": {
																			":id": "'person_' + button.value",
																			"v-on:click": "clickButton(button.value)",
																			"v-for": "button in arr.person_button_group",
																			":disabled": "!rec.current.enterable",
																			"style": "width: 8em; margin-left: 0.1em;",
																			":style": "{'--button-color': button.color}",
																			"class": ["toggle"],
																			":class": "button.value === rec.current.unproductive ? 'active' : ''",
																			":icon": "button.icon"
																		},
																		"element": [
																			{
																				":id": "'span-'+button.value",
																				"component": "nc-span",
																				"text": "{{button.show}}"
																			}
																		]
																	}
																]
															},
															{
																"component": "nc-button-group",
																"attribute": {
																	"v-if": "!rec.person_in_production"
																},
																"element": [
																	{
																		"component": "nc-button",
																		"attribute": {
																			":id": "'unproductive_' + button.value",
																			"v-on:click": "clickButton(button.value)",
																			"v-for": "button in arr.unproductive_button_group",
																			":disabled": "!rec.current.enterable",
																			"style": "width: 8em; margin-left: 0.1em;",
																			":style": "{'--button-color': button.color}",
																			"class": ["toggle"],
																			":class": "button.value === rec.current.unproductive ? 'active' : ''",
																			":icon": "button.icon"
																		},
																		"element": [
																			{
																				":id": "'span-'+button.value",
																				"component": "nc-span",
																				"text": "{{button.show}}"
																			}
																		]
																	}
																]
															}
														]
													},
													{
														"component": "nc-col",
														"attribute": {
															"width": "auto",
															"class": ["nc-end-h"]
														},
														"element": [
															{
																"component": "nc-button",
																"attribute": {
																	"id": "person_in_production",
																	"style": "width: 2.7em",
																	"class": ["icon", "nc-icon-center"],
																	"class-": "rec.person_in_production ? 'active' : ''",
																	":style": "{'--button-color': rec.person_in_production ? 'green' : 'darkred'}",
																	":icon": "rec.person_in_production ? 'user-plus' : 'user-minus'",
																	"v-on:click": "rec.person_in_production = !rec.person_in_production",
																	":disabled": "!rec.person"
																}
															}
														]
													}
												]
											},
											{
												"component": "nc-row",
												"attribute": {
													"class": ["nc-align-top"]
												},
												"element": [
													{
														"component": "nc-col",
														"attribute": {
															"width": "18em",
															"v-if": "rec.person_in_production && rec.resource !== 'all'"
														},
														"element": [
															{
																"component": "nc-label-dropdown",
																"text": "Stop reason",
																"attribute": {
																	"label-style": "width: 7em; text-align: right;",
																	"model": "rec.machine_stop_type"
																}
															}
														]
													},
													{
														"component": "nc-col",
														"attribute": {
															"width": "auto"
														},
														"element": [
															{
																"component": "nc-button-group",
																"attribute": {
																	"v-if": "rec.separate_machine_run && rec.person_in_production && rec.resource !== 'all'"
																},
																"element": [
																	{
																		"component": "nc-button",
																		"attribute": {
																			":id": "'machine_' + button.value",
																			"v-on:click": "clickButton(button.value)",
																			"v-for": "button in arr.machine_button_group",
																			":disabled": "!rec.current.enterable",
																			"style": "width: 8em; margin-left: 0.1em;",
																			":style": "{'--button-color': button.color}",
																			"class": ["toggle"],
																			":class": "button.value === rec.current.unproductive ? 'active' : ''",
																			":icon": "button.icon"
																		},
																		"element": [
																			{
																				":id": "'unproductive-span'+button.value",
																				"component": "nc-span",
																				"text": "{{button.show}}"
																			}
																		]
																	}
																]
															}
														]
													},
													{
														"component": "nc-col",
														"attribute": {
															"v-if": "rec.person_in_production && rec.resource !== 'all'",
															"width": "auto",
															"class": ["nc-end-h"]
														},
														"element": [
															{
																"component": "nc-button",
																"attribute": {
																	"id": "separate_machine_run",
																	"style": "width: 2.7em",
																	"class": ["icon", "nc-icon-center"],
																	":icon": "rec.separate_machine_run ? 'unlock' : 'lock'",
																	":style": "{'--button-color': rec.separate_machine_run ? 'green' : 'darkred'}",
																	"v-on:click": "rec.separate_machine_run = !rec.separate_machine_run",
																	":disabled": "!rec.person"
																}
															}
														]
													}
												]
											}
										]
									},
									{
										"component": "nc-col",
										"attribute": {
											"width": "13em"
										},
										"element": [
											{
												"component": "nc-row",
												"element": [
													{
														"component": "nc-label-input",
														"text": "Finished",
														"attribute": {
															":disabled": "!rec.current.can_start || rec.current.unproductive !== '' && rec.focus_field === '' || !rec.current.enterable",
															":input-class": "rec.current.started_amount > 0 && rec.current.produced_amount > 0 && rec.current.started_amount < rec.current.produced_amount + rec.current.failed_amount ? 'not-valid-input' : ''",
															"label-style": "width: 5em; text-align: right;",
															"v-on:change": "fixAmount()",
															"v-on:focus": "rec.focus_field = 'produced_amount'",
															"v-on:blur": "amountAndInfo()",
															"model": "rec.current.produced_amount"
														}
													}
												]
											},
											{
												"component": "nc-row",
												"element": [
													{
														"component": "nc-label-input",
														"text": "Failed",
														"attribute": {
															":disabled": "!rec.current.can_start || rec.current.unproductive !== '' && rec.focus_field === '' || !rec.current.enterable",
															":input-class": "rec.current.started_amount > 0 && rec.current.failed_amount > 0 && rec.current.started_amount < rec.current.produced_amount + rec.current.failed_amount ? 'not-valid-input' : ''",
															"label-style": "width: 5em; text-align: right;",
															"v-on:change": "fixAmount()",
															"v-on:focus": "rec.focus_field = 'failed_amount'",
															"v-on:blur": "amountAndInfo()",
															"model": "rec.current.failed_amount"
														}
													}
												]
											}
										]
									},
									{
										"component": "nc-col",
										"attribute": {
											"width": "auto",
											"class": ["nc-align-top"]
										},
										"element": [
											{
												"component": "nc-row",
												"attribute": {},
												"element": [
													{
														"component": "nc-col",
														"attribute": {
															"width": "13.25em",
															"class": ["nc-end-h"]
														},
														"element": [
															{
																"component": "nc-button",
																"attribute": {
																	"id": "save-button",
																	":disabled": "!rec.current.can_start",
																	"v-on:click": "clickButton('save')",
																	"class": ["nc-button-wide"],
																	":icon": "rec.button_icon.done",
																	"model": "hdr.work_center.button.save"
																}
															}
														]
													},
													{
														"component": "nc-col",
														"attribute": {
															"width": "auto"
														}
													},
													{
														"component": "nc-col",
														"attribute": {
															"width": "10em",
															"class": ["nc-align-top", "nc-end-h"]
														},
														"element": [
															{
																"component": "nc-button",
																"attribute": {
																	"id": "primary-button",
																	"v-on:click": "update(null, null, true)",
																	"class": ["basic", "nc-button-wide"],
																	"style": "margin-left: 0.5em;",
																	"icon": "sync",
																	"model": "hdr.work_center.button.update"
																}
															}
														]
													}
												]
											},
											{
												"component": "nc-row",
												"element": [
													{
														"component": "nc-label-input",
														"text": "Notes",
														"attribute": {
															":disabled": "rec.current.unproductive !== '' && rec.focus_field === '' || !rec.current.enterable",
															"label-style": "width: 4em;",
															"v-on:blur": "amountAndInfo()",
															"model": "rec.current.info",
															"style": "width: 100%;"
														}
													}
												]
											}
										]
									}
								]
							}
						]
					},
					{
						"component": "nc-row",
						"attribute": {
							"height-": "0.5em"
						},
						"element": [
							{
								"component": "nc-line"
							}
						]
					},
					{
						"component": "nc-row",
						"attribute": {
							"id": "find"
						},
						"element": [
							{
								"component": "nc-col",
								"attribute": {
									"width": "21em",
									"class": ["nc-margin-right"]
								},
								"element": [
									{
										"component": "nc-label-dropdown",
										"text": "Resource",
										"attribute": {
											"label-style": "width: 5em;",
											"model": "rec.resource",
											"v-on:change": "update('work')"
										}
									}
								]
							},
							{
								"component": "nc-col",
								"attribute": {
									"width": "auto"
								},
								"element": [
									{
										"component": "nc-col",
										"attribute": {
											"width": "auto",
											"class": ["nc-margin-right"]
										},
										"element": [
											{
												"component": "nc-label-input",
												"text": "Find",
												"attribute": {
													"label-style": "width: 3em; text-align: right;",
													"model": "rec.find_text",
													"v-on:change": "findChanged(rec.find_text)"
												}
											}
										]
									},
									{
										"component": "nc-col",
										"attribute": {
											"width": "2em",
											"class": ["nc-margin-right"]
										},
										"element": [
											{
												"component": "nc-button",
												"attribute": {
													"id": "clear_find",
													"size": "tiny",
													"style": "width: 2em; padding-left: 0.3em",
													"v-on:click": "findChanged(null, 'clear_find')",
													"icon": "backspace"
												}
											}
										]
									}
								]
							},
							{
								"component": "nc-col",
								"attribute": {
									"width": "auto",
									"class": ["nc-space-evenly"]
								},
								"element": [
									{
										"component": "nc-checkbox",
										"text": "Create schedule",
										"attribute": {
											"model": "rec.create_schedule",
											"v-on:click": "update(null, null, true)"
										}
									},
									{
										"component": "nc-checkbox",
										"text": "Show sales",
										"attribute": {
											"model": "rec.virtual_production_order",
											"v-on:click": "refresh()"
										}
									},
									{
										"component": "nc-checkbox",
										"text": "Done",
										"attribute": {
											"model": "rec.show_done",
											"v-on:click": "refresh()"
										}
									},
									{
										"component": "nc-checkbox",
										"text": "Active",
										"attribute": {
											"model": "rec.show_active",
											"v-on:click": "refresh()"
										}
									}
								]
							}
						]
					},
					{
						"component": "nc-row",
						"element": [
							{
								"component": "nc-grid",
								"attribute": {
									"id": "work",
									":doesExternalFilterPass": "doesExternalFilterPass",
									"height-": "rec.tab_open ? rec.info_open ? 'calc(100vh - 49em)' : 'calc(100vh - 39em)' : rec.info_open ? 'calc(100vh - 45em)' : 'calc(100vh - 36em)'",
									":height": "rec.tab_open ? 'calc(100vh - 40em)' : 'calc(100vh - 37em)'",
									":isExternalFilterPresent": "isExternalFilterPresent",
									":style": "{width: '100%', 'min-height': '8em'}",
									"model": "grid.work",
									"v-on:grid-row-clicked": "gridRowClicked",
									"v-on:grid-row-double-clicked": "gridRowDoubleClicked"
								}
							}
						]
					},
					{
						"component": "nc-row",
						"attribute": {
							"v-if": "rec.document_data && rec.document_data.viewer_show_type !== 'fullpage'",
							"class": ["nc-container-margin-top"]
						},
						"element": [
							{
								"component": "nc-col",
								"attribute": {
									"width": "auto",
									"height": "18em",
									"v-if": "!rec.show_work_phase_wide",
									":style": "{'min-width': rec.tab_document === 'storage_map' ? '45%' : '24em'}",
									"class": ["nc-item-margin-top", "nc-margin-right"]
								},
								"element": [
									{
										"component": "nc-row",
										"element": [
											{
												"component": "nc-tab",
												"attribute": {
													"class": ["nc-tab-work-center"],
													":style": "{width: '100%'}",
													"model": "rec.tab_material",
													"v-on:change": "setGrid('product_material')",
													"v-on:dblclick": "setGrid('product_material', true)"
												}
											}
										]
									},
									{
										"component": "nc-row",
										"attribute": {
											":style": "{width: '100%', height: '18em'}"
										},
										"element": [
											{
												"component": "nc-grid",
												"attribute": {
													"id": "product_material",
													"model": "grid.product_material",
													"v-if": "rec.tab_material === 'material_estimated' || rec.tab_material === 'collect'",
													"v-on:grid-row-clicked": "gridRowClicked",
													"v-on:grid-row-double-clicked": "gridRowDoubleClicked"
												}
											},
											{
												"component": "nc-grid",
												"attribute": {
													"id": "product_material_actual",
													"model": "grid.product_material_actual",
													"v-if": "rec.tab_material === 'material_actual'",
													"v-on:grid-row-clicked": "gridRowClicked",
													"v-on:grid-row-double-clicked": "gridRowDoubleClicked"
												}
											}
										]
									}
								]
							},
							{
								"component": "nc-col",
								"attribute": {
									"width": "auto",
									"height": "18em",
									"v-if": "rec.tab_material === 'collect'",
									"class": ["nc-item-margin-top", "nc-margin-right"]
								},
								"element": [
									{
										"component": "nc-row",
										"element": [
											{
												"component": "nc-tab",
												"attribute": {
													"class": ["nc-tab-work-center"],
													":style": "{width: '100%'}",
													"model": "rec.tab_collect",
													"v-on:change": "setGrid('product_material')",
													"v-on:dblclick": "setGrid('product_material', true)"
												}
											}
										]
									},
									{
										"component": "nc-grid",
										"attribute": {
											"id": "stock_location",
											"height": "18em",
											"model": "grid.stock_location"
										}
									}
								]
							},
							{
								"component": "nc-col",
								"attribute": {
									"width": "auto",
									"height": "18em",
									"v-if": "!rec.show_work_phase_wide",
									"style": "min-width: 24em;",
									"class": ["nc-item-margin-top", "nc-margin-right"]
								},
								"element": [
									{
										"component": "nc-row",
										"element": [
											{
												"component": "nc-tab",
												"attribute": {
													"class": ["nc-tab-work-center"],
													":style": "{width: '100%'}",
													"model": "rec.tab_document",
													"v-on:change": "openDocumentPreview()"
												}
											}
										]
									},
									{
										"component": "nc-row",
										"element": [
											{
												"component": "nc-droparea",
												"attribute": {
													"icon": "",
													":clickable": "false",
													"v-if": "rec.tab_document !== 'storage_map'",
													":style": "{width: '100%', 'margin-top': '0px', height: 'calc(18em + 4px)'}",
													"v-on:import-file": "importFile"
												},
												"element": [
													{
														"component": "nc-grid",
														"attribute": {
															"id": "document",
															":style": "{width: '100%', 'margin-top': '0px', 'padding-bottom': '1px', height: '18em'}",
															"model": "grid.document",
															"v-on:grid-row-clicked": "gridRowClicked",
															"v-on:grid-row-double-clicked": "gridRowDoubleClicked"
														}
													}
												]
											},
											{
												"component": "nc-rect",
												"attribute": {
													"v-if": "rec.tab_document === 'storage_map'",
													"style": ["margin: 1px; overflow: hidden;"]
												},
												"element": [
													{
														"component": "nc-svg-map",
														"attribute": {
															":highlight": "mapSelected",
															"style": "height: 20.85em; margin-top: -3em;",
															"svg": "img/storage-map.svg",
															"v-model:hover": "mapHover",
															"v-on:click": "storageMapToggleSelected($event)",
															"v-on:dblclick": "storageMapDoubleClick($event)"
														}
													}
												]
											}
										]
									}
								]
							},
							{
								"component": "nc-col",
								"attribute": {
									"width": "auto",
									"height": "18em",
									"style": "min-width: 35em;",
									"class": ["nc-item-margin-top"],
									"v-if": "rec.tab_document !== 'storage_map'"
								},
								"element": [
									{
										"component": "nc-row",
										"element": [
											{
												"component": "nc-tab",
												"attribute": {
													"class": ["nc-tab-work-center"],
													"style": "width: 100%",
													"model": "rec.tab_work_phase",
													"v-on:change": "setGrid('work_phase')",
													"v-on:dblclick": "setGrid('work_phase', true)"
												}
											}
										]
									},
									{
										"component": "nc-row",
										"attribute": {
											"class": ["nc-end-h"],
											"style": "margin-top: -2.2em;"
										},
										"element": [
											{
												"component": "nc-checkbox",
												"text": "Wide",
												"attribute": {
													"model": "rec.show_work_phase_wide"
												}
											}
										]
									},
									{
										"component": "nc-row",
										"element": [
											{
												"component": "nc-grid",
												"attribute": {
													"id": "work_phase",
													"model": "grid.work_phase",
													"v-if": "rec.tab_work_phase === 'work_phase_estimated'",
													"v-on:grid-row-clicked": "gridRowClicked",
													"v-on:grid-row-double-clicked": "gridRowDoubleClicked",
													"style": ["width: 100%", "height: 18em"]
												}
											},
											{
												"component": "nc-grid",
												"attribute": {
													"id": "work_phase_actual",
													"model": "grid.work_phase_actual",
													"v-if": "rec.tab_work_phase === 'work_phase_actual'",
													"v-on:grid-row-clicked": "gridRowClicked",
													"v-on:grid-row-double-clicked": "gridRowDoubleClicked",
													"style": ["width: 100%", "height: 18em"]
												}
											},
											{
												"component": "nc-grid",
												"attribute": {
													"id": "work_phase_actual_open",
													"model": "grid.work_phase_actual_open",
													"v-if": "rec.tab_work_phase === 'work_phase_actual_open'",
													"v-on:grid-row-clicked": "gridRowClicked",
													"v-on:grid-row-double-clicked": "gridRowDoubleClicked",
													"style": ["width: 100%", "height: 18em"]
												}
											},
											{
												"component": "nc-rect",
												"attribute": {
													"v-if": "rec.tab_work_phase === 'document'",
													"style": ["height: 18em", "margin: 1px", "overflow: hidden;"]
												},
												"element": [
													{
														"component": "nc-document-preview",
														"attribute": {
															"id": "nc-document-preview-canvas",
															":name": "rec.document_name",
															":loadable": "rec.document_loadable",
															":passwordCallback": "passwordCallback",
															":src": "rec.document_data",
															":viewStyle": "rec.document_style_preview",
															"v-on:dblclick": "documentPreviewDoubleClick"
														}
													}
												]
											}
										]
									}
								]
							}
						]
					}
				]
			}
		]
	}
}
