qidian-vue-ui 1.5.3 → 1.7.0

package/dist/components/index.d.ts

@@ -20,4 +20,5 @@ export * from './service';
 export * from './service-dialog-table-select';
 export * from './service-popup-table-select';
 export * from './service-select';
+export * from './steps';
 export * from './upload';

package/dist/components/org/select/props.d.ts

@@ -1,6 +1,6 @@
 export declare const qdOrgSelectProps: {
     readonly showFullDeptPath: true;
-    readonly manual: true;
+    readonly manual: undefined;
     readonly showArrow: true;
     readonly popupVisible: undefined;
     readonly disabled: undefined;

package/dist/components/service-select/index.css

@@ -1,4 +1,4 @@
-.qd-service-select__load[data-v-340599bc] {
+.qd-service-select__load[data-v-90dbce79] {
   width: 100%;
   border-top: 1px solid var(--td-component-stroke);
   padding: 6px;

package/dist/components/service-select/index.vue.mjs

@@ -2,7 +2,7 @@ import './index.css'
 import _sfc_main from "./index.vue2.mjs";
 /* empty css            */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const QdServiceSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-340599bc"]]);
+const QdServiceSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-90dbce79"]]);
 export {
   QdServiceSelect as default
 };

package/dist/components/service-select/index.vue2.mjs

@@ -1,5 +1,5 @@
 import './index.css'
-import { defineComponent, mergeDefaults, computed, ref, watch, onMounted, onActivated, onDeactivated, createBlock, openBlock, unref, mergeProps, isRef, createSlots, withCtx, renderSlot, createCommentVNode, renderList, normalizeProps, guardReactiveProps } from "vue";
+import { defineComponent, mergeDefaults, computed, ref, unref, watch, onMounted, onActivated, onDeactivated, createBlock, openBlock, mergeProps, isRef, createSlots, withCtx, renderSlot, createCommentVNode, renderList, normalizeProps, guardReactiveProps } from "vue";
 import { useVModels } from "../../node_modules/.pnpm/@vueuse_core@14.2.0_vue@3.5.26_typescript@5.9.3_/node_modules/@vueuse/core/dist/index.mjs";
 import { isEmpty, useServiceLoadMore, toArr, extractSlotsWithoutPrefix, checkSameObject } from "qidian-shared";
 import { Select, Loading } from "tdesign-vue-next";
@@ -181,6 +181,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         onChange,
         ...selectOptions
       } = props;
+      const mergedManual = manual ?? unref(pagination) !== false;
       const rePopupProps = popupProps || {};
       rePopupProps.onScrollToBottom = (context) => {
         popupProps?.onScrollToBottom?.(context);
@@ -250,7 +251,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         },
         serviceOptions: {
           service,
-          manual,
+          manual: mergedManual,
           transformParams: mergedTransformParams,
           transformRes,
           pagination,

package/dist/components/service-select/props.d.ts

@@ -1,5 +1,5 @@
 export declare const qdServiceSelectProps: {
-    readonly manual: true;
+    readonly manual: undefined;
     readonly showArrow: true;
     readonly popupVisible: undefined;
     readonly disabled: undefined;

package/dist/components/service-select/props.mjs

@@ -1,5 +1,5 @@
 const qdServiceSelectProps = {
-  manual: true,
+  manual: void 0,
   showArrow: true,
   popupVisible: void 0,
   disabled: void 0,

package/dist/components/steps/index.css

@@ -0,0 +1,211 @@
+.qd-steps[data-v-3fae5c44] {
+  display: grid;
+  gap: var(--td-comp-paddingTB-xs);
+}
+.qd-steps__nav[data-v-3fae5c44] {
+  display: flex;
+  align-items: center;
+  width: 100%;
+}
+.qd-steps__phases[data-v-3fae5c44] {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.qd-steps__phase[data-v-3fae5c44] {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--td-size-3);
+  padding: var(--td-size-1) var(--td-comp-paddingLR-s) var(--td-size-1) var(--td-comp-paddingLR-xs);
+  border-radius: var(--td-radius-round);
+  transition: all 0.15s;
+}
+.qd-steps__phase--clickable[data-v-3fae5c44] {
+  cursor: pointer;
+}
+.qd-steps__phase--done[data-v-3fae5c44] {
+  color: var(--td-text-color-secondary);
+}
+.qd-steps__phase--done .qd-steps__phase-icon[data-v-3fae5c44] {
+  background-color: var(--td-success-color);
+  color: var(--td-text-color-anti);
+  border-color: transparent;
+}
+.qd-steps__phase--done .qd-steps__phase-name[data-v-3fae5c44] {
+  color: var(--td-text-color-secondary);
+}
+.qd-steps__phase--done.qd-steps__phase--clickable[data-v-3fae5c44]:hover {
+  background-color: var(--td-bg-color-container-hover);
+}
+.qd-steps__phase--active[data-v-3fae5c44] {
+  background-color: var(--td-brand-color-light);
+}
+.qd-steps__phase--active .qd-steps__phase-icon[data-v-3fae5c44] {
+  background-color: var(--td-brand-color);
+  color: var(--td-text-color-anti);
+  border-color: transparent;
+  box-shadow: var(--td-shadow-1);
+}
+.qd-steps__phase--active .qd-steps__phase-name[data-v-3fae5c44] {
+  color: var(--td-text-color-brand);
+  font-weight: 700;
+}
+.qd-steps__phase--pending[data-v-3fae5c44] {
+  opacity: 0.6;
+}
+.qd-steps__phase-icon[data-v-3fae5c44] {
+  width: calc(var(--td-comp-size-xxxs) + var(--td-size-1));
+  height: calc(var(--td-comp-size-xxxs) + var(--td-size-1));
+  border-radius: var(--td-radius-circle);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: var(--td-font-size-mark-small);
+  font-weight: 700;
+  line-height: 1;
+  flex-shrink: 0;
+  background-color: var(--td-bg-color-secondarycontainer);
+  color: var(--td-text-color-placeholder);
+  border: calc(var(--td-size-1) / 2) solid var(--td-component-stroke);
+  transition: all 0.15s;
+}
+.qd-steps__phase-name[data-v-3fae5c44] {
+  font-size: var(--td-font-size-body-small);
+  color: var(--td-text-color-placeholder);
+  font-weight: 600;
+  white-space: nowrap;
+  transition: color 0.15s;
+}
+.qd-steps__separator[data-v-3fae5c44] {
+  color: var(--td-text-color-placeholder);
+  margin: 0 var(--td-comp-margin-s);
+  font-size: var(--td-font-size-body-large);
+  line-height: 1;
+  transform: translateY(calc(var(--td-size-1) / -2));
+}
+.qd-steps__separator--done[data-v-3fae5c44] {
+  color: var(--td-success-color);
+}
+.qd-steps__divider[data-v-3fae5c44] {
+  border-top: calc(var(--td-size-1) / 2) solid var(--td-border-level-1-color);
+}
+.qd-steps__substeps[data-v-3fae5c44] {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  gap: var(--td-comp-margin-m);
+  margin-top: 0;
+  padding-bottom: 0;
+}
+.qd-steps__substep-list[data-v-3fae5c44] {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: var(--td-size-1);
+}
+.qd-steps__substep[data-v-3fae5c44] {
+  display: inline-flex;
+  align-items: center;
+  border-radius: var(--td-radius-medium);
+  padding: var(--td-size-2) var(--td-comp-paddingLR-s);
+  gap: var(--td-size-3);
+  transition: all 0.12s;
+}
+.qd-steps__substep--clickable[data-v-3fae5c44] {
+  cursor: pointer;
+}
+.qd-steps__substep[data-v-3fae5c44]:hover {
+  background-color: var(--td-bg-color-container-hover);
+}
+.qd-steps__substep:hover .qd-steps__substep-name[data-v-3fae5c44] {
+  color: var(--td-text-color-primary);
+}
+.qd-steps__substep--done .qd-steps__substep-no[data-v-3fae5c44] {
+  color: var(--td-success-color);
+  background-color: transparent;
+}
+.qd-steps__substep--done .qd-steps__substep-no[data-v-3fae5c44]::before {
+  background-color: var(--td-success-color);
+  border-color: transparent;
+}
+.qd-steps__substep--done .qd-steps__substep-name[data-v-3fae5c44] {
+  color: var(--td-text-color-primary);
+}
+.qd-steps__substep--active[data-v-3fae5c44] {
+  background-color: var(--td-bg-color-container-hover);
+}
+.qd-steps__substep--active .qd-steps__substep-no[data-v-3fae5c44] {
+  color: var(--td-text-color-brand);
+  background-color: transparent;
+}
+.qd-steps__substep--active .qd-steps__substep-no[data-v-3fae5c44]::before {
+  background-color: var(--td-brand-color);
+  border-color: transparent;
+  box-shadow: 0 0 0 var(--td-size-1) var(--td-brand-color-light);
+}
+.qd-steps__substep--active .qd-steps__substep-name[data-v-3fae5c44] {
+  color: var(--td-text-color-brand);
+  font-weight: 700;
+}
+.qd-steps__substep--pending[data-v-3fae5c44] {
+  color: var(--td-text-color-placeholder);
+}
+.qd-steps__substep--pending .qd-steps__substep-no[data-v-3fae5c44] {
+  color: var(--td-text-color-disabled);
+}
+.qd-steps__substep--pending .qd-steps__substep-no[data-v-3fae5c44]::before {
+  border-color: var(--td-component-border);
+}
+.qd-steps__substep--pending .qd-steps__substep-name[data-v-3fae5c44] {
+  color: var(--td-text-color-placeholder);
+}
+.qd-steps__substep-no[data-v-3fae5c44] {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 0;
+  padding: 0;
+  padding-left: calc(var(--td-size-4) + var(--td-size-1));
+  font-size: var(--td-font-size-mark-small);
+  font-weight: 700;
+  line-height: 1.45;
+  color: var(--td-text-color-disabled);
+  background-color: transparent;
+}
+.qd-steps__substep-no[data-v-3fae5c44]::before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 50%;
+  width: var(--td-size-3);
+  height: var(--td-size-3);
+  border-radius: var(--td-radius-circle);
+  border: calc(var(--td-size-1) / 2) solid var(--td-component-stroke);
+  box-sizing: border-box;
+  transform: translateY(-50%);
+  transition: all 0.12s;
+}
+.qd-steps__substep-name[data-v-3fae5c44] {
+  font-size: var(--td-font-size-body-small);
+  font-weight: 600;
+  color: var(--td-text-color-secondary);
+  white-space: nowrap;
+  transition: color 0.12s;
+}
+.qd-steps__indicator[data-v-3fae5c44] {
+  flex: none;
+  margin-left: auto;
+  padding: 0;
+  border: none;
+  font-size: var(--td-font-size-body-small);
+  font-weight: 600;
+  color: var(--td-text-color-placeholder);
+  white-space: nowrap;
+  background-color: transparent;
+}
+.qd-steps__indicator b[data-v-3fae5c44] {
+  color: var(--td-text-color-primary);
+  font-weight: 700;
+}

package/dist/components/steps/index.d.ts

@@ -0,0 +1,2 @@
+export { default as QdSteps } from './index.vue';
+export type { QdStepsProps, QdStepsGroup } from './types';

package/dist/components/steps/index.vue.d.ts

@@ -0,0 +1,10 @@
+import type { QdStepsProps } from './types';
+declare const _default: import("vue").DefineComponent<QdStepsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    jump: (stepIndex: number) => any;
+}, string, import("vue").PublicProps, Readonly<QdStepsProps> & Readonly<{
+    onJump?: ((stepIndex: number) => any) | undefined;
+}>, {
+    maxReachedStep: number;
+    canJumpTo: (stepIndex: number) => boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/steps/index.vue.mjs

@@ -0,0 +1,8 @@
+import './index.css'
+import _sfc_main from "./index.vue2.mjs";
+/* empty css            */
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-3fae5c44"]]);
+export {
+  index as default
+};

package/dist/components/steps/index.vue2.mjs

@@ -0,0 +1,158 @@
+import './index.css'
+import { defineComponent, mergeDefaults, computed, createElementBlock, openBlock, createElementVNode, createCommentVNode, Fragment, renderList, createBlock, normalizeClass, toDisplayString, unref, createTextVNode } from "vue";
+import { ChevronRightSIcon } from "tdesign-icons-vue-next";
+import { qdStepsProps } from "./props.mjs";
+const _hoisted_1 = { class: "qd-steps" };
+const _hoisted_2 = { class: "qd-steps__nav" };
+const _hoisted_3 = { class: "qd-steps__phases" };
+const _hoisted_4 = ["onClick"];
+const _hoisted_5 = {
+  key: 0,
+  class: "qd-steps__phase-icon"
+};
+const _hoisted_6 = {
+  key: 1,
+  class: "qd-steps__phase-icon"
+};
+const _hoisted_7 = {
+  key: 2,
+  class: "qd-steps__phase-icon"
+};
+const _hoisted_8 = { class: "qd-steps__phase-name" };
+const _hoisted_9 = { class: "qd-steps__substeps" };
+const _hoisted_10 = { class: "qd-steps__substep-list" };
+const _hoisted_11 = ["onClick"];
+const _hoisted_12 = { class: "qd-steps__substep-no" };
+const _hoisted_13 = { class: "qd-steps__substep-name" };
+const _hoisted_14 = { class: "qd-steps__indicator" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "QdSteps"
+  },
+  __name: "index",
+  props: /* @__PURE__ */ mergeDefaults({
+    options: {},
+    current: {},
+    maxReachedStep: {},
+    canJumpTo: { type: Function }
+  }, qdStepsProps),
+  emits: ["jump"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const flatSteps = computed(() => props.options.flatMap((group) => getPhaseStepLabels(group)));
+    const reachedStep = computed(() => props.maxReachedStep ?? props.current);
+    const hasSubSteps = computed(() => props.options.some((group) => group.steps?.length));
+    const currentPhaseIndex = computed(
+      () => props.options.findIndex((group) => getPhaseStepIndexes(group).includes(props.current))
+    );
+    const currentPhaseStepIndexes = computed(() => {
+      const group = props.options[currentPhaseIndex.value];
+      if (!group) return [];
+      return getPhaseStepIndexes(group);
+    });
+    function getPhaseFirstStepIndex(group) {
+      return getPhaseStepIndexes(group)[0];
+    }
+    function getPhaseStepLabels(group) {
+      return group.steps?.length ? group.steps : [group.title];
+    }
+    function getPhaseStepIndexes(group) {
+      const startIndex = props.options.slice(0, props.options.indexOf(group)).reduce((total, item) => total + getPhaseStepLabels(item).length, 0);
+      return getPhaseStepLabels(group).map((_, index) => startIndex + index);
+    }
+    function getPhaseStatus(group) {
+      const stepIndexes = getPhaseStepIndexes(group);
+      const isActive = stepIndexes.includes(props.current);
+      if (isActive) return "active";
+      const isDone = stepIndexes.every((stepIndex) => stepIndex <= reachedStep.value);
+      if (isDone) return "done";
+      return "pending";
+    }
+    function getStepStatus(stepIndex) {
+      if (stepIndex === props.current) return "active";
+      if (stepIndex < props.current || stepIndex <= reachedStep.value) return "done";
+      return "pending";
+    }
+    function handlePhaseClick(phase) {
+      const stepIndex = getPhaseFirstStepIndex(phase);
+      if (!props.canJumpTo(stepIndex)) return;
+      emit("jump", stepIndex);
+    }
+    function handleStepClick(stepIndex) {
+      if (!props.canJumpTo(stepIndex)) return;
+      emit("jump", stepIndex);
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createElementVNode("div", _hoisted_3, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (phase, pi) => {
+              return openBlock(), createElementBlock(Fragment, { key: pi }, [
+                createElementVNode("div", {
+                  class: normalizeClass([
+                    "qd-steps__phase",
+                    {
+                      "qd-steps__phase--done": getPhaseStatus(phase) === "done",
+                      "qd-steps__phase--active": getPhaseStatus(phase) === "active",
+                      "qd-steps__phase--pending": getPhaseStatus(phase) === "pending",
+                      "qd-steps__phase--clickable": __props.canJumpTo(getPhaseFirstStepIndex(phase))
+                    }
+                  ]),
+                  onClick: ($event) => handlePhaseClick(phase)
+                }, [
+                  getPhaseStatus(phase) === "done" ? (openBlock(), createElementBlock("span", _hoisted_5, "✓")) : getPhaseStatus(phase) === "active" ? (openBlock(), createElementBlock("span", _hoisted_6, toDisplayString(pi + 1), 1)) : (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(pi + 1), 1)),
+                  createElementVNode("span", _hoisted_8, toDisplayString(phase.title), 1)
+                ], 10, _hoisted_4),
+                pi < __props.options.length - 1 ? (openBlock(), createBlock(unref(ChevronRightSIcon), {
+                  key: 0,
+                  class: normalizeClass([
+                    "qd-steps__separator",
+                    { "qd-steps__separator--done": getPhaseStatus(phase) === "done" }
+                  ])
+                }, null, 8, ["class"])) : createCommentVNode("", true)
+              ], 64);
+            }), 128))
+          ])
+        ]),
+        hasSubSteps.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+          _cache[1] || (_cache[1] = createElementVNode("div", { class: "qd-steps__divider" }, null, -1)),
+          createElementVNode("div", _hoisted_9, [
+            createElementVNode("div", _hoisted_10, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(currentPhaseStepIndexes.value, (stepIndex, subIndex) => {
+                return openBlock(), createElementBlock("div", {
+                  key: stepIndex,
+                  class: normalizeClass([
+                    "qd-steps__substep",
+                    `qd-steps__substep--${getStepStatus(stepIndex)}`,
+                    {
+                      "qd-steps__substep--clickable": __props.canJumpTo(stepIndex)
+                    }
+                  ]),
+                  onClick: ($event) => handleStepClick(stepIndex)
+                }, [
+                  createElementVNode("span", _hoisted_12, [
+                    getStepStatus(stepIndex) === "done" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                      createTextVNode("✓")
+                    ], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                      createTextVNode(toDisplayString(currentPhaseIndex.value + 1) + "." + toDisplayString(subIndex + 1), 1)
+                    ], 64))
+                  ]),
+                  createElementVNode("span", _hoisted_13, toDisplayString(flatSteps.value[stepIndex]), 1)
+                ], 10, _hoisted_11);
+              }), 128))
+            ]),
+            createElementVNode("div", _hoisted_14, [
+              _cache[0] || (_cache[0] = createTextVNode(" 第 ", -1)),
+              createElementVNode("b", null, toDisplayString(__props.current + 1), 1),
+              createTextVNode(" / " + toDisplayString(flatSteps.value.length) + " 步 ", 1)
+            ])
+          ])
+        ], 64)) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/steps/props.d.ts

