aloha-vue 1.2.25 → 1.2.27

package/docs/package.json

@@ -11,7 +11,7 @@
     "build-css": "node-sass --include-path scss styles/styles.scss dist/styles/styles.css"
   },
   "dependencies": {
-    "@floating-ui/vue": "^1.0.2",
+    "@floating-ui/vue": "1.0.2",
     "aloha-css": "1.0.127",
     "axios": "1.4.0",
     "dompurify": "3.0.3",

package/docs/src/views/Form/PageForm/PageForm.js

@@ -174,7 +174,7 @@ export default {
           id: "aloha7",
           classColumn: "a_column_5",
           helpText: "ALOHA help!!!",
-          disabled: true,
+          disabled: false,
         },
         {
           type: "switch",

package/docs/webpack.config.js

@@ -27,7 +27,7 @@ function resolveAlias(mode)  {
     "tiny-emitter": path.resolve(__dirname, "node_modules/tiny-emitter"),
     dompurify: path.resolve(__dirname, "node_modules/dompurify"),
     tinymce: path.resolve(__dirname, "node_modules/tinymce"),
-    "@popperjs/core": path.resolve(__dirname, "node_modules/@popperjs/core"),
+    "@floating-ui/vue": path.resolve(__dirname, "node_modules/@floating-ui/vue"),
   };
 }
 

package/package.json

@@ -14,7 +14,7 @@
     "Vue.js"
   ],
   "homepage": "https://github.com/ilia-brykin/aloha/#README.md",
