e2hang/HuajisheTools
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

New Huajishe Check ChaoXing

Browse Source
This commit is contained in:
e2hang
2025-10-01 10:01:52 +08:00
parent 240b884eac
commit 80be8ae3cf
1094 changed files with 61709 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/README.en-US.md Normal file
View File

@@ -0,0 +1,62 @@
:: BASE_DOC ::
## API
### Indexes Props
name | type | default | description | required
-- | -- | -- | -- | --
style | Object | - | CSS(Cascading Style Sheets) | N
custom-style | Object | - | CSS(Cascading Style Sheets)，used to set style on virtual component | N
index-list | Array | - | `0.32.0`。Typescript：`string [] \| number[]` | N
list | Array | [] | `deprecated`。Typescript：`ListItem[] ` `interface ListItem { title: string; index: string; children: { title: string; [key: string]: any} [] }`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/indexes/type.ts) | N
sticky | Boolean | true | Typescript：`Boolean` | N
sticky-offset | Number | 0 | `1.0.0` | N
### Indexes Events
name | params | description
-- | -- | --
change | `(index: string \| number)` | `0.34.0`
select | `(index: string \| number)` | \-
### IndexesAnchor Props
name | type | default | description | required
-- | -- | -- | -- | --
style | Object | - | CSS(Cascading Style Sheets) | N
custom-style | Object | - | CSS(Cascading Style Sheets)，used to set style on virtual component | N
index | String / Number | - | \- | N
### IndexesAnchor External Classes
className | Description
-- | --
t-class | class name of root node
t-class-sidebar | \-
t-class-sidebar-item | \-
### CSS Variables
The component provides the following CSS variables, which can be used to customize styles.
Name | Default Value | Description
-- | -- | --
--td-indexes-sidebar-active-bg-color | @brand-color | -
--td-indexes-sidebar-active-color | @font-white-1 | -
--td-indexes-sidebar-color | @font-gray-1 | -
--td-indexes-sidebar-font-size | 24rpx | -
--td-indexes-sidebar-item-size | 40rpx | -
--td-indexes-sidebar-line-height | 40rpx | -
--td-indexes-sidebar-right | 16rpx | -
--td-indexes-sidebar-tips-bg-color | @brand-color-light | -
--td-indexes-sidebar-tips-color | @brand-color | -
--td-indexes-sidebar-tips-font-size | 40rpx | -
--td-indexes-sidebar-tips-right | calc(100% + 32rpx) | -
--td-indexes-sidebar-tips-size | 96rpx | -
--td-indexes-anchor-active-bg-color | @bg-color-container | -
--td-indexes-anchor-active-color | @brand-color | -
--td-indexes-anchor-active-font-weight | 600 | -
--td-indexes-anchor-bg-color | @bg-color-secondarycontainer | -
--td-indexes-anchor-color | @font-gray-1 | -
--td-indexes-anchor-font-size | 28rpx | -
--td-indexes-anchor-line-height | 44rpx | -

105
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/README.md Normal file
View File

