dpzvc3-ui 3.1.4 → 3.1.6

package/src/components/picker/picker.tsx

@@ -1,112 +0,0 @@
-// src/components/picker/picker.tsx
-import { defineComponent, ref, computed, watch, provide, PropType } from 'vue'
-import Popup from '../popup'
-import AreaPicker from './area-picker/area-picker.vue'
-import DatePicker from './date-picker/date-picker.vue'
-import NormalPicker from './normal-picker/normal-picker.vue'
-import type { PickerProps } from './types'
-
-export type { PickerProps }
-
-const prefixCls = 'dpzvc3-picker'
-const LIST = ['DatePicker', 'AreaPicker', 'NormalPicker']
-
-export default defineComponent({
-  name: 'Dpzvc3Picker',
-  components: { Popup, AreaPicker, DatePicker, NormalPicker },
-  props: {
-    type: {
-      type: String as PropType<PickerProps['type']>,
-      default: 'DatePicker',
-      validator: (val: string) => LIST.includes(val)
-    },
-    modelValue: { type: Boolean, default: false },
-    /** AreaPicker props */
-    addressValue: String,
-    styles: { type: Object as PropType<Record<string, any>>, default: () => ({}) },
-    valueSeparator: { type: String, default: '/' },
-    /** DatePicker props */
-    dateValue: String,
-    year: { type: [Boolean, Array] as PropType<boolean | any[]>, default: true },
-    month: { type: [Boolean, Array] as PropType<boolean | any[]>, default: true },
-    day: { type: [Boolean, Array] as PropType<boolean | any[]>, default: true },
-    /** NormalPicker props */
-    list: { type: Array as PropType<any[]>, default: () => [] },
-    initArr: { type: Array as PropType<any[]>, default: () => [] }
-  },
-  emits: ['update:modelValue', 'sure', 'cancle', 'normal-change'],
-  setup(props, { emit, slots }) {
-    const visible = ref(props.modelValue)
-
-    watch(() => props.modelValue, val => {
-      visible.value = val
-    })
-
-    watch(visible, val => {
-      emit('update:modelValue', val)
-    })
-
-    const wrapperClass = computed(() => [`${prefixCls}-wrapper`])
-    const contentClass = computed(() => [`${prefixCls}-content`])
-
-    const onOk = (val: any) => {
-      emit('update:modelValue', false)
-      emit('sure', val)
-    }
-
-    const onFail = () => {
-      emit('update:modelValue', false)
-      emit('cancle')
-    }
-
-    const onNormalChange = (val: any) => {
-      emit('normal-change', val)
-    }
-
-    provide('DpzVc3Picker', {
-      pickerOnOk: onOk,
-      pickeronFail: onFail,
-      pickerOnNormalChange: onNormalChange
-    })
-
-    return () => (
-      <Popup v-model={visible.value} height="284px" position="bottom">
-        <div class={wrapperClass.value}>
-          <div class={contentClass.value}>
-            {props.type === 'AreaPicker' && (
-              <AreaPicker
-                styles={props.styles}
-                address-value={props.addressValue}
-                value-separator={props.valueSeparator}
-                onOk={onOk}
-                onFail={onFail}
-              />
-            )}
-
-            {props.type === 'DatePicker' && (
-              <DatePicker
-                year={props.year}
-                month={props.month}
-                day={props.day}
-                date-value={props.dateValue}
-                value-separator={props.valueSeparator}
-                onOk={onOk}
-                onFail={onFail}
-              />
-            )}
-
-            {props.type === 'NormalPicker' && (
-              <NormalPicker
-                list={props.list}
-                init-arr={props.initArr}
-                onOk={onOk}
-                onFail={onFail}
-                onScroll={onNormalChange}
-              />
-            )}
-          </div>
-        </div>
-      </Popup>
-    )
-  }
-})

package/src/components/picker/types.ts