@@ -0,0 +1,4 @@
+export declare const qdStepsProps: {
+    readonly maxReachedStep: undefined;
+    readonly canJumpTo: () => boolean;
+};

package/dist/components/steps/props.mjs

@@ -0,0 +1,7 @@
+const qdStepsProps = {
+  maxReachedStep: void 0,
+  canJumpTo: () => false
+};
+export {
+  qdStepsProps
+};

package/dist/components/steps/types.d.ts

@@ -0,0 +1,10 @@
+export interface QdStepsGroup {
+    title: string;
+    steps?: string[];
+}
+export interface QdStepsProps {
+    options: QdStepsGroup[];
+    current: number;
+    maxReachedStep?: number;
+    canJumpTo?: (stepIndex: number) => boolean;
+}

package/dist/index.mjs

@@ -44,8 +44,9 @@ import { defineQdServiceDialogTableSelect } from "./components/service-dialog-ta
 import { default as default32 } from "./components/service-popup-table-select/index.vue.mjs";
 import { defineQdServicePopupTableSelect } from "./components/service-popup-table-select/define.mjs";
 import { default as default33 } from "./components/service-select/index.vue.mjs";
+import { default as default34 } from "./components/steps/index.vue.mjs";
 import { qdUploadAcceptMap } from "./components/upload/config.mjs";
-import { default as default34 } from "./components/upload/index.vue.mjs";
+import { default as default35 } from "./components/upload/index.vue.mjs";
 import { hasPermi, hasPermiDirective } from "./directive/hasPermi.mjs";
 import { hasRole, hasRoleDirective } from "./directive/hasRole.mjs";
 import { useAgentChat } from "./hooks/useAgentChat/index.mjs";
@@ -99,7 +100,8 @@ export {
   default32 as QdServicePopupTableSelect,
   default33 as QdServiceSelect,
   default30 as QdServiceTable,
-  default34 as QdUpload,
+  default34 as QdSteps,
+  default35 as QdUpload,
   auth,
   defineQdCrudList,
   defineQdCrudTable,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "qidian-vue-ui",
-  "version": "1.5.3",
+  "version": "1.7.0",
   "description": "基于 TDesign 的 QiDian Vue UI 组件库",
   "author": "qidian",
   "license": "MIT",