free-fe-core-modules 0.0.2 → 0.0.4

package/field-components/Fields/AgreementCheck.vue

@@ -1,161 +0,0 @@
-<template>
-  <span :class="`input-field-agreement-check row items-center no-wrap ${(Field.Options
-    && Field.Options.Center) ? 'center full-width justify-center' : ''}`">
-    <span class="field-label-empty" v-if="!Field.Options || !Field.Options.Center"></span>
-    <div class="row no-wrap items-center relative-position"
-      :class="`check ${hasError ? 'input-field--error' : ''}`">
-      <q-checkbox
-        :class="`check`"
-        @input="validate(); $emit('input')"
-        v-bind="$attrs"
-        v-model="fieldData"
-      />
-
-      <div class="input-field-tips" v-if="Field.Tips && Field.Tips.length > 0">
-        <span class="input-field-tips-prefix"></span>
-        <span class="tips-list">
-          <span v-for="(tip, index) in Field.Tips"
-            :key="index" class="input-field-tips-tip">
-            <span class="input-field-tips-tip-prefix"></span>
-            <span v-for="(t, tindex) in fieldTip(tip)" :key="tindex">
-              <span v-if="t.Link" class="tip-link">
-                <span class="tip-link-prefix"></span>
-                <a :href="t.Link">{{t.Text}}</a>
-                <span class="tip-link-postfix"></span>
-              </span>
-              <span v-else class="tip-text">{{t.Text}}</span>
-            </span>
-            <span class="input-field-tips-tip-postfix"></span>
-          </span>
-        </span>
-        <span class="input-field-tips-postfix"></span>
-      </div>
-
-      <div class="input-field--error-tag" v-if="hasError">
-        <e-icon name="error"></e-icon>
-      </div>
-    </div>
-  </span>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldAgreementCheck',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Simple',
-    Label: '协议同意勾选框',
-    Value: 'AgreementCheck',
-    Extra: [
-      {
-        Type: 'Check',
-        Label: '居中显示',
-        Name: 'Options.Center',
-      },
-    ],
-    Description: '',
-  },
-  data() {
-    return {
-      hasError: false,
-    };
-  },
-  watch: {
-    fieldData() {
-      if (!this.fieldData) {
-        this.fieldData = false;
-      }
-    },
-  },
-  created() {
-    if (!this.fieldData) {
-      this.fieldData = false;
-    }
-  },
-  computed: {
-    fieldTip() {
-      return (tip) => {
-        if (!tip || !tip.Text) return '';
-        if (!tip.Links || !Array.isArray(tip.Links) || tip.Links.length <= 0) {
-          return [{ Text: tip.Text }];
-        }
-
-        // process tip with links
-        let linkPos = [];
-        tip.Links.forEach((tl) => {
-          if (!tl || !tl.Text || !tl.Link) return;
-
-          const start = tip.Text.indexOf(tl.Text);
-          if (start >= 0) {
-            linkPos.push({
-              start,
-              end: start + tl.Text.length,
-              Link: tl.Link,
-              File: tl.File,
-            });
-          }
-        });
-
-        const textSplit = [];
-        let start = 0;
-        linkPos = linkPos.sort((a, b) => a.start - b.start);
-        for (let i = 0; i < linkPos.length; i += 1) {
-          const lp = linkPos[i];
-
-          const beforeText = tip.Text.substr(start, lp.start - start);
-          if (beforeText) {
-            textSplit.push({ Text: beforeText });
-          }
-
-          textSplit.push({
-            Text: tip.Text.substr(lp.start, lp.end - lp.start),
-            Link: lp.File
-              ? this.$options.filters.serverDocument(lp.File)
-              : lp.Link,
-          });
-
-          start += lp.end;
-        }
-
-        const afterText = tip.Text.substr(start);
-        if (afterText) {
-          textSplit.push({
-            Text: afterText,
-          });
-        }
-
-        if (textSplit.length > 0) return textSplit;
-
-        return [{ Text: tip.Text }];
-      };
-    },
-  },
-  methods: {
-    validate() {
-      if (this.Field.Required) {
-        this.hasError = typeof this.fieldData === 'undefined' || !this.fieldData;
-        return !this.hasError;
-      }
-
-      const rules = Array.isArray(typeof this.Field.Rules)
-        ? this.Field.Rules
-        : [this.Field.Rules];
-
-      let isValid = true;
-      for (let i = 0; i < rules.length; i += 1) {
-        const r = rules[i];
-
-        if (typeof r === 'function') {
-          isValid = isValid && r(this.fieldData);
-        }
-      }
-
-      this.hasError = !isValid;
-      return isValid;
-    },
-  },
-});
-</script>

package/field-components/Fields/ApiCall.vue

@@ -1,139 +0,0 @@
-<template>
-  <div class="simple-field input-field-apicall row items-start no-wrap">
-    <span
-      class="full-width"
-      v-if="Field"
-    >
-      <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 : ''">
-          {{callResult}}
-        </span>
-        <span
-          class="postfix"
-          v-if="Field.Options && Field.Options.Postfix"
-        >{{Field.Options.Postfix}}</span>
-      </span>
-    </span>
-    <slot name="warning"></slot>
-  </div>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldApiCall',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Advanced',
-    Label: '特定接口处理',
-    Value: 'ApiCall',
-    Extra: [
-      {
-        Type: 'String',
-        Label: '数据获取地址',
-        Name: 'Options.Url',
-      },
-      {
-        Type: 'String',
-        Label: '传送字段名',
-        Name: 'Options.Fields',
-        Placeholder: '逗号分割',
-        Tips: [
-          {
-            Text: '默认将传送当前字段数据，但可以指定相同数据层级下的其他字段。',
-          },
-        ],
-      },
-      {
-        Type: 'String',
-        Label: '附加字段名',
-        Name: 'Options.ExtraFieldNames',
-        Placeholder: '逗号分割',
-        Tips: [
-          {
-            Text: '如果接口返回值中有这些字段，他们将会被赋予当前父数据中。',
-          },
-        ],
-      },
-    ],
-    Description: '',
-  },
-  data() {
-    return {
-      callResult: '',
-    };
-  },
-  watch: {
-    fieldData() {
-      this.apiCall();
-    },
-  },
-  // created() {
-  //   this.apiCall();
-  // },
-  // updated() {
-  //   this.apiCall();
-  // },
-  methods: {
-    apiCall() {
-      this.Field.Options.Fields = this.Field.Options.Fields || this.Field.Name;
-
-      if (!this.Field || !this.Field.Options || !this.Field.Options.Fields) {
-        return;
-      }
-
-      const paramObj = {};
-      if (this.Field.Options.Fields.length > 0) {
-        if (typeof this.Field.Options.Fields === 'string') {
-          this.Field.Options.Fields = this.Field.Options.Fields.split(',');
-        }
-        for (let i = 0; i < this.Field.Options.Fields.length; i += 1) {
-          const fld = this.Field.Options.Fields[i];
-
-          if (fld) {
-            Object.setValue(paramObj, fld, Object.nestValue(this.data, fld));
-          }
-        }
-      } else {
-        Object.setValue(paramObj, this.Field.Name, this.fieldData);
-      }
-
-      this.postRequest(this.Field.Options.Url, paramObj).then((d) => {
-        if (d && d.msg === 'OK') {
-          if (d.data && d.data.value) {
-            this.callResult = d.data.value;
-          } else {
-            this.callResult = d.data;
-          }
-
-          // other extra new fields
-          (this.Field.Options.ExtraFieldNames || '').split(',').forEach((fname) => {
-            //this.$set(this.data, fname, d.data[fname]);
-            this.data[fname] = d.data[fname];
-          });
-        }
-      });
-    },
-  },
-});
-</script>

package/field-components/Fields/Category.vue

@@ -1,33 +0,0 @@
-<template>
-  <div
-    v-if="typeof Field.Label !== 'undefined'"
-    v-bind="$attrs"
-    class="input-field-category simple-field row items-center no-wrap">
-    <span class="label">{{Field.Label}}</span>
-    <slot name="warning"></slot>
-    </div>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldCategory',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Static',
-    Label: '字段分类',
-    Value: 'Category',
-    Description: '',
-  },
-});
-</script>
-
-<style lang="sass" scoped>
-.field-category
-    font-size: 14px
-    font-weight: bold
-    margin-top: 12px
-    margin-bottom: 12px
-</style>

package/field-components/Fields/Check.vue

@@ -1,131 +0,0 @@
-<template>
-  <span class="simple-field input-field-check row items-center no-wrap">
-    <span>
-      <span
-        :class="`field-label ${(Field.Label && Field.Label.trim().length)
-          ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`"
-        v-if="Field.showLabel && !Field.dense && 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 v-else-if="!Field.showLabel && !Field.dense" class="field-label-empty"></span>
-
-      <q-checkbox
-        @input="$emit('input')"
-        :disable="Field.ReadOnly"
-        v-bind="$attrs"
-        :label="!Field.showLabel ? Field.Label : ''"
-        v-model="fieldData"
-      />
-    </span>
-    <slot name="warning"></slot>
-  </span>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldCheck',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Simple',
-    Label: '勾选',
-    Value: 'Check',
-    Extra: [
-      {
-        Type: 'FixedList',
-        Label: '选项',
-        Name: 'Options',
-        Options: {
-          Columns: [
-            {
-              Label: 'Label',
-              Name: 'Label',
-              ReadOnly: true,
-            },
-            {
-              Label: 'Value',
-              Name: 'Value',
-              ReadOnly: true,
-            },
-            {
-              Label: 'Extra',
-              Name: 'Extra',
-              Type: 'FieldList',
-              Options: {
-                Columns: [
-                  {
-                    Label: '#',
-                    Name: 'Index',
-                  },
-                  {
-                    Label: '名称',
-                    Name: 'Name',
-                  },
-                  {
-                    Label: '标题',
-                    Name: 'Label',
-                  },
-                ],
-              },
-            },
-          ],
-          Default: [
-            {
-              Label: '选中',
-              Value: true,
-              Extra: [],
-            },
-            {
-              Label: '未选',
-              Value: false,
-              Extra: [],
-            },
-          ],
-        },
-      },
-    ],
-    Description: '',
-  },
-  watch: {
-    fieldData() {
-      if (!this.fieldData) {
-        this.fieldData = false;
-      }
-    },
-  },
-  created() {
-    if (!this.fieldData) {
-      this.fieldData = false;
-    }
-  },
-  methods: {
-    validate() {
-      if (this.Field.Required) return typeof this.fieldData !== 'undefined';
-
-      const rules = Array.isArray(typeof this.Field.Rules) ? this.Field.Rules : [this.Field.Rules];
-
-      let isValid = true;
-      for (let i = 0; i < rules.length; i += 1) {
-        const r = rules[i];
-
-        if (typeof r === 'function') {
-          isValid = isValid && r(this.fieldData);
-        }
-      }
-
-      return isValid;
-    },
-  },
-});
-</script>

package/field-components/Fields/Customize.vue

@@ -1,103 +0,0 @@
-<template>
-  <div class="input-field-customize">
-    <span
-      :class="`field-label field-label-readonly ${(Field.Label && Field.Label.trim().length)
-          ? '' : 'field-label-empty'} ${Field.Required ? 'required' : ''}`"
-      v-if="Field.Label"
-    >
-      <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 ref="content"></span>
-
-    <slot name="warning"></slot>
-  </div>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldCustomize',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'Advanced',
-    Label: '自定义模板',
-    Value: 'Customize',
-    Extra: [
-      {
-        Type: 'Rich',
-        Label: '模板',
-        enableField: true,
-        Name: 'Options.Template',
-      },
-    ],
-    Description: '',
-  },
-  watch: {
-    htmlContent() {
-      this.$refs.content.innerHTML = this.htmlContent;
-    },
-    // fieldData() {
-    //   if (this.fieldData && this.$refs.content) {
-    //     this.$refs.content.innerHTML = this.generateContent(this.fieldData);
-    //   }
-    // },
-  },
-  mounted() {
-    if (this.htmlContent) {
-      this.$refs.content.innerHTML = this.htmlContent;
-    }
-  },
-  computed: {
-    htmlContent() {
-      const template = this.Field && this.Field.Options ? this.Field.Options.Template : '';
-      if (!template) return '';
-
-      if (!this.fieldData) return template;
-
-      const replaced = template.replace(
-        /<efield>{([^<]*)}<\/efield>/g,
-        (match, name) => {
-          if (this.fieldData[name]) {
-            // could be options
-            if (this.fieldData.StepsDefinition) {
-              const cStep = this.fieldData.StepsDefinition.find(
-                (s) => s.Index === this.fieldData.CurrentStep,
-              );
-              if (cStep && cStep.Fields) {
-                const fld = cStep.Fields.find((f) => f.Name === name);
-
-                if (fld && fld.Options && Array.isArray(fld.Options)) {
-                  const fVal = fld.Options.find(
-                    (o) => o.Value === this.fieldData[name],
-                  );
-
-                  if (fVal && fVal.Label) {
-                    return fVal.Label;
-                  }
-                }
-              }
-            }
-
-            // otherwise.
-            return this.fieldData[name];
-          }
-          return '';
-        },
-      );
-
-      return replaced;
-    },
-  },
-});
-</script>

package/field-components/Fields/Date.vue

@@ -1,142 +0,0 @@
-<template>
-  <span class="simple-field input-field-date row items-center no-wrap">
-    <span v-if="Field.ReadOnly">
-      <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">{{localData}}</span>
-    </span>
-    <q-input
-      v-else
-      v-model="localData"
-      hide-bottom-space
-      :readonly="Field.ReadOnly"
-      v-bind="$attrs"
-      @input="$emit('input')"
-      :ref="`input_field_validator_date`"
-    >
-      <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-popup-proxy
-        v-if="!Field.ReadOnly"
-        ref="qDateProxy"
-        transition-show="scale"
-        transition-hide="scale"
-      >
-        <span class="row">
-          <q-date
-            v-model="localData"
-            v-bind="$attrs"
-            :options="dateOptions"
-            today-btn
-            mask="YYYY-MM-DD"
-            :locale="locale"
-            @input="() => {$refs.qDateProxy.hide();$emit('input')}"
-          />
-        </span>
-      </q-popup-proxy>
-      <template v-slot:append>
-        <q-icon name="event" class="cursor-pointer">
-        </q-icon>
-      </template>
-    </q-input>
-    <slot name="warning"></slot>
-  </span>
-</template>
-
-<script>
-import { defineComponent } from 'vue';
-import mixins from 'free-fe-mixins';
-
-export default defineComponent({
-  name: 'InputFieldDate',
-  mixins: [mixins.InputFieldMixin],
-  fieldInfo: {
-    Category: 'DateTime',
-    Label: '日期',
-    Value: 'Date',
-    Extra: [
-      {
-        Type: 'String',
-        Label: '最小值',
-        Name: 'MinValue',
-      },
-      {
-        Type: 'String',
-        Label: '最大值',
-        Name: 'MaxValue',
-      },
-      {
-        Type: 'Boolean',
-        Label: '最大至“现在”',
-        Name: 'Info.TillNow',
-      },
-      {
-        Type: 'Boolean',
-        Label: '最小从“现在”',
-        Name: 'Info.FromNow',
-      },
-    ],
-    Description: '',
-  },
-  data() {
-    return {
-      localData: '',
-    };
-  },
-  watch: {
-    fieldData() {
-      if (!this.fieldData) {
-        this.localData = '';
-        return;
-      }
-      this.localData = this.$options.filters.normalDate(this.fieldData);
-    },
-    localData() {
-      this.fieldData = this.localData;
-    },
-  },
-  computed: {
-    locale() {
-      return this.ctx.config.locales.find(
-        (l) => l.locale === (this.ctx.config.locale || this.ctx.config.defaultLocale),
-      ).calendar;
-    },
-    dateOptions() {
-      if (this.Field.Options && (typeof this.Field.Options === 'function' || Array.isArray(this.Field.Options))) return this.Field.Options;
-
-      let minDate = '1900/01/01';
-      let maxDate = '2100/12/31';
-
-      if (this.Field.MinValue) {
-        minDate = this.Field.MinValue;
-      }
-
-      if (this.Field.MaxValue === 'now') {
-        maxDate = new Date().toLocaleDateString();
-      } else if (this.Field.MaxValue) {
-        maxDate = this.Field.MaxValue;
-      }
-
-      return (date) => date >= minDate && date <= maxDate;
-    },
-  },
-});
-</script>
-
-<style lang="sass" scoped>
-.q-field--with-bottom
-  padding-bottom: 0
-</style>