-  "version": "1.2.25",
+  "version": "1.2.27",
   "author": {
     "name": "Ilia Brykin",
     "email": "brykin.ilia@gmail.com"
@@ -40,7 +40,7 @@
     "build-icons": "node scriptsNode/iconsSvgToJs.js bootstrap3 && node scriptsNode/iconsSvgToJs.js bootstrap-1-9-1"
   },
   "dependencies": {
-    "@floating-ui/vue": "^1.0.2",
+    "@floating-ui/vue": "1.0.2",
     "aloha-css": "1.0.98",
     "axios": "^1.4.0",
     "dompurify": "^2.4.1",

package/src/ATable/ATable.js

@@ -650,6 +650,7 @@ export default {
       if (this.isDataArray) {
         return this.data.length;
       }
+      return 0;
     },
 
     isDataObject() {

package/src/ATable/ATableTd/compositionAPI/LinkAPI.js

@@ -27,6 +27,7 @@ export default function LinkAPI(props) {
     if (isPlainObject(column.value.to)) {
       const TO = cloneDeep(column.value.to);
       const PARAMS = TO.params || {};
+      const QUERY = TO.query || {};
       if (column.value.to.paramsDynamic) {
         let hasParamsDynamicError = false;
         forEach(column.value.to.paramsDynamic, (value, key) => {
@@ -41,7 +42,22 @@ export default function LinkAPI(props) {
           return undefined;
         }
       }
+      if (column.value.to.queryDynamic) {
+        let hasParamsDynamicError = false;
+        forEach(column.value.to.queryDynamic, (value, key) => {
+          const PARAMS_VALUE = get(row.value, value);
+          if (isUndefined(PARAMS_VALUE)) {
+            hasParamsDynamicError = true;
+            return false;
+          }
+          PARAMS[key] = PARAMS_VALUE;
+        });
+        if (hasParamsDynamicError) {
+          return undefined;
+        }
+      }
       TO.params = PARAMS;
+      TO.query = QUERY;
       return TO;
     }
     return undefined;

package/src/ATable/compositionAPI/RowActionsAPI.js

@@ -131,6 +131,7 @@ export default function RowActionsAPI(props) {
     if (isPlainObject(rowAction.to)) {
       const TO = cloneDeep(rowAction.to);
       const PARAMS = TO.params || {};
+      const QUERY = TO.query || {};
       if (rowAction.to.paramsDynamic) {
         let hasParamsDynamicError = false;
         forEach(rowAction.to.paramsDynamic, (value, key) => {
@@ -145,7 +146,22 @@ export default function RowActionsAPI(props) {
           return undefined;
         }
       }
+      if (rowAction.to.queryDynamic) {
+        let hasParamsDynamicError = false;
+        forEach(rowAction.to.queryDynamic, (value, key) => {
+          const PARAMS_VALUE = get(row.value, value);
+          if (isUndefined(PARAMS_VALUE)) {
+            hasParamsDynamicError = true;
+            return false;
+          }
+          PARAMS[key] = PARAMS_VALUE;
+        });
+        if (hasParamsDynamicError) {
+          return undefined;
+        }
+      }
       TO.params = PARAMS;
+      TO.query = QUERY;
       return TO;
     }
     return undefined;

package/src/ATable/compositionAPI/SortAPI.js

@@ -51,9 +51,9 @@ export default function SortAPI(props) {
   const dataSorted = computed(() => {
     if (modelSortLocal.value.length &&
       !isSortingOutside.value) {
-      return orderBy(data.value, sortOptions.value.models, sortOptions.value.directions);
+      return orderBy(data.value || [], sortOptions.value.models, sortOptions.value.directions);
     }
-    return data.value;
+    return data.value || [];
   });
 
   watch(modelSort, () => {

package/src/ui/ASwitch/ASwitch.js

@@ -1,7 +1,5 @@
 import {
-  computed,
   h,
-  toRef,
 } from "vue";
 
 import AErrorsText from "../AErrorsText/AErrorsText";
@@ -10,22 +8,130 @@ import ALabel from "../ALabel/ALabel";
 import ATooltip from "../../ATooltip/ATooltip";
 import ATranslation from "../../ATranslation/ATranslation";
 
-import UiMixinProps from "../mixins/UiMixinProps";
-
+import CheckedAPI from "./compositionAPI/CheckedAPI";
+import LabelAPI from "./compositionAPI/LabelAPI";
+import ModelAPI from "./compositionAPI/ModelAPI";
+import OnInputAPI from "./compositionAPI/OnInputAPI";
 import TitleAPI from "./compositionAPI/TitleAPI";
 import UiAPI from "../compositionApi/UiAPI";
 import UiStyleHideAPI from "../compositionApi/UiStyleHideAPI";
 
 import placements from "../../const/placements";
+import {
+  uniqueId,
+} from "lodash-es";
 
-const KEY_CODE_SPACE = 32;
 
 export default {
   name: "ASwitch",
-  mixins: [
-    UiMixinProps,
-  ],
   props: {
+    disabled: {
+      type: Boolean,
+      required: false,
+    },
+    id: {
+      type: [String, Number],
+      required: false,
+      default: () => uniqueId("a_ui_"),
+    },
+    idPrefix: {
+      type: String,
+      required: false,
+      default: undefined,
+    },
+    htmlId: {
+      type: String,
+      required: false,
+      default: undefined,
+    },
+    inputAttributes: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
+    inputClass: {
+      required: false,
+    },
+    label: {
+      type: [String, Number],
+      required: false,
+      default: undefined,
+    },
+    labelClass: {
+      required: false,
+      default: undefined,
+    },
+    required: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+    modelUndefined: {
+      required: false,
+      default: null,
+    },
+    isLabelFloat: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
+    errors: {
+      type: [String, Array],
+      required: false,
+      default: undefined,
+    },
+    errorsAll: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
+    classColumn: {
+      type: String,
+      required: false,
+      default: undefined,
+    },
+    modelDependencies: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
+    dependencies: {
+      type: [Array, Object],
+      required: false,
+      default: undefined,
+    },
+    helpText: {
+      type: String,
+      required: false,
+    },
+    type: {
+      type: String,
+      required: false,
+    },
+    isHide: {
+      type: Boolean,
+      required: false,
+    },
+    isRender: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
+    options: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
+    change: {
+      type: Function,
+      required: false,
+      default: () => {},
+    },
+    extra: {
+      type: Object,
+      required: false,
+      default: undefined,
+    },
     modelValue: {
       type: [Boolean, String, Number],
       required: false,
@@ -97,6 +203,11 @@ export default {
       required: false,
     },
   },
+  emits: [
+    "blur",
+    "focus",
+    "update:modelValue",
+  ],
   setup(props, context) {
     const {
       componentStyleHide,
@@ -119,102 +230,51 @@ export default {
       hasTitle,
     } = TitleAPI(props);
 
-    const modelValue = toRef(props, "modelValue");
-
-    const trueLabel = toRef(props, "trueLabel");
-
-    const falseLabel = toRef(props, "falseLabel");
-
-    const defaultLabel = toRef(props, "defaultLabel");
-
-    const trueValue = toRef(props, "trueValue");
-
-    const falseValue = toRef(props, "falseValue");
-
-    const defaultValue = toRef(props, "defaultValue");
-
-    const isModelTrue = computed(() => {
-      return modelValue.value === trueValue.value ||
-        modelValue.value === "true";
-    });
-
-    const isModelFalse = computed(() => {
-      return modelValue.value === falseValue.value ||
-        modelValue.value === "false";
-    });
+    const {
+      isModelDefault,
+      isModelFalse,
+      isModelTrue,
+    } = ModelAPI(props);
 
-    const isModelDefault = computed(() => {
-      return !isModelTrue.value && !isModelFalse.value;
+    const {
+      labelValueLocal,
+    } = LabelAPI(props, {
+      isModelFalse,
+      isModelTrue,
     });
 
-    const labelValueLocal = computed(() => {
-      if (isModelTrue.value) {
-        return trueLabel.value;
-      }
-      if (isModelFalse.value) {
-        return falseLabel.value;
-      }
-      return defaultLabel.value;
+    const {
+      isChecked,
+    } = CheckedAPI({
+      isModelFalse,
+      isModelTrue,
     });
 
-    const isThreeState = toRef(props, "isThreeState");
-
-    const isChecked = computed(() => {
-      if (isModelTrue.value) {
-        return true;
-      }
-      if (isModelFalse.value) {
-        return false;
-      }
-      return undefined;
+    const {
+      onInput,
+      onKeydown,
+    } = OnInputAPI(props, {
+      changeModel,
+      isModelFalse,
+      isModelTrue,
     });
 
-    const disabled = toRef(props, "disabled");
-    const onInput = $event => {
-      if (disabled.value) {
-        return;
-      }
-      let model;
-      if (isModelTrue.value) {
-        model = falseValue.value;
-      } else if (isThreeState.value && isModelFalse.value) {
-        model = defaultValue.value;
-      } else {
-        model = trueValue.value;
-      }
-
-      changeModel({
-        model,
-        $event,
-      });
-    };
-
-    const onKeydown = $event => {
-      if ($event.key === "Enter" ||
-        $event.keyCode === KEY_CODE_SPACE) {
-        onInput($event);
-        $event.stopPropagation();
-        $event.preventDefault();
-      }
-    };
 
     return {
-      componentStyleHide,
-
       ariaDescribedbyLocal,
       clearModel,
+      componentStyleHide,
       errorsId,
       hasTitle,
       helpTextId,
       htmlIdLocal,
+      isChecked,
       isErrors,
       isModel,
-      onBlur,
-      onFocus,
-
-      isChecked,
       isModelDefault,
       labelValueLocal,
+      onBlur,
+      onFocus,
       onInput,
       onKeydown,
     };

package/src/ui/ASwitch/compositionAPI/CheckedAPI.js

@@ -0,0 +1,22 @@
+import {
+  computed,
+} from "vue";
+
+export default function CheckedAPI({
+  isModelFalse = computed(() => false),
+  isModelTrue = computed(() => false),
+}) {
+  const isChecked = computed(() => {
+    if (isModelTrue.value) {
+      return true;
+    }
+    if (isModelFalse.value) {
+      return false;
+    }
+    return undefined;
+  });
+
+  return {
+    isChecked,
+  };
+}

package/src/ui/ASwitch/compositionAPI/LabelAPI.js

@@ -0,0 +1,27 @@
+import {
+  computed,
+  toRef,
+} from "vue";
+
+export default function LabelAPI(props, {
+  isModelFalse = computed(() => false),
+  isModelTrue = computed(() => false),
+}) {
+  const trueLabel = toRef(props, "trueLabel");
+  const falseLabel = toRef(props, "falseLabel");
+  const defaultLabel = toRef(props, "defaultLabel");
+
+  const labelValueLocal = computed(() => {
+    if (isModelTrue.value) {
+      return trueLabel.value;
+    }
+    if (isModelFalse.value) {
+      return falseLabel.value;
+    }
+    return defaultLabel.value;
+  });
+
+  return {
+    labelValueLocal,
+  };
+}

package/src/ui/ASwitch/compositionAPI/ModelAPI.js

@@ -0,0 +1,30 @@
+import {
+  computed,
+  toRef,
+} from "vue";
+
+export default function ModelAPI(props) {
+  const modelValue = toRef(props, "modelValue");
+  const trueValue = toRef(props, "trueValue");
+  const falseValue = toRef(props, "falseValue");
+
+  const isModelTrue = computed(() => {
+    return modelValue.value === trueValue.value ||
+      modelValue.value === "true";
+  });
+
+  const isModelFalse = computed(() => {
+    return modelValue.value === falseValue.value ||
+      modelValue.value === "false";
+  });
+
+  const isModelDefault = computed(() => {
+    return !isModelTrue.value && !isModelFalse.value;
+  });
+
+  return {
+    isModelDefault,
+    isModelFalse,
+    isModelTrue,
+  };
+}

package/src/ui/ASwitch/compositionAPI/OnInputAPI.js

@@ -0,0 +1,51 @@
+import {
+  computed,
+  toRef,
+} from "vue";
+
+import AKeysCode from "../../../const/AKeysCode";
+
+export default function OnInputAPI(props, {
+  changeModel = () => {},
+  isModelFalse = computed(() => false),
+  isModelTrue = computed(() => false),
+}) {
+  const defaultValue = toRef(props, "defaultValue");
+  const disabled = toRef(props, "disabled");
+  const falseValue = toRef(props, "falseValue");
+  const isThreeState = toRef(props, "isThreeState");
+  const trueValue = toRef(props, "trueValue");
+
+  const onInput = $event => {
+    if (disabled.value) {
+      return;
+    }
+    let model;
+    if (isModelTrue.value) {
+      model = falseValue.value;
+    } else if (isThreeState.value && isModelFalse.value) {
+      model = defaultValue.value;
+    } else {
+      model = trueValue.value;
+    }
+
+    changeModel({
+      model,
+      $event,
+    });
+  };
+
+  const onKeydown = $event => {
+    if ($event.keyCode === AKeysCode.enter ||
+      $event.keyCode === AKeysCode.space) {
+      onInput($event);
+      $event.stopPropagation();
+      $event.preventDefault();
+    }
+  };
+
+  return {
+    onInput,
+    onKeydown,
+  };
+}