@didaoktv/didaoui-uniapp 1.0.0 → 1.2.0

package/components/dd-workorder-card/dd-workorder-card.vue

@@ -0,0 +1,237 @@
+<template>
+  <view
+    class="dd-workorder-card"
+    :class="`dd-workorder-card--${type}`"
+    hover-class="dd-workorder-card--press"
+    :hover-stay-time="40"
+    @click="onClick"
+  >
+    <view class="dd-workorder-card__head">
+      <text class="dd-workorder-card__title">{{ title }}</text>
+      <text v-if="status || typeText" class="dd-workorder-card__tag" :class="`dd-workorder-card__tag--${type}`">
+        {{ status || typeText }}
+      </text>
+    </view>
+
+    <view v-if="checklist && checklist.length" class="dd-workorder-card__checklist">
+      <view
+        v-for="item in checklist"
+        :key="item.id"
+        class="dd-workorder-card__check-item"
+        hover-class="dd-workorder-card__check-item--press"
+        :hover-stay-time="40"
+        @click.stop="onCheck(item)"
+      >
+        <view class="dd-workorder-card__box" :class="{ 'dd-workorder-card__box--on': item.done }">
+          <text v-if="item.done" class="dd-workorder-card__box-check">✓</text>
+        </view>
+        <text class="dd-workorder-card__check-text" :class="{ 'dd-workorder-card__check-text--done': item.done }">
+          {{ item.text }}
+        </text>
+      </view>
+    </view>
+
+    <view v-if="progress !== undefined" class="dd-workorder-card__progress">
+      <view class="dd-workorder-card__progress-track">
+        <view class="dd-workorder-card__progress-bar" :style="{ width: progress + '%' }" />
+      </view>
+      <text class="dd-workorder-card__progress-text">{{ progress }}%</text>
+    </view>
+
+    <view v-if="time" class="dd-workorder-card__time">{{ time }}</view>
+
+    <view v-if="$slots.actions" class="dd-workorder-card__actions">
+      <slot name="actions" />
+    </view>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+
+export interface ChecklistItem {
+  id: string
+  text: string
+  done: boolean
+}
+
+interface Props {
+  title: string
+  type?: 'service' | 'repair' | 'feedback' | 'decoration' | 'todo'
+  status?: string
+  checklist?: ChecklistItem[]
+  progress?: number
+  time?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  title: '',
+  type: 'todo',
+  status: '',
+  checklist: () => [],
+  progress: undefined,
+  time: '',
+})
+
+const emit = defineEmits<{
+  (e: 'check', val: { item: ChecklistItem; done: boolean }): void
+  (e: 'click', val: { title: string }): void
+}>()
+
+const typeTextMap: Record<string, string> = {
+  service: '服务铃',
+  repair: '维修',
+  feedback: '反馈',
+  decoration: '布置',
+  todo: '待办',
+}
+
+const typeText = computed(() => (props.status ? '' : typeTextMap[props.type] || '待办'))
+
+function onCheck(item: ChecklistItem) {
+  // 受控组件：不直接改 prop，仅把「期望的新状态」上抛，由父级持有 done 状态。
+  // 避免父级 @check 再翻转一次导致双重切换。
+  const done = !item.done
+  emit('check', { item, done })
+}
+
+function onClick() {
+  emit('click', { title: props.title })
+}
+</script>
+
+<style lang="scss" scoped>
+@import '../../scss/variables';
+@import '../../scss/mixins';
+
+.dd-workorder-card {
+  @include dd-glass(sm);
+  border-radius: $dd-radius-lg;
+  padding: $dd-space-3 $dd-space-4;
+
+  &--press {
+    transform: scale(0.99);
+    background: $dd-surface-hover;
+  }
+}
+
+.dd-workorder-card__head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: $dd-space-2;
+}
+
+.dd-workorder-card__title {
+  flex: 1;
+  min-width: 0;
+  font-size: $dd-font-size-body;
+  font-weight: $dd-font-weight-lead;
+  color: $dd-text-primary;
+  @include dd-ellipsis(1);
+}
+
+.dd-workorder-card__tag {
+  flex-shrink: 0;
+  font-size: 20rpx;
+  padding: 2rpx 14rpx;
+  border-radius: $dd-radius-sm;
+
+  &--service { color: $dd-primary-400; background: rgba(245, 166, 35, 0.12); }
+  &--repair { color: $dd-error-400; background: rgba(229, 57, 53, 0.12); }
+  &--feedback { color: $dd-accent-300; background: rgba(45, 75, 160, 0.2); }
+  &--decoration { color: $dd-vip-500; background: rgba(156, 39, 176, 0.14); }
+  &--todo { color: $dd-text-secondary; background: $dd-glass-border; }
+}
+
+.dd-workorder-card__checklist {
+  margin-top: $dd-space-2;
+  display: flex;
+  flex-direction: column;
+}
+
+.dd-workorder-card__check-item {
+  display: flex;
+  align-items: center;
+  gap: $dd-space-2;
+  padding: $dd-space-1 0;
+
+  &--press {
+    opacity: 0.7;
+  }
+}
+
+.dd-workorder-card__box {
+  width: 40rpx;
+  height: 40rpx;
+  flex-shrink: 0;
+  border-radius: $dd-radius-sm;
+  border: 2rpx solid $dd-border-strong;
+  @include dd-flex-center;
+
+  &--on {
+    background: $dd-gradient-primary;
+    border-color: transparent;
+  }
+}
+
+.dd-workorder-card__box-check {
+  font-size: $dd-font-size-caption;
+  color: $dd-neutral-900;
+  line-height: 1;
+}
+
+.dd-workorder-card__check-text {
+  flex: 1;
+  font-size: $dd-font-size-body;
+  color: $dd-text-primary;
+
+  &--done {
+    color: $dd-text-tertiary;
+    text-decoration: line-through;
+  }
+}
+
+.dd-workorder-card__progress {
+  display: flex;
+  align-items: center;
+  gap: $dd-space-2;
+  margin-top: $dd-space-2;
+}
+
+.dd-workorder-card__progress-track {
+  flex: 1;
+  height: $dd-space-1;
+  background: $dd-surface-container-high;
+  border-radius: $dd-radius-full;
+  overflow: hidden;
+}
+
+.dd-workorder-card__progress-bar {
+  height: 100%;
+  background: $dd-gradient-primary-h;
+  border-radius: $dd-radius-full;
+  transition: width 0.3s ease;
+}
+
+.dd-workorder-card__progress-text {
+  font-size: $dd-font-size-caption;
+  color: $dd-text-tertiary;
+  font-family: $dd-font-mono;
+}
+
+.dd-workorder-card__time {
+  margin-top: $dd-space-1;
+  font-size: $dd-font-size-caption;
+  color: $dd-text-tertiary;
+}
+
+.dd-workorder-card__actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: $dd-space-3;
+  margin-top: $dd-space-2;
+  border-top: 1px solid $dd-border-subtle;
+  padding-top: $dd-space-2;
+}
+</style>