@@ -1,17 +0,0 @@
-// src/components/picker/types.ts
-export interface PickerProps {
-  type?: 'DatePicker' | 'AreaPicker' | 'NormalPicker'
-  modelValue?: boolean
-  /** AreaPicker */
-  addressValue?: string
-  styles?: Record<string, any>
-  valueSeparator?: string
-  /** DatePicker */
-  year?: boolean | any[]
-  month?: boolean | any[]
-  day?: boolean | any[]
-  dateValue?: string
-  /** NormalPicker */
-  list?: any[]
-  initArr?: any[]
-}

package/src/components/popup/index.ts

@@ -1,12 +0,0 @@
-/**
- * Created by admin on 2025/11/19.
- */
-import type { App } from 'vue'
-import Popup from './popup'
-Popup.install = (app: App): void => {
-    app.component('Popup', Popup); // 注册全局组件
-}
-type IWithInstall<T> = T & { install(app: App): void };
-const _Popup=Popup as IWithInstall<typeof Popup>;
-export default _Popup
-export type { PopupProps } from './types'

package/src/components/popup/popup.d.ts

@@ -1,16 +0,0 @@
-// src/components/popup/popup.d.ts
-
-import type { App } from 'vue'
-import type { PopupProps } from './types'  // 引入同级 types.ts 中的 BadgeProps
-
-/** Badge 组件实例类型，带 install 方法 */
-declare const Popup: {
-  /** Vue 组件本身 */
-  new (): any
-  /** props 类型引用 */
-  __props?: PopupProps
-  /** install 方法，用于全量注册 */
-  install(app: App): void
-}
-
-export default Badge

package/src/components/popup/popup.tsx

@@ -1,68 +0,0 @@
-import { defineComponent, ref, computed, watch, PropType, Transition } from 'vue'
-import type { PopupProps } from './types'
-export type { PopupProps }
-
-const prefixCls = 'dpzvc3-popup'
-
-export default defineComponent({
-  name: 'Dpzvc3Popup',
-  props: {
-    modelValue: { type: Boolean, default: false },
-    position: { type: String as PropType<PopupProps['position']>, default: 'bottom' },
-    showMask: { type: Boolean, default: true },
-    maskClosable: { type: Boolean, default: true },
-    width: { type: [Number, String] as PropType<number | string>, default: '100%' },
-    height: { type: [Number, String] as PropType<number | string> },
-    styles: { type: Object as PropType<Record<string, string | number>>, default: () => ({}) }
-  },
-  emits: ['update:modelValue'],
-  setup(props, { emit, slots }) {
-    const visible = ref(props.modelValue)
-    const mask = ref(props.showMask)
-
-    watch(() => props.modelValue, val => { visible.value = val })
-    watch(visible, val => { emit('update:modelValue', val) })
-    watch(() => props.showMask, val => { mask.value = val })
-
-    const classes = computed(() => [prefixCls])
-    const popupClasses = computed(() => [`${prefixCls}-${props.position}`, `${prefixCls}-content`])
-    const contentStyle = computed(() => {
-      const heightValue = props.height != null ? props.height : (props.position === 'top' ? 'auto' : '100%')
-      return { ...props.styles, width: props.width, height: heightValue }
-    })
-
-    const close = () => { if (props.maskClosable && mask.value) visible.value = false }
-
-    return () => (
-      <div class={classes.value}>
-        {/* 遮罩层 */}
-        <Transition
-          name="dpzvc3-ani-fade"
-          v-slots={{
-            default: () =>
-              mask.value && visible.value && (
-                <div
-                  class={`${prefixCls}-mask`}
-                  onClick={close}
-                  onTouchMove={(e:any) => e.preventDefault()}
-                />
-              )
-          }}
-        />
-
-        {/* 弹窗内容 */}
-        <Transition
-          name={`dpzvc3-ani-${props.position}`}
-          v-slots={{
-            default: () =>
-              visible.value && (
-                <div class={popupClasses.value} style={contentStyle.value}>
-                  {slots.default?.()}
-                </div>
-              )
-          }}
-        />
-      </div>
-    )
-  }
-})

