提交

甲情_甲意/miniprogram/node_modules/antd-mini/less/GuideTour/index.axml

@@ -0,0 +1,126 @@
+<import-sjs
+  from="./index.sjs"
+  name="utils"
+></import-sjs>
+<view
+  a:if="{{visible}}"
+  class="ant-guide-tour {{className || ''}}"
+  style="{{style || ''}}"
+>
+  <mask
+    show
+    className="{{maskClassName}}"
+    style="z-index:9999;{{maskStyle || ''}}"
+  ></mask>
+  <ant-icon
+    type="CloseOutline"
+    className="ant-guide-tour-clear"
+    onTap="onCancel"
+  ></ant-icon>
+  <view class="ant-guide-tour-button">
+    <ant-button
+      a:if="{{utils.checkShowJump(mixin.value, items)}}"
+      inline
+      size="small"
+      onTap="onCancel"
+    >
+      {{jumpText}}
+    </ant-button>
+    <ant-button
+      a:if="{{utils.checkShowPrev(mixin.value, items)}}"
+      inline
+      size="small"
+      onTap="onPrev"
+      data-currentValue="{{mixin.value}}"
+    >
+      {{prevStepText}}
+    </ant-button>
+    <ant-button
+      a:if="{{utils.checkShowNext(mixin.value, items)}}"
+      inline
+      size="small"
+      onTap="onNext"
+      data-currentValue="{{mixin.value}}"
+    >
+      {{nextStepText}}
+    </ant-button>
+    <ant-button
+      a:if="{{utils.checkShowKnow(mixin.value, items)}}"
+      inline
+      size="small"
+      onTap="onCancel"
+    >
+      {{gotItText}}
+    </ant-button>
+  </view>
+  <block a:if="{{swiperable}}">
+    <view class="ant-guide-tour-indicator">
+      <block
+        a:for="{{items}}"
+        a:for-index="index"
+        a:for-item="item"
+      >
+        <view class="ant-guide-tour-indicator-dot {{index === mixin.value ? 'ant-guide-tour-indicator-dot-active' : ''}}"></view>
+      </block>
+    </view>
+    <swiper
+      class="ant-guide-tour-swiper"
+      current="{{mixin.value}}"
+      adjustHeight="none"
+      style="height: 100vh"
+      onChange="onSwiperChange"
+    >
+      <block
+        a:for="{{items}}"
+        a:for-index="index"
+        a:for-item="item"
+      >
+        <swiper-item>
+          <view
+            class="ant-guide-tour-item {{item.className || ''}}"
+            style="top:{{item.top}}px; left:{{item.left}}px"
+          >
+            <slot
+              name="step"
+              index="{{mixin.current}}"
+            >
+              <image
+                a:if="{{item.imageUrl}}"
+                class="ant-guide-tour-item-img"
+                src="{{item.imageUrl}}"
+                style="{{item.imageStyle}}"
+                mode="{{item.imageMode}}"
+              ></image>
+            </slot>
+          </view>
+        </swiper-item>
+      </block>
+    </swiper>
+  </block>
+  <block a:else>
+    <block
+      a:for="{{items}}"
+      a:for-index="index"
+      a:for-item="item"
+    >
+      <view
+        a:if="{{mixin.value === index}}"
+        class="ant-guide-tour-item {{item.className || ''}}"
+        style="top:{{item.top}}px; left:{{item.left}}px"
+      >
+        <slot
+          name="step"
+          index="{{index}}"
+        >
+          <image
+            a:if="{{item.imageUrl}}"
+            class="ant-guide-tour-item-img"
+            src="{{item.imageUrl}}"
+            style="{{item.imageStyle}}"
+            mode="{{item.imageMode}}"
+          ></image>
+        </slot>
+      </view>
+    </block>
+  </block>
+</view>

甲情_甲意/miniprogram/node_modules/antd-mini/less/GuideTour/index.d.ts

@@ -0,0 +1 @@
+export {};

甲情_甲意/miniprogram/node_modules/antd-mini/less/GuideTour/index.js