@@ -0,0 +1,105 @@
---
title: Indexes 索引
description: 用于页面中信息快速检索，可以根据目录中的页码快速找到所需的内容。
spline: navigation
isComponent: true
---
<span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20lines-88%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20functions-87%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20statements-85%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20branches-65%25-red" /></span>
<div style="background: #ecf2fe; display: flex; align-items: center; line-height: 20px; padding: 14px 24px; border-radius: 3px; color: #555a65">
<svg fill="none" viewBox="0 0 16 16" width="16px" height="16px" style="margin-right: 5px">
<path fill="#0052d9" d="M8 15A7 7 0 108 1a7 7 0 000 14zM7.4 4h1.2v1.2H7.4V4zm.1 2.5h1V12h-1V6.5z" fillOpacity="0.9"></path>
</svg>
IndexesAnchor 索引锚点组件于 0.32.0 版本上线，请留意版本。
</div>
## 引入
全局引入，在 miniprogram 根目录下的`app.json`中配置，局部引入，在需要引入的页面或组件的`index.json`中配置。
```json
"usingComponents": {
"t-indexes": "tdesign-miniprogram/indexes/indexes",
"t-indexes-anchor": "tdesign-miniprogram/indexes-anchor/indexes-anchor"
}
```
## 代码演示
<a href="https://developers.weixin.qq.com/s/BH9tQimJ7mSj" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>
<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后，依次执行：npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>
### 基础索引
{{ base }}
### 自定义索引
{{ custom }}
### API
### Indexes Props
名称 | 类型 | 默认值 | 描述 | 必传
-- | -- | -- | -- | --
style | Object | - | 样式 | N
custom-style | Object | - | 样式，一般用于开启虚拟化组件节点场景 | N
index-list | Array | - | `0.32.0`。索引字符列表。不传默认 `A-Z`。TS 类型：`string [] \| number[]` | N
list | Array | [] | 已废弃。索引列表的列表数据。每个元素包含三个子元素，index(string)：索引值，例如1，2，3，...或A，B，C等；title(string): 索引标题，可不填将默认设为索引值；children(Array<{title: string}>): 子元素列表，title为子元素的展示文案。TS 类型：`ListItem[] ` `interface ListItem { title: string; index: string; children: { title: string; [key: string]: any} [] }`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/indexes/type.ts) | N
sticky | Boolean | true | 索引是否吸顶，默认为true。TS 类型：`Boolean` | N
sticky-offset | Number | 0 | `1.0.0`。锚点吸顶时与顶部的距离 | N
### Indexes Events
名称 | 参数 | 描述
-- | -- | --
change | `(index: string \| number)` | `0.34.0`。索引发生变更时触发事件
select | `(index: string \| number)` | 点击侧边栏时触发事件
### IndexesAnchor Props
名称 | 类型 | 默认值 | 描述 | 必传
-- | -- | -- | -- | --
style | Object | - | 样式 | N
custom-style | Object | - | 样式，一般用于开启虚拟化组件节点场景 | N
index | String / Number | - | 索引字符 | N
### IndexesAnchor External Classes
类名 | 描述
-- | --
t-class | 根节点样式类
t-class-sidebar | 侧边栏样式类
t-class-sidebar-item | 侧边栏选项样式类
### CSS Variables
组件提供了下列 CSS 变量，可用于自定义样式。
名称 | 默认值 | 描述
-- | -- | --
--td-indexes-sidebar-active-bg-color | @brand-color | -
--td-indexes-sidebar-active-color | @font-white-1 | -
--td-indexes-sidebar-color | @font-gray-1 | -
--td-indexes-sidebar-font-size | 24rpx | -
--td-indexes-sidebar-item-size | 40rpx | -
--td-indexes-sidebar-line-height | 40rpx | -
--td-indexes-sidebar-right | 16rpx | -
--td-indexes-sidebar-tips-bg-color | @brand-color-light | -
--td-indexes-sidebar-tips-color | @brand-color | -
--td-indexes-sidebar-tips-font-size | 40rpx | -
--td-indexes-sidebar-tips-right | calc(100% + 32rpx) | -
--td-indexes-sidebar-tips-size | 96rpx | -
--td-indexes-anchor-active-bg-color | @bg-color-container | -
--td-indexes-anchor-active-color | @brand-color | -
--td-indexes-anchor-active-font-weight | 600 | -
--td-indexes-anchor-bg-color | @bg-color-secondarycontainer | -
--td-indexes-anchor-color | @font-gray-1 | -
--td-indexes-anchor-font-size | 28rpx | -
--td-indexes-anchor-line-height | 44rpx | -

45
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/indexes.d.ts vendored Normal file
View File