package/index.ts

@@ -1,11 +1,14 @@
 import type { App } from 'vue'
 
-// === Input (13) ===
+// === Input (21) ===
 import DdButton from './components/dd-button/dd-button.vue'
 import DdInput from './components/dd-input/dd-input.vue'
 import DdSwitch from './components/dd-switch/dd-switch.vue'
 import DdCheckbox from './components/dd-checkbox/dd-checkbox.vue'
+import DdCheckboxGroup from './components/dd-checkbox-group/dd-checkbox-group.vue'
 import DdRadio from './components/dd-radio/dd-radio.vue'
+import DdRadioGroup from './components/dd-radio-group/dd-radio-group.vue'
+import DdForm from './components/dd-form/dd-form.vue'
 import DdSearchBar from './components/dd-search-bar/dd-search-bar.vue'
 import DdSlider from './components/dd-slider/dd-slider.vue'
 import DdStepper from './components/dd-stepper/dd-stepper.vue'
@@ -15,6 +18,11 @@ import DdPicker from './components/dd-picker/dd-picker.vue'
 import DdRate from './components/dd-rate/dd-rate.vue'
 import DdUpload from './components/dd-upload/dd-upload.vue'
 import DdIcon from './components/dd-icon/dd-icon.vue'
+import DdKeyboard from './components/dd-keyboard/dd-keyboard.vue'
+import DdNumberKeyboard from './components/dd-number-keyboard/dd-number-keyboard.vue'
+import DdCarKeyboard from './components/dd-car-keyboard/dd-car-keyboard.vue'
+import DdCascader from './components/dd-cascader/dd-cascader.vue'
+import DdGoodsSku from './components/dd-goods-sku/dd-goods-sku.vue'
 
 // === Navigation (12) ===
 import DdNavigation from './components/dd-navigation/dd-navigation.vue'
