p-pc-ui 1.2.5 → 1.2.7

package/dist/components/p-button-rounded/p-button-rounded.vue

@@ -0,0 +1,83 @@
+<script setup lang="ts">
+import { ref, reactive, onMounted } from 'vue'
+import { Button as AButton, Tooltip as ATooltip } from 'ant-design-vue'
+
+const {
+  color = '#fff',
+  bgColor = '#735ffa',
+  borderColor = '#fff',
+  loading = false,
+  disabled = false,
+  tooltip = '',
+  rounded = 100,
+  click = null,
+  width = 160,
+  height = 48,
+} = defineProps<{
+  loading?: boolean
+  bgColor?: string
+  color?: string
+  borderColor?: string
+  disabled?: boolean
+  tooltip?: any
+  rounded?: number | string
+  click?: Function
+  width?: number | string
+  height?: number | string
+}>()
+
+const builtInLoading = ref(false)
+const emits = defineEmits(['click', 'loading'])
+
+const useDebounceFn = (fn: Function, delay = 300) => {
+  let timer: ReturnType<typeof setTimeout> | null = null
+
+  return (...args: any[]) => {
+    if (timer) clearTimeout(timer) // 每次都清除之前的定时器
+    timer = setTimeout(() => {
+      fn(...args)
+    }, delay)
+  }
+}
+
+const btnClick = useDebounceFn(async () => {
+  builtInLoading.value = true
+  try {
+    if (disabled) {
+      return
+    }
+    // 同时兼容两种调用方式
+    click && (await click())
+    emits('click')
+  } catch (err) {
+  } finally {
+    builtInLoading.value = false
+  }
+}, 200)
+</script>
+
+<template>
+
+  <a-tooltip color="var(--secondary-color-light)" :overlayInnerStyle="{ color: '#fff' }" :title="tooltip"
+    v-bind="$attrs">
+    <a-button @click="btnClick" :loading="loading || builtInLoading" class="font-semibold"
+      :class="disabled ? 'cursor-not-allowed' : 'hover:opacity-80 active:opacity-100'" :style="{
+        background: disabled ? '#b5b5b5' : bgColor,
+        color: disabled ? '#fff' : color,
+        ...(!disabled && { border: `1px solid ${borderColor}` }),
+        borderRadius: rounded + 'px',
+        minWidth: width + 'px',
+        minHeight: height + 'px',
+      }">
+      <slot></slot>
+    </a-button>
+
+  </a-tooltip>
+
+</template>
+
+<style lang="scss">
+.ant-btn-default:not(:disabled):hover {
+  border-color: #cecece !important;
+}
+</style>

package/dist/components/p-form/index.d.ts

@@ -0,0 +1,119 @@
+
+type FieldRule = { msg?: string, required?: boolean, min?: number, max?: number, decimal?: number }
+
+interface Base<K extends string = string> {
+    key: K,
+    label: string,
+    default?: any,
+    placeholder?: string,
+    fieldType?: 'string' | 'number' | 'array' | 'date',
+    fieldRules?: FieldRule[];
+    visibleHook?: Function,
+    tooltip?: string,
+    hideLabel?: boolean
+    colon?: boolean,
+    labelSpan?: number,
+    valueSpan?: number,
+    labelAlign?: 'left' | 'right'
+}
+
+
+export interface Input<K extends string = string> extends Base<K> {
+    type: 'input',
+    prefix?: any,
+    suffix?: any
+}
+
+export interface InputNumber<K extends string = string> extends Base<K> {
+    type: 'number',
+    prefix?: any,
+    suffix?: any
+}
+
+export interface InputPassword<K extends string = string> extends Base<K> {
+    type: 'password',
+    prefix?: any,
+}
+
+export interface InputCode<K extends string = string> extends Base<K> {
+    type: 'code',
+    interval: number,
+    codeName: string,
+    sendNoticeFunc: Function
+    activityFunc?: Function
+    prefix?: any,
+    suffix?: any,
+    sendStatus?: 'waitSend' | 'sending' | 'end',
+}
+
+
+
+type LoadOptionsData = () => Promise<{ label: string, value: any }[]>
+
+
+interface SelectBase<K extends string = string> extends Base<K> {
+    type: 'select' | 'treeSelect' | 'radio',
+    fieldNames?: {
+        label?: string;
+        value?: string;
+    };
+    isMultiple?: boolean
+}
+
+type GetOptionList =
+    | { optionList: any[]; mapPath?: never; loadDataFunc?: LoadOptionsData }
+    | { optionList?: any[]; mapPath: string[], loadDataFunc?: LoadOptionsData }
+    | { optionList?: any[]; mapPath?: string[], loadDataFunc: LoadOptionsData }
+
+export type Select<K extends string = string> = SelectBase<K> & GetOptionList;
+
+
+interface UploadBase<K extends string = string> extends Base<K> {
+    uploadType: 'pic' | 'file',
+    maxCount?: number,
+}
+
+export interface UploadOss<K extends string = string> extends UploadBase<K> {
+    type: 'uploadOss',
+    getOssToken: ({file_name}) => Promise<any>,
+    baseOssUrl: string,
+}
+
+
+export interface Upload<K extends string = string> extends UploadBase<K> {
+    type: 'upload',
+}
+
+export interface Textarea<K extends string = string> extends Base<K> {
+    type: 'textarea',
+}
+
+export interface DatePicker<K extends string = string> extends Base<K> {
+    type: 'datePicker',
+}
+
+
+export interface Component<K extends string = string> extends Base<K> {
+    type: 'component',
+    component: any
+}
+
+export interface Editor<K extends string = string> extends Base<K> {
+    type: 'editor',
+    getOssToken: ({ file_name: string }) => Promise<any>,
+    baseOssUrl?: string,
+}
+
+
+export type FormDataItem<K extends string = string> =
+    | Input<K>
+    | InputNumber<K>
+    | InputPassword<K>
+    | InputCode<K>
+    | Select<K>
+    | Upload<K>
+    | UploadOss<K>
+    | Textarea<K>
+    | DatePicker<K>
+    | Component<K>
+    | Editor<K>