@@ -0,0 +1,45 @@
import { RelationsOptions, SuperComponent } from '../common/src/index';
export default class Indexes extends SuperComponent {
externalClasses: string[];
properties: import("./type").TdIndexesProps;
data: {
prefix: string;
classPrefix: string;
_height: number;
_indexList: any[];
scrollTop: number;
activeAnchor: any;
showTips: boolean;
};
relations: RelationsOptions;
behaviors: string[];
timer: any;
groupTop: any[];
sidebar: any;
currentTouchAnchor: any;
observers: {
indexList(v: any): void;
height(v: any): void;
};
lifetimes: {
ready(): void;
};
methods: {
setHeight(height: string | number): void;
setIndexList(list: any): void;
getAllRect(): void;
getAnchorsRect(): Promise<any[]>;
getSidebarRect(): void;
toggleTips(flag: boolean): void;
setAnchorByIndex(index: any): void;
onClick(e: any): void;
onTouchMove(e: any): void;
onTouchCancel(): void;
onTouchEnd(e: any): void;
onAnchorTouch: (...args: any[]) => void;
setAnchorOnScroll(scrollTop: number): void;
onScroll({ scrollTop }: {
scrollTop: any;
}): void;
};
}

236
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/indexes.js Normal file
View File

@@ -0,0 +1,236 @@
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { SuperComponent, wxComponent } from '../common/src/index';
import config from '../common/config';
import props from './props';
import { getRect, throttle, systemInfo } from '../common/utils';
import pageScrollMixin from '../mixins/page-scroll';
const { prefix } = config;
const name = `${prefix}-indexes`;
let Indexes = class Indexes extends SuperComponent {
constructor() {
super(...arguments);
this.externalClasses = [`${prefix}-class`, `${prefix}-class-sidebar`, `${prefix}-class-sidebar-item`];
this.properties = props;
this.data = {
prefix,
classPrefix: name,
_height: 0,
_indexList: [],
scrollTop: 0,
activeAnchor: null,
showTips: false,
};
this.relations = {
'../indexes-anchor/indexes-anchor': {
type: 'child',
},
};
this.behaviors = [pageScrollMixin()];
this.timer = null;
this.groupTop = [];
this.sidebar = null;
this.currentTouchAnchor = null;
this.observers = {
indexList(v) {
this.setIndexList(v);
this.setHeight(this.data._height);
},
height(v) {
this.setHeight(v);
},
};
this.lifetimes = {
ready() {
this.timer = null;
this.groupTop = [];
this.sidebar = null;
if (this.data._height === 0) {
this.setHeight();
}
if (this.data.indexList === null) {
this.setIndexList();
}
},
};
this.methods = {
setHeight(height) {
if (!height) {
const { windowHeight } = systemInfo;
height = windowHeight;
}
this.setData({
_height: height,
}, () => {
this.getAllRect();
});
},
setIndexList(list) {
if (!list) {
const start = 'A'.charCodeAt(0);
const alphabet = [];
for (let i = start, end = start + 26; i < end; i += 1) {
alphabet.push(String.fromCharCode(i));
}
this.setData({ _indexList: alphabet });
}
else {
this.setData({ _indexList: list });
}
},
getAllRect() {
this.getAnchorsRect().then(() => {
this.groupTop.forEach((item, index) => {
const next = this.groupTop[index + 1];
item.totalHeight = ((next === null || next === void 0 ? void 0 : next.top) || Infinity) - item.top;
});
this.setAnchorOnScroll(0);
});
this.getSidebarRect();
},
getAnchorsRect() {
return Promise.all(this.$children.map((child) => getRect(child, `.${name}-anchor`).then((rect) => {
this.groupTop.push({
height: rect.height,
top: rect.top,
anchor: child.data.index,
});
})));
},
getSidebarRect() {
getRect(this, `#id-${name}__bar`).then((rect) => {
const { top, height } = rect;
const { length } = this.data._indexList;
this.sidebar = {
top,
height,
itemHeight: (height - (length - 1) * 2) / length,
};
});
},
toggleTips(flag) {
if (!flag) {
clearInterval(this.timer);
this.timer = setTimeout(() => {
this.setData({
showTips: false,
});
}, 300);
}
else {
this.setData({
showTips: true,
});
}
},
setAnchorByIndex(index) {
const { _indexList, stickyOffset } = this.data;
const activeAnchor = _indexList[index];
if (this.data.activeAnchor !== null && this.data.activeAnchor === activeAnchor)
return;
const target = this.groupTop.find((item) => item.anchor === activeAnchor);
if (target) {
this.currentTouchAnchor = activeAnchor;
const scrollTop = target.top - stickyOffset;
wx.pageScrollTo({
scrollTop,
duration: 0,
});
this.toggleTips(true);
this.triggerEvent('select', { index: activeAnchor });
this.setData({ activeAnchor });
}
},
onClick(e) {
const { index } = e.currentTarget.dataset;
this.setAnchorByIndex(index);
},
onTouchMove(e) {
this.onAnchorTouch(e);
},
onTouchCancel() {
this.toggleTips(false);
},
onTouchEnd(e) {
this.toggleTips(false);
this.onAnchorTouch(e);
},
onAnchorTouch: throttle(function (e) {
const getAnchorIndex = (clientY) => {
const offsetY = clientY - this.sidebar.top;
if (offsetY <= 0) {
return 0;
}
if (offsetY > this.sidebar.height) {
return this.data._indexList.length - 1;
}
return Math.floor(offsetY / this.sidebar.itemHeight);
};
const index = getAnchorIndex(e.changedTouches[0].clientY);
this.setAnchorByIndex(index);
}, 1000 / 30),
setAnchorOnScroll(scrollTop) {
if (!this.groupTop) {
return;
}
const { sticky, stickyOffset, activeAnchor } = this.data;
scrollTop += stickyOffset;
const curIndex = this.groupTop.findIndex((group) => scrollTop >= group.top - group.height && scrollTop <= group.top + group.totalHeight - group.height);
if (curIndex === -1)
return;
const curGroup = this.groupTop[curIndex];
if (this.currentTouchAnchor !== null) {
this.triggerEvent('change', { index: curGroup.anchor });
this.currentTouchAnchor = null;
}
else if (activeAnchor !== curGroup.anchor) {
this.triggerEvent('change', { index: curGroup.anchor });
this.setData({ activeAnchor: curGroup.anchor });
}
if (sticky) {
const offset = curGroup.top - scrollTop;
const betwixt = offset < curGroup.height && offset > 0 && scrollTop > stickyOffset;
this.$children.forEach((child, index) => {
if (index === curIndex) {
const sticky = scrollTop > stickyOffset;
const anchorStyle = `transform: translate3d(0, ${betwixt ? offset : 0}px, 0); top: ${stickyOffset}px`;
if (anchorStyle !== child.data.anchorStyle || sticky !== child.data.sticky) {
child.setData({
sticky,
active: true,
style: `height: ${curGroup.height}px`,
anchorStyle,
});
}
}
else if (index + 1 === curIndex) {
const anchorStyle = `transform: translate3d(0, ${betwixt ? offset - curGroup.height : 0}px, 0); top: ${stickyOffset}px`;
if (anchorStyle !== child.data.anchorStyle) {
child.setData({
sticky: true,
active: true,
style: `height: ${curGroup.height}px`,
anchorStyle,
});
}
}
else {
child.setData({ active: false, sticky: false, anchorStyle: '' });
}
});
}
},
onScroll({ scrollTop }) {
this.setAnchorOnScroll(scrollTop);
},
};
}
};
Indexes = __decorate([
wxComponent()
], Indexes);
export default Indexes;