@@ -0,0 +1,55 @@
+import { __awaiter, __generator } from "tslib";
+import { Component, triggerEvent, triggerEventOnly } from '../_util/simply';
+import { GuideTourDefaultProps } from './props';
+import mixinValue from '../mixins/value';
+Component(GuideTourDefaultProps, {
+    onNext: function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var currentValue, newCurrent;
+            return __generator(this, function (_a) {
+                currentValue = this.getValue();
+                newCurrent = currentValue + 1;
+                if (!this.isControlled()) {
+                    this.update(newCurrent);
+                }
+                triggerEvent(this, 'change', newCurrent);
+                return [2 /*return*/];
+            });
+        });
+    },
+    onPrev: function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var currentValue, newCurrent;
+            return __generator(this, function (_a) {
+                currentValue = this.getValue();
+                newCurrent = currentValue - 1;
+                if (!this.isControlled()) {
+                    this.update(newCurrent);
+                }
+                triggerEvent(this, 'change', newCurrent);
+                return [2 /*return*/];
+            });
+        });
+    },
+    onCancel: function () {
+        triggerEventOnly(this, 'cancel');
+    },
+    onSwiperChange: function (e) {
+        return __awaiter(this, void 0, void 0, function () {
+            var current;
+            return __generator(this, function (_a) {
+                current = e.detail.current;
+                if (!this.isControlled()) {
+                    this.update(current);
+                }
+                triggerEvent(this, 'change', current);
+                return [2 /*return*/];
+            });
+        });
+    },
+}, undefined, [
+    mixinValue({
+        valueKey: 'current',
+        defaultValueKey: 'defaultCurrent',
+    }),
+]);

甲情_甲意/miniprogram/node_modules/antd-mini/less/GuideTour/index.json

@@ -0,0 +1,8 @@
+{
+  "component": true,
+  "usingComponents": {
+    "mask": "../Mask/index",
+    "ant-button": "../Button/index",
+    "ant-icon": "../Icon/index"
+  }
+}

甲情_甲意/miniprogram/node_modules/antd-mini/less/GuideTour/index.less

@@ -0,0 +1,71 @@
+@import (reference) './variable.less';
+
+.@{guideTourPrefix} {
+  &-button {
+    width: 100%;
+    position: absolute;
+    left: 0;
+    bottom: @guide-tour-button-bottom;
+    z-index: @guide-tour-z-index-3;
+    display: flex;
+    justify-content: center;
+    .ant-button:nth-of-type(1) {
+      color: @guide-tour-text-color;
+      background-color: transparent;
+      box-shadow: inset 0 0 0 @border-width-standard @COLOR_BORDER_DEFAULT;
+    }
+    .ant-button:nth-of-type(2) {
+      color: @COLOR_TEXT_PRIMARY_DEFAULT;
+      background-color: @COLOR_WHITE_DEFAULT;
+      box-shadow: none;
+    }
+    .ant-button {
+      margin: 0 12 * @rpx;
+      width: 152 * @rpx;
+    }
+  }
+
+  &-indicator {
+    width: 100%;
+    position: absolute;
+    bottom: @guide-tour-dot-bottom;
+    left: 50%;
+    transform: translateX(-50%);
+    z-index: @guide-tour-z-index-2;
+    display: flex;
+    justify-content: center;
+    &-dot {
+      margin: 0 3 * @rpx;
+      background-color: @guide-tour-dot-color;
+      width: @guide-tour-dot-size;
+      height: @guide-tour-dot-size;
+      border-radius: @guide-tour-dot-border-radius;
+      &-active {
+        width: @guide-tour-dot-active-width;
+        background-color: @guide-tour-text-color;
+      }
+    }
+  }
+  &-clear {
+    position: fixed;
+    top: 80 * @rpx;
+    right: 40 * @rpx;
+    z-index: @guide-tour-z-index-3;
+    font-size: 56 * @rpx;
+    color: @guide-tour-clear-color;
+  }
+
+  &-item {
+    z-index: @guide-tour-z-index-2;
+    position: fixed;
+    top: 0;
+    left: 0;
+  }
+  &-swiper {
+    z-index: @guide-tour-z-index-2;
+    position: fixed;
+    top: 0;
+    left: 0;
+
+  }
+}

甲情_甲意/miniprogram/node_modules/antd-mini/less/GuideTour/index.sjs