@@ -35,12 +43,17 @@ import DdCard from './components/dd-card/dd-card.vue'
 import DdRoomCard from './components/dd-room-card/dd-room-card.vue'
 import DdFeatureGrid from './components/dd-feature-grid/dd-feature-grid.vue'
 import DdSticky from './components/dd-sticky/dd-sticky.vue'
+import DdBillDetail from './components/dd-bill-detail/dd-bill-detail.vue'
+import DdWorkorderCard from './components/dd-workorder-card/dd-workorder-card.vue'
+import DdCalendar from './components/dd-calendar/dd-calendar.vue'
+import DdQrcode from './components/dd-qrcode/dd-qrcode.vue'
 
-// === Display (16) ===
+// === Display (24) ===
 import DdTag from './components/dd-tag/dd-tag.vue'
 import DdStatCard from './components/dd-stat-card/dd-stat-card.vue'
 import DdChampionCard from './components/dd-champion-card/dd-champion-card.vue'
 import DdAvatar from './components/dd-avatar/dd-avatar.vue'
+import DdAvatarGroup from './components/dd-avatar-group/dd-avatar-group.vue'
 import DdBadge from './components/dd-badge/dd-badge.vue'
 import DdListCell from './components/dd-list-cell/dd-list-cell.vue'
 import DdCell from './components/dd-cell/dd-cell.vue'
@@ -53,6 +66,13 @@ import DdSkeleton from './components/dd-skeleton/dd-skeleton.vue'
 import DdEmptyState from './components/dd-empty-state/dd-empty-state.vue'
 import DdStep from './components/dd-step/dd-step.vue'
 import DdSteps from './components/dd-steps/dd-steps.vue'
+import DdText from './components/dd-text/dd-text.vue'
+import DdLink from './components/dd-link/dd-link.vue'
+import DdCopy from './components/dd-copy/dd-copy.vue'
+import DdAlbum from './components/dd-album/dd-album.vue'
+import DdCoupon from './components/dd-coupon/dd-coupon.vue'
+import DdParse from './components/dd-parse/dd-parse.vue'
+import DdMarkdown from './components/dd-markdown/dd-markdown.vue'
 
 // === Overlay (10) ===
 import DdModal from './components/dd-modal/dd-modal.vue'
@@ -77,24 +97,34 @@ import DdLoadmore from './components/dd-loadmore/dd-loadmore.vue'
 import DdCapsuleButton from './components/dd-capsule-button/dd-capsule-button.vue'
 import DdMiniProgramNavbar from './components/dd-mini-program-navbar/dd-mini-program-navbar.vue'
 
