free-fe-core-modules 0.0.17 → 0.0.19

package/composible/useAnchor.js

@@ -0,0 +1,35 @@
+import { watch, onMounted, nextTick, getCurrentInstance } from "vue";
+import { useRoute } from 'vue-router';
+
+export function useAnchor(opts) {
+  const { proxy:vm } = getCurrentInstance();
+  const route = useRoute();
+
+  const goToPageAnchor = (astr) => {
+    const anchorStr = astr || route.params.anchor || route.query.anchor;
+    if (anchorStr) {
+      const anchor = vm.$el.querySelector(`#${anchorStr}`);
+      if (anchor && anchor.scrollIntoView) {
+        nextTick(() => {
+          anchor.scrollIntoView({
+            behavior: 'smooth',
+            ...opts,
+          });
+        });
+      }
+    }
+  };
+
+  watch(() => route, () => {
+    goToPageAnchor();
+  });
+
+  onMounted(() => {
+    goToPageAnchor();
+  });
+
+  return {
+    goToPageAnchor,
+  }
+};
+

package/composible/useFormValidator.js

@@ -43,6 +43,10 @@ export function useFormValidator(...list) {
             hasErr = !validFun() || hasErr;
 
             if (hasErr) {
+              if (refi.el?.className) {
+                refi.el.className += ' hasError';
+              }
+
               console.error('got error', args)
               break;
             }

package/free-field/Fields/Date.js

@@ -2,6 +2,7 @@ import { ref, defineComponent, getCurrentInstance, h, computed } from 'vue';
 import { QInput, QIcon, QPopupProxy, QDate } from 'quasar';
 import { useFreeField, freeFieldProps } from '../composible/useFreeField';
 import freeFieldLabel from '../composible/freeFieldLabel';
+import ReadonlyContent from '../composible/readonlyContent';
 import { useFormValidator} from '../../composible/useFormValidator';
 
 export default defineComponent({
@@ -43,7 +44,7 @@ export default defineComponent({
 
     const { proxy: vm } = getCurrentInstance();
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const before = (props.Field.Label !== void 0) ? () => h(freeFieldLabel, {
       Field: props.Field,
@@ -86,6 +87,9 @@ export default defineComponent({
 
       rules: props.Field.Rules,
 
+      ...inputControlSettings.value,
+
+      class: 'full-width',
       modelValue: localDate.value,
       'onUpdate:modelValue': (v) => {
         setFieldData(v, emit);
@@ -121,6 +125,11 @@ export default defineComponent({
       }),
     }));
 
+    const readonlyNode = () => h(ReadonlyContent, {
+      Field: props.Field,
+      Content: fieldData.value,
+    });
+
     const {
       validate,
     } = useFormValidator(DateNode);

package/free-field/Fields/DateRange.js

@@ -43,7 +43,7 @@ export default defineComponent({
 
     const { proxy: vm } = getCurrentInstance();
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const updateFieldDate = () => {
       setFieldData([min.value, max.value].join(props.Field.Separator || '~'), emit);
@@ -125,6 +125,8 @@ export default defineComponent({
 
       rules: props.Field.Rules,
 
+      ...inputControlSettings.value,
+
       modelValue: min.value,
       'onUpdate:modelValue': (v) => {
         min.value = v;
@@ -170,6 +172,8 @@ export default defineComponent({
 
       rules: props.Field.Rules,
 
+      ...inputControlSettings.value,
+
       modelValue: max.value,
       'onUpdate:modelValue': (v) => {
         max.value = v;

package/free-field/Fields/Number.js

@@ -89,6 +89,7 @@ export default defineComponent({
     ],
     Description: '',
   },
+  emits: ['input'],
   props: {
     ...freeFieldProps,
   },
@@ -96,7 +97,7 @@ export default defineComponent({
   setup(props, { emit, slots , expose }){
     if (!props.Field) return {};
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     // keep between the min and max value
     watch(fieldData, (d) => {
@@ -140,6 +141,8 @@ export default defineComponent({
       hideBottomSpace: true,
       readonly: props.Field?.ReadOnly,
 
+      ...inputControlSettings.value,
+
       class: 'full-width',
       style: props.Field.Info?.Style,
 

package/free-field/Fields/NumberRange.vue

@@ -15,7 +15,6 @@
     <span v-else class="row items-center no-wrap">
       <q-input
         :readonly="Field.ReadOnly"
-        v-bind="$attrs"
         :placeholder="$attrs.placeholder || $t(getModule('field-components').config['defaultInputFieldPlaceholder'])"
         hide-bottom-space
         @input="rangeChanged"
@@ -23,6 +22,7 @@
         v-model.number="range.min"
         :ref="`input_field_validator_${Field.Name || Field.Label}`"
         :maxlength="maxlength"
+        v-bind="inputControlSettings"
       >
         <template
           v-slot:prepend
@@ -41,7 +41,6 @@
       <span class="free-field-range-separator">{{`${Field.Separator || '~'}`}}</span>
       <q-input
         :readonly="Field.ReadOnly"
-        v-bind="$attrs"
         :placeholder="$attrs.placeholder || $t(getModule('field-components').config['defaultInputFieldPlaceholder'])"
         hide-bottom-space
         @input="rangeChanged"
@@ -49,6 +48,7 @@
         v-model.number="range.max"
         :ref="`input_field_validator_${Field.Name || Field.Label}2`"
         :maxlength="maxlength"
+        v-bind="inputControlSettings"
       >
         <template
           v-slot:prepend
@@ -71,14 +71,15 @@
 </template>
 
 <script>
-import { defineComponent } from 'vue';
-import { freeFieldProps } from '../composible/useFreeField';
+import { defineComponent, ref } from 'vue';
+import { freeFieldProps, useFreeField } from '../composible/useFreeField';
 
 export default defineComponent({
   name: 'InputFieldNumberRange',
   props: {
     ...freeFieldProps,
   },
+  emits: ['input'],
   fieldInfo: {
     Category: 'Simple',
     Label: '数字范围',
@@ -97,12 +98,19 @@ export default defineComponent({
     ],
     Description: '',
   },
-  data() {
+  setup(props){
+    if (!props.Field) return {};
+
+    const { fieldData, inputControlSettings } = useFreeField(props);
+    const range = ref({
+      min: 0,
+      max: 0,
+    });
+
     return {
-      range: {
-        min: 0,
-        max: 0,
-      },
+      range,
+      fieldData,
+      inputControlSettings,
     };
   },
   watch: {

package/free-field/Fields/Password.js

@@ -32,7 +32,7 @@ export default defineComponent({
   setup(props, { emit, slots, expose }){
     if (!props.Field) return {};
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
     const isPwd = ref(true);
 
     const before = () => h(freeFieldLabel, {
@@ -55,6 +55,8 @@ export default defineComponent({
       hideBottomSpace: true,
       readonly: props.Field?.ReadOnly,
 
+      ...inputControlSettings.value,
+
       class: 'full-width',
       style: props.Field.Info?.Style,
 

package/free-field/Fields/RadioList.vue

@@ -68,6 +68,7 @@ export default defineComponent({
   props: {
     ...freeFieldProps,
   },
+  emits: ['input'],
   setup(props, { expose, emit }) {
     if (!props.Field) return {};
 

package/free-field/Fields/Rich.vue

@@ -109,6 +109,7 @@ export default defineComponent({
   components: {
     tiny,
   },
+  emits: ['input'],
   props: {
     ...freeFieldProps,
     enableField: { type: Boolean, default: false },

package/free-field/Fields/Search.vue

@@ -12,6 +12,7 @@
               ((Field.Options?.SearchPlaceholder) || Field.Placeholder)"
               @keydown.enter="search()"
               class="full-width"
+              v-bind="inputControlSettings"
             >
               <template v-slot:append>
                 <q-btn :class="Field.Options?.SearchBtnClasses" :flat="!Field.Options?.SearchBtn3D" :round="!Field.Options?.SearchBtnRect" icon="search" @click="search()" :disabled="Field.ReadOnly">{{Field.Options.SearchBtnText}}</q-btn>
@@ -290,7 +291,7 @@ export default defineComponent({
   setup(props, { expose }) {
     if (!props.Field) return {};
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const { validate } = useFormValidator('fieldToValid');
     expose({
@@ -300,6 +301,7 @@ export default defineComponent({
     return {
       fieldData,
       setFieldData,
+      inputControlSettings,
     };
   },
   data() {

package/free-field/Fields/Select.vue

@@ -58,6 +58,8 @@
         ref="fieldToValid"
         :use-input="Field && Field.UseInput"
         :use-chip="Field && Field.UseChip"
+        v-bind="inputControlSettings"
+        :rules="Field.Rules"
       >
         <template v-slot:before>
           <span
@@ -246,7 +248,7 @@ export default defineComponent({
 
     const { proxy:vm } = getCurrentInstance();
 
-    const { fieldData, getFieldData, setFieldData } = useFreeField(props);
+    const { fieldData, getFieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const hasError = ref(false);
     const checked = ref([]);
@@ -296,21 +298,22 @@ export default defineComponent({
     });
 
     const selfValidate = () => {
-      if (props.Field.AsCheck && props.Field.Required) {
-        const isValid = checked.value && checked.value.length > 0;
-        hasError.value = !isValid;
-        return isValid;
-      }
-
-      return true;
+      const isValid = checked.value && checked.value.length > 0;
+      hasError.value = !isValid;
+      return isValid;
     };
 
     const { validate } = useFormValidator('fieldToValid');
     expose ({
-      selfValidate,
       validate,
     })
 
+    if (props.Field.AsCheck && props.Field.Required) {
+      expose ({
+        selfValidate,
+      })
+    }
+
     const selectChanged = (v) => {
       selfValidate();
       setFieldData(v, emit);
@@ -391,6 +394,7 @@ export default defineComponent({
 
       selectChanged,
       checkChanged,
+      inputControlSettings,
     };
   },
 });

package/free-field/Fields/SelectionChain.vue

@@ -35,6 +35,7 @@
           emit-value
           @input="selectionChanged(index)"
           ref="fieldsToValid"
+          v-bind="inputControlSettings"
         ></q-select>
       </span>
       <span v-if="Field && Field.ReadOnly">
@@ -119,7 +120,7 @@ export default defineComponent({
 
     const { proxy:vm } = getCurrentInstance();
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const optionsList = ref([]);
     const valuesList = ref([]);
@@ -217,6 +218,7 @@ export default defineComponent({
       valuesList,
 
       selectionChanged,
+      inputControlSettings,
     };
   },
   created() {

package/free-field/Fields/String.js

@@ -63,7 +63,7 @@ export default defineComponent({
     if (!props.Field) return {};
 
     const { proxy:vm } = getCurrentInstance();
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const readonlyNode = () => h(ReadonlyContent, {
       Field: props.Field,
@@ -88,6 +88,9 @@ export default defineComponent({
       // bottomSlots: true,
       hideBottomSpace: true,
       readonly: props.Field?.ReadOnly,
+
+      ...inputControlSettings.value,
+
       placeholder: props.Field?.Placeholder || attrs.placeholder || vm.$t(vm.getModule('core-modules').config['defaultInputFieldPlaceholder']),
 
       class: 'full-width',
@@ -105,7 +108,7 @@ export default defineComponent({
       append,
     }));
 
-    const { validate } = useFormValidator(inputNode);
+    const { validate } = useFormValidator(inputNode.value);
     expose({
       validate,
     })

package/free-field/Fields/Text.js

@@ -1,4 +1,4 @@
-import { defineComponent, h, ref, watchEffect, computed } from 'vue';
+import { defineComponent, h, ref, watchEffect, computed, useAttrs } from 'vue';
 import { QInput } from 'quasar';
 import { useFreeField, freeFieldProps } from '../composible/useFreeField';
 import ReadonlyContent from '../composible/readonlyContent';
@@ -24,10 +24,10 @@ export default defineComponent({
     ...freeFieldProps,
   },
   emits: ['input'],
-  setup(props, { emit, slots, expose }){
+  setup(props, { emit, slots, expose, attrs }){
     if (!props.Field) return {};
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const rows = ref(3);
 
@@ -53,6 +53,8 @@ export default defineComponent({
       readonly: props.Field?.ReadOnly,
       rows: rows.value,
 
+      ...inputControlSettings.value,
+
       class: 'full-width',
       style: props.Field.Info?.Style,
 

package/free-field/Fields/Time.vue

@@ -14,6 +14,7 @@
     <q-input v-else v-model="fieldData.value" hide-bottom-space
       :readonly="Field.ReadOnly"
       @input="$emit('input')"
+      v-bind="inputControlSettings"
       ref="fieldToValid">
       <template v-slot:before v-if="Field.Label !== void 0">
         <span
@@ -97,7 +98,7 @@ export default defineComponent({
 
     const { proxy:vm } = getCurrentInstance();
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const locale = vm.ctx.config.locales.find(
       (l) => l.locale === (vm.ctx.config.locale || vm.ctx.config.defaultLocale),
@@ -175,7 +176,8 @@ export default defineComponent({
 
       changed: (v) => {
         setFieldData(v, emit);
-      }
+      },
+      inputControlSettings,
     };
   },
 });

package/free-field/Fields/TimeRange.vue

@@ -27,6 +27,7 @@
         v-model="min"
         hide-bottom-space
         :readonly="Field.ReadOnly"
+        v-bind="inputControlSettings"
         ref="input_field_validator_first"
       >
         <q-popup-proxy
@@ -62,6 +63,7 @@
         v-model="max"
         hide-bottom-space
         :readonly="Field.ReadOnly"
+        v-bind="inputControlSettings"
         ref="input_field_validator_second"
       >
         <q-popup-proxy
@@ -161,7 +163,7 @@ export default defineComponent({
 
     const { proxy:vm } = getCurrentInstance();
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const updateFieldDate = () => {
       setFieldData([min.value, max.value].join(props.Field.Separator || '~'), emit);
@@ -364,7 +366,8 @@ export default defineComponent({
 
       changed: (v) => {
         setFieldData(v, emit);
-      }
+      },
+      inputControlSettings,
     };
   },
 });

package/free-field/Fields/Year.js

@@ -75,7 +75,7 @@ export default defineComponent({
   setup(props, { emit, slots, expose }){
     if (!props.Field) return {};
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const before = (props.Field.Label !== void 0) ? () => h(freeFieldLabel, {
       Field: props.Field,
@@ -111,6 +111,8 @@ export default defineComponent({
       'map-options': true,
       label: props.Field.Placeholder,
 
+      ...inputControlSettings.value,
+
       class: 'full-width',
       style: props.Field.Info?.Style,
 

package/free-field/Fields/YearRange.vue

@@ -19,6 +19,7 @@
         :options="minYearOptions"
         :readonly="Field.ReadOnly"
         @input="rangeChanged"
+        v-bind="inputControlSettings"
         ref="input_field_validator_first"
       >
         <template v-slot:before v-if="Field.Label !== void 0">
@@ -39,6 +40,7 @@
         :options="maxYearOptions"
         :readonly="Field.ReadOnly"
         @input="rangeChanged"
+        v-bind="inputControlSettings"
         ref="input_field_validator_second"
       />
     </span>
@@ -89,7 +91,7 @@ export default defineComponent({
   setup(props, { emit, expose }) {
     if (!props.Field) return () => null;
 
-    const { fieldData, setFieldData } = useFreeField(props);
+    const { fieldData, setFieldData, inputControlSettings } = useFreeField(props);
 
     const min = ref('');
     const max = ref('');
@@ -175,6 +177,7 @@ export default defineComponent({
       maxYearOptions,
 
       rangeChanged,
+      inputControlSettings,
     };
   },
 });

package/free-field/composible/fieldWrapper.js

@@ -49,7 +49,7 @@ export default defineComponent({
         lField.Rules.push(
           (val) => {
             const pVal = isRef(val) ? val.value : val;
-            return typeof pVal !== "undefined" && pVal !== "";
+            return !!pVal;
           }
         );
       }

package/free-field/composible/readonlyContent.js

@@ -11,7 +11,7 @@ export default defineComponent({
     if (!props.Field) return {};
 
     const readonlyNode = () => h('span', {
-      class: 'full-width',
+      class: 'full-width row no-wrap',
     }, [
       (props.Field.Label !== void 0) && h(FieldLabel, {
         Field: props.Field,

package/free-field/composible/useFreeField.js

@@ -1,4 +1,4 @@
-import { reactive, getCurrentInstance, watchEffect } from "vue";
+import { reactive, getCurrentInstance, watchEffect, computed } from "vue";
 
 export const freeFieldProps = {
   values: { type: Object },
@@ -12,11 +12,11 @@ export function useFreeField(props, ctx) {
   watchEffect(() => {
     let realData = void 0;
     let usingDft = false;
-    
+
     if (!props.Field) {
       return;
     }
-    
+
     if (!props.Field.Name) {
       realData = props.Field.Value || props.Field.Default || void 0;
       usingDft = true;
@@ -71,6 +71,10 @@ export function useFreeField(props, ctx) {
     fieldData.value = realData;
   });
 
+  const inputControlSettings = computed(() => {
+    return vm.ctx.config['core-modules']?.inputControlSettings || {};
+  });
+
   return {
     fieldData,
     getFieldData: (n) => Object.nestValue(props.values, n),
@@ -83,5 +87,6 @@ export function useFreeField(props, ctx) {
     setData: (n, v) => {
       Object.setValue(props.values, n, v);
     },
+    inputControlSettings,
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "free-fe-core-modules",
-  "version": "0.0.17",
+  "version": "0.0.19",
   "main": "index.js",
   "repository": "https://github.com/freeeis/free-fe-core-modules.git",
   "author": "zhiquan",