free-fe-core-modules 0.0.2 → 0.0.4

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>

package/field-components/Fields/UltimateFile.vue

@@ -1,100 +0,0 @@
-<template>
-  <div class="row input-field-file-list combined input-field--readonly">
-    <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>
-    <q-uploader
-      multiple
-      :class="`q-ma-xs`"
-      ref="uploader"
-    >
-      <template v-slot:list="scope">
-        <div v-if="scope.files.length && Field.AsList"
-          class="file-list file-list-list">
-          <q-list>
-            <q-item
-              class="file-list-item"
-              v-for="(file, index) in scope.files" :key="index">
-                <span class="file-name full-width ellipsis">
-                  {{ file.name }}
-                  <q-tooltip>{{ file.name }}</q-tooltip>
-                </span>
-
-                <span class="file-size full-width ellipsis">
-                  Size: {{ file.sizeLabel || file.__sizeLabel }}
-                </span>
-            </q-item>
-          </q-list>
-        </div>
-
-        <div v-if="scope.files.length && !Field.AsList"
-          class="file-list file-list-card row items-start justify-start q-gutter-xl">
-          <q-card
-            flat
-            class="file-list-item"
-            v-for="(file, index) in scope.files" :key="index">
-              <q-img class="file-image" :src="fileThumb(file)">
-                <div class="view-btn-wrapper absolute-full justify-center text-center">
-                  <q-btn
-                    flat
-                    class="view-btn full-height full-width"
-                    @click="preview(file)"
-                  >查看</q-btn>
-                </div>
-              </q-img>
-              <span class="file-name full-width ellipsis">
-                {{ file.name }}
-                <q-tooltip>{{ file.name }}</q-tooltip>
-              </span>
-
-              <span class="file-size full-width ellipsis">
-                Size: {{ file.sizeLabel || file.__sizeLabel }}
-              </span>
-          </q-card>
-        </div>
-      </template>
-    </q-uploader>
-    <q-dialog class="image-preview-dialog"
-      flat
-      full-width full-height v-model="showPreview"
-      style="background: rgba(0,0,0,0)">
-      <div class="image-preview">
-        <q-img contain :src="previewFile"
-          @click="showPreview=false"
-          style="height: 100%; max-width: 100%;"></q-img>
-      </div>
-    </q-dialog>
-  </div>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixnins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldUltimateFile',
-  mixins: [mixnins.UploaderMixin, mixnins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Upload',
-    Label: '上传文件',
-    Value: 'UltimateFile',
-    Description: '',
-  },
-  watch: {
-    fieldData() {
-      if (this.fieldData) {
-        this.$refs.uploader.files = this.fieldData;
-      }
-    },
-  },
-});
-</script>
-
-<style lang="sass">
-.q-uploader__header
-  display: none
-</style>

package/field-components/Fields/Year.vue

@@ -1,124 +0,0 @@
-<template>
-  <span class="input-field-year simple-field row items-center no-wrap">
-    <q-select
-      v-model="fieldData"
-      hide-bottom-space
-      :options="yearOptions"
-      :readonly="Field.ReadOnly"
-      @input="$emit('input')"
-      :ref="`input_field_validator_${Field.Name || Field.Label}`"
-      map-options
-      :label="Field.Placeholder"
-      emit-value
-      v-bind="$attrs"
-    >
-      <template v-slot:before v-if="typeof Field.Label !== 'undefined'">
-        <span
-          :class="`field-label ${(Field.Label && Field.Label.trim().length)
-            ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`">
-          <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-select>
-    <slot name="warning"></slot>
-  </span>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldYear',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'DateTime',
-    Label: '年份',
-    Value: 'Year',
-    Extra: [
-      {
-        Type: 'String',
-        Label: '最小值',
-        Name: 'MinValue',
-      },
-      {
-        Type: 'String',
-        Label: '最大值',
-        Name: 'MaxValue',
-      },
-      {
-        Type: 'Boolean',
-        Label: '最大至“现在”',
-        Name: 'Info.TillNow',
-      },
-      {
-        Type: 'Boolean',
-        Label: '最小从“现在”',
-        Name: 'Info.FromNow',
-      },
-      {
-        Type: 'DynamicList',
-        Label: '选项',
-        Name: 'Options',
-        Options: {
-          Columns: [
-            {
-              Label: 'Year',
-              Name: 'Value',
-            },
-            {
-              Label: 'Extra',
-              Name: 'Extra',
-              Type: 'FieldList',
-              Options: {
-                Columns: [
-                  {
-                    Label: '#',
-                    Name: 'Index',
-                  },
-                  {
-                    Label: '名称',
-                    Name: 'Name',
-                  },
-                  {
-                    Label: '标题',
-                    Name: 'Label',
-                  },
-                ],
-              },
-            },
-          ],
-        },
-      },
-    ],
-    Description: '',
-  },
-  computed: {
-    yearOptions() {
-      if (this.Field.Type !== 'Year') return [];
-
-      if (this.Field.Options && Array.isArray(this.Field.Options)) {
-        return this.Field.Options;
-      }
-
-      let minYear = 1900;
-      let maxYear = Date.now().year;
-
-      if (this.Field.MinValue && Number(this.Field.MinValue)) {
-        minYear = Number(this.Field.MinValue);
-      }
-      if (this.Field.MaxValue && Number(this.Field.MaxValue)) {
-        maxYear = Number(this.Field.MaxValue);
-      }
-
-      const options = [];
-      for (let i = minYear; i <= maxYear; i += 1) {
-        options.push(i);
-      }
-      return options;
-    },
-  },
-});
-</script>