+// === Canvas (5) ===
+import DdCanvas from './components/dd-canvas/dd-canvas.vue'
+import DdBarcode from './components/dd-barcode/dd-barcode.vue'
+import DdCropper from './components/dd-cropper/dd-cropper.vue'
+import DdSignature from './components/dd-signature/dd-signature.vue'
+import DdPoster from './components/dd-poster/dd-poster.vue'
+
 const components = {
-  DdButton, DdInput, DdSwitch, DdCheckbox, DdRadio,
+  DdButton, DdInput, DdSwitch, DdCheckbox, DdCheckboxGroup, DdRadio, DdRadioGroup, DdForm,
   DdSearchBar, DdSlider, DdStepper, DdDatePicker, DdField,
   DdPicker, DdRate, DdUpload, DdIcon,
+  DdKeyboard, DdNumberKeyboard, DdCarKeyboard, DdCascader, DdGoodsSku,
   DdNavigation, DdTopNavbar, DdSegmentedTab, DdSwipeableTab,
   DdDrawer, DdTabbar, DdTabbarItem, DdBacktop,
   DdCollapse, DdCollapseItem, DdDropdownMenu, DdDropdownItem,
-  DdCard, DdRoomCard, DdFeatureGrid, DdSticky,
-  DdTag, DdStatCard, DdChampionCard, DdAvatar, DdBadge,
+  DdCard, DdRoomCard, DdFeatureGrid, DdSticky, DdBillDetail, DdWorkorderCard, DdCalendar, DdQrcode,
+  DdTag, DdStatCard, DdChampionCard, DdAvatar, DdAvatarGroup, DdBadge,
   DdListCell, DdCell, DdCellGroup, DdCountDown, DdDivider,
   DdImage, DdProgress, DdSkeleton, DdEmptyState, DdStep, DdSteps,
+  DdText, DdLink, DdCopy, DdAlbum, DdCoupon, DdParse, DdMarkdown,
   DdModal, DdActionSheet, DdToast, DdAlert, DdLoading,
   DdDialog, DdOverlay, DdPopup, DdPopover, DdPopoverItem,
   DdSwipeAction, DdSwipe, DdSwipeItem, DdPullRefresh, DdLoadmore,
   DdCapsuleButton, DdMiniProgramNavbar,
+  DdCanvas, DdBarcode, DdCropper, DdSignature, DdPoster,
 }
 
