初始化项目, 添加TDesign等包

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/index.wxs

@@ -0,0 +1,7 @@
+var getTreeClass = function (level, total) {
+  if (level === 0) return 'right';
+  if (level === 1 && level !== total - 1) return 'middle';
+  return 'left';
+};
+
+module.exports.getTreeClass = getTreeClass;

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/props.d.ts

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

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/props.js

@@ -0,0 +1 @@
+const props={customValue:{type:null},height:{type:null,value:336},keys:{type:Object},multiple:{type:Boolean,value:!1},options:{type:Array,value:[]},value:{type:null,value:null},defaultValue:{type:null}};export default props;

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/tree-select.d.ts

@@ -0,0 +1,31 @@
+import { SuperComponent } from '../common/src/index';
+import type { TreeOptionData } from '../common/common';
+export default class TreeSelect extends SuperComponent {
+    externalClasses: string[];
+    options: {
+        multipleSlots: boolean;
+    };
+    data: {
+        prefix: string;
+        classPrefix: string;
+        scrollIntoView: any;
+    };
+    properties: import("./type").TdTreeSelectProps<TreeOptionData<string | number>>;
+    controlledProps: {
+        key: string;
+        event: string;
+    }[];
+    observers: {
+        'value, customValue, options, keys, multiple'(): void;
+    };
+    lifetimes: {
+        ready(): void;
+    };
+    methods: {
+        buildTreeOptions(): void;
+        getScrollIntoView(status: string): void;
+        onRootChange(e: any): void;
+        handleTreeClick(e: any): void;
+        handleChange(e: any): void;
+    };
+}

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/tree-select.js

@@ -0,0 +1 @@
+import{__decorate}from"tslib";import{SuperComponent,wxComponent}from"../common/src/index";import{isDef}from"../common/validator";import config from"../common/config";import{getTreeDepth}from"../common/utils";import props from"./props";const{prefix:prefix}=config,name=`${prefix}-tree-select`;let TreeSelect=class extends SuperComponent{constructor(){super(...arguments),this.externalClasses=[`${prefix}-class`,`${prefix}-class-left-column`,`${prefix}-class-left-item`,`${prefix}-class-middle-item`,`${prefix}-class-right-column`,`${prefix}-class-right-item`,`${prefix}-class-right-item-label`],this.options={multipleSlots:!0},this.data={prefix:prefix,classPrefix:name,scrollIntoView:null},this.properties=props,this.controlledProps=[{key:"value",event:"change"}],this.observers={"value, customValue, options, keys, multiple"(){this.buildTreeOptions()}},this.lifetimes={ready(){this.getScrollIntoView("init")}},this.methods={buildTreeOptions(){var e,l;const{options:t,value:i,customValue:o,multiple:n,keys:s}=this.data;if(!t.length)return;const r=[];let a=-1,c={children:t};for(;null==c?void 0:c.children;){a+=1;const t=c.children.map(e=>({label:e[(null==s?void 0:s.label)||"label"],value:e[(null==s?void 0:s.value)||"value"],disabled:e[(null==s?void 0:s.disabled)||"disabled"],children:e[(null==s?void 0:s.children)||"children"]}));r.push(t);const n=null!==(e=null==o?void 0:o[a])&&void 0!==e?e:null==i?void 0:i[a];c=n&&null!==(l=t.find(e=>e.value===n))&&void 0!==l?l:t[0]}const u=getTreeDepth(t,null==s?void 0:s.children);for(;r.length<u;)r.push([]),a+=1;const d=Math.max(0,a),p=o||r.map((e,l)=>{var t,o,s;const a=l===r.length-1&&n?[null===(t=e[0])||void 0===t?void 0:t.value]:null===(o=e[0])||void 0===o?void 0:o.value;return null!==(s=null==i?void 0:i[l])&&void 0!==s?s:a});this.setData({innerValue:p,leafLevel:d,treeOptions:r})},getScrollIntoView(e){const{value:l,customValue:t,scrollIntoView:i}=this.data;if("init"===e){const e=t||l,i=Array.isArray(e)?e.map(e=>Array.isArray(e)?e[0]:e):[e];this.setData({scrollIntoView:i})}else{if(null===i)return;this.setData({scrollIntoView:null})}},onRootChange(e){const{innerValue:l}=this.data,{value:t}=e.detail;this.getScrollIntoView("none"),l[0]=t,this._trigger("change",{value:l,level:0})},handleTreeClick(e){const{level:l,value:t}=e.currentTarget.dataset,{innerValue:i}=this.data;i[l]=t,this.getScrollIntoView("none"),this._trigger("change",{value:i,level:1})},handleChange(e){const{innerValue:l}=this.data,{level:t,type:i}=e.target.dataset,{value:o}="multiple"===i?e.detail.context:e.detail;if("multiple"===i){isDef(l[t])||(l[t]=[]);const e=l[t].indexOf(o);-1===e?l[t].push(o):l[t].splice(e,1)}else l[t]=o;this.getScrollIntoView("none"),this._trigger("change",{value:l,level:t})}}}};TreeSelect=__decorate([wxComponent()],TreeSelect);export default TreeSelect;

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/tree-select.json

@@ -0,0 +1 @@
+{"component":true,"styleIsolation":"apply-shared","usingComponents":{"t-radio":"../radio/radio","t-radio-group":"../radio-group/radio-group","t-checkbox":"../checkbox/checkbox","t-checkbox-group":"../checkbox-group/checkbox-group","t-side-bar":"../side-bar/side-bar","t-side-bar-item":"../side-bar-item/side-bar-item","t-scroll-view":"../scroll-view/scroll-view"}}

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/tree-select.wxml

