first commit
This commit is contained in:
215
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/button.js
vendored
Normal file
215
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/button.js
vendored
Normal file
@@ -0,0 +1,215 @@
|
||||
"use strict";
|
||||
const uni_modules_tdesignUniapp_components_common_src_instantiationDecorator = require("../common/src/instantiationDecorator.js");
|
||||
const uni_modules_tdesignUniapp_components_common_config = require("../common/config.js");
|
||||
const uni_modules_tdesignUniapp_components_button_props = require("./props.js");
|
||||
const uni_modules_tdesignUniapp_components_common_utils = require("../common/utils.js");
|
||||
const uni_modules_tdesignUniapp_components_common_utils_wxs = require("../common/utils.wxs.js");
|
||||
const common_vendor = require("../../../../common/vendor.js");
|
||||
const TIcon = () => "../icon/icon.js";
|
||||
const TLoading = () => "../loading/loading.js";
|
||||
const name = `${uni_modules_tdesignUniapp_components_common_config.prefix}-button`;
|
||||
const _sfc_main = uni_modules_tdesignUniapp_components_common_src_instantiationDecorator.uniComponent({
|
||||
name,
|
||||
options: {
|
||||
styleIsolation: "shared"
|
||||
},
|
||||
externalClasses: [
|
||||
`${uni_modules_tdesignUniapp_components_common_config.prefix}-class`,
|
||||
`${uni_modules_tdesignUniapp_components_common_config.prefix}-class-icon`,
|
||||
`${uni_modules_tdesignUniapp_components_common_config.prefix}-class-loading`
|
||||
],
|
||||
components: {
|
||||
TIcon,
|
||||
TLoading
|
||||
},
|
||||
props: {
|
||||
...uni_modules_tdesignUniapp_components_button_props.props
|
||||
},
|
||||
emits: [
|
||||
"click"
|
||||
],
|
||||
data() {
|
||||
return {
|
||||
tools: uni_modules_tdesignUniapp_components_common_utils_wxs.tools,
|
||||
prefix: uni_modules_tdesignUniapp_components_common_config.prefix,
|
||||
className: "",
|
||||
classPrefix: name,
|
||||
_icon: void 0
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
iconCustomStyle() {
|
||||
const fontSize = {
|
||||
"extra-small": "var(--td-button-extra-small-icon-font-size, 18px)",
|
||||
small: "var(--td-button-small-icon-font-size, 18px)",
|
||||
medium: "var(--td-button-medium-icon-font-size, 20px)",
|
||||
large: "var(--td-button-large-icon-font-size, 24px)"
|
||||
};
|
||||
return uni_modules_tdesignUniapp_components_common_utils_wxs.tools._style([
|
||||
{
|
||||
fontSize: fontSize[this.size || "medium"],
|
||||
borderRadius: "var(--td-button-icon-border-radius, 4px)"
|
||||
},
|
||||
this._icon.style || ""
|
||||
]);
|
||||
},
|
||||
loadingCustomStyle() {
|
||||
return uni_modules_tdesignUniapp_components_common_utils_wxs.tools._style({
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center"
|
||||
});
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
icon: {
|
||||
handler(value) {
|
||||
this._icon = uni_modules_tdesignUniapp_components_common_utils.calcIcon(value, "");
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
theme: "setClass",
|
||||
size: "setClass",
|
||||
plain: "setClass",
|
||||
block: "setClass",
|
||||
shape: "setClass",
|
||||
disabled: "setClass",
|
||||
loading: "setClass",
|
||||
variant: "setClass"
|
||||
},
|
||||
mounted() {
|
||||
this.setClass();
|
||||
},
|
||||
methods: {
|
||||
setClass() {
|
||||
const t = [
|
||||
name,
|
||||
this.tClass,
|
||||
`${name}--${this.variant || "base"}`,
|
||||
`${name}--${this.theme || "default"}`,
|
||||
`${name}--${this.shape || "rectangle"}`,
|
||||
`${name}--size-${this.size || "medium"}`
|
||||
];
|
||||
if (this.block) {
|
||||
t.push(`${name}--block`);
|
||||
}
|
||||
if (this.disabled) {
|
||||
t.push(`${name}--disabled`);
|
||||
}
|
||||
if (this.ghost) {
|
||||
t.push(`${name}--ghost`);
|
||||
}
|
||||
this.className = t.join(" ");
|
||||
},
|
||||
getuserinfo(t) {
|
||||
this.$emit("getuserinfo", t);
|
||||
},
|
||||
contact(t) {
|
||||
this.$emit("contact", t);
|
||||
},
|
||||
getphonenumber(t) {
|
||||
this.$emit("getphonenumber", t);
|
||||
},
|
||||
error(t) {
|
||||
this.$emit("error", t);
|
||||
},
|
||||
opensetting(t) {
|
||||
this.$emit("opensetting", t);
|
||||
},
|
||||
launchapp(t) {
|
||||
this.$emit("launchapp", t);
|
||||
},
|
||||
chooseavatar(t) {
|
||||
this.$emit("chooseavatar", t);
|
||||
},
|
||||
agreeprivacyauthorization(t) {
|
||||
this.$emit("agreeprivacyauthorization", t);
|
||||
},
|
||||
handleTap(t) {
|
||||
if (this.disabled || this.loading)
|
||||
return;
|
||||
this.$emit("click", t);
|
||||
}
|
||||
}
|
||||
});
|
||||
if (!Array) {
|
||||
const _easycom_t_icon2 = common_vendor.resolveComponent("t-icon");
|
||||
const _easycom_t_loading2 = common_vendor.resolveComponent("t-loading");
|
||||
(_easycom_t_icon2 + _easycom_t_loading2)();
|
||||
}
|
||||
const _easycom_t_icon = () => "../icon/icon.js";
|
||||
const _easycom_t_loading = () => "../loading/loading.js";
|
||||
if (!Math) {
|
||||
(_easycom_t_icon + _easycom_t_loading)();
|
||||
}
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: _ctx._icon
|
||||
}, _ctx._icon ? {
|
||||
b: common_vendor.o(($event) => "handleClose"),
|
||||
c: common_vendor.p({
|
||||
["custom-style"]: _ctx.iconCustomStyle,
|
||||
["t-class"]: _ctx.classPrefix + "__icon " + _ctx.classPrefix + "__icon--" + (_ctx._icon.activeIdx == _ctx._icon.index ? "active " : " ") + _ctx.tClassIcon,
|
||||
prefix: _ctx._icon.prefix,
|
||||
name: _ctx._icon.name || "",
|
||||
size: _ctx._icon.size,
|
||||
color: _ctx._icon.color
|
||||
})
|
||||
} : {}, {
|
||||
d: _ctx.loading
|
||||
}, _ctx.loading ? {
|
||||
e: common_vendor.p({
|
||||
delay: _ctx.loadingProps.delay || 0,
|
||||
duration: _ctx.loadingProps.duration || 800,
|
||||
indicator: _ctx.loadingProps.indicator || true,
|
||||
["inherit-color"]: _ctx.loadingProps.inheritColor || true,
|
||||
layout: _ctx.loadingProps.layout || "horizontal",
|
||||
pause: _ctx.loadingProps.pause || false,
|
||||
progress: _ctx.loadingProps.progress || 0,
|
||||
reverse: _ctx.loadingProps.reverse || false,
|
||||
size: _ctx.loadingProps.size || "40rpx",
|
||||
text: _ctx.loadingProps.text || "",
|
||||
theme: _ctx.loadingProps.theme || "circular",
|
||||
loading: true,
|
||||
["t-class"]: _ctx.classPrefix + "__loading " + _ctx.classPrefix + "__loading--wrapper",
|
||||
["t-class-indicator"]: _ctx.classPrefix + "__loading--indicator " + _ctx.tClassLoading,
|
||||
["custom-style"]: _ctx.loadingCustomStyle
|
||||
})
|
||||
} : {}, {
|
||||
f: _ctx.content
|
||||
}, _ctx.content ? {
|
||||
g: common_vendor.t(_ctx.content)
|
||||
} : {}, {
|
||||
h: common_vendor.n(_ctx.classPrefix + "__content " + ((_ctx._icon && _ctx._icon.name || _ctx.loading) && _ctx.content ? _ctx.classPrefix + "__content--has-icon" : "")),
|
||||
i: _ctx.tId,
|
||||
j: common_vendor.s(_ctx.tools._style([_ctx.customStyle])),
|
||||
k: _ctx.customDataset,
|
||||
l: common_vendor.n(_ctx.className),
|
||||
m: _ctx.disabled || _ctx.loading ? "" : _ctx.type,
|
||||
n: _ctx.disabled || _ctx.loading ? "" : _ctx.openType,
|
||||
o: _ctx.hoverStopPropagation,
|
||||
p: _ctx.hoverStartTime,
|
||||
q: _ctx.hoverStayTime,
|
||||
r: _ctx.lang,
|
||||
s: _ctx.sessionFrom,
|
||||
t: _ctx.disabled || _ctx.loading ? "" : _ctx.hoverClass || _ctx.classPrefix + "--hover",
|
||||
v: _ctx.sendMessageTitle,
|
||||
w: _ctx.sendMessagePath,
|
||||
x: _ctx.sendMessageImg,
|
||||
y: _ctx.appParameter,
|
||||
z: _ctx.showMessageCard,
|
||||
A: _ctx.ariaLabel,
|
||||
B: common_vendor.o((...args) => _ctx.handleTap && _ctx.handleTap(...args)),
|
||||
C: common_vendor.o((...args) => _ctx.getuserinfo && _ctx.getuserinfo(...args)),
|
||||
D: common_vendor.o((...args) => _ctx.contact && _ctx.contact(...args)),
|
||||
E: common_vendor.o((...args) => _ctx.getphonenumber && _ctx.getphonenumber(...args)),
|
||||
F: common_vendor.o((...args) => _ctx.error && _ctx.error(...args)),
|
||||
G: common_vendor.o((...args) => _ctx.opensetting && _ctx.opensetting(...args)),
|
||||
H: common_vendor.o((...args) => _ctx.launchapp && _ctx.launchapp(...args)),
|
||||
I: common_vendor.o((...args) => _ctx.chooseavatar && _ctx.chooseavatar(...args)),
|
||||
J: common_vendor.o((...args) => _ctx.agreeprivacyauthorization && _ctx.agreeprivacyauthorization(...args))
|
||||
});
|
||||
}
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-ad58069f"]]);
|
||||
wx.createComponent(Component);
|
||||
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/tdesign-uniapp/components/button/button.js.map
|
||||
7
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/button.json
vendored
Normal file
7
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/button.json
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"t-icon": "../icon/icon",
|
||||
"t-loading": "../loading/loading"
|
||||
}
|
||||
}
|
||||
1
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/button.wxml
vendored
Normal file
1
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/button.wxml
vendored
Normal file
@@ -0,0 +1 @@
|
||||
<button id="{{i}}" style="{{j}}" data-custom="{{k}}" class="{{['data-v-ad58069f', l]}}" form-type="{{m}}" open-type="{{n}}" hover-stop-propagation="{{o}}" hover-start-time="{{p}}" hover-stay-time="{{q}}" lang="{{r}}" session-from="{{s}}" hover-class="{{t}}" send-message-title="{{v}}" send-message-path="{{w}}" send-message-img="{{x}}" app-parameter="{{y}}" show-message-card="{{z}}" aria-label="{{A}}" catchtap="{{B}}" bindgetuserinfo="{{C}}" bindcontact="{{D}}" bindgetphonenumber="{{E}}" binderror="{{F}}" bindopensetting="{{G}}" bindlaunchapp="{{H}}" bindchooseavatar="{{I}}" bindagreeprivacyauthorization="{{J}}"><block wx:if="{{a}}" name="icon"><t-icon wx:if="{{c}}" class="data-v-ad58069f" bindclick="{{b}}" u-i="ad58069f-0" bind:__l="__l" u-p="{{c}}"/></block><t-loading wx:if="{{d}}" class="data-v-ad58069f" u-i="ad58069f-1" bind:__l="__l" u-p="{{e}}"/><view class="{{['data-v-ad58069f', h]}}"><slot name="content"/><block wx:if="{{f}}">{{g}}</block><slot/></view><slot name="suffix"/></button>
|
||||
525
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/button.wxss
vendored
Normal file
525
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/button.wxss
vendored
Normal file
@@ -0,0 +1,525 @@
|
||||
.t-button--size-extra-small.data-v-ad58069f {
|
||||
font-size: var(--td-button-extra-small-font-size, var(--td-font-size-base, 28rpx));
|
||||
padding-left: var(--td-button-extra-small-padding-horizontal, 16rpx);
|
||||
padding-right: var(--td-button-extra-small-padding-horizontal, 16rpx);
|
||||
height: var(--td-button-extra-small-height, 56rpx);
|
||||
line-height: var(--td-button-extra-small-height, 56rpx);
|
||||
}
|
||||
.t-button--size-extra-small .t-button__icon.data-v-ad58069f {
|
||||
font-size: var(--td-button-extra-small-icon-size, 36rpx);
|
||||
}
|
||||
.t-button--size-small.data-v-ad58069f {
|
||||
font-size: var(--td-button-small-font-size, var(--td-font-size-base, 28rpx));
|
||||
padding-left: var(--td-button-small-padding-horizontal, 24rpx);
|
||||
padding-right: var(--td-button-small-padding-horizontal, 24rpx);
|
||||
height: var(--td-button-small-height, 64rpx);
|
||||
line-height: var(--td-button-small-height, 64rpx);
|
||||
}
|
||||
.t-button--size-small .t-button__icon.data-v-ad58069f {
|
||||
font-size: var(--td-button-small-icon-size, 36rpx);
|
||||
}
|
||||
.t-button--size-medium.data-v-ad58069f {
|
||||
font-size: var(--td-button-medium-font-size, var(--td-font-size-m, 32rpx));
|
||||
padding-left: var(--td-button-medium-padding-horizontal, 32rpx);
|
||||
padding-right: var(--td-button-medium-padding-horizontal, 32rpx);
|
||||
height: var(--td-button-medium-height, 80rpx);
|
||||
line-height: var(--td-button-medium-height, 80rpx);
|
||||
}
|
||||
.t-button--size-medium .t-button__icon.data-v-ad58069f {
|
||||
font-size: var(--td-button-medium-icon-size, 40rpx);
|
||||
}
|
||||
.t-button--size-large.data-v-ad58069f {
|
||||
font-size: var(--td-button-large-font-size, var(--td-font-size-m, 32rpx));
|
||||
padding-left: var(--td-button-large-padding-horizontal, 40rpx);
|
||||
padding-right: var(--td-button-large-padding-horizontal, 40rpx);
|
||||
height: var(--td-button-large-height, 96rpx);
|
||||
line-height: var(--td-button-large-height, 96rpx);
|
||||
}
|
||||
.t-button--size-large .t-button__icon.data-v-ad58069f {
|
||||
font-size: var(--td-button-large-icon-size, 48rpx);
|
||||
}
|
||||
.t-button--default.data-v-ad58069f {
|
||||
color: var(--td-button-default-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
|
||||
background-color: var(--td-button-default-bg-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
|
||||
border-color: var(--td-button-default-border-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
|
||||
}
|
||||
.t-button--default.data-v-ad58069f::after {
|
||||
border-width: var(--td-button-border-width, 4rpx);
|
||||
border-color: var(--td-button-default-border-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
|
||||
}
|
||||
.t-button--default.t-button--hover.data-v-ad58069f {
|
||||
z-index: 0;
|
||||
}
|
||||
.t-button--default.t-button--hover.data-v-ad58069f,
|
||||
.t-button--default.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-default-active-bg-color, var(--td-bg-color-component-active, var(--td-gray-color-6, #a6a6a6)));
|
||||
border-color: var(--td-button-default-active-border-color, var(--td-bg-color-component-active, var(--td-gray-color-6, #a6a6a6)));
|
||||
}
|
||||
.t-button--default.t-button--disabled.data-v-ad58069f {
|
||||
color: var(--td-button-default-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
|
||||
background-color: var(--td-button-default-disabled-bg, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
|
||||
}
|
||||
.t-button--default.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--default.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-default-disabled-border-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
|
||||
}
|
||||
.t-button--primary.data-v-ad58069f {
|
||||
color: var(--td-button-primary-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
|
||||
background-color: var(--td-button-primary-bg-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
border-color: var(--td-button-primary-border-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
}
|
||||
.t-button--primary.data-v-ad58069f::after {
|
||||
border-width: var(--td-button-border-width, 4rpx);
|
||||
border-color: var(--td-button-primary-border-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
}
|
||||
.t-button--primary.t-button--hover.data-v-ad58069f {
|
||||
z-index: 0;
|
||||
}
|
||||
.t-button--primary.t-button--hover.data-v-ad58069f,
|
||||
.t-button--primary.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-primary-active-bg-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
|
||||
border-color: var(--td-button-primary-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
|
||||
}
|
||||
.t-button--primary.t-button--disabled.data-v-ad58069f {
|
||||
color: var(--td-button-primary-disabled-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
|
||||
background-color: var(--td-button-primary-disabled-bg, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
}
|
||||
.t-button--primary.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--primary.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-primary-disabled-border-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
}
|
||||
.t-button--light.data-v-ad58069f {
|
||||
color: var(--td-button-light-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
background-color: var(--td-button-light-bg-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
|
||||
border-color: var(--td-button-light-border-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
|
||||
}
|
||||
.t-button--light.data-v-ad58069f::after {
|
||||
border-width: var(--td-button-border-width, 4rpx);
|
||||
border-color: var(--td-button-light-border-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
|
||||
}
|
||||
.t-button--light.t-button--hover.data-v-ad58069f {
|
||||
z-index: 0;
|
||||
}
|
||||
.t-button--light.t-button--hover.data-v-ad58069f,
|
||||
.t-button--light.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-light-active-bg-color, var(--td-brand-color-light-active, var(--td-primary-color-2, #d9e1ff)));
|
||||
border-color: var(--td-button-light-active-border-color, var(--td-brand-color-light-active, var(--td-primary-color-2, #d9e1ff)));
|
||||
}
|
||||
.t-button--light.t-button--disabled.data-v-ad58069f {
|
||||
color: var(--td-button-light-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
background-color: var(--td-button-light-disabled-bg, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
|
||||
}
|
||||
.t-button--light.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--light.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-light-disabled-border-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
|
||||
}
|
||||
.t-button--danger.data-v-ad58069f {
|
||||
color: var(--td-button-danger-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
|
||||
background-color: var(--td-button-danger-bg-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
|
||||
border-color: var(--td-button-danger-border-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
|
||||
}
|
||||
.t-button--danger.data-v-ad58069f::after {
|
||||
border-width: var(--td-button-border-width, 4rpx);
|
||||
border-color: var(--td-button-danger-border-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
|
||||
}
|
||||
.t-button--danger.t-button--hover.data-v-ad58069f {
|
||||
z-index: 0;
|
||||
}
|
||||
.t-button--danger.t-button--hover.data-v-ad58069f,
|
||||
.t-button--danger.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-danger-active-bg-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
|
||||
border-color: var(--td-button-danger-active-border-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
|
||||
}
|
||||
.t-button--danger.t-button--disabled.data-v-ad58069f {
|
||||
color: var(--td-button-danger-disabled-color, var(--td-font-white-1, #ffffff));
|
||||
background-color: var(--td-button-danger-disabled-bg, var(--td-error-color-3, #ffb9b0));
|
||||
}
|
||||
.t-button--danger.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--danger.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-danger-disabled-border-color, var(--td-error-color-3, #ffb9b0));
|
||||
}
|
||||
.t-button.data-v-ad58069f {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
background-image: none;
|
||||
transition: all 0.3s;
|
||||
touch-action: manipulation;
|
||||
border-radius: var(--td-button-border-radius, var(--td-radius-default, 12rpx));
|
||||
outline: none;
|
||||
font-family: PingFang SC, Microsoft YaHei, Arial Regular;
|
||||
font-weight: var(--td-button-font-weight, 600);
|
||||
vertical-align: top;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
/* stylelint-disable-next-line */
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
.t-button.data-v-ad58069f::after {
|
||||
border-radius: calc(var(--td-button-border-radius, var(--td-radius-default, 12rpx)) * 2);
|
||||
}
|
||||
.t-button--text.data-v-ad58069f {
|
||||
color: var(--td-button-default-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
|
||||
background-color: transparent;
|
||||
}
|
||||
.t-button--text.data-v-ad58069f,
|
||||
.t-button--text.data-v-ad58069f::after {
|
||||
border: 0;
|
||||
}
|
||||
.t-button--text.t-button--hover.data-v-ad58069f,
|
||||
.t-button--text.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-default-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
|
||||
}
|
||||
.t-button--text.t-button--primary.data-v-ad58069f {
|
||||
color: var(--td-button-primary-text-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
background-color: transparent;
|
||||
}
|
||||
.t-button--text.t-button--primary.t-button--hover.data-v-ad58069f,
|
||||
.t-button--text.t-button--primary.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-primary-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
|
||||
}
|
||||
.t-button--text.t-button--primary.t-button--disabled.data-v-ad58069f {
|
||||
color: var(--td-button-primary-text-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
|
||||
}
|
||||
.t-button--text.t-button--danger.data-v-ad58069f {
|
||||
color: var(--td-button-danger-text-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
|
||||
background-color: transparent;
|
||||
}
|
||||
.t-button--text.t-button--danger.t-button--hover.data-v-ad58069f,
|
||||
.t-button--text.t-button--danger.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-danger-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
|
||||
}
|
||||
.t-button--text.t-button--danger.t-button--disabled.data-v-ad58069f {
|
||||
color: var(--td-button-danger-text-disabled-color, var(--td-button-danger-disabled-color, var(--td-font-white-1, #ffffff)));
|
||||
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
|
||||
}
|
||||
.t-button--text.t-button--light.data-v-ad58069f {
|
||||
color: var(--td-button-light-text-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
background-color: transparent;
|
||||
}
|
||||
.t-button--text.t-button--light.t-button--hover.data-v-ad58069f,
|
||||
.t-button--text.t-button--light.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-light-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
|
||||
}
|
||||
.t-button--text.t-button--disabled.data-v-ad58069f {
|
||||
color: var(--td-button-default-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
|
||||
}
|
||||
.t-button--outline.data-v-ad58069f {
|
||||
color: var(--td-button-default-outline-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
|
||||
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
|
||||
}
|
||||
.t-button--outline.data-v-ad58069f,
|
||||
.t-button--outline.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-default-outline-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
|
||||
}
|
||||
.t-button--outline.t-button--hover.data-v-ad58069f,
|
||||
.t-button--outline.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-default-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
|
||||
border-color: var(--td-button-default-outline-active-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
|
||||
}
|
||||
.t-button--outline.t-button--disabled.data-v-ad58069f {
|
||||
color: var(--td-button-default-outline-disabled-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
|
||||
}
|
||||
.t-button--outline.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--outline.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-default-outline-disabled-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
|
||||
}
|
||||
.t-button--outline.t-button--primary.data-v-ad58069f {
|
||||
color: var(--td-button-primary-outline-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
}
|
||||
.t-button--outline.t-button--primary.data-v-ad58069f,
|
||||
.t-button--outline.t-button--primary.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-primary-outline-border-color, var(--td-button-primary-outline-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9))));
|
||||
}
|
||||
.t-button--outline.t-button--primary.t-button--hover.data-v-ad58069f {
|
||||
color: var(--td-button-primary-outline-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
|
||||
}
|
||||
.t-button--outline.t-button--primary.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-primary-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
|
||||
border-color: var(--td-button-primary-outline-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
|
||||
}
|
||||
.t-button--outline.t-button--primary.t-button--disabled.data-v-ad58069f {
|
||||
background-color: transparent;
|
||||
color: var(--td-button-primary-outline-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
}
|
||||
.t-button--outline.t-button--primary.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--outline.t-button--primary.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-primary-outline-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
}
|
||||
.t-button--outline.t-button--danger.data-v-ad58069f {
|
||||
color: var(--td-button-danger-outline-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
|
||||
}
|
||||
.t-button--outline.t-button--danger.data-v-ad58069f,
|
||||
.t-button--outline.t-button--danger.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-danger-outline-border-color, var(--td-button-danger-outline-color, var(--td-error-color, var(--td-error-color-6, #d54941))));
|
||||
}
|
||||
.t-button--outline.t-button--danger.t-button--hover.data-v-ad58069f {
|
||||
color: var(--td-button-danger-outline-active-border-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
|
||||
}
|
||||
.t-button--outline.t-button--danger.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-danger-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
|
||||
border-color: var(--td-button-danger-outline-active-border-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
|
||||
}
|
||||
.t-button--outline.t-button--danger.t-button--disabled.data-v-ad58069f {
|
||||
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
|
||||
color: var(--td-button-danger-outline-disabled-color, var(--td-error-color-3, #ffb9b0));
|
||||
}
|
||||
.t-button--outline.t-button--danger.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--outline.t-button--danger.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-danger-outline-disabled-color, var(--td-error-color-3, #ffb9b0));
|
||||
}
|
||||
.t-button--outline.t-button--light.data-v-ad58069f {
|
||||
color: var(--td-button-light-outline-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
background-color: var(--td-button-light-outline-bg-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
|
||||
}
|
||||
.t-button--outline.t-button--light.data-v-ad58069f,
|
||||
.t-button--outline.t-button--light.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-light-outline-border-color, var(--td-button-light-outline-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9))));
|
||||
}
|
||||
.t-button--outline.t-button--light.t-button--hover.data-v-ad58069f {
|
||||
color: var(--td-button-light-outline-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
|
||||
}
|
||||
.t-button--outline.t-button--light.t-button--hover.data-v-ad58069f,
|
||||
.t-button--outline.t-button--light.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-light-outline-active-bg-color, var(--td-brand-color-light-active, var(--td-primary-color-2, #d9e1ff)));
|
||||
border-color: var(--td-button-light-outline-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
|
||||
}
|
||||
.t-button--outline.t-button--light.t-button--disabled.data-v-ad58069f {
|
||||
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
|
||||
color: var(--td-button-light-outline-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
}
|
||||
.t-button--outline.t-button--light.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--outline.t-button--light.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-light-outline-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
}
|
||||
.t-button--dashed.data-v-ad58069f {
|
||||
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
|
||||
border-style: dashed;
|
||||
border-width: 2rpx;
|
||||
}
|
||||
.t-button--dashed.data-v-ad58069f::after {
|
||||
border: 0;
|
||||
}
|
||||
.t-button--dashed.t-button--hover.data-v-ad58069f,
|
||||
.t-button--dashed.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-button-default-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
|
||||
border-color: var(--td-button-default-outline-active-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
|
||||
}
|
||||
.t-button--dashed.t-button--primary.data-v-ad58069f {
|
||||
color: var(--td-button-primary-dashed-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
}
|
||||
.t-button--dashed.t-button--primary.data-v-ad58069f,
|
||||
.t-button--dashed.t-button--primary.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-primary-dashed-border-color, var(--td-button-primary-dashed-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9))));
|
||||
}
|
||||
.t-button--dashed.t-button--primary.t-button--disabled.data-v-ad58069f {
|
||||
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
|
||||
color: var(--td-button-primary-dashed-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
}
|
||||
.t-button--dashed.t-button--primary.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--dashed.t-button--primary.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-primary-dashed-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
|
||||
}
|
||||
.t-button--dashed.t-button--danger.data-v-ad58069f {
|
||||
color: var(--td-button-danger-dashed-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
|
||||
}
|
||||
.t-button--dashed.t-button--danger.data-v-ad58069f,
|
||||
.t-button--dashed.t-button--danger.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-danger-dashed-border-color, var(--td-button-danger-dashed-color, var(--td-error-color, var(--td-error-color-6, #d54941))));
|
||||
}
|
||||
.t-button--dashed.t-button--danger.t-button--disabled.data-v-ad58069f {
|
||||
background-color: transparent;
|
||||
color: var(--td-button-danger-dashed-disabled-color, var(--td-button-danger-disabled-color, var(--td-font-white-1, #ffffff)));
|
||||
}
|
||||
.t-button--dashed.t-button--danger.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-danger-dashed-disabled-color, var(--td-button-danger-disabled-color, var(--td-font-white-1, #ffffff)));
|
||||
}
|
||||
.t-button--ghost.data-v-ad58069f {
|
||||
background-color: transparent;
|
||||
color: var(--td-button-ghost-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
|
||||
}
|
||||
.t-button--ghost.data-v-ad58069f,
|
||||
.t-button--ghost.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-ghost-border-color, var(--td-button-ghost-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff))));
|
||||
}
|
||||
.t-button--ghost.t-button--default.t-button--hover.data-v-ad58069f {
|
||||
color: var(--td-button-ghost-hover-color, var(--td-font-white-2, rgba(255, 255, 255, 0.55)));
|
||||
}
|
||||
.t-button--ghost.t-button--default.t-button--hover.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--default.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: transparent;
|
||||
border-color: var(--td-button-ghost-hover-color, var(--td-font-white-2, rgba(255, 255, 255, 0.55)));
|
||||
}
|
||||
.t-button--ghost.t-button--primary.data-v-ad58069f {
|
||||
color: var(--td-button-ghost-primary-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
}
|
||||
.t-button--ghost.t-button--primary.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--primary.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-ghost-primary-border-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
||||
}
|
||||
.t-button--ghost.t-button--primary.t-button--hover.data-v-ad58069f {
|
||||
color: var(--td-button-ghost-primary-hover-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
|
||||
}
|
||||
.t-button--ghost.t-button--primary.t-button--hover.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--primary.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: transparent;
|
||||
border-color: var(--td-button-ghost-primary-hover-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
|
||||
}
|
||||
.t-button--ghost.t-button--primary.t-button--text.t-button--hover.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--primary.t-button--text.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-gray-color-10, #4b4b4b);
|
||||
}
|
||||
.t-button--ghost.t-button--primary.t-button--disabled.data-v-ad58069f {
|
||||
background-color: transparent;
|
||||
color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
|
||||
}
|
||||
.t-button--ghost.t-button--primary.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--primary.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
|
||||
}
|
||||
.t-button--ghost.t-button--danger.data-v-ad58069f {
|
||||
color: var(--td-button-ghost-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
|
||||
}
|
||||
.t-button--ghost.t-button--danger.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--danger.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-ghost-danger-border-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
|
||||
}
|
||||
.t-button--ghost.t-button--danger.t-button--hover.data-v-ad58069f {
|
||||
color: var(--td-button-ghost-danger-hover-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
|
||||
}
|
||||
.t-button--ghost.t-button--danger.t-button--hover.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--danger.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: transparent;
|
||||
border-color: var(--td-button-ghost-danger-hover-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
|
||||
}
|
||||
.t-button--ghost.t-button--danger.t-button--text.t-button--hover.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--danger.t-button--text.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-gray-color-10, #4b4b4b);
|
||||
}
|
||||
.t-button--ghost.t-button--danger.t-button--disabled.data-v-ad58069f {
|
||||
background-color: transparent;
|
||||
color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
|
||||
}
|
||||
.t-button--ghost.t-button--danger.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--danger.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
|
||||
}
|
||||
.t-button--ghost.t-button--default.t-button--text.t-button--hover.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--default.t-button--text.t-button--hover.data-v-ad58069f::after {
|
||||
background-color: var(--td-gray-color-10, #4b4b4b);
|
||||
}
|
||||
.t-button--ghost.t-button--default.t-button--disabled.data-v-ad58069f {
|
||||
background-color: transparent;
|
||||
color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
|
||||
}
|
||||
.t-button--ghost.t-button--default.t-button--disabled.data-v-ad58069f,
|
||||
.t-button--ghost.t-button--default.t-button--disabled.data-v-ad58069f::after {
|
||||
border-color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
|
||||
}
|
||||
.t-button__loading + .t-button__content.data-v-ad58069f:not(:empty),
|
||||
.t-button__icon + .t-button__content.data-v-ad58069f:not(:empty) {
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
.t-button__icon.data-v-ad58069f {
|
||||
border-radius: var(--td-button-icon-border-radius, 8rpx);
|
||||
}
|
||||
.t-button--round.t-button--size-large.data-v-ad58069f {
|
||||
border-radius: calc(var(--td-button-large-height, 96rpx) / 2);
|
||||
}
|
||||
.t-button--round.t-button--size-large.data-v-ad58069f::after {
|
||||
border-radius: var(--td-button-large-height, 96rpx);
|
||||
}
|
||||
.t-button--round.t-button--size-medium.data-v-ad58069f {
|
||||
border-radius: calc(var(--td-button-medium-height, 80rpx) / 2);
|
||||
}
|
||||
.t-button--round.t-button--size-medium.data-v-ad58069f::after {
|
||||
border-radius: var(--td-button-medium-height, 80rpx);
|
||||
}
|
||||
.t-button--round.t-button--size-small.data-v-ad58069f {
|
||||
border-radius: calc(var(--td-button-small-height, 64rpx) / 2);
|
||||
}
|
||||
.t-button--round.t-button--size-small.data-v-ad58069f::after {
|
||||
border-radius: var(--td-button-small-height, 64rpx);
|
||||
}
|
||||
.t-button--round.t-button--size-extra-small.data-v-ad58069f {
|
||||
border-radius: calc(var(--td-button-extra-small-height, 56rpx) / 2);
|
||||
}
|
||||
.t-button--round.t-button--size-extra-small.data-v-ad58069f::after {
|
||||
border-radius: var(--td-button-extra-small-height, 56rpx);
|
||||
}
|
||||
.t-button--square.data-v-ad58069f {
|
||||
padding: 0;
|
||||
}
|
||||
.t-button--square.t-button--size-large.data-v-ad58069f {
|
||||
width: var(--td-button-large-height, 96rpx);
|
||||
}
|
||||
.t-button--square.t-button--size-medium.data-v-ad58069f {
|
||||
width: var(--td-button-medium-height, 80rpx);
|
||||
}
|
||||
.t-button--square.t-button--size-small.data-v-ad58069f {
|
||||
width: var(--td-button-small-height, 64rpx);
|
||||
}
|
||||
.t-button--square.t-button--size-extra-small.data-v-ad58069f {
|
||||
width: var(--td-button-extra-small-height, 56rpx);
|
||||
}
|
||||
.t-button--circle.data-v-ad58069f {
|
||||
padding: 0;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.t-button--circle.t-button--size-large.data-v-ad58069f {
|
||||
width: var(--td-button-large-height, 96rpx);
|
||||
}
|
||||
.t-button--circle.t-button--size-large.data-v-ad58069f::after {
|
||||
border-radius: 50%;
|
||||
}
|
||||
.t-button--circle.t-button--size-medium.data-v-ad58069f {
|
||||
width: var(--td-button-medium-height, 80rpx);
|
||||
}
|
||||
.t-button--circle.t-button--size-medium.data-v-ad58069f::after {
|
||||
border-radius: 50%;
|
||||
}
|
||||
.t-button--circle.t-button--size-small.data-v-ad58069f {
|
||||
width: var(--td-button-small-height, 64rpx);
|
||||
}
|
||||
.t-button--circle.t-button--size-small.data-v-ad58069f::after {
|
||||
border-radius: 50%;
|
||||
}
|
||||
.t-button--circle.t-button--size-extra-small.data-v-ad58069f {
|
||||
width: var(--td-button-extra-small-height, 56rpx);
|
||||
}
|
||||
.t-button--circle.t-button--size-extra-small.data-v-ad58069f::after {
|
||||
border-radius: 50%;
|
||||
}
|
||||
.t-button--block.data-v-ad58069f {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
.t-button--disabled.data-v-ad58069f {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.t-button__loading--wrapper.data-v-ad58069f {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.t-button.t-button--hover.data-v-ad58069f::after {
|
||||
z-index: -1;
|
||||
}
|
||||
.data-v-ad58069f .t-button__loading + .t-button__content:not(:empty) {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.data-v-ad58069f .t-button__icon + .t-button__content:not(:empty) {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.t-button.data-v-ad58069f {
|
||||
/* support my-alipay */
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
210
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/props.js
vendored
Normal file
210
unpackage/dist/dev/mp-weixin/uni_modules/tdesign-uniapp/components/button/props.js
vendored
Normal file
@@ -0,0 +1,210 @@
|
||||
"use strict";
|
||||
const props = {
|
||||
/** 打开 APP 时,向 APP 传递的参数,open-type=launchApp时有效 */
|
||||
appParameter: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
/** 是否为块级元素 */
|
||||
block: Boolean,
|
||||
/** 按钮内容 */
|
||||
content: {
|
||||
type: String
|
||||
},
|
||||
/** 自定义 dataset,可通过 event.currentTarget.dataset.custom 获取 */
|
||||
customDataset: {
|
||||
type: [String, Number, Boolean, Object, Array],
|
||||
default: () => ({})
|
||||
},
|
||||
/** 禁用状态。优先级:Button.disabled > Form.disabled */
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: void 0
|
||||
},
|
||||
/** 是否为幽灵按钮(镂空按钮) */
|
||||
ghost: Boolean,
|
||||
/** 指定按钮按下去的样式类,按钮不为加载或禁用状态时有效。当 `hover-class="none"` 时,没有点击态效果 */
|
||||
hoverClass: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
/** 按住后多久出现点击态,单位毫秒 */
|
||||
hoverStartTime: {
|
||||
type: Number,
|
||||
default: 20
|
||||
},
|
||||
/** 手指松开后点击态保留时间,单位毫秒 */
|
||||
hoverStayTime: {
|
||||
type: Number,
|
||||
default: 70
|
||||
},
|
||||
/** 指定是否阻止本节点的祖先节点出现点击态 */
|
||||
hoverStopPropagation: Boolean,
|
||||
/** 图标名称。值为字符串表示图标名称,值为 `Object` 类型,表示透传至 `icon` */
|
||||
icon: {
|
||||
type: [String, Object]
|
||||
},
|
||||
/** 指定返回用户信息的语言,zh_CN 简体中文,zh_TW 繁体中文,en 英文。<br />具体释义:<br />`en` 英文;<br />`zh_CN` 简体中文;<br />`zh_TW` 繁体中文。<br />[小程序官方文档](https://developers.weixin.qq.com/miniprogram/dev/component/button.html) */
|
||||
lang: {
|
||||
type: String,
|
||||
validator(val) {
|
||||
if (!val)
|
||||
return true;
|
||||
return ["en", "zh_CN", "zh_TW"].includes(val);
|
||||
}
|
||||
},
|
||||
/** 是否显示为加载状态 */
|
||||
loading: Boolean,
|
||||
/** 透传 Loading 组件全部属性 */
|
||||
loadingProps: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 微信开放能力。<br />具体释义:<br />`contact` 打开客服会话,如果用户在会话中点击消息卡片后返回小程序,可以从 bindcontact 回调中获得具体信息,<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/customer-message/customer-message.html">具体说明</a> (*鸿蒙 OS 暂不支持*);<br />`liveActivity` 通过前端获取<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/subscribe-message-2.html">新的一次性订阅消息下发机制</a>使用的 code;<br />`share` 触发用户转发,使用前建议先阅读<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share.html#使用指引">使用指引</a>;<br />`getPhoneNumber` 获取用户手机号,可以从 bindgetphonenumber 回调中获取到用户信息,<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html">具体说明</a> (*小程序插件中不能使用*);<br />`getUserInfo` 获取用户信息,可以从 bindgetuserinfo 回调中获取到用户信息 (*小程序插件中不能使用*);<br />`launchApp` 打开APP,可以通过 app-parameter 属性设定向 APP 传的参数<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/launchApp.html">具体说明</a>;<br />`openSetting` 打开授权设置页;<br />`feedback` 打开“意见反馈”页面,用户可提交反馈内容并上传<a href="https://developers.weixin.qq.com/miniprogram/dev/api/base/debug/wx.getLogManager.html">日志</a>,开发者可以登录<a href="https://mp.weixin.qq.com/">小程序管理后台</a>后进入左侧菜单“客服反馈”页面获取到反馈内容;<br />`chooseAvatar` 获取用户头像,可以从 bindchooseavatar 回调中获取到头像信息;<br />`agreePrivacyAuthorization`用户同意隐私协议按钮。用户点击一次此按钮后,所有隐私接口可以正常调用。可通过`bindagreeprivacyauthorization`监听用户同意隐私协议事件。隐私合规开发指南详情可见《<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/user-privacy/PrivacyAuthorize.html">小程序隐私协议开发指南</a>》。<br />[小程序官方文档](https://developers.weixin.qq.com/miniprogram/dev/component/button.html) */
|
||||
openType: {
|
||||
type: String,
|
||||
validator(val) {
|
||||
if (!val)
|
||||
return true;
|
||||
return ["contact", "share", "getPhoneNumber", "getUserInfo", "launchApp", "openSetting", "feedback", "chooseAvatar", "agreePrivacyAuthorization"].includes(val);
|
||||
}
|
||||
},
|
||||
/** 原生按钮属性,当手机号快速验证或手机号实时验证额度用尽时,是否对用户展示“申请获取你的手机号,但该功能使用次数已达当前小程序上限,暂时无法使用”的提示,默认展示,open-type="getPhoneNumber" 或 open-type="getRealtimePhoneNumber" 时有效 */
|
||||
phoneNumberNoQuotaToast: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
/** 会话内消息卡片图片,open-type="contact"时有效 */
|
||||
sendMessageImg: {
|
||||
type: String,
|
||||
default: "截图"
|
||||
},
|
||||
/** 会话内消息卡片点击跳转小程序路径,open-type="contact"时有效 */
|
||||
sendMessagePath: {
|
||||
type: String,
|
||||
default: "当前分享路径"
|
||||
},
|
||||
/** 会话内消息卡片标题,open-type="contact"时有效 */
|
||||
sendMessageTitle: {
|
||||
type: String,
|
||||
default: "当前标题"
|
||||
},
|
||||
/** 会话来源,open-type="contact"时有效 */
|
||||
sessionFrom: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
/** 按钮形状,有 4 种:长方形、正方形、圆角长方形、圆形 */
|
||||
shape: {
|
||||
type: String,
|
||||
default: "rectangle",
|
||||
validator(val) {
|
||||
if (!val)
|
||||
return true;
|
||||
return ["rectangle", "square", "round", "circle"].includes(val);
|
||||
}
|
||||
},
|
||||
/** 是否显示会话内消息卡片,设置此参数为 true,用户进入客服会话会在右下角显示"可能要发送的小程序"提示,用户点击后可以快速发送小程序消息,open-type="contact"时有效 */
|
||||
showMessageCard: Boolean,
|
||||
/** 组件尺寸 */
|
||||
size: {
|
||||
type: String,
|
||||
default: "medium",
|
||||
validator(val) {
|
||||
if (!val)
|
||||
return true;
|
||||
return ["extra-small", "small", "medium", "large"].includes(val);
|
||||
}
|
||||
},
|
||||
/** 按钮标签id */
|
||||
tId: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
/** 组件风格,依次为品牌色、危险色 */
|
||||
theme: {
|
||||
type: String,
|
||||
default: "default",
|
||||
validator(val) {
|
||||
if (!val)
|
||||
return true;
|
||||
return ["default", "primary", "danger", "light"].includes(val);
|
||||
}
|
||||
},
|
||||
/** 同小程序的 formType */
|
||||
type: {
|
||||
type: String,
|
||||
validator(val) {
|
||||
if (!val)
|
||||
return true;
|
||||
return ["submit", "reset"].includes(val);
|
||||
}
|
||||
},
|
||||
/** 按钮形式,基础、线框、虚线、文字 */
|
||||
variant: {
|
||||
type: String,
|
||||
default: "base",
|
||||
validator(val) {
|
||||
if (!val)
|
||||
return true;
|
||||
return ["base", "outline", "dashed", "text"].includes(val);
|
||||
}
|
||||
},
|
||||
/** 原生按钮属性,用户同意隐私协议事件回调,open-type=agreePrivacyAuthorization时有效 (Tips: 如果使用 onNeedPrivacyAuthorization 接口,需要在 bindagreeprivacyauthorization 触发后再调用 resolve({ event: "agree", buttonId })) */
|
||||
onAgreeprivacyauthorization: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 原生按钮属性,获取用户头像回调,`open-type=chooseAvatar` 时有效。返回 `e.detail.avatarUrl` 为头像临时文件链接 */
|
||||
onChooseavatar: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 点击时触发 */
|
||||
onClick: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 原生按钮属性,客服消息回调,`open-type="contact"` 时有效 */
|
||||
onContact: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 新的一次性订阅消息下发机制回调,`open-type=liveActivity` 时有效 */
|
||||
onCreateliveactivity: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 原生按钮属性,当使用开放能力时,发生错误的回调,`open-type=launchApp` 时有效 */
|
||||
onError: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 原生按钮属性,手机号快速验证回调,open-type=getPhoneNumber时有效。Tips:在触发 bindgetphonenumber 回调后应立即隐藏手机号按钮组件,或置为 disabled 状态,避免用户重复授权手机号产生额外费用 */
|
||||
onGetphonenumber: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 原生按钮属性,手机号实时验证回调,open-type=getRealtimePhoneNumber 时有效。Tips:在触发 bindgetrealtimephonenumber 回调后应立即隐藏手机号按钮组件,或置为 disabled 状态,避免用户重复授权手机号产生额外费用 */
|
||||
onGetrealtimephonenumber: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 原生按钮属性,用户点击该按钮时,会返回获取到的用户信息,回调的detail数据与wx.getUserInfo返回的一致,open-type="getUserInfo"时有效 */
|
||||
onGetuserinfo: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 打开 APP 成功的回调,`open-type=launchApp` 时有效 */
|
||||
onLaunchapp: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
},
|
||||
/** 原生按钮属性,在打开授权设置页后回调,open-type=openSetting时有效 */
|
||||
onOpensetting: {
|
||||
type: Function,
|
||||
default: () => ({})
|
||||
}
|
||||
};
|
||||
exports.props = props;
|
||||
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/tdesign-uniapp/components/button/props.js.map
|
||||
Reference in New Issue
Block a user