@@ -0,0 +1,18 @@
+function checkShowNext(current, items) {
+  return current < items.length - 1;
+}
+function checkShowPrev(current, items) {
+  return current > 0;
+}
+function checkShowJump(current, items) {
+  return current === 0 && items.length > 1;
+}
+function checkShowKnow(current, items) {
+  return current === items.length - 1;
+}
+export default {
+  checkShowNext: checkShowNext,
+  checkShowPrev: checkShowPrev,
+  checkShowJump: checkShowJump,
+  checkShowKnow: checkShowKnow
+};

甲情_甲意/miniprogram/node_modules/antd-mini/less/GuideTour/props.d.ts

@@ -0,0 +1,88 @@
+import { IBaseProps } from '../_util/base';
+interface IStep {
+    /**
+     * @description 图片地址
+     */
+    imageUrl: string;
+    /**
+     * @description 图片模式
+     */
+    imageMode: string;
+    /**
+     * @description 图片内联样式
+     */
+    imageStyle: string;
+    /**
+     * @description 距离顶部
+     */
+    top: string;
+    /**
+     * @description 距离左边
+     */
+    left: string;
+    /**
+     * @description className
+     */
+    className?: string;
+}
+export interface IGuideTour extends IBaseProps {
+    /**
+     * @description 蒙层样式
+     */
+    maskStyle: string;
+    /**
+     * @description 蒙层 className
+     */
+    maskClassName?: string;
+    /**
+     * @description 步骤详情
+     */
+    items: IStep[];
+    /**
+     * @description 当前步骤
+     */
+    current: number;
+    /**
+     * @description 初始step
+     */
+    defaultCurrent: number;
+    /**
+     * @description 是否开启滑动模式
+     */
+    swiperable: boolean;
+    /**
+     * @description 引导是否可见, 受控
+     * @default true
+     */
+    visible: boolean;
+    /**
+     * @description 关闭回调
+     */
+    onCancel: () => void;
+    /**
+     * @description 步骤改变回调
+     */
+    onChange: (index: number) => boolean;
+    /**
+     * @description 上一步按钮文案
+     * @default "上一步"
+     */
+    prevStepText?: string;
+    /**
+     * @description 下一步按钮文案
+     * @default "下一步"
+     */
+    nextStepText?: string;
+    /**
+     * @description 知道了按钮文案
+     * @default "知道了"
+     */
+    gotItText?: string;
+    /**
+     * @description 跳过按钮文案
+     * @default "跳过"
+     */
+    jumpText?: string;
+}
+export declare const GuideTourDefaultProps: Partial<IGuideTour>;
+export {};

甲情_甲意/miniprogram/node_modules/antd-mini/less/GuideTour/props.js

@@ -0,0 +1,13 @@
+export var GuideTourDefaultProps = {
+    visible: false,
+    swiperable: false,
+    items: [],
+    current: null,
+    defaultCurrent: 0,
+    gotItText: '知道了',
+    nextStepText: '下一步',
+    prevStepText: '上一步',
+    jumpText: '跳过',
+    maskStyle: '',
+    maskClassName: '',
+};

甲情_甲意/miniprogram/node_modules/antd-mini/less/GuideTour/variable.less

@@ -0,0 +1,30 @@
+@import (reference) '../style/themes/index.less';
+
+@guideTourPrefix: ant-guide-tour;
+
+// 层级-1
+@guide-tour-z-index-1: 9999;
+// 层级-2
+@guide-tour-z-index-2: 10000;
+// 层级-3
+@guide-tour-z-index-3: 10001;
+// 主要文字颜色
+@guide-tour-text-color: @COLOR_WHITE_DEFAULT;
+// 关闭按钮颜色
+@guide-tour-clear-color: @COLOR_TEXT_ASSIST_DEFAULT;
+// 按钮距离底部
+@guide-tour-button-bottom: calc(100 * @rpx + env(safe-area-inset-bottom));
+// 按钮高度
+@guide-tour-button-height:52 * @rpx;
+// 步骤条点的长宽
+@guide-tour-dot-size: 6 * @rpx;
+// 步骤条点的颜色
+@guide-tour-dot-color: @COLOR_TEXT_ASSIST_DEFAULT;
+// 激活步骤条点的长度
+@guide-tour-dot-active-width:26 * @rpx;
+// 步骤条点的弧度
+@guide-tour-dot-border-radius:2 * @rpx;
+// 步骤条距离底部
+@guide-tour-dot-bottom: calc(
+  @guide-tour-button-bottom + 40 * @rpx + @guide-tour-button-height
+);