taro-ui-vue3
Version:
Taro UI Rewritten in Vue 3.0
244 lines (243 loc) • 8 kB
JavaScript
var __defProp = Object.defineProperty;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {enumerable: true, configurable: true, writable: true, value}) : obj[key] = value;
var __objSpread = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(b)) {
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
import {h, defineComponent, computed, mergeProps, warn} from "vue";
import {Button, View, Form} from "@tarojs/components";
import AtLoading from "../loading/index";
import {getEnvs} from "../utils/common";
import Taro from "@tarojs/taro";
const SIZE_CLASS = {
normal: "normal",
small: "small"
};
const TYPE_CLASS = {
primary: "primary",
secondary: "secondary"
};
const AtButton = defineComponent({
name: "AtButton",
components: {
AtLoading
},
props: {
size: {
type: String,
default: "normal",
validator: (prop) => ["normal", "small"].includes(prop)
},
type: {
type: String,
default: "",
validator: (prop) => ["primary", "secondary", ""].includes(prop)
},
circle: Boolean,
full: Boolean,
loading: Boolean,
disabled: Boolean,
onClick: Function,
formType: {
type: String,
default: "",
validator: (prop) => ["submit", "reset", ""].includes(prop)
},
openType: {
type: String,
validator: (prop) => [
"contact",
"contactShare",
"share",
"getRealnameAuthInfo",
"getAuthorize",
"getPhoneNumber",
"getUserInfo",
"lifestyle",
"launchApp",
"openSetting",
"feedback"
].includes(prop)
},
lang: {
type: String,
default: "en"
},
sessionFrom: String,
sendMessageTitle: String,
sendMessagePath: String,
sendMessageImg: String,
showMessageCard: Boolean,
appParameter: String,
scope: String,
onGetUserInfo: Function,
onGetAuthorize: Function,
onContact: Function,
onGetPhoneNumber: Function,
onGetRealnameAuthInfo: Function,
onError: Function,
onOpenSetting: Function,
onLaunchapp: Function
},
setup(props, {attrs, slots}) {
const {isWEAPP, isALIPAY, isWEB} = getEnvs();
const rootClasses = computed(() => ({
[`at-button--${SIZE_CLASS[props.size]}`]: SIZE_CLASS[props.size],
[`at-button--${props.type}`]: TYPE_CLASS[props.type ? props.type : ""],
"at-button--circle": props.circle,
"at-button--disabled": props.disabled,
"at-button--full": props.full,
"at-button--icon": props.loading,
"at-button": true
}));
const loadingColor = computed(() => props.type === "primary" ? "#fff" : "");
const loadingSize = computed(() => props.size === "small" ? "30" : "0");
function handleClick(event) {
var _a;
if (Boolean(attrs["onTap"])) {
warn("AtButton \u7ED1\u5B9A\u7684\u70B9\u51FB\u4E8B\u4EF6\u5E94\u4E3A `click`\uFF0C \u800C\u975E `tap`\u3002", '\u6B63\u786E\u793A\u4F8B\uFF1A`<at-button @click="eventHandler"/>`');
}
if (!props.disabled) {
(_a = props.onClick) == null ? void 0 : _a.call(props, event);
}
}
function handleGetUserInfo(event) {
var _a;
warn("2021 \u5E74 4 \u6708 13 \u65E5\u540E\u53D1\u5E03\u7684\u65B0\u7248\u672C\u5C0F\u7A0B\u5E8F\uFF0C", '\u5F00\u53D1\u8005\u8C03\u7528 `wx.getUserInfo` \u6216 `<button open-type="getUserInfo"/>` \u5C06\u4E0D\u518D\u5F39\u51FA\u5F39\u7A97\uFF0C', "\u76F4\u63A5\u8FD4\u56DE\u533F\u540D\u7684\u7528\u6237\u4E2A\u4EBA\u4FE1\u606F\u3002", "\u8BE6\u60C5\u89C1\uFF1Ahttps://developers.weixin.qq.com/community/develop/doc/000cacfa20ce88df04cb468bc52801?idescene=6&page=10,", "\u8BF7\u4F7F\u7528 `getUserProfile` \u8FDB\u884C\u9002\u914D\u3002");
(_a = props.onGetUserInfo) == null ? void 0 : _a.call(props, event);
}
function handleGetPhoneNumber(event) {
var _a;
(_a = props.onGetPhoneNumber) == null ? void 0 : _a.call(props, event);
}
function handleOpenSetting(event) {
var _a;
(_a = props.onOpenSetting) == null ? void 0 : _a.call(props, event);
}
function handleError(event) {
var _a;
(_a = props.onError) == null ? void 0 : _a.call(props, event);
}
function handleContact(event) {
var _a;
(_a = props.onContact) == null ? void 0 : _a.call(props, event);
}
function handleLaunchapp(event) {
var _a;
(_a = props.onLaunchapp) == null ? void 0 : _a.call(props, event);
}
function handleGetRealNameAuthInfo(event) {
var _a;
(_a = props.onGetRealnameAuthInfo) == null ? void 0 : _a.call(props, event);
}
function handleGetAuthorize(event) {
var _a;
(_a = props.onGetAuthorize) == null ? void 0 : _a.call(props, event);
}
function handleSubmit(event) {
if (isWEAPP || isWEB) {
Taro.eventCenter.trigger("submit", event.detail, {
bubbles: true,
composed: true
});
}
}
function handleReset(event) {
if (isWEAPP || isWEB) {
Taro.eventCenter.trigger("reset", event.detail, {
bubbles: true,
composed: true
});
}
}
function getWxButtonProps() {
if (!props.openType)
return {};
const wxButtonProps = {};
switch (props.openType) {
case "contact":
wxButtonProps.onContact = handleContact;
break;
case "openSetting":
wxButtonProps.onOpensetting = handleOpenSetting;
break;
case "getPhoneNumber":
wxButtonProps.onGetphonenumber = handleGetPhoneNumber;
break;
case "getUserInfo":
wxButtonProps.onGetuserinfo = handleGetUserInfo;
break;
case "getAuthorize":
wxButtonProps.onGetauthorize = handleGetAuthorize;
break;
case "launchApp":
wxButtonProps.onLaunchapp = handleLaunchapp;
wxButtonProps.onError = handleError;
break;
default:
break;
}
return wxButtonProps;
}
const webButton = h(Button, {
class: "at-button__wxbutton",
lang: props.lang,
formType: props.formType === "submit" || props.formType === "reset" ? props.formType : void 0
});
const miniAppButton = h(Button, __objSpread({
class: "at-button__wxbutton",
formType: props.formType,
openType: props.openType,
lang: props.lang,
sessionFrom: props.sessionFrom,
sendMessageTitle: props.sendMessageTitle,
sendMessagePath: props.sendMessagePath,
sendMessageImg: props.sendMessageImg,
showMessageCard: props.showMessageCard,
appParameter: props.appParameter
}, getWxButtonProps()));
return () => h(View, mergeProps(attrs, {
class: rootClasses.value,
onTap: handleClick
}), {
default: () => [
isWEB && !props.disabled && webButton,
isWEAPP && !props.disabled && h(Form, {
onSubmit: handleSubmit,
onReset: handleReset
}, {default: () => [miniAppButton]}),
isALIPAY && !props.disabled && miniAppButton,
props.loading && h(View, {
class: "at-button__icon"
}, {
default: () => [
h(AtLoading, {
color: loadingColor.value,
size: loadingSize.value
})
]
}),
h(View, {
class: "at-button__text"
}, {default: () => {
var _a;
return (_a = slots.default) == null ? void 0 : _a.call(slots);
}})
]
});
}
});
var button_default = AtButton;
export {
button_default as default
};