白色主题

This commit is contained in:
2023-02-12 19:04:01 +08:00
parent d736a5912f
commit 57ab6fbb49
411 changed files with 1752 additions and 5304 deletions

View File

@@ -11,7 +11,7 @@ const props = {
type: Number,
value: 5,
},
customStyle: {
style: {
type: String,
value: '',
},

View File

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
import { SuperComponent, wxComponent } from '../common/src/index';
import config from '../common/config';
import props from './props';
import { unitConvert } from '../common/utils';
import { unitConvert, getRect } from '../common/utils';
const { prefix } = config;
const name = `${prefix}-rate`;
let Rate = class Rate extends SuperComponent {
@@ -35,10 +35,7 @@ let Rate = class Rate extends SuperComponent {
const { count, allowHalf, gap, value: currentValue, size } = this.properties;
const [touch] = e.touches;
const margin = unitConvert(gap);
const selQuery = this.createSelectorQuery();
selQuery
.select(`.${name}__wrapper`)
.boundingClientRect((rect) => {
getRect(this, `.${name}__wrapper`).then((rect) => {
const { width, left } = rect;
const starWidth = (width - (count - 1) * margin) / count;
const offsetX = touch.pageX - left;
@@ -57,15 +54,14 @@ let Rate = class Rate extends SuperComponent {
this.setData({
tipsVisible: true,
actionType: eventType,
scaleIndex: eventType === 'move' ? Math.ceil(value) : -1,
scaleIndex: Math.ceil(value),
tipsLeft: Math.max(left, 0),
});
}
if (value !== currentValue) {
this._trigger('change', { value });
}
})
.exec();
});
},
onTap(e) {
this.onTouch(e, 'tap');
@@ -86,7 +82,7 @@ let Rate = class Rate extends SuperComponent {
if (actionType === 'move')
return;
this._trigger('change', { value });
setTimeout(() => this.setData({ tipsVisible: false }), 300);
setTimeout(() => this.setData({ tipsVisible: false, scaleIndex: -1 }), 300);
},
};
}

View File

@@ -13,7 +13,7 @@
<t-icon
wx:for="{{ count }}"
wx:key="*this"
class="{{classPrefix }}__icon {{utils.getIconClass(classPrefix + '__icon', defaultValue, value, index, allowHalf, disabled, scaleIndex)}} "
class="{{classPrefix }}__icon {{utils.getIconClass(classPrefix + '__icon', defaultValue, value, index, allowHalf, disabled, scaleIndex)}}"
t-class="{{prefix}}-class-icon"
name="{{utils.getIconName(defaultValue, value, index, variant, icon)}}"
size="{{ size }}"
@@ -24,32 +24,48 @@
>{{utils.getText(texts,value,defaultTexts)}}</text
>
<view wx:if="{{tipsVisible}}" class="{{classPrefix}}__tips" style="left: {{tipsLeft}}px">
<block wx:if="{{actionType == 'tap'}}">
<view
wx:if="{{allowHalf}}"
class="{{_.cls(classPrefix + '__tips-item', [['active', utils.ceil(value) - 0.5 == value]])}}"
bind:tap="onSelect"
data-value="{{utils.ceil(value) - 0.5}}"
>
<t-icon
class="{{classPrefix }}__icon {{classPrefix }}__icon--selected-half"
name="{{utils.getIconName(defaultValue, value, index, variant, icon)}}"
size="{{ size }}"
style="{{utils.getColor(color)}}"
/>
<view class="{{classPrefix}}__tips-text">{{utils.ceil(value) - 0.5}}</view>
</view>
<view
class="{{_.cls(classPrefix + '__tips-item', [['active', utils.ceil(value) == value]])}}"
bind:tap="onSelect"
data-value="{{utils.ceil(value)}}"
>
<t-icon
class="{{_.cls(classPrefix + '__icon', ['selected'])}}"
name="{{utils.getIconName(defaultValue, value, index, 'filled', icon)}}"
size="{{ size }}"
style="{{utils.getColor(color)}}"
/>
<view class="{{classPrefix}}__tips-text">{{utils.ceil(value)}}</view>
</view>
</block>
<view
wx:if="{{allowHalf && actionType == 'tap'}}"
class="{{_.cls(classPrefix + '__tips-item', [['active', utils.ceil(value) - 0.5 == value]])}}"
bind:tap="onSelect"
data-value="{{utils.ceil(value) - 0.5}}"
>
<t-icon
class="{{classPrefix }}__icon {{classPrefix }}__icon--selected"
name="{{utils.getIconName(defaultValue, value, index, variant, icon)}}"
size="{{ size }}"
style="{{utils.getColor(color)}}"
/>
<view class="{{classPrefix}}__tips-text">{{utils.ceil(value) - 0.5}}</view>
</view>
<view
wx:else
class="{{_.cls(classPrefix + '__tips-item', [['active', utils.ceil(value) == value && actionType == 'tap']])}}"
bind:tap="onSelect"
data-value="{{utils.ceil(value)}}"
>
<t-icon
class="{{classPrefix }}__icon {{classPrefix }}__icon--selected"
class="{{_.cls(classPrefix + '__icon', [['selected', utils.ceil(value) == value], ['selected-half', utils.ceil(value) != value]]) }}"
name="{{utils.getIconName(defaultValue, value, index, 'filled', icon)}}"
size="{{ size }}"
style="{{utils.getColor(color)}}"
style="{{utils.getColor(color)}}; font-size: {{size}};"
/>
<view class="{{classPrefix}}__tips-text">{{actionType == 'tap' ? utils.ceil(value) : value}}</view>
<view class="{{classPrefix}}__tips-text">{{value}}</view>
</view>
</view>
</view>

View File

@@ -33,6 +33,9 @@ module.exports = {
}
} else if (allowHalf && curVal - index > 0) {
className.push(classPrefix + '--selected-half');
if (scaleIndex === index + 1) {
className.push(classPrefix + '--current');
}
if (disabled) {
className.push(classPrefix + '--disabled-half');
}

View File

@@ -36,7 +36,9 @@
display: inline-flex;
}
.t-rate__icon {
display: block;
line-height: 1em;
width: 1em;
transition: transform 0.3s ease;
}
.t-rate__icon--current {
@@ -76,6 +78,9 @@
transform: translateX(-50%);
}
.t-rate__tips-item {
display: flex;
flex-direction: column;
align-items: center;
width: 64rpx;
border-radius: 6rpx;
}

View File

@@ -11,7 +11,7 @@ export interface TdRateProps {
type: NumberConstructor;
value?: number;
};
customStyle?: {
style?: {
type: StringConstructor;
value?: string;
};