package/src/components/popup/types.ts

@@ -1,9 +0,0 @@
-export type PopupProps = {
-  modelValue?: boolean
-  position?: 'top' | 'bottom' | 'right' | 'left'
-  showMask?: boolean
-  maskClosable?: boolean
-  width?: number | string
-  height?: number | string
-  styles?: Record<string, string | number>
-}

package/src/components/progress/index.ts

@@ -1,12 +0,0 @@
-/**
- * Created by yishide on 2025/09/26.
- */
-import type { App } from 'vue'
-import Progress from './progress'
-Progress.install = (app: App): void => {
-    app.component('DpProgress', Progress); // 注册全局组件
-}
-type IWithInstall<T> = T & { install(app: App): void };
-const _Progress=Progress as IWithInstall<typeof Progress>;
-export default _Progress
-export type { ProgressProps } from './types'

package/src/components/progress/progress.tsx

@@ -1,81 +0,0 @@
-// src/components/Progress/Progress.tsx
-import {
-  defineComponent,
-  ref,
-  computed,
-  watch
-} from 'vue'
-import type { PropType, CSSProperties } from 'vue'
-import type { ProgressProps } from './types'
-export type { ProgressProps }
-
-const prefixCls = 'dpzvc3-progress'
-
-export default defineComponent({
-  name: 'DpzVcProgress',
-
-  props: {
-    styles: {
-      type: Object as PropType<CSSProperties>,
-      default: () => ({})
-    },
-    modelValue: {
-      type: [Number, String] as PropType<number | string>,
-      default: 0
-    },
-    barHeight: {
-      type: [Number, String] as PropType<number | string>,
-      default: 3
-    }
-  },
-
-  setup(props, { slots }) {
-    /** 当前进度 */
-    const width = ref<number>(0)
-
-    /** 同步 v-model */
-    watch(
-      () => props.modelValue,
-      (val) => {
-        const num = Number(val) || 0
-        width.value = num >= 100 ? 100 : num
-      },
-      { immediate: true }
-    )
-
-    /** class */
-    const classes = computed(() => [prefixCls])
-    const outerClass = computed(() => [`${prefixCls}-outer`])
-    const runawayClass = computed(() => [`${prefixCls}-runaway`])
-    const progressClass = computed(() => [`${prefixCls}-progress`])
-
-    /** style */
-    const runawayStyle = computed<CSSProperties>(() => ({
-      height: `${props.barHeight}px`
-    }))
-
-    const progressStyle = computed<CSSProperties>(() => ({
-      height: `${props.barHeight}px`,
-      width: `${width.value}%`
-    }))
-
-    return () => (
-      <div class={classes.value} style={props.styles}>
-        {slots.left?.()}
-
-        <div class={outerClass.value}>
-          <div
-            class={runawayClass.value}
-            style={runawayStyle.value}
-          />
-          <div
-            class={progressClass.value}
-            style={progressStyle.value}
-          />
-        </div>
-
-        {slots.right?.()}
-      </div>
-    )
-  }
-})

package/src/components/progress/types.ts

@@ -1,9 +0,0 @@
-// src/components/Progress/types.ts
-export interface ProgressProps {
-  /** 自定义样式 */
-  styles?: Record<string, any>
-  /** 当前进度 */
-  modelValue?: number | string
-  /** 进度条高度 */
-  barHeight?: number | string
-}

package/src/components/prompt/confirm.ts

