@neatui/nuxt 1.5.5 → 1.6.0

package/src/components/form/DateRangePicker@v2.vue.backup

@@ -1,224 +0,0 @@
-<template>
-  <div :ui-form="`@a type:select sz:${sz}`" ui-tips="@a co:well" :ui-tips-view="state.show">
-    <IFollowView>
-      <Input v-bind="$props" :clearable="false" readonly v-model="state.value" @click="toggle">
-        <template #suffix><i ui-form-select=""></i></template>
-      </Input>
-      <template #tips>
-        <div ui-calendar="@a" class="w-ll">
-          <div ui-calendar-head="">
-            <div ui-flex="row lm" class="nx-ss-sub">
-              <span class="fw-auto">{{ curr.y }}-{{ curr.m }}</span>
-            </div>
-            <div ui-flex="row rm">
-              <button class="fs-xs mr-ss" ui-btn="@a main s">使用</button>
-            </div>
-          </div>
-          <ul ui-calendar-week="">
-            <li><span>日</span></li>
-            <li><span>一</span></li>
-            <li><span>二</span></li>
-            <li><span>三</span></li>
-            <li><span>四</span></li>
-            <li><span>五</span></li>
-            <li><span>六</span></li>
-          </ul>
-          <div>
-            <ul ui-calendar-days="">
-              <li
-                v-for="(item, idx) in curr.days"
-                :key="idx"
-                :class="`${item.isToday ? 'today' : item.isLastMonth || item.isNextMonth ? 'o-sl' : item.isHoliday ? 'co-risk' : ''} ${
-                  state.selected && state.selected === item.date ? 'active' : ''
-                }`"
-              >
-                <div v-if="item.day" @click="change(item)" class="pr">
-                  <span>{{ item.day }}</span>
-                  <sup style="font-size: 0.6em; margin-top: -0.3em; position: absolute; left: 100%; top: 0" v-if="item.holiday" class="lh-ss">休</sup>
-                </div>
-              </li>
-            </ul>
-          </div>
-          <div ui-calendar-foot="">
-            <div ui-flex="row lm">
-              <div ui-calendar-prev-year="" @click="prev('y')"></div>
-              <div ui-calendar-prev="" @click="prev('m')"></div>
-            </div>
-            <div ui-flex="row cm" class="nx-ss-sub">
-              <ul class="fs-xs n-sm-sub" ui-flex="row lm">
-                <li ui-btn="@a s none">年</li>
-                <li ui-btn="@a s none">月</li>
-                <li ui-btn="@a s none">日</li>
-                <li ui-btn="@a s none">时</li>
-              </ul>
-            </div>
-            <div ui-flex="row rm">
-              <div ui-calendar-next="" @click="next('m')"></div>
-              <div ui-calendar-next-year="" @click="next('y')"></div>
-            </div>
-          </div>
-        </div>
-      </template>
-    </IFollowView>
-  </div>
-</template>
-<script setup lang="ts">
-  import { computed, reactive, toRefs } from 'vue';
-  import { idate } from '@fekit/utils';
-  import { Input } from '../form';
-  import { IFollowView } from '../basic';
-
-  // 创建日期
-  const cDate = (date: any = null) => {
-    const _date = new Date(date);
-    return date && _date instanceof Date && !isNaN(_date.getTime()) ? _date : new Date();
-  };
-  // 个位补零
-  const numfill = (num: string | number = '') => {
-    return Number(num) < 10 ? `0${num}` : num;
-  };
-  // 外部入参
-  const props = defineProps({
-    theme: { type: String, default: '@a' },
-    sz: { type: String, default: 'm' },
-    co: { type: String, default: '' },
-    block: { type: Boolean, default: true },
-    // 提示文案
-    tips: {
-      type: String,
-      default: ''
-    },
-    // 提示文案
-    placeholder: {
-      type: String,
-      default: ''
-    },
-    // 格式
-    format: {
-      type: String,
-      default: ''
-    },
-    // 值
-    value: {
-      type: [String, Number],
-      default: ''
-    },
-    // 节假日
-    holiday: {
-      type: Object,
-      default: () => ({})
-    },
-    // 校验规则
-    rules: {
-      type: Array,
-      default: () => []
-    },
-    // 是否是示校验图标
-    verify: {
-      type: Boolean,
-      default: false
-    }
-  });
-
-  // 内部数据
-  const state: any = reactive({
-    view: 1,
-    show: 0,
-    pos: 'bl',
-    selected: '',
-    date: props.value,
-    curr: computed(() => {
-      const date = cDate(state.date);
-      const calendar = [];
-      // 年
-      const y: any = date.getFullYear();
-      // 月
-      const m: any = date.getMonth() + 1;
-      // 日
-      const d: any = date.getDate();
-      // 本月第一天星期几
-      const w = new Date(`${y}-${m}-1`).getDay();
-      // 当前月份一共几天
-      const days = new Date(y, m, 0).getDate();
-
-      // 当前
-      const curr = new Date();
-      const curr_y = curr.getFullYear();
-      const curr_m = curr.getMonth() + 1;
-      const curr_d = curr.getDate();
-
-      // 上月
-      const last = new Date(y, m - 1, 0);
-      const last_y = last.getFullYear();
-      const last_m = last.getMonth() + 1;
-
-      // 下月
-      const next = new Date(y, m + 1, 0);
-      const next_y = next.getFullYear();
-      const next_m = next.getMonth() + 1;
-      let prevdays = last.getDate();
-
-      for (let i = 0; i < w; i++) {
-        calendar.unshift({
-          date: `${last_y}-${numfill(last_m)}-${prevdays}`,
-          day: prevdays,
-          isLastMonth: 1
-        });
-        prevdays = prevdays - 1;
-      }
-      for (let i = 1; i <= days; i++) {
-        const _i = numfill(i);
-        calendar.push({
-          date: `${y}-${numfill(m)}-${_i}`,
-          day: _i,
-          isToday: curr_y === y && curr_m === m && curr_d === i,
-          isHoliday: props.holiday[`${y}-${numfill(m)}-${_i}`]?.name ? 1 : 0,
-          holiday: props.holiday[`${y}-${numfill(m)}-${_i}`]?.name
-        });
-      }
-      for (let i = 1; calendar.length < 42; i++) {
-        const _i = numfill(i);
-        calendar.push({
-          date: `${next_y}-${numfill(next_m)}-${_i}`,
-          day: _i,
-          isNextMonth: 1
-        });
-      }
-      return { days: calendar, y, m, d };
-    }),
-    value: computed(() => {
-      return props.format ? idate(state.selected || props.value).format(props.format) : state.selected || props.value;
-    })
-  });
-  const { curr = {} }: any = toRefs(state);
-
-  const toggle = () => {
-    state.show = state.show ? 0 : 1;
-  };
-  const upload = (a: any = 'm', b: any = 1) => {
-    const date = cDate(state.date);
-    if (a === 'm') {
-      date.setMonth(date.getMonth() + b);
-    } else {
-      date.setFullYear(date.getFullYear() + b);
-    }
-    return date.toISOString().substring(0, 10);
-  };
-
-  // 日期前翻
-  const prev = (type: any = 'm') => {
-    state.date = upload(type, -1);
-  };
-  // 日期后翻
-  const next = (type: any = 'm') => {
-    state.date = upload(type, 1);
-  };
-
-  // 向外通信
-  const emits = defineEmits(['change']);
-  const change = (item: any) => {
-    state.selected = item.date;
-    state.date = item.date;
-    emits('change', item.date);
-  };
-</script>

package/src/components/form/Input.vue.backup

@@ -1,230 +0,0 @@
-<template>
-  <div
-    :ui-form="`${theme} sz:${sz} ${state.error.co} type:input ${block ? ' :block' : ''} ${disabled ? 'disabled' : ''} ${readonly ? 'readonly' : ''}`"
-    @click="emits('click', $event)"
-  >
-    <div :ui-form-tips="state.error.ontips">{{ state.error.tips }}</div>
-    <div ui-form-prefix="">
-      <template v-for="(item, idx) in prefix" :key="idx">
-        <div v-html="isObject(item) ? item.html : item"></div>
-      </template>
-      <slot name="prefix"></slot>
-    </div>
-    <slot>
-      <input
-        v-model="state.value"
-        :type="type"
-        :placeholder="placeholder"
-        :readonly="readonly || disabled"
-        autocomplete="new-password"
-        @focus="emits('focus', $event, state)"
-        @input="input($event)"
-        @change="emits('change', $event, state)"
-        @blur="blur($event)"
-      />
-    </slot>
-    <div ui-form-suffix="">
-      <i ui-form-clean="" v-if="clearable && state.value && !readonly && !disabled" @click.stop="clear"></i>
-      <slot name="suffix"></slot>
-      <template v-for="(item, idx) in suffix" :key="idx">
-        <div v-html="isObject(item) ? item.html : item"></div>
-      </template>
-    </div>
-    <i v-if="ready && verify" :ui-form-verify="verify"></i>
-  </div>
-</template>
-
-<script setup lang="ts">
-  import { reactive, watch } from 'vue';
-  import { isObject } from '@fekit/utils';
-
-  const emits = defineEmits(['update:modelValue', 'click', 'blur', 'focus', 'change', 'input', 'clear']);
-
-  /**
-   * 入参说明
-   *
-   * modelValue     值
-   * theme          主题
-   * sz             尺寸
-   * co             颜色
-   * block          撑满
-   * ready          准备就绪
-   * type           类型
-   * tips           提示文案
-   * placeholder    内容占位
-   * maxlength      最大长度
-   * minlength      最小长度
-   * disabled       是否禁用
-   * readonly       是否只读
-   * clearable      是否显示清除按钮
-   * rules          校验规则
-   * verify         是否是示校验图标
-   * prefix         前缀内容
-   * suffix         后缀内容
-   * interacted     用户是否交互
-   */
-
-  // 类型
-  interface Props {
-    modelValue?: string | number;
-    placeholder?: string;
-    rules?: Array<object>;
-    theme?: string;
-    sz?: '' | 'xs' | 's' | 'm' | 'l' | 'xl';
-    co?: string;
-    block?: boolean;
-    ready?: boolean;
-    type?: string;
-    tips?: string;
-    maxlength?: null | number;
-    minlength?: null | number;
-    disabled?: boolean;
-    readonly?: boolean;
-    clearable?: boolean;
-    verify?: boolean;
-    prefix?: Array<any>;
-    suffix?: Array<any>;
-    interacted?: boolean;
-  }
-  const props: any = withDefaults(defineProps<Props>(), {
-    modelValue: '',
-    placeholder: '',
-    rules: () => [],
-    theme: '@a',
-    sz: '',
-    co: '',
-    block: true,
-    ready: false,
-    type: 'text',
-    tips: '',
-    maxlength: null,
-    minlength: null,
-    disabled: false,
-    readonly: false,
-    clearable: true,
-    verify: false,
-    prefix: () => [],
-    suffix: () => [],
-    interacted: false
-  });
-
-  const state: any = reactive({
-    // 用户是否交互
-    interacted: false,
-    // 值
-    value: props.modelValue,
-    // 错误
-    error: {}
-  });
-  // 外部传入交互标识，主要用于外部没有输入但点击了提交
-  watch(
-    () => props.interacted,
-    (interacted: any) => {
-      if (interacted) {
-        state.interacted = interacted;
-      }
-    },
-    { deep: true, immediate: true }
-  );
-
-  // 监听异步数据
-  watch(
-    () => props.modelValue,
-    (value: any) => {
-      if (state.value !== value) {
-        state.value = value;
-      }
-    },
-    { deep: true, immediate: true }
-  );
-  watch(
-    () => state.value,
-    (value: any) => {
-      emits('update:modelValue', value);
-    },
-    { deep: true, immediate: true }
-  );
-
-  // 校验
-  watch(
-    [() => state.interacted, () => state.value],
-    async () => {
-      if (state.interacted) {
-        // 提示文案
-        let tips = '';
-        // 错误类型
-        let type = '';
-        // 验证结果
-        let verify = '';
-
-        if (props.modelValue) {
-          // 有值
-          let hasError = false;
-          // 遍历校验规则
-          for (const rule of props.rules) {
-            if (rule && rule.validator) {
-              const yes = !(await rule.validator(props.modelValue));
-              if (yes) {
-                tips = rule.msg;
-                type = rule.type;
-                hasError = true;
-                break;
-              }
-            }
-          }
-          verify = hasError ? 'no' : 'ok';
-        } else {
-          // 无值
-          let hasError = false;
-          // 遍历校验规则
-          for (const rule of props.rules) {
-            if (rule) {
-              tips = rule.msg;
-              type = rule.type;
-              if (rule.required) {
-                hasError = true;
-                break;
-              }
-            }
-          }
-          verify = hasError ? 'no' : '';
-        }
-        if (verify !== 'no' && props.tips) {
-          tips = props.tips;
-        }
-        // 是否显示提示
-        const ontips = (verify === 'no' && tips) || props.tips ? 'show' : '';
-        // 状态颜色
-        const co = verify === 'no' ? 'co:' + type : props.co ? 'co:' + props.co : '';
-        state.error = { tips, ontips, verify, co };
-      } else {
-        state.error = { tips: props.tips, ontips: props.tips ? 'show' : '', verify: '', co: '' };
-      }
-    },
-    { deep: true, immediate: true }
-  );
-
-  // 清空
-  function clear() {
-    emits('update:modelValue', '');
-    emits('clear');
-  }
-  // 输入
-  const input = (e: any) => {
-    if (!state.interacted) {
-      setTimeout(() => {
-        state.interacted = true;
-      }, 50);
-    }
-    emits('input', e, state);
-  };
-  // 失焦
-  const blur = (e: any) => {
-    if (!state.interacted) {
-      setTimeout(() => {
-        state.interacted = true;
-      }, 50);
-    }
-    emits('blur', e, state);
-  };
-</script>

package/src/components/form/MoreSelect.vue.backup

@@ -1,144 +0,0 @@
-<template>
-  <div :ui-form="`@a type:select ${sz ? 'sz:' + sz : ''}`">
-    <IFollowView ref="ifollow" tipBoxClass="ny-sm nx-no" tipBoxStyle="min-width: 100%">
-      <slot>
-        <Input v-bind="$props" :clearable="false" readonly v-model="state.value" :interacted="interacted">
-          <template #suffix><i ui-form-select=""></i></template>
-        </Input>
-      </slot>
-      <template #tips>
-        <ul v-if="props.options?.length" ui-scroll=":y s" class="nx-sm lh-ml" style="min-width: 100%; max-height: 15em">
-          <template v-for="(item, idx) of props.options" :key="idx">
-            <li v-if="item.disable" class="ux-hover nx-sm r-ss o-ms">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
-                <input type="checkbox" :name="state.name" :checked="modelValue?.some((i: any) => `${i}` === `${item.value}`)" />
-                <del class="ml-sm">{{ item.label || item }}</del>
-              </label>
-            </li>
-            <li v-else class="ux-hover nx-sm r-ss" @click.stop="select(item.value)">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
-                <input type="checkbox" :name="state.name" :checked="modelValue?.some((i: any) => `${i}` === `${item.value}`)" />
-                <span class="ml-sm">{{ item.label || item }}</span>
-              </label>
-            </li>
-          </template>
-        </ul>
-        <div v-else class="w-full ny-ms" ui-flex="col cm" v-html="spare"></div>
-        <ul class="nx-sm lh-ml" v-if="tools">
-          <li class="my-ss"><div class="o-mm" ui-line="@a"></div></li>
-          <li ui-flex="row xm">
-            <div class="ux-hover nx-sm r-ss nowrap co-main" @click.stop="allselect()">
-              <label style="pointer-events: none" ui-form="@a type:checkbox :block">
-                <input type="checkbox" :name="state.name" :checked="state.all" />
-                <span class="ml-sm">全选({{ props.options?.length || 0 }})</span>
-              </label>
-            </div>
-            <div>
-              <button v-show="state.has" class="co-risk" ui-btn="@a none s" @click="remove">清空</button>
-            </div>
-          </li>
-        </ul>
-      </template>
-    </IFollowView>
-  </div>
-</template>
-
-<script setup lang="ts">
-  import { reactive, ref, computed, watch } from 'vue';
-  import { Input } from '../form';
-  import { IFollowView } from '../basic';
-  const ifollow: any = ref(null);
-
-  const emits = defineEmits(['update:modelValue']);
-  const props: any = defineProps({
-    // 用户是否交互
-    interacted: {
-      type: Boolean,
-      default: false
-    },
-    theme: { type: String, default: '@a' },
-    sz: { type: String, default: '' },
-    co: { type: String, default: '' },
-    block: { type: Boolean, default: true },
-    // 提示文案
-    tips: {
-      type: String,
-      default: ''
-    },
-    placeholder: {
-      type: String,
-      default: ''
-    },
-    modelValue: {
-      type: Array as () => any[],
-      default: () => []
-    },
-    options: {
-      type: Array as () => any[],
-      default: () => []
-    },
-    // 校验规则
-    rules: {
-      type: Array,
-      default: () => []
-    },
-    // 是否是示校验图标
-    verify: {
-      type: Boolean,
-      default: false
-    },
-    tools: {
-      type: Boolean,
-      default: true
-    },
-    spare: {
-      type: String,
-      default: '当前没有可选项'
-    }
-  });
-
-  const state: any = reactive({
-    name: computed(() => {
-      return Array.from({ length: 8 }, () => String.fromCharCode(97 + Math.floor(Math.random() * 26))).join('');
-    }),
-    show: 0,
-    value: '',
-    all: computed(() => {
-      return props.options?.every((item: any) => props.modelValue?.some((i: any) => `${i}` === `${item.value}`));
-    }),
-    has: computed(() => {
-      return props.options?.some((item: any) => props.modelValue?.some((i: any) => `${i}` === `${item.value}`));
-    })
-  });
-
-  // 监听外部数据
-  watch(
-    () => props.modelValue,
-    (v: any = []) => {
-      const selectd: any = props.options?.filter((item: any) => v?.some((i: any) => `${i}` === `${item.value}`))?.map((item: any) => item.label) || [];
-      state.value = selectd.join(' Ι ') || '';
-    },
-    { deep: true, immediate: true }
-  );
-
-  // 更新
-  const change = (item: any) => {
-    emits('update:modelValue', item);
-  };
-  // 选中
-  const select = (item: any) => {
-    const s = [...props.modelValue];
-    s?.indexOf(item) !== -1 ? s?.splice(s?.indexOf(item), 1) : s?.push(item);
-    change(s);
-  };
-  // 全选
-  const allselect = () => {
-    const s = state.all ? [] : props.options?.map((item: any) => item.value);
-    change(s);
-  };
-  // 清除
-  const remove = () => {
-    change([]);
-    ifollow.value.cancel();
-  };
-</script>