-export function install(app: App) {
+export function install(app: App, ...options: any[]) {
   Object.entries(components).forEach(([name, comp]) => {
     app.component(name, comp)
   })
@@ -105,23 +135,34 @@ export default { install }
 // 全量具名导出
 export {
   components,
-  DdButton, DdInput, DdSwitch, DdCheckbox, DdRadio,
+  DdButton, DdInput, DdSwitch, DdCheckbox, DdCheckboxGroup, DdRadio, DdRadioGroup, DdForm,
   DdSearchBar, DdSlider, DdStepper, DdDatePicker, DdField,
   DdPicker, DdRate, DdUpload, DdIcon,
+  DdKeyboard, DdNumberKeyboard, DdCarKeyboard, DdCascader, DdGoodsSku,
   DdNavigation, DdTopNavbar, DdSegmentedTab, DdSwipeableTab,
   DdDrawer, DdTabbar, DdTabbarItem, DdBacktop,
   DdCollapse, DdCollapseItem, DdDropdownMenu, DdDropdownItem,
-  DdCard, DdRoomCard, DdFeatureGrid, DdSticky,
-  DdTag, DdStatCard, DdChampionCard, DdAvatar, DdBadge,
+  DdCard, DdRoomCard, DdFeatureGrid, DdSticky, DdBillDetail, DdWorkorderCard, DdCalendar, DdQrcode,
+  DdTag, DdStatCard, DdChampionCard, DdAvatar, DdAvatarGroup, DdBadge,
   DdListCell, DdCell, DdCellGroup, DdCountDown, DdDivider,
   DdImage, DdProgress, DdSkeleton, DdEmptyState, DdStep, DdSteps,
+  DdText, DdLink, DdCopy, DdAlbum, DdCoupon, DdParse, DdMarkdown,
   DdModal, DdActionSheet, DdToast, DdAlert, DdLoading,
   DdDialog, DdOverlay, DdPopup, DdPopover, DdPopoverItem,
   DdSwipeAction, DdSwipe, DdSwipeItem, DdPullRefresh, DdLoadmore,
   DdCapsuleButton, DdMiniProgramNavbar,
+  DdCanvas, DdBarcode, DdCropper, DdSignature, DdPoster,
 }
 
 export * from './libs/utils'
 
+// 表单校验类型（dd-form/dd-field 配套）
+export type {
+  DdFieldRule,
+  DdFieldValidateTrigger,
+  DdFieldInstance,
+  DdFormContext,
+} from './components/dd-form/rules'
+
 // 图标元数据（供 demo/文档消费，与 dd-icon.vue 内 SCSS &-- 规则保持一致）
 export { iconNames, iconGroups } from './components/dd-icon/dd-icon.vue'

package/libs/config/color.js

@@ -0,0 +1,16 @@
+// 为了给某些特殊场景使用和向后兼容，无需删除此文件(2020-06-20)
+const color = {
+    primary: '#3c9cff',
+    info: '#909399',
+    default: '#909399',
+    warning: '#f9ae3d',
+    error: '#f56c6c',
+    success: '#5ac725',
+    mainColor: '#303133',
+    contentColor: '#606266',
+    tipsColor: '#909399',
+    lightColor: '#c0c4cc',
+    borderColor: '#e4e7ed'
+}
+
+export default color

package/libs/config/config.js

@@ -0,0 +1,25 @@
+const version = '3'
+
+// 开发环境才提示，生产环境不会提示
+if (process.env.NODE_ENV === 'development') {
+	console.log(`\n %c DidaoUI V${version} %c https://didaoktv.com \n\n`, 'color: #ffffff; background: #3c9cff; padding:5px 0;', 'color: #3c9cff;background: #ffffff; padding:5px 0;');
+}
+
+export default {
+    v: version,
+    version,
+    // 颜色部分，本来可以通过scss的:export导出供js使用，但是奈何nvue不支持
+    color: {
+        'primary': '#2979ff',
+        'warning': '#ff9900',
+        'success': '#19be6b',
+        'error': '#fa3534',
+        'info': '#909399',
+        'main-color': '#303133',
+        'content-color': '#606266',
+        'tips-color': '#909399',
+        'light-color': '#c0c4cc'
+    },
+	// 默认单位，可以通过配置为rpx，那么在用于传入组件大小参数为数值时，就默认为rpx
+	unit: 'px'
+}

package/libs/config/props.js

@@ -0,0 +1,185 @@
+/**
+ * Shared props configuration store.
+ *
+ * Component defaults are registered lazily by each component props.js file so
+ * importing one component no longer pulls defaults for every component.
+ */
+import config from './config'
+import zIndex from './zIndex.js'
+import color from './color.js'
+import { shallowMerge } from '../function/index.js'
+
+const componentKeys = [
+    'actionSheet',
+    'album',
+    'alert',
+    'avatar',
+    'avatarGroup',
+    'backtop',
+    'badge',
+    'box',
+    'button',
+    'calendar',
+    'calendarStrip',
+    'carKeyboard',
+    'card',
+    'cell',
+    'cellGroup',
+    'checkbox',
+    'checkboxGroup',
+    'circleProgress',
+    'code',
+    'codeInput',
+    'col',
+    'collapse',
+    'collapseItem',
+    'columnNotice',
+    'countDown',
+    'countTo',
+    'datetimePicker',
+    'divider',
+    'dropdown',
+    'dropdownItem',
+    'empty',
+    'form',
+    'formItem',
+    'gap',
+    'grid',
+    'gridItem',
+    'guide',
+    'icon',
+    'image',
+    'indexAnchor',
+    'indexItem',
+    'indexList',
+    'input',
+    'keyboard',
+    'line',
+    'lineProgress',
+    'link',
+    'list',
+    'listItem',
+    'loadingIcon',
+    'loadingPage',
+    'loadmore',
+    'modal',
+    'navbar',
+    'navbarMini',
+    'noNetwork',
+    'noticeBar',
+    'notify',
+    'novelReader',
+    'numberBox',
+    'numberKeyboard',
+    'overlay',
+    'parse',
+    'pdfReader',
+    'picker',
+    'pickerColumn',
+    'popover',
+    'popup',
+    'radio',
+    'radioGroup',
+    'rate',
+    'readMore',
+    'row',
+    'rowNotice',
+    'safeBottom',
+    'scrollList',
+    'search',
+    'section',
+    'skeleton',
+    'slider',
+    'statusBar',
+    'steps',
+    'stepsItem',
+    'sticky',
+    'subsection',
+    'swipeAction',
+    'swipeActionItem',
+    'swiper',
+    'swiperIndicator',
+    'switch',
+    'tabbar',
+    'tabbarItem',
+    'table',
+    'tabs',
+    'tabsItem',
+    'tag',
+    'td',
+    'text',
+    'textarea',
+    'th',
+    'toast',
+    'toolbar',
+    'tooltip',
+    'tr',
+    'transition',
+    'upload'
+]
+
+const props = {}
+
+function ensureComponentProps(key) {
+    if (!props[key] || typeof props[key] !== 'object') {
+        props[key] = {}
+    }
+    return props[key]
+}
+
+function isPlainObject(value) {
+    return Object.prototype.toString.call(value) === '[object Object]'
+}
+
+function cloneDefaultValue(value) {
+    if (Array.isArray(value)) {
+        return value.slice()
+    }
+    if (isPlainObject(value)) {
+        return mergeDefaults({}, value)
+    }
+    return value
+}
+
+function mergeDefaults(target, defaults = {}) {
+    if (!target || typeof target !== 'object' || !defaults || typeof defaults !== 'object') {
+        return target
+    }
+    Object.keys(defaults).forEach((key) => {
+        const defaultValue = defaults[key]
+        const targetValue = target[key]
+        if (targetValue === undefined) {
+            target[key] = cloneDefaultValue(defaultValue)
+        } else if (isPlainObject(targetValue) && isPlainObject(defaultValue)) {
+            mergeDefaults(targetValue, defaultValue)
+        }
+    })
+    return target
+}
+
+componentKeys.forEach(ensureComponentProps)
+
+export function registerComponentProps(defaultProps = {}) {
+    Object.keys(defaultProps || {}).forEach((key) => {
+        const componentProps = ensureComponentProps(key)
+        mergeDefaults(componentProps, defaultProps[key])
+    })
+    return props
+}
+
+export function setPropsConfig(configProps = {}) {
+    Object.keys(configProps || {}).forEach((key) => {
+        shallowMerge(ensureComponentProps(key), configProps[key])
+    })
+    return props
+}
+
+function setConfig(configs = {}) {
+    shallowMerge(config, configs.config || {})
+    setPropsConfig(configs.props || {})
+    shallowMerge(color, configs.color || {})
+    shallowMerge(zIndex, configs.zIndex || {})
+}
+
+// ponytail: 不提供全局配置注入入口（含 http 实例注册），DidaoUI 组件默认值由各组件 props.js 就地注册
+export default props

package/libs/config/zIndex.js

@@ -0,0 +1,20 @@
+// uniapp在H5中各API的z-index值如下：
+/**
+ * actionsheet: 999
+ * modal: 999
+ * navigate: 998
+ * tabbar: 998
+ * toast: 999
+ */
+
+export default {
+    toast: 10090,
+    noNetwork: 10080,
+    // popup包含popup，actionsheet，keyboard，picker的值
+    popup: 10075,
+    mask: 10070,
+    navbar: 980,
+    topTips: 975,
+    sticky: 970,
+    indexListSticky: 965
+}