@@ -0,0 +1 @@
+<wxs module="_" src="../common/utils.wxs"/><wxs module="_this" src="./index.wxs"/><view class="{{classPrefix}} class" style="{{_._style(['height:' + _.addUnit(height) , style, customStyle])}}"><t-scroll-view class="{{_.cls(classPrefix + '__column', [_this.getTreeClass(leafLevel - level, treeOptions.length)])}} {{prefix}}-class" wx:for="{{treeOptions}}" wx:key="level" wx:for-index="level" scrollIntoView="{{scrollIntoView && scrollIntoView[level] ? '.scroll-into-view >>> #scroll-to-' + scrollIntoView[level] : '' }}"><t-side-bar wx:if="{{level == 0}}" value="{{innerValue[level]}}" bind:change="onRootChange" t-class="{{classPrefix}}-column {{prefix}}-class-left-column"><t-side-bar-item wx:for="{{treeOptions[level]}}" wx:key="index" label="{{item.label}}" value="{{item.value}}" disabled="{{item.disabled}}" tId="scroll-to-{{item.value}}" class="scroll-into-view" t-class="{{prefix}}-class-left-item"/></t-side-bar><block wx:elif="{{level != leafLevel}}"><view wx:for="{{treeOptions[level]}}" wx:key="value" bind:tap="handleTreeClick" data-level="{{level}}" data-value="{{item.value}}" class="{{_.cls(classPrefix + '__item', [['active', item.value === innerValue[level]], ['disabled', item.disabled]])}} {{prefix}}-class-middle-item scroll-into-view"><view id="scroll-to-{{item.value}}">{{item.label}}</view></view></block><t-radio-group wx:elif="{{!multiple}}" class="{{classPrefix}}__radio {{prefix}}-class-right-column" data-level="{{level}}" data-type="single" value="{{innerValue[level]}}" bind:change="handleChange"><t-radio wx:for="{{treeOptions[level]}}" wx:key="value" tId="scroll-to-{{item.value}}" class="scroll-into-view {{classPrefix}}__radio-item {{prefix}}-class-right-item" t-class-label="{{prefix}}-class-right-item-label" icon="line" value="{{item.value}}" disabled="{{item.disabled}}" maxLabelRow="{{1}}" borderless placement="right">{{item.label}}</t-radio></t-radio-group><t-checkbox-group wx:else class="{{classPrefix}}__checkbox {{prefix}}-class-right-column" value="{{innerValue[level] || []}}" data-level="{{level}}" data-type="multiple" bind:change="handleChange"><t-checkbox wx:for="{{treeOptions[level]}}" wx:key="value" tId="scroll-to-{{item.value}}" class="scroll-into-view {{prefix}}-class-right-item" t-class-label="{{prefix}}-class-right-item-label" placement="right" icon="line" maxLabelRow="{{1}}" value="{{item.value}}" disabled="{{item.disabled}}" borderless>{{item.label}}</t-checkbox></t-checkbox-group></t-scroll-view><slot name="content"/></view>

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/tree-select.wxss

@@ -0,0 +1,9 @@
+@import '../common/style/index.wxss';.t-tree-select{display:flex;background-color:var(--td-tree-bg-color,var(--td-bg-color-container,var(--td-font-white-1,#fff)));}
+.t-tree-select__column{width:var(--td-tree-colum-width,206rpx);color:var(--td-tree-colum-text-color,var(--td-text-color-primary,var(--td-font-gray-1,rgba(0,0,0,.9))));}
+.t-tree-select__column--left{background:var(--td-tree-root-bg-color,var(--td-bg-color-secondarycontainer,var(--td-gray-color-1,#f3f3f3)));}
+.t-tree-select__column--right{flex:1;}
+.t-tree-select__column::-webkit-scrollbar{display:none;width:0;height:0;color:transparent;}
+.t-tree-select__item{overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1;display:-webkit-box;-webkit-box-orient:vertical;height:var(--td-tree-item-height,112rpx);line-height:var(--td-tree-item-height,112rpx);font-size:var(--td-tree-item-font-size,32rpx);padding-left:32rpx;}
+.t-tree-select__item--active{font-weight:600;color:var(--td-tree-item-active-color,var(--td-brand-color,var(--td-primary-color-7,#0052d9)));}
+.t-tree-select__item--disabled{pointer-events:none;cursor:not-allowed;color:var(--td-tree-item-disabled-color,var(--td-text-color-disabled,var(--td-font-gray-4,rgba(0,0,0,.26))));}
+.t-tree-select-column{width:100%;height:auto;}

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/type.d.ts

@@ -0,0 +1,32 @@
+import { TreeOptionData, TreeKeysType } from '../common/common';
+export interface TdTreeSelectProps<DataOption extends TreeOptionData = TreeOptionData> {
+    customValue?: {
+        type: null;
+        value?: TreeSelectValue;
+    };
+    height?: {
+        type: null;
+        value?: string | number;
+    };
+    keys?: {
+        type: ObjectConstructor;
+        value?: TreeKeysType;
+    };
+    multiple?: {
+        type: BooleanConstructor;
+        value?: boolean;
+    };
+    options?: {
+        type: ArrayConstructor;
+        value?: Array<DataOption>;
+    };
+    value?: {
+        type: null;
+        value?: TreeSelectValue;
+    };
+    defaultValue?: {
+        type: null;
+        value?: TreeSelectValue;
+    };
+}
+export declare type TreeSelectValue = string | number | Array<TreeSelectValue>;

miniprogram/miniprogram_npm/tdesign-miniprogram/tree-select/type.js

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