@@ -1,104 +0,0 @@
-/**
- * Vue 3 prompt confirm
- * 使用 createVNode + render
- */
-
-import { createVNode, render } from 'vue'
-import Prompt from './prompt'
-import type { MergePromptOptions, PromptProps } from './types'
-// let seed = 0
-
-function createPromptInstance (properties:MergePromptOptions = {}) {
-  // const id = `dpzvc3-prompt-${seed++}`
-  // const instance = null
-  // 容器
-  const container = document.createElement('div')
-  // container.id = id
-  document.body.appendChild(container)
-  // 组件 props（默认值）
-  const props: MergePromptOptions = {
-    value: false,
-    text: '',
-    placeholderText: '请输入',
-    width: '70%',
-    title: '',
-    okText: '确定',
-    cancleText: '取消',
-    loading: false,
-    showCancle: true,
-    spec: '',
-    message: '',
-    validator: null,
-    onOk: () => {},
-    onCancle: () => {},
-    ...properties
-  }
-const mergeProps = <T extends object, K extends keyof T>(
-  target: T,
-  source: Partial<T>
-) =>{
-  (Object.keys(source) as K[]).forEach((key) => {
-    target[key] = source[key]!
-  })
-}
-  const updateVNode = () => {
-    // vnode
-    // console.log(props, 'props')
-    const vnode = createVNode(Prompt, {
-      ...props,
-      // 给动态挂载组件绑定 update:value 事件
-      'onUpdate:value': (val: boolean) => {
-        // 当子组件 emit('update:value', false) 时执行
-        if (val === false) {
-          vnode.component!.props.value = false // 关闭内部显示
-          destroy() // 销毁 DOM
-        }
-      },
-      onRemove: destroy
-    })
-    // 挂载
-    render(vnode, container)
-    // instance = vnode.component
-  }
-  // 销毁
-  const destroy = () => {
-    props.value = false
-    setTimeout(() => {
-      render(null, container)
-    }, 300)
-  }
-
-  return {
-    /**
-     * 显示
-     */
-    show (options: PromptProps = {}) {
-      // alert(1)
-      mergeProps(props, options)
-      // Object.keys(options).forEach((key) => {
-      //   const typeKey = key as keyof PromptProps
-      //   const val = options[typeKey];
-      //   // if (val) { 
-      //       props[typeKey] = val
-      //   // }
-      // })
-      // console.log(instance.props, 'props')
-      props.value = true
-      updateVNode()
-    },
-
-    /**
-     * 关闭
-     */
-    remove () {
-      props.value = false
-
-      destroy()
-    },
-
-    // component: instance
-  }
-}
-
-// export default Prompt
-export { createPromptInstance }

package/src/components/prompt/index.ts

@@ -1,50 +0,0 @@
-/**
- * Created by admin on 2025/12/10.
- * Rewritten for Vue 3 (no createApp)
- */
-
-import {createPromptInstance } from './confirm'
-import type { MergePromptOptions, PromptInstance, DefaultPromptProps } from './types'
-let promptInstance: DefaultPromptProps
-
-function getPromptInstance () {
-  if (!promptInstance) {
-    promptInstance = createPromptInstance({
-      closable: true,
-      maskClosable: false,
-      // footerHide: false
-    })
-  }
-  return promptInstance
-}
-
-/**
- * confirm 核心方法
- */
-function confirm (options: MergePromptOptions = {}) {
-  const instance: DefaultPromptProps = getPromptInstance()!
-
-  // 组件销毁回调
-  options.onRemove = () => {
-    promptInstance = null
-  }
-
-  instance.show(options)
-}
-
-/**
- * info 弹窗
- */
-const Prompt: PromptInstance = {
-  info: (props: MergePromptOptions = {}) => { 
-    props.showCancle = true
-    return confirm(props)
-  },
-  remove: () => {
-    if (!promptInstance) return false
-    const instance = getPromptInstance()!
-    instance.remove()
-  } 
-}
-
-export default Prompt

package/src/components/prompt/prompt.tsx