9
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/indexes.json Normal file
View File

@@ -0,0 +1,9 @@
{
"component": true,
"styleIsolation": "apply-shared",
"usingComponents": {
"t-icon": "../icon/icon",
"t-cell": "../cell/cell",
"t-cell-group": "../cell-group/cell-group"
}
}

28
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/indexes.wxml Normal file
View File

@@ -0,0 +1,28 @@
<wxs src="../common/utils.wxs" module="_" />
<wxs src="./indexes.wxs" module="_this" />
<view style="{{_._style([style, customStyle])}}" class="{{classPrefix}} class {{prefix}}-class">
<view
class="{{classPrefix}}__sidebar {{prefix}}-class-sidebar"
id="id-{{classPrefix}}__bar"
catch:touchmove="onTouchMove"
catch:touchcancel="onTouchCancel"
catch:touchend="onTouchEnd"
>
<view
class="{{_.cls(classPrefix + '__sidebar-item', [['active', activeAnchor === item]])}} {{prefix}}-class-sidebar-item"
wx:for="{{ _indexList }}"
wx:key="*this"
bind:tap="onClick"
data-index="{{index}}"
>
<view aria-role="button" aria-label="{{ activeAnchor === item ? '已选中' + item : ''}}">
{{ _this.getFirstCharacter(item) }}
</view>
<view class="{{classPrefix}}__sidebar-tips" wx:if="{{ showTips && activeAnchor === item }}">
{{ activeAnchor }}
</view>
</view>
</view>
<slot />
</view>

