{"version":3,"file":"attributeValuesContainer.js","sources":["../../../Framework/Controls/attributeValuesContainer.ts"],"sourcesContent":["// \r\n// Copyright by the Spark Development Network\r\n//\r\n// Licensed under the Rock Community License (the \"License\");\r\n// you may not use this file except in compliance with the License.\r\n// You may obtain a copy of the License at\r\n//\r\n// http://www.rockrms.com/license\r\n//\r\n// Unless required by applicable law or agreed to in writing, software\r\n// distributed under the License is distributed on an \"AS IS\" BASIS,\r\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n// See the License for the specific language governing permissions and\r\n// limitations under the License.\r\n// \r\n//\r\nimport { computed, defineComponent, PropType, ref, watch } from \"vue\";\r\nimport { PublicAttributeBag } from \"@Obsidian/ViewModels/Utility/publicAttributeBag\";\r\nimport RockSuspense from \"./rockSuspense\";\r\nimport LoadingIndicator from \"./loadingIndicator\";\r\nimport { List } from \"@Obsidian/Utility/linq\";\r\nimport TabbedContent from \"./tabbedContent\";\r\nimport RockField from \"./rockField\";\r\nimport { PublicAttributeCategoryBag } from \"@Obsidian/ViewModels/Utility/publicAttributeCategoryBag\";\r\nimport { emptyGuid } from \"@Obsidian/Utility/guid\";\r\n\r\ntype CategorizedAttributes = PublicAttributeCategoryBag & {\r\n attributes: PublicAttributeBag[]\r\n};\r\n\r\nexport default defineComponent({\r\n name: \"AttributeValuesContainer\",\r\n components: {\r\n RockField,\r\n LoadingIndicator,\r\n RockSuspense,\r\n TabbedContent,\r\n },\r\n props: {\r\n modelValue: {\r\n type: Object as PropType>,\r\n required: true\r\n },\r\n isEditMode: {\r\n type: Boolean as PropType,\r\n default: false\r\n },\r\n attributes: {\r\n type: Object as PropType>,\r\n required: true\r\n },\r\n showEmptyValues: {\r\n type: Boolean as PropType,\r\n default: true\r\n },\r\n showAbbreviatedName: {\r\n type: Boolean as PropType,\r\n default: false\r\n },\r\n displayWithinExistingRow: {\r\n type: Boolean as PropType,\r\n default: false\r\n },\r\n displayAsTabs: {\r\n type: Boolean as PropType,\r\n default: false\r\n },\r\n showCategoryLabel: {\r\n type: Boolean as PropType,\r\n default: true\r\n },\r\n numberOfColumns: {\r\n type: Number as PropType,\r\n default: 1\r\n },\r\n entityTypeName: {\r\n type: String as PropType,\r\n default: \"\"\r\n }\r\n },\r\n\r\n setup(props, { emit }) {\r\n const validAttributes = computed((): PublicAttributeBag[] => {\r\n return new List(Object.values(props.attributes))\r\n .orderBy(a => a.order)\r\n .toArray();\r\n });\r\n\r\n const values = ref({ ...props.modelValue });\r\n\r\n const attributeCategories = computed(() => {\r\n // Initialize the category list with a \"default\" category\r\n const categoryList: CategorizedAttributes[] = [{\r\n guid: emptyGuid,\r\n name: \"Attributes\",\r\n order: 0,\r\n attributes: []\r\n }];\r\n\r\n validAttributes.value.forEach(attr => {\r\n // Skip empty attributes if we are not set to display empty values or we're not editing values\r\n if (!props.showEmptyValues && !props.isEditMode && attr.key && (props.modelValue[attr.key] ?? \"\") == \"\") {\r\n return;\r\n }\r\n\r\n if (attr.categories && attr.categories.length > 0) {\r\n const categories = [...attr.categories] as PublicAttributeCategoryBag[]; // copy, so sort doesn't cause updates\r\n\r\n categories.sort((a, b) => a.order - b.order).forEach((cat, i) => {\r\n const newCat: CategorizedAttributes = { attributes: [], ...cat }; // copy and convert to CategorizedAttributes\r\n\r\n // Make sure we only have 1 copy of any category in the list\r\n if (!categoryList.some(oldCat => oldCat.guid == newCat.guid)) {\r\n categoryList.push(newCat);\r\n }\r\n\r\n // Add this attribute to the first (in order) category it is in\r\n if (i == 0) {\r\n categoryList.find(cat => cat.guid == newCat.guid)?.attributes.push(attr);\r\n }\r\n });\r\n }\r\n else {\r\n // Put in \"default\" category\r\n categoryList[0].attributes.push(attr);\r\n }\r\n });\r\n\r\n // Clear out any categories that don't have any attributes assigned to them, then sort the list by category order\r\n return categoryList.filter(cat => cat.attributes.length > 0).sort((a, b) => a.order - b.order);\r\n });\r\n\r\n const actuallyDisplayAsTabs = computed(() => {\r\n if (attributeCategories.value.length === 0) {\r\n return false;\r\n }\r\n\r\n const hasCategories = attributeCategories.value.length > 1 || attributeCategories.value[0].guid !== emptyGuid;\r\n\r\n return hasCategories && props.displayAsTabs && !props.isEditMode;\r\n });\r\n\r\n const defaultCategoryHeading = computed(() => {\r\n if (actuallyDisplayAsTabs.value || !props.entityTypeName) {\r\n return \"Attributes\";\r\n }\r\n\r\n return `${props.entityTypeName} Attributes`;\r\n });\r\n\r\n const columnClass = computed(() => {\r\n let numColumns = props.numberOfColumns;\r\n\r\n // Need to make the columns divisible by 12\r\n if (numColumns < 1) {\r\n numColumns = 1;\r\n }\r\n else if (numColumns == 5) {\r\n numColumns = 4;\r\n }\r\n else if (numColumns > 6 && numColumns < 12) {\r\n numColumns = 6;\r\n }\r\n else if (numColumns > 12) {\r\n numColumns = 12;\r\n }\r\n\r\n return `col-md-${12 / numColumns}`;\r\n });\r\n\r\n const onUpdateValue = (key: string, value: string): void => {\r\n values.value[key] = value;\r\n\r\n emit(\"update:modelValue\", values.value);\r\n };\r\n\r\n watch(() => props.modelValue, () => {\r\n values.value = { ...props.modelValue };\r\n });\r\n\r\n return {\r\n onUpdateValue,\r\n validAttributes,\r\n values,\r\n attributeCategories,\r\n actuallyDisplayAsTabs,\r\n defaultCategoryHeading,\r\n columnClass\r\n };\r\n },\r\n\r\n template: `\r\n\r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n {{ item.name }}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n\r\n \r\n \r\n
{{defaultCategoryHeading}}
\r\n
{{cat.name}}
\r\n\r\n
\r\n