@@ -1,161 +0,0 @@
-// src/components/Prompt/Prompt.tsx
-import {
-  defineComponent,
-  ref,
-  watch
-} from 'vue'
-import type { PropType } from 'vue'
-import type { PromptProps } from './types'
-
-import Modal from '../modal/modal'
-import TextBar from '../Text/textBar'
-import DpButton from '../button/button'
-
-export default defineComponent({
-  name: 'Dpzvc3Prompt',
-
-  props: {
-    value: { type: Boolean, default: false },
-    text: { type: String, default: '' },
-    closable: { type: Boolean, default: true },
-    maskClosable: { type: Boolean, default: true },
-    title: String,
-    width: { type: String, default: '220px' },
-    okText: { type: String, default: '确定' },
-    cancleText: { type: String, default: '取消' },
-    loading: { type: Boolean, default: false },
-    styles: Object as PropType<Record<string, any>>,
-    spec: { type: String, default: '提示' },
-    validator: {
-      type: [RegExp, Function] as PropType<PromptProps['validator'] | null>,
-      default: null
-    },
-    msg: String,
-    placeholderText: String,
-    onOk: {
-      type: Function as PropType<(val: string) => void>,
-      default: () => {}
-    },
-    onCancle: {
-      type: Function as PropType<() => void>,
-      default: () => {}
-    }
-  },
-
-  emits: ['update:value', 'on-ok', 'on-cancle'],
-
-  setup (props, { emit }) {
-    /** 内部状态 */
-    const visible = ref(props.value)
-    const texts = ref(props.text)
-    const message = ref(props.msg || '')
-    const placeholder = ref(props.placeholderText)
-    const buttonLoading = ref(false)
-
-    /** 同步外部 */
-    watch(() => props.value, val => {
-      visible.value = val
-    })
-
-    watch(() => props.text, val => {
-      texts.value = val
-    })
-
-    watch(() => props.loading, val => {
-      buttonLoading.value = val
-    })
-
-    /** 确定 */
-    const ok = () => {
-      let valid: boolean | string = true
-
-      if (props.validator) {
-        if (props.validator instanceof RegExp) {
-          valid = props.validator.test(texts.value)
-        } else if (typeof props.validator === 'function') {
-          valid = props.validator(texts.value)
-        }
-      }
-
-      if (valid !== true) {
-        message.value = typeof valid === 'string' ? valid : ''
-        return
-      }
-
-      emit('update:value', false)
-      props.onOk?.(texts.value)
-      emit('on-ok', texts.value)
-    }
-
-    /** 取消 */
-    const cancle = () => {
-      emit('update:value', false)
-      props.onCancle?.()
-      emit('on-cancle')
-    }
-
-    return () => (
-      <Modal
-        v-model={visible.value}
-        width={props.width}
-        title={props.title}
-        style={props.styles}
-        maskClosable={props.maskClosable}
-      >
-        {{
-          header: () => (
-            <div
-              class="dpzvc3-modal-header-inner ellipse-fir"
-              innerHTML={props.title}
-            />
-          ),
-
-          body: () => (
-            <div class="dpzvc3-prompt-body-inner">
-              <div class="dpzvc3-prompt-content">
-                <span class="dpzvc3-prompt-spec">
-                  {props.spec}
-                </span>
-
-                <TextBar
-                  v-model={texts.value}
-                  type="text"
-                  placeholder={placeholder.value}
-                />
-
-                {message.value && (
-                  <div
-                    class="dpzvc3-prompt-error"
-                    innerHTML={message.value}
-                  />
-                )}
-              </div>
-            </div>
-          ),
-
-          footer: () => (
-            <>
-              <DpButton
-                styles={{ background: '#ffffff', color: 'red' }}
-                onClick={ok}
-              >
-                {{
-                  'button-inner': () => props.okText
-                }}
-              </DpButton>
-
-              <DpButton
-                styles={{ background: '#ffffff', color: '#ccc' }}
-                onClick={cancle}
-              >
-                {{
-                  'button-inner': () => props.cancleText
-                }}
-              </DpButton>
-            </>
-          )
-        }}
-      </Modal>
-    )
-  }
-})