7
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/indexes.wxs Normal file
View File

@@ -0,0 +1,7 @@
function getFirstCharacter(str) {
return str.toString().substring(0, 1);
}
module.exports = {
getFirstCharacter: getFirstCharacter,
};

78
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/indexes.wxss Normal file
View File

@@ -0,0 +1,78 @@
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@keyframes tdesign-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
transform: scale(1.5);
}
.t-indexes {
position: relative;
height: 100vh;
}
.t-indexes__sidebar {
position: fixed;
right: var(--td-indexes-sidebar-right, 16rpx);
width: var(--td-indexes-sidebar-item-size, 40rpx);
color: var(--td-indexes-sidebar-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font-size: var(--td-indexes-sidebar-font-size, 24rpx);
line-height: var(--td-indexes-sidebar-line-height, 40rpx);
display: flex;
flex-flow: column nowrap;
top: 50%;
transform: translateY(-50%);
z-index: 1;
}
.t-indexes__sidebar-item {
border-radius: 50%;
position: relative;
text-align: center;
}
.t-indexes__sidebar-item--active {
background-color: var(--td-indexes-sidebar-active-bg-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
color: var(--td-indexes-sidebar-active-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
}
.t-indexes__sidebar-item + .t-indexes__sidebar-item {
margin-top: 4rpx;
}
.t-indexes__sidebar-tips {
min-width: var(--td-indexes-sidebar-tips-size, 96rpx);
max-width: 198rpx;
padding: 0 32rpx;
box-sizing: border-box;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
height: var(--td-indexes-sidebar-tips-size, 96rpx);
line-height: var(--td-indexes-sidebar-tips-size, 96rpx);
text-align: center;
font-size: var(--td-indexes-sidebar-tips-font-size, 40rpx);
font-weight: 700;
color: var(--td-indexes-sidebar-tips-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
background-color: var(--td-indexes-sidebar-tips-bg-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
border-radius: var(--td-indexes-sidebar-tips-size, 96rpx);
position: absolute;
top: 50%;
bottom: 0;
transform: translateY(-50%);
right: var(--td-indexes-sidebar-tips-right, calc(100% + 32rpx));
}

3
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/props.d.ts vendored Normal file
View File

@@ -0,0 +1,3 @@
import { TdIndexesProps } from './type';
declare const props: TdIndexesProps;
export default props;

14
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/props.js Normal file
View File

@@ -0,0 +1,14 @@
const props = {
indexList: {
type: null,
},
sticky: {
type: Boolean,
value: true,
},
stickyOffset: {
type: Number,
value: 0,
},
};
export default props;

14
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/type.d.ts vendored Normal file
View File

@@ -0,0 +1,14 @@
export interface TdIndexesProps {
indexList?: {
type: null;
value?: string[] | number[];
};
sticky?: {
type: BooleanConstructor;
value?: Boolean;
};
stickyOffset?: {
type: NumberConstructor;
value?: number;
};
}

1
HuajisheCheckChaoXing/miniprogram_npm/tdesign-miniprogram/indexes/type.js Normal file
View File

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