提交

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

@@ -0,0 +1,66 @@
+<view
+  class="ant-tab-bar {{className || ''}}"
+  style="{{style || ''}}"
+>
+  <view class="ant-tab-bar-wrap">
+    <block
+      a:for="{{items}}"
+      a:for-index="index"
+      a:for-item="item"
+    >
+      <view
+        class="ant-tab-bar-item {{index === mixin.value ? 'ant-tab-bar-item-active ' + (activeClassName || '') : ''}}"
+        style="{{index === mixin.value ? activeStyle || '' : ''}}"
+        onTap="onChange"
+        data-index="{{index}}"
+      >
+        <ant-badge
+          a:if="{{item.badge}}"
+          type="{{item.badge.type || 'dot'}}"
+          text="{{item.badge.text}}"
+          stroke="{{item.badge.stroke}}"
+          bgColor="{{item.badge.bgColor}}"
+          position="{{item.badge.position || 'top-right'}}"
+          offsetX="{{item.badge.offsetX || '-9px'}}"
+          offsetY="{{item.badge.offsetY || '0px'}}"
+        >
+          <slot
+            name="icon"
+            active="{{mixin.value == index}}"
+            item="{{item}}"
+            index="{{index}}"
+          >
+            <image-icon
+              className="ant-tab-bar"
+              image="{{mixin.value === index ? item.activeIcon : item.icon}}"
+            ></image-icon>
+          </slot>
+        </ant-badge>
+        <block a:else>
+          <slot
+            name="icon"
+            active="{{mixin.value == index}}"
+            item="{{item}}"
+            index="{{index}}"
+          >
+            <image-icon
+              className="ant-tab-bar"
+              image="{{mixin.value === index ? item.activeIcon : item.icon}}"
+            ></image-icon>
+          </slot>
+        </block>
+        <view class="ant-tab-bar-text-wrap">
+          <slot
+            name="text"
+            active="{{mixin.value === index}}"
+            item="{{item}}"
+            index="{{index}}"
+          >
+            <!--display: inline-->
+            <text class="ant-tab-bar-text">{{item.text}}</text>
+          </slot>
+        </view>
+      </view>
+    </block>
+  </view>
+</view>

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

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

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

@@ -0,0 +1,20 @@
+import { TabBarDefaultProps } from './props';
+import { Component, triggerEvent } from '../_util/simply';
+import mixinValue from '../mixins/value';
+Component(TabBarDefaultProps, {
+    onChange: function (e) {
+        var index = e.currentTarget.dataset.index;
+        if (index === this.getValue()) {
+            return;
+        }
+        if (!this.isControlled()) {
+            this.update(index);
+        }
+        triggerEvent(this, 'change', index, e);
+    },
+}, null, [
+    mixinValue({
+        valueKey: 'current',
+        defaultValueKey: 'defaultCurrent',
+    }),
+]);

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

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "ant-badge": "../Badge/index",
+    "image-icon": "../ImageIcon/index"
+  }
+}

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

@@ -0,0 +1,41 @@
+@import (reference) './variable.less';
+
+@tabsPrefix: ant-tab-bar;
+@tabSize: 48 * @rpx;
+@textSize: 20 * @rpx;
+
+.@{tabsPrefix} {
+  &-wrap {
+    display: flex;
+    align-items: center;
+    background-color: @COLOR_CARD;
+  }
+  &-item {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 8 * @rpx 0;
+    color: @COLOR_TEXT_SECONDARY;
+    &-active {
+      color: @COLOR_BRAND1;
+    }
+  }
+
+  &-icon {
+    max-width: @tabSize;
+    max-height: @tabSize;
+    font-size: @tabSize;
+  }
+
+  &-image {
+    font-size: @tabSize;
+    max-width: @tabSize;
+    max-height: @tabSize;
+  }
+
+  &-text {
+    font-size: @textSize;
+  }
+}

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

@@ -0,0 +1,55 @@
+import { IBaseProps } from '../_util/base';
+import { IBadgeProps } from '../Badge/props';
+export interface ITabItem {
+    /**
+     * @description 底部图标，支持 Icon 或图片
+     * @default ''
+     */
+    icon?: string;
+    /**
+     * @description 高亮状态的底部图标，支持 Icon 或图片
+     * @default ''
+     */
+    activeIcon?: string;
+    /**
+     * @description 底部的文本信息
+     * @default ''
+     */
+    text: string;
+    /**
+     * @description 徽标，参见 <Badge/> 组件
+     * @default undefined
+     */
+    badge?: IBadgeProps;
+}
+/**
+ * @description 标签栏，内部配合 TabItem 使用。
+ */
+export interface ITabBarProps extends IBaseProps {
+    /**
+     * @description tabbar 配置，为一个数组
+     * @default []
+     */
+    items: ITabItem[];
+    /**
+     * @description 选中
+     */
+    current: number;
+    /**
+     * @description 初始值
+     */
+    defaultCurrent: number;
+    /**
+     * @description 高亮状态图标和文本的 className
+     */
+    activeClassName?: string;
+    /**
+     * @description 高亮状态图标和文本的 style
+     */
+    activeStyle?: string;
+    /**
+     * @description tabbar 切换时的回调
+     */
+    onChange: (index: number, e: Record<string, any>) => void;
+}
+export declare const TabBarDefaultProps: Partial<ITabBarProps>;

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

@@ -0,0 +1,7 @@
+export var TabBarDefaultProps = {
+    items: [],
+    current: null,
+    defaultCurrent: 0,
+    activeClassName: '',
+    activeStyle: '',
+};

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

@@ -0,0 +1,17 @@
+@import (reference) '../style/themes/index.less';
+
+// 基础类型的颜色 文本和下划线同一个颜色、未选中的文本颜色，无背景色
+// 胶囊类型的颜色，文本和背景色，选中状态的文本和背景色
+// 混合型的颜色，主标题的文本在选中与未选中的颜色，描述的未选中颜色以及选中后的文本和背景色
+
+// 选中后的颜色：
+// 基础：文本和下划线为蓝色
+// 胶囊：文本白色，背景蓝色
+// 混合：主标题文本蓝色，描述背景色蓝色，文本白色
+
+// 未选中的颜色
+// 基础：文本黑色
+// 胶囊：文本黑色，背景色灰色
+// 混合：主标题文本黑色，文本灰色无背景
+
+// 黑色、灰色、白色、蓝色