free-fe-core-modules 0.0.2 → 0.0.3

package/field-components/Fields/Number.vue

@@ -1,247 +0,0 @@
-<template>
-  <span
-    class="simple-field input-field-number row items-center no-wrap"
-    v-if="Field"
-  >
-    <span
-      v-if="Field.ReadOnly"
-      class="full-width"
-    >
-      <span
-        :class="`field-label field-label-readonly ${(Field.Label && Field.Label.trim().length)
-            ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`"
-        v-if="typeof Field.Label !== 'undefined'"
-      >
-        <q-tooltip
-          v-if="Field.Description"
-          anchor="top right"
-        >{{Field.Description}}</q-tooltip>
-        {{Field.Label || ''}}
-        <span
-          v-if="Field.Required"
-          class="required-mark"
-        >*</span>
-      </span>
-      <span class="readonly-content">
-        <span
-          class="prefix"
-          v-if="Field.Options && Field.Options.Prefix"
-        >{{Field.Options.Prefix}}</span>
-        <span :style="(Field.Info && Field.Info.Style) ? Field.Info.Style : ''">{{fieldData}}</span>
-        <span
-          class="postfix"
-          v-if="Field.Options && Field.Options.Postfix"
-        >{{Field.Options.Postfix}}</span>
-      </span>
-    </span>
-    <q-input
-      v-else
-      :readonly="Field.ReadOnly"
-      v-bind="$attrs"
-      hide-bottom-space
-      @input="valueChanged"
-      type="number"
-      v-model.number="localData"
-      :ref="`input_field_validator_${Field.Name || Field.Label}`"
-      :maxlength="maxlength"
-    >
-      <template v-slot:before>
-        <span
-          :class="`field-label ${(Field.Label && Field.Label.trim().length)
-            ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`"
-          v-if="typeof Field.Label !== 'undefined'"
-        >
-          <q-tooltip
-            v-if="Field.Description"
-            anchor="top right"
-          >{{Field.Description}}</q-tooltip>
-          {{Field.Label || ''}}
-          <span
-            v-if="Field.Required"
-            class="required-mark"
-          >*</span>
-        </span>
-      </template>
-
-      <template
-        v-slot:prepend
-        v-if="Field.Options && Field.Options.Prefix"
-      >
-        <span class="prefix">{{Field.Options.Prefix}}</span>
-      </template>
-
-      <template
-        v-slot:append
-        v-if="Field.Options && Field.Options.Postfix"
-      >
-        <span class="postfix">{{Field.Options.Postfix}}</span>
-      </template>
-    </q-input>
-    <slot name="warning"></slot>
-  </span>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldNumber',
-  mixins: [mixins.InputFieldMixin],
-  emits:['input'],
-  fieldInfo: {
-    Category: 'Simple',
-    Label: '数字',
-    Value: 'Number',
-    Extra: [
-      {
-        Type: 'String',
-        Label: '前缀',
-        Name: 'Options.Prefix',
-      },
-      {
-        Type: 'String',
-        Label: '后缀',
-        Name: 'Options.Postfix',
-      },
-      {
-        Type: 'Number',
-        Label: '最小值',
-        Name: 'MinValue',
-      },
-      {
-        Type: 'Number',
-        Label: '最大值',
-        Name: 'MaxValue',
-      },
-      {
-        Type: 'Number',
-        Label: '最大长度',
-        Name: 'Options.MaxLength',
-      },
-      {
-        Type: 'DynamicList',
-        Label: '附加字段',
-        Name: 'Options.Extra',
-        Options: {
-          Columns: [
-            {
-              Label: '值范围',
-              Name: 'Value',
-              Type: 'Labels',
-              Options: {
-                Batch: true,
-              },
-            },
-            {
-              Label: '不在其中时',
-              Type: 'Boolean',
-              Name: 'WhenNotIn',
-              Default: false,
-            },
-            {
-              Label: '字段',
-              Name: 'List',
-              Type: 'FieldList',
-              Options: {
-                Columns: [
-                  {
-                    Label: '#',
-                    Name: 'Index',
-                    sortable: true,
-                  },
-                  {
-                    Label: '名称',
-                    Name: 'Name',
-                    style: 'max-width: 200px;',
-                    sortable: true,
-                  },
-                  {
-                    Label: '标题',
-                    Name: 'Label',
-                    style: 'max-width: 200px;',
-                    sortable: true,
-                  },
-                ],
-              },
-            },
-          ],
-        },
-      },
-    ],
-    Description: '',
-  },
-  data() {
-    return {
-      localData: 0,
-    };
-  },
-  watch: {
-    fieldData() {
-      this.localData = this.fieldData;
-    },
-  },
-  created() {
-    this.localData = this.fieldData;
-  },
-  computed: {
-    maxlength() {
-      if (this.Field && this.Field.Options && this.Field.Options.MaxLength) {
-        return this.Field.Options.MaxLength;
-      }
-
-      return '';
-    },
-  },
-  methods: {
-    valueChanged(d) {
-      if (!d) return;
-
-      if (!Number(d) && Number(d) !== 0) return;
-
-      let v = d;
-      if (typeof this.Field.MinValue !== 'undefined' && Number(this.Field.MinValue) > v) {
-        v = Number(this.Field.MinValue);
-      }
-      if (typeof this.Field.MaxValue !== 'undefined' && Number(this.Field.MaxValue) < v) {
-        v = Number(this.Field.MaxValue);
-      }
-
-      this.localData = v;
-      this.fieldData = v;
-
-      this.$emit('input');
-    },
-    initExtra() {
-      if (
-        this.Field
-        && this.Field.Options
-        && this.Field.Options.Extra
-        && this.Field.Options.Extra.length > 0
-        && this.fieldData
-      ) {
-        const extraList = [];
-        const dataValue = this.fieldData ? this.fieldData.toString() : '';
-        for (let i = 0; i < this.Field.Options.Extra.length; i += 1) {
-          const extra = this.Field.Options.Extra[i];
-
-          if (extra.Value && extra.Value.length > 0) {
-            const hasIndex = extra.Value.indexOf(dataValue);
-            if ((extra.WhenNotIn && hasIndex < 0)
-              || (!extra.WhenNotIn && hasIndex >= 0)) {
-              for (let j = 0; j < extra.List.length; j += 1) {
-                const fld = extra.List[j];
-                // if (extraList.findIndex(f => f.Name === fld.Name && f.Label === fld.Label) < 0) {
-                extraList.push(fld);
-                // }
-              }
-            }
-          }
-        }
-        return extraList;
-      }
-      return [];
-    },
-  },
-});
-</script>

package/field-components/Fields/Password.vue

@@ -1,79 +0,0 @@
-<template>
-  <span class="simple-field input-field-password row items-center no-wrap">
-    <q-input
-      v-model="fieldData"
-      v-bind="$attrs"
-      hide-bottom-space
-      :readonly="Field.ReadOnly"
-      :type="isPwd ? 'password' : 'text'"
-      :autocomplete="(Field.Options && Field.Options.autocomplete) ? '' : 'new-password'"
-      @input="$emit('input')"
-      :ref="`input_field_validator_${Field.Name || Field.Label}`"
-      :maxlength="maxlength"
-    >
-      <template v-slot:before>
-        <span
-          :class="`field-label ${(Field.Label && Field.Label.trim().length)
-            ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`"
-          v-if="typeof Field.Label !== 'undefined'">
-          <q-tooltip v-if="Field.Description" anchor="top right">{{Field.Description}}</q-tooltip>
-          {{Field.Label || ''}}
-          <span v-if="Field.Required" class="required-mark">*</span>
-        </span>
-      </template>
-
-      <template v-slot:append>
-        <e-icon
-          :name="isPwd ? 'visibility_off' : 'visibility'"
-          class="cursor-pointer"
-          @click="isPwd = !isPwd"
-        />
-      </template>
-    </q-input>
-    <slot name="warning"></slot>
-  </span>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldPassword',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Simple',
-    Label: '密码',
-    Value: 'Password',
-    Description: '',
-    Extra: [
-      {
-        Type: 'Boolean',
-        Label: '自动填入',
-        Name: 'Options.autocomplete',
-        Default: 'false',
-      },
-      {
-        Type: 'Number',
-        Label: '最大长度',
-        Name: 'Options.MaxLength',
-      },
-    ],
-  },
-  data() {
-    return {
-      isPwd: true,
-    };
-  },
-  computed: {
-    maxlength() {
-      if (this.Field && this.Field.Options
-        && this.Field.Options.MaxLength) {
-        return this.Field.Options.MaxLength;
-      }
-
-      return '';
-    },
-  },
-});
-</script>

package/field-components/Fields/Static.vue

@@ -1,22 +0,0 @@
-<template>
-  <div class="input-field-static">
-    <slot name="warning"></slot>
-    {{fieldData}}
-  </div>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldStatic',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Static',
-    Label: '固定内容',
-    Value: 'Static',
-    Description: '',
-  },
-});
-</script>

package/field-components/Fields/String.vue

@@ -1,185 +0,0 @@
-<template>
-  <span
-    class="simple-field input-field-string row items-center no-wrap"
-    v-if="Field"
-  >
-    <span
-      v-if="Field.ReadOnly"
-      class="full-width"
-    >
-      <span
-        :class="`field-label field-label-readonly ${(Field.Label && Field.Label.trim().length)
-            ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`"
-        v-if="Field.Label !== void 0">
-        <q-tooltip
-          v-if="Field.Description"
-          anchor="top right"
-        >{{Field.Description}}</q-tooltip>{{Field.Label || ''}}
-        <span
-          v-if="Field.Required"
-          class="required-mark"
-        >*</span>
-      </span>
-      <span class="readonly-content">
-        <span
-          class="prefix"
-          v-if="Field.Options && Field.Options.Prefix"
-        >{{Field.Options.Prefix}}
-        </span>
-        <span :style="(Field.Info && Field.Info.Style) ? Field.Info.Style : ''">{{modelValue}}
-        </span>
-        <span
-          class="postfix"
-          v-if="Field.Options && Field.Options.Postfix"
-        >{{Field.Options.Postfix}}</span>
-      </span>
-    </span>
-    <q-input
-      v-else
-      v-model="localData"
-      @update:model-value="inputEvent"
-      autocomplete="off"
-      v-bind="$attrs"
-      hide-bottom-space
-      :readonly="Field.ReadOnly"
-      :ref="`input_field_validator_${Field.Name || Field.Label}`"
-      :maxlength="maxlength"
-      :style="(Field.Info && Field.Info.Style) ? Field.Info.Style : ''"
-    >
-      <template v-slot:before>
-        <span
-          :class="`field-label ${(Field.Label && Field.Label.trim().length)
-            ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`"
-          v-if="Field.Label !== void 0"
-        >
-          <q-tooltip
-            v-if="Field.Description"
-            anchor="top right"
-          >{{Field.Description}}</q-tooltip>
-          {{Field.Label || ''}}
-          <span
-            v-if="Field.Required"
-            class="required-mark"
-          >*</span>
-        </span>
-      </template>
-
-      <template
-        v-slot:prepend
-        v-if="Field && ((Field.Slots && Field.Slots.indexOf('prepend') >= 0)
-        || (Field.Options && Field.Options.Prefix))"
-      >
-        <slot name="prepend"
-          v-if="Field && Field.Slots && Field.Slots.indexOf('prepend') >= 0"></slot>
-        <span
-          class="prefix"
-          v-if="Field && Field.Options && Field.Options.Prefix"
-        >{{Field.Options.Prefix}}</span>
-      </template>
-
-      <template
-        v-slot:append
-        v-if="Field && ((Field.Slots && Field.Slots.indexOf('append') >= 0)
-        || (Field.Options && Field.Options.Postfix))"
-      >
-        <slot v-if="Field && Field.Slots && Field.Slots.indexOf('append') >= 0"
-          name="append"></slot>
-        <span
-          class="postfix"
-          v-if="Field && Field.Options && Field.Options.Postfix"
-        >{{Field.Options.Postfix}}</span>
-      </template>
-    </q-input>
-    <slot name="warning"></slot>
-  </span>
-</template>
-
-<script>
-import { defineComponent, ref, computed, watch } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldString',
-  emits: ['update:modelValue'],
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Simple',
-    Label: '字符串',
-    Value: 'String',
-    Extra: [
-      {
-        Type: 'String',
-        Label: '前缀',
-        Name: 'Options.Prefix',
-      },
-      {
-        Type: 'String',
-        Label: '后缀',
-        Name: 'Options.Postfix',
-      },
-      {
-        Type: 'String',
-        Label: '最小值',
-        Name: 'MinValue',
-      },
-      {
-        Type: 'String',
-        Label: '最大值',
-        Name: 'MaxValue',
-      },
-      {
-        Type: 'Number',
-        Label: '最大长度',
-        Name: 'Options.MaxLength',
-      },
-      {
-        Type: 'Labels',
-        Label: '类型检查',
-        Name: 'rules',
-      },
-    ],
-    Description: '',
-  },
-  props: {
-    // modelValue: {},
-    // Field: Object
-  },
-  setup(props, { emit }){
-    let localData = ref(props.fieldData || '');
-
-    watch(() => props.fieldData, (v) => {
-      localData.value = v.value;
-    })
-
-    const maxlength = computed(() => {
-      if (props.Field && props.Field.Options
-        && props.Field.Options.MaxLength) {
-        return props.Field.Options.MaxLength;
-      }
-      return '';
-    });
-
-    watch(localData, () => {
-      let v = localData.value;
-      if (typeof props.Field.MinValue !== 'undefined' && props.Field.MinValue > v) {
-        v = props.Field.MinValue;
-      }
-      if (typeof props.Field.MaxValue !== 'undefined' && props.Field.MaxValue < v) {
-        v = props.Field.MaxValue;
-      }
-
-      localData.value = v;
-    })
-
-    const inputEvent = (e) => {
-      emit('update:modelValue', e);
-    }
-
-    return {
-      localData,
-      maxlength,
-      inputEvent
-    }
-  },
-});
-</script>

package/field-components/Fields/Text.vue

@@ -1,89 +0,0 @@
-<template>
-  <span class="input-field-text">
-    <div :class="Field.Label ? 'warning-with-label' : 'warning-without-label'" >
-      <slot name="warning"></slot>
-    </div>
-    <span v-if="Field.ReadOnly" class="row no-wrap">
-      <span
-        :class="`field-label field-label-readonly ${(Field.Label && Field.Label.trim().length)
-            ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`"
-        v-if="typeof Field.Label !== 'undefined'"
-      >
-        <q-tooltip v-if="Field.Description" anchor="top right">{{Field.Description}}</q-tooltip>
-        {{Field.Label || ''}}
-        <span v-if="Field.Required" class="required-mark">*</span>
-      </span>
-      <span class="readonly-content" style="white-space: pre-wrap">{{fieldData}}</span>
-    </span>
-    <q-input
-      v-else
-      type="textarea"
-      v-model="fieldData"
-      @input="$emit('input')"
-      v-bind="$attrs"
-      hide-bottom-space
-      :readonly="Field.ReadOnly"
-      :rows="rows"
-      :ref="`input_field_validator_${Field.Name || Field.Label}`"
-      :maxlength="maxlength"
-    >
-      <template v-slot:before>
-        <span
-          :class="`field-label ${(Field.Label && Field.Label.trim().length)
-            ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`"
-          v-if="typeof Field.Label !== 'undefined'">
-          <q-tooltip v-if="Field.Description" anchor="top right">{{Field.Description}}</q-tooltip>
-          {{Field.Label || ''}}
-          <span v-if="Field.Required" class="required-mark">*</span>
-        </span>
-      </template>
-    </q-input>
-  </span>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldText',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Simple',
-    Label: '文本',
-    Value: 'Text',
-    Extra: [
-      {
-        Type: 'Number',
-        Label: '最大长度',
-        Name: 'Options.MaxLength',
-      },
-    ],
-    Description: '',
-  },
-  computed: {
-    rows() {
-      const contentLines = (this.fieldData && typeof this.fieldData === 'string') ? Math.max((this.fieldData.match(/\n/g) || '').length + 1, this.fieldData.length / 20) : 8;
-      return (this.Field && this.Field.ReadOnly) ? Math.min(contentLines, 20) : 8;
-    },
-    maxlength() {
-      if (this.Field && this.Field.Options
-        && this.Field.Options.MaxLength) {
-        return this.Field.Options.MaxLength;
-      }
-
-      return '';
-    },
-  },
-});
-</script>
-
-<style lang="sass" scoped>
-@import '../style.sass'
-
-.q-field__native
-  min-height: 160px
-
-.warning-with-label
-  margin-left: $fieldLabelWidth
-</style>