init
This commit is contained in:
shuhongfan
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,63 @@
|
||||
"use strict";
|
||||
var uni_modules_uniIcons_components_uniIcons_icons = require("./icons.js");
|
||||
var common_vendor = require("../../../../common/vendor.js");
|
||||
const getVal = (val) => {
|
||||
const reg = /^[0-9]*$/g;
|
||||
return typeof val === "number" || reg.test(val) ? val + "px" : val;
|
||||
};
|
||||
const _sfc_main = {
|
||||
name: "UniIcons",
|
||||
emits: ["click"],
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: "#333333"
|
||||
},
|
||||
size: {
|
||||
type: [Number, String],
|
||||
default: 16
|
||||
},
|
||||
customPrefix: {
|
||||
type: String,
|
||||
default: ""
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
icons: uni_modules_uniIcons_components_uniIcons_icons.icons.glyphs
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
unicode() {
|
||||
let code = this.icons.find((v) => v.font_class === this.type);
|
||||
if (code) {
|
||||
return unescape(`%u${code.unicode}`);
|
||||
}
|
||||
return "";
|
||||
},
|
||||
iconSize() {
|
||||
return getVal(this.size);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
_onClick() {
|
||||
this.$emit("click");
|
||||
}
|
||||
}
|
||||
};
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return {
|
||||
a: $props.color,
|
||||
b: $options.iconSize,
|
||||
c: common_vendor.n("uniui-" + $props.type),
|
||||
d: common_vendor.n($props.customPrefix),
|
||||
e: common_vendor.n($props.customPrefix ? $props.type : ""),
|
||||
f: common_vendor.o((...args) => $options._onClick && $options._onClick(...args))
|
||||
};
|
||||
}
|
||||
var Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "E:/project/project-wl-yonghuduan-uniapp-vue3/uni_modules/uni-icons/components/uni-icons/uni-icons.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<text style="{{'color:' + a + ';' + ('font-size:' + b)}}" class="{{['uni-icons', c, d, e]}}" bindtap="{{f}}"></text>
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,22 @@
|
||||
"use strict";
|
||||
var en = {
|
||||
"uni-load-more.contentdown": "Pull up to show more",
|
||||
"uni-load-more.contentrefresh": "loading...",
|
||||
"uni-load-more.contentnomore": "No more data"
|
||||
};
|
||||
var zhHans = {
|
||||
"uni-load-more.contentdown": "\u4E0A\u62C9\u663E\u793A\u66F4\u591A",
|
||||
"uni-load-more.contentrefresh": "\u6B63\u5728\u52A0\u8F7D...",
|
||||
"uni-load-more.contentnomore": "\u6CA1\u6709\u66F4\u591A\u6570\u636E\u4E86"
|
||||
};
|
||||
var zhHant = {
|
||||
"uni-load-more.contentdown": "\u4E0A\u62C9\u986F\u793A\u66F4\u591A",
|
||||
"uni-load-more.contentrefresh": "\u6B63\u5728\u52A0\u8F09...",
|
||||
"uni-load-more.contentnomore": "\u6C92\u6709\u66F4\u591A\u6578\u64DA\u4E86"
|
||||
};
|
||||
var messages = {
|
||||
en,
|
||||
"zh-Hans": zhHans,
|
||||
"zh-Hant": zhHant
|
||||
};
|
||||
exports.messages = messages;
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<view class="uni-load-more" bindtap="{{q}}"><view wx:if="{{a}}" style="{{'width:' + h + ';' + ('height:' + i)}}" class="uni-load-more__img uni-load-more__img--android-MP"><view class="uni-load-more__img-icon" style="{{'border-top-color:' + b + ';' + ('border-top-width:' + c)}}"></view><view class="uni-load-more__img-icon" style="{{'border-top-color:' + d + ';' + ('border-top-width:' + e)}}"></view><view class="uni-load-more__img-icon" style="{{'border-top-color:' + f + ';' + ('border-top-width:' + g)}}"></view></view><view wx:elif="{{j}}" style="{{'width:' + l + ';' + ('height:' + m)}}" class="uni-load-more__img uni-load-more__img--ios-H5"><image src="{{k}}" mode="widthFix"></image></view><text wx:if="{{n}}" class="uni-load-more__text" style="{{'color:' + p}}">{{o}}</text></view>
|
||||
@@ -0,0 +1,156 @@
|
||||
/* 水平间距 */
|
||||
/* 水平间距 */
|
||||
.uni-load-more {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 40px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.uni-load-more__text {
|
||||
font-size: 14px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.uni-load-more__img {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
.uni-load-more__img--nvue {
|
||||
color: #666666;
|
||||
}
|
||||
.uni-load-more__img--android,
|
||||
.uni-load-more__img--ios {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
.uni-load-more__img--android {
|
||||
animation: loading-ios 1s 0s linear infinite;
|
||||
}
|
||||
@keyframes loading-android {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
.uni-load-more__img--ios-H5 {
|
||||
position: relative;
|
||||
animation: loading-ios-H5 1s 0s step-end infinite;
|
||||
}
|
||||
.uni-load-more__img--ios-H5 image {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
@keyframes loading-ios-H5 {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
8% {
|
||||
transform: rotate(30deg);
|
||||
}
|
||||
16% {
|
||||
transform: rotate(60deg);
|
||||
}
|
||||
24% {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
32% {
|
||||
transform: rotate(120deg);
|
||||
}
|
||||
40% {
|
||||
transform: rotate(150deg);
|
||||
}
|
||||
48% {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
56% {
|
||||
transform: rotate(210deg);
|
||||
}
|
||||
64% {
|
||||
transform: rotate(240deg);
|
||||
}
|
||||
73% {
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
82% {
|
||||
transform: rotate(300deg);
|
||||
}
|
||||
91% {
|
||||
transform: rotate(330deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
.uni-load-more__img--android-MP {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
transform: rotate(0deg);
|
||||
animation: loading-ios 1s 0s ease infinite;
|
||||
}
|
||||
.uni-load-more__img--android-MP .uni-load-more__img-icon {
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
border: solid 2px transparent;
|
||||
border-top: solid 2px #777777;
|
||||
transform-origin: center;
|
||||
}
|
||||
.uni-load-more__img--android-MP .uni-load-more__img-icon:nth-child(1) {
|
||||
animation: loading-android-MP-1 1s 0s linear infinite;
|
||||
}
|
||||
.uni-load-more__img--android-MP .uni-load-more__img-icon:nth-child(2) {
|
||||
animation: loading-android-MP-2 1s 0s linear infinite;
|
||||
}
|
||||
.uni-load-more__img--android-MP .uni-load-more__img-icon:nth-child(3) {
|
||||
animation: loading-android-MP-3 1s 0s linear infinite;
|
||||
}
|
||||
@keyframes loading-android {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes loading-android-MP-1 {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes loading-android-MP-2 {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes loading-android-MP-3 {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,143 @@
|
||||
"use strict";
|
||||
var common_vendor = require("../../../../common/vendor.js");
|
||||
const _sfc_main = {
|
||||
name: "UniNumberBox",
|
||||
emits: ["change", "input", "update:modelValue", "blur", "focus"],
|
||||
props: {
|
||||
value: {
|
||||
type: [Number, String],
|
||||
default: 1
|
||||
},
|
||||
modelValue: {
|
||||
type: [Number, String],
|
||||
default: 1
|
||||
},
|
||||
min: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
max: {
|
||||
type: Number,
|
||||
default: 100
|
||||
},
|
||||
step: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
background: {
|
||||
type: String,
|
||||
default: "#f5f5f5"
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: "#333"
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
inputValue: 0
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
value(val) {
|
||||
this.inputValue = +val;
|
||||
},
|
||||
modelValue(val) {
|
||||
this.inputValue = +val;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.value === 1) {
|
||||
this.inputValue = +this.modelValue;
|
||||
}
|
||||
if (this.modelValue === 1) {
|
||||
this.inputValue = +this.value;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
_calcValue(type) {
|
||||
if (this.disabled) {
|
||||
return;
|
||||
}
|
||||
const scale = this._getDecimalScale();
|
||||
let value = this.inputValue * scale;
|
||||
let step = this.step * scale;
|
||||
if (type === "minus") {
|
||||
value -= step;
|
||||
if (value < this.min * scale) {
|
||||
return;
|
||||
}
|
||||
if (value > this.max * scale) {
|
||||
value = this.max * scale;
|
||||
}
|
||||
}
|
||||
if (type === "plus") {
|
||||
value += step;
|
||||
if (value > this.max * scale) {
|
||||
return;
|
||||
}
|
||||
if (value < this.min * scale) {
|
||||
value = this.min * scale;
|
||||
}
|
||||
}
|
||||
this.inputValue = (value / scale).toFixed(String(scale).length - 1);
|
||||
this.$emit("change", +this.inputValue);
|
||||
this.$emit("input", +this.inputValue);
|
||||
this.$emit("update:modelValue", +this.inputValue);
|
||||
},
|
||||
_getDecimalScale() {
|
||||
let scale = 1;
|
||||
if (~~this.step !== this.step) {
|
||||
scale = Math.pow(10, String(this.step).split(".")[1].length);
|
||||
}
|
||||
return scale;
|
||||
},
|
||||
_onBlur(event) {
|
||||
this.$emit("blur", event);
|
||||
let value = event.detail.value;
|
||||
if (isNaN(value)) {
|
||||
this.inputValue = this.min;
|
||||
return;
|
||||
}
|
||||
value = +value;
|
||||
if (value > this.max) {
|
||||
value = this.max;
|
||||
} else if (value < this.min) {
|
||||
value = this.min;
|
||||
}
|
||||
const scale = this._getDecimalScale();
|
||||
this.inputValue = value.toFixed(String(scale).length - 1);
|
||||
this.$emit("change", +this.inputValue);
|
||||
this.$emit("input", +this.inputValue);
|
||||
this.$emit("update:modelValue", +this.inputValue);
|
||||
},
|
||||
_onFocus(event) {
|
||||
this.$emit("focus", event);
|
||||
}
|
||||
}
|
||||
};
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return {
|
||||
a: $data.inputValue <= $props.min || $props.disabled ? 1 : "",
|
||||
b: $props.color,
|
||||
c: common_vendor.o(($event) => $options._calcValue("minus")),
|
||||
d: $props.background,
|
||||
e: $props.disabled,
|
||||
f: common_vendor.o((...args) => $options._onFocus && $options._onFocus(...args)),
|
||||
g: common_vendor.o((...args) => $options._onBlur && $options._onBlur(...args)),
|
||||
h: $props.background,
|
||||
i: $props.color,
|
||||
j: $data.inputValue,
|
||||
k: common_vendor.o(($event) => $data.inputValue = $event.detail.value),
|
||||
l: $data.inputValue >= $props.max || $props.disabled ? 1 : "",
|
||||
m: $props.color,
|
||||
n: common_vendor.o(($event) => $options._calcValue("plus")),
|
||||
o: $props.background
|
||||
};
|
||||
}
|
||||
var Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "E:/project/project-wl-yonghuduan-uniapp-vue3/uni_modules/uni-number-box/components/uni-number-box/uni-number-box.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<view class="uni-numbox"><view bindtap="{{c}}" class="uni-numbox__minus uni-numbox-btns" style="{{'background:' + d}}"><text class="{{['uni-numbox--text', a && 'uni-numbox--disabled']}}" style="{{'color:' + b}}">-</text></view><input disabled="{{e}}" bindfocus="{{f}}" bindblur="{{g}}" class="uni-numbox__value" type="number" style="{{'background:' + h + ';' + ('color:' + i)}}" value="{{j}}" bindinput="{{k}}"/><view bindtap="{{n}}" class="uni-numbox__plus uni-numbox-btns" style="{{'background:' + o}}"><text class="{{['uni-numbox--text', l && 'uni-numbox--disabled']}}" style="{{'color:' + m}}">+</text></view></view>
|
||||
@@ -0,0 +1,42 @@
|
||||
/* 水平间距 */
|
||||
/* 水平间距 */
|
||||
.uni-numbox {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.uni-numbox-btns {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 8px;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.uni-numbox__value {
|
||||
margin: 0 2px;
|
||||
background-color: #f5f5f5;
|
||||
width: 40px;
|
||||
height: 26px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
border-left-width: 0;
|
||||
border-right-width: 0;
|
||||
color: #333;
|
||||
}
|
||||
.uni-numbox__minus {
|
||||
border-top-left-radius: 2px;
|
||||
border-bottom-left-radius: 2px;
|
||||
}
|
||||
.uni-numbox__plus {
|
||||
border-top-right-radius: 2px;
|
||||
border-bottom-right-radius: 2px;
|
||||
}
|
||||
.uni-numbox--text {
|
||||
line-height: 20px;
|
||||
font-size: 20px;
|
||||
font-weight: 300;
|
||||
color: #333;
|
||||
}
|
||||
.uni-numbox .uni-numbox--disabled {
|
||||
color: #c0c0c0 !important;
|
||||
}
|
||||
@@ -0,0 +1,136 @@
|
||||
"use strict";
|
||||
var uni_modules_uniPopup_components_uniPopup_popup = require("../uni-popup/popup.js");
|
||||
var common_vendor = require("../../../../common/vendor.js");
|
||||
var uni_modules_uniPopup_components_uniPopup_i18n_index = require("../uni-popup/i18n/index.js");
|
||||
const { t } = common_vendor.initVueI18n(uni_modules_uniPopup_components_uniPopup_i18n_index.messages);
|
||||
const _sfc_main = {
|
||||
name: "uniPopupDialog",
|
||||
mixins: [uni_modules_uniPopup_components_uniPopup_popup.popup],
|
||||
emits: ["confirm", "close"],
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: ""
|
||||
},
|
||||
placeholder: {
|
||||
type: [String, Number],
|
||||
default: ""
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: "error"
|
||||
},
|
||||
mode: {
|
||||
type: String,
|
||||
default: "base"
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
content: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
beforeClose: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
cancelText: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
confirmText: {
|
||||
type: String,
|
||||
default: ""
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogType: "error",
|
||||
focus: false,
|
||||
val: ""
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
okText() {
|
||||
return this.confirmText || t("uni-popup.ok");
|
||||
},
|
||||
closeText() {
|
||||
return this.cancelText || t("uni-popup.cancel");
|
||||
},
|
||||
placeholderText() {
|
||||
return this.placeholder || t("uni-popup.placeholder");
|
||||
},
|
||||
titleText() {
|
||||
return this.title || t("uni-popup.title");
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
type(val) {
|
||||
this.dialogType = val;
|
||||
},
|
||||
mode(val) {
|
||||
if (val === "input") {
|
||||
this.dialogType = "info";
|
||||
}
|
||||
},
|
||||
value(val) {
|
||||
this.val = val;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.popup.disableMask();
|
||||
if (this.mode === "input") {
|
||||
this.dialogType = "info";
|
||||
this.val = this.value;
|
||||
} else {
|
||||
this.dialogType = this.type;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.focus = true;
|
||||
},
|
||||
methods: {
|
||||
onOk() {
|
||||
if (this.mode === "input") {
|
||||
this.$emit("confirm", this.val);
|
||||
} else {
|
||||
this.$emit("confirm");
|
||||
}
|
||||
if (this.beforeClose)
|
||||
return;
|
||||
this.popup.close();
|
||||
},
|
||||
closeDialog() {
|
||||
this.$emit("close");
|
||||
if (this.beforeClose)
|
||||
return;
|
||||
this.popup.close();
|
||||
},
|
||||
close() {
|
||||
this.popup.close();
|
||||
}
|
||||
}
|
||||
};
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: common_vendor.t($options.titleText),
|
||||
b: common_vendor.n("uni-popup__" + $data.dialogType),
|
||||
c: $props.mode === "base"
|
||||
}, $props.mode === "base" ? {
|
||||
d: common_vendor.t($props.content)
|
||||
} : {
|
||||
e: $options.placeholderText,
|
||||
f: $data.focus,
|
||||
g: $data.val,
|
||||
h: common_vendor.o(($event) => $data.val = $event.detail.value)
|
||||
}, {
|
||||
i: common_vendor.t($options.closeText),
|
||||
j: common_vendor.o((...args) => $options.closeDialog && $options.closeDialog(...args)),
|
||||
k: common_vendor.t($options.okText),
|
||||
l: common_vendor.o((...args) => $options.onOk && $options.onOk(...args))
|
||||
});
|
||||
}
|
||||
var Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "E:/project/project-wl-yonghuduan-uniapp-vue3/uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<view class="uni-popup-dialog"><view class="uni-dialog-title"><text class="{{['uni-dialog-title-text', b]}}">{{a}}</text></view><view wx:if="{{c}}" class="uni-dialog-content"><block wx:if="{{$slots.d}}"><slot></slot></block><block wx:else><text class="uni-dialog-content-text">{{d}}</text></block></view><view wx:else class="uni-dialog-content"><block wx:if="{{$slots.d}}"><slot></slot></block><block wx:else><input class="uni-dialog-input" type="text" placeholder="{{e}}" focus="{{f}}" value="{{g}}" bindinput="{{h}}"></input></block></view><view class="uni-dialog-button-group"><view class="uni-dialog-button" bindtap="{{j}}"><text class="uni-dialog-button-text">{{i}}</text></view><view class="uni-dialog-button uni-border-left" bindtap="{{l}}"><text class="uni-dialog-button-text uni-button-color">{{k}}</text></view></view></view>
|
||||
@@ -0,0 +1,76 @@
|
||||
/* 水平间距 */
|
||||
/* 水平间距 */
|
||||
.uni-popup-dialog {
|
||||
width: 300px;
|
||||
border-radius: 11px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.uni-dialog-title {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-top: 25px;
|
||||
}
|
||||
.uni-dialog-title-text {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
.uni-dialog-content {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
}
|
||||
.uni-dialog-content-text {
|
||||
font-size: 14px;
|
||||
color: #6C6C6C;
|
||||
}
|
||||
.uni-dialog-button-group {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-top-color: #f5f5f5;
|
||||
border-top-style: solid;
|
||||
border-top-width: 1px;
|
||||
}
|
||||
.uni-dialog-button {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 45px;
|
||||
}
|
||||
.uni-border-left {
|
||||
border-left-color: #f0f0f0;
|
||||
border-left-style: solid;
|
||||
border-left-width: 1px;
|
||||
}
|
||||
.uni-dialog-button-text {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
}
|
||||
.uni-button-color {
|
||||
color: #007aff;
|
||||
}
|
||||
.uni-dialog-input {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
border: 1px #eee solid;
|
||||
height: 40px;
|
||||
padding: 0 10px;
|
||||
border-radius: 5px;
|
||||
color: #555;
|
||||
}
|
||||
.uni-popup__success {
|
||||
color: #4cd964;
|
||||
}
|
||||
.uni-popup__warn {
|
||||
color: #f0ad4e;
|
||||
}
|
||||
.uni-popup__error {
|
||||
color: #dd524d;
|
||||
}
|
||||
.uni-popup__info {
|
||||
color: #909399;
|
||||
}
|
||||
@@ -0,0 +1,28 @@
|
||||
"use strict";
|
||||
var en = {
|
||||
"uni-popup.cancel": "cancel",
|
||||
"uni-popup.ok": "ok",
|
||||
"uni-popup.placeholder": "pleace enter",
|
||||
"uni-popup.title": "Hint",
|
||||
"uni-popup.shareTitle": "Share to"
|
||||
};
|
||||
var zhHans = {
|
||||
"uni-popup.cancel": "\u53D6\u6D88",
|
||||
"uni-popup.ok": "\u786E\u5B9A",
|
||||
"uni-popup.placeholder": "\u8BF7\u8F93\u5165",
|
||||
"uni-popup.title": "\u63D0\u793A",
|
||||
"uni-popup.shareTitle": "\u5206\u4EAB\u5230"
|
||||
};
|
||||
var zhHant = {
|
||||
"uni-popup.cancel": "\u53D6\u6D88",
|
||||
"uni-popup.ok": "\u78BA\u5B9A",
|
||||
"uni-popup.placeholder": "\u8ACB\u8F38\u5165",
|
||||
"uni-popup.title": "\u63D0\u793A",
|
||||
"uni-popup.shareTitle": "\u5206\u4EAB\u5230"
|
||||
};
|
||||
var messages = {
|
||||
en,
|
||||
"zh-Hans": zhHans,
|
||||
"zh-Hant": zhHant
|
||||
};
|
||||
exports.messages = messages;
|
||||
@@ -0,0 +1,23 @@
|
||||
"use strict";
|
||||
var popup = {
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
created() {
|
||||
this.popup = this.getParent();
|
||||
},
|
||||
methods: {
|
||||
getParent(name = "uniPopup") {
|
||||
let parent = this.$parent;
|
||||
let parentName = parent.$options.name;
|
||||
while (parentName !== name) {
|
||||
parent = parent.$parent;
|
||||
if (!parent)
|
||||
return false;
|
||||
parentName = parent.$options.name;
|
||||
}
|
||||
return parent;
|
||||
}
|
||||
}
|
||||
};
|
||||
exports.popup = popup;
|
||||
@@ -0,0 +1,340 @@
|
||||
"use strict";
|
||||
var common_vendor = require("../../../../common/vendor.js");
|
||||
const _sfc_main = {
|
||||
name: "uniPopup",
|
||||
components: {},
|
||||
emits: ["change", "maskClick"],
|
||||
props: {
|
||||
animation: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: "center"
|
||||
},
|
||||
isMaskClick: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
maskClick: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
backgroundColor: {
|
||||
type: String,
|
||||
default: "none"
|
||||
},
|
||||
safeArea: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
maskBackgroundColor: {
|
||||
type: String,
|
||||
default: "rgba(0, 0, 0, 0.4)"
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
type: {
|
||||
handler: function(type) {
|
||||
if (!this.config[type])
|
||||
return;
|
||||
this[this.config[type]](true);
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
isDesktop: {
|
||||
handler: function(newVal) {
|
||||
if (!this.config[newVal])
|
||||
return;
|
||||
this[this.config[this.type]](true);
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
maskClick: {
|
||||
handler: function(val) {
|
||||
this.mkclick = val;
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
isMaskClick: {
|
||||
handler: function(val) {
|
||||
this.mkclick = val;
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
showPopup(show) {
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
duration: 300,
|
||||
ani: [],
|
||||
showPopup: false,
|
||||
showTrans: false,
|
||||
popupWidth: 0,
|
||||
popupHeight: 0,
|
||||
config: {
|
||||
top: "top",
|
||||
bottom: "bottom",
|
||||
center: "center",
|
||||
left: "left",
|
||||
right: "right",
|
||||
message: "top",
|
||||
dialog: "center",
|
||||
share: "bottom"
|
||||
},
|
||||
maskClass: {
|
||||
position: "fixed",
|
||||
bottom: 0,
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
backgroundColor: "rgba(0, 0, 0, 0.4)"
|
||||
},
|
||||
transClass: {
|
||||
position: "fixed",
|
||||
left: 0,
|
||||
right: 0
|
||||
},
|
||||
maskShow: true,
|
||||
mkclick: true,
|
||||
popupstyle: this.isDesktop ? "fixforpc-top" : "top"
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
isDesktop() {
|
||||
return this.popupWidth >= 500 && this.popupHeight >= 500;
|
||||
},
|
||||
bg() {
|
||||
if (this.backgroundColor === "" || this.backgroundColor === "none") {
|
||||
return "transparent";
|
||||
}
|
||||
return this.backgroundColor;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const fixSize = () => {
|
||||
const {
|
||||
windowWidth,
|
||||
windowHeight,
|
||||
windowTop,
|
||||
safeArea,
|
||||
screenHeight,
|
||||
safeAreaInsets
|
||||
} = common_vendor.index.getSystemInfoSync();
|
||||
this.popupWidth = windowWidth;
|
||||
this.popupHeight = windowHeight + (windowTop || 0);
|
||||
if (safeArea && this.safeArea) {
|
||||
this.safeAreaInsets = screenHeight - safeArea.bottom;
|
||||
} else {
|
||||
this.safeAreaInsets = 0;
|
||||
}
|
||||
};
|
||||
fixSize();
|
||||
},
|
||||
unmounted() {
|
||||
this.setH5Visible();
|
||||
},
|
||||
created() {
|
||||
if (this.isMaskClick === null && this.maskClick === null) {
|
||||
this.mkclick = true;
|
||||
} else {
|
||||
this.mkclick = this.isMaskClick !== null ? this.isMaskClick : this.maskClick;
|
||||
}
|
||||
if (this.animation) {
|
||||
this.duration = 300;
|
||||
} else {
|
||||
this.duration = 0;
|
||||
}
|
||||
this.messageChild = null;
|
||||
this.clearPropagation = false;
|
||||
this.maskClass.backgroundColor = this.maskBackgroundColor;
|
||||
},
|
||||
methods: {
|
||||
setH5Visible() {
|
||||
},
|
||||
closeMask() {
|
||||
this.maskShow = false;
|
||||
},
|
||||
disableMask() {
|
||||
this.mkclick = false;
|
||||
},
|
||||
clear(e) {
|
||||
e.stopPropagation();
|
||||
this.clearPropagation = true;
|
||||
},
|
||||
open(direction) {
|
||||
if (this.showPopup) {
|
||||
clearTimeout(this.timer);
|
||||
this.showPopup = false;
|
||||
}
|
||||
let innerType = ["top", "center", "bottom", "left", "right", "message", "dialog", "share"];
|
||||
if (!(direction && innerType.indexOf(direction) !== -1)) {
|
||||
direction = this.type;
|
||||
}
|
||||
if (!this.config[direction]) {
|
||||
console.error("\u7F3A\u5C11\u7C7B\u578B\uFF1A", direction);
|
||||
return;
|
||||
}
|
||||
this[this.config[direction]]();
|
||||
this.$emit("change", {
|
||||
show: true,
|
||||
type: direction
|
||||
});
|
||||
},
|
||||
close(type) {
|
||||
this.showTrans = false;
|
||||
this.$emit("change", {
|
||||
show: false,
|
||||
type: this.type
|
||||
});
|
||||
clearTimeout(this.timer);
|
||||
this.timer = setTimeout(() => {
|
||||
this.showPopup = false;
|
||||
}, 300);
|
||||
},
|
||||
touchstart() {
|
||||
this.clearPropagation = false;
|
||||
},
|
||||
onTap() {
|
||||
if (this.clearPropagation) {
|
||||
this.clearPropagation = false;
|
||||
return;
|
||||
}
|
||||
this.$emit("maskClick");
|
||||
if (!this.mkclick)
|
||||
return;
|
||||
this.close();
|
||||
},
|
||||
top(type) {
|
||||
this.popupstyle = this.isDesktop ? "fixforpc-top" : "top";
|
||||
this.ani = ["slide-top"];
|
||||
this.transClass = {
|
||||
position: "fixed",
|
||||
left: 0,
|
||||
right: 0,
|
||||
backgroundColor: this.bg
|
||||
};
|
||||
if (type)
|
||||
return;
|
||||
this.showPopup = true;
|
||||
this.showTrans = true;
|
||||
this.$nextTick(() => {
|
||||
if (this.messageChild && this.type === "message") {
|
||||
this.messageChild.timerClose();
|
||||
}
|
||||
});
|
||||
},
|
||||
bottom(type) {
|
||||
this.popupstyle = "bottom";
|
||||
this.ani = ["slide-bottom"];
|
||||
this.transClass = {
|
||||
position: "fixed",
|
||||
left: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
paddingBottom: this.safeAreaInsets + "px",
|
||||
backgroundColor: this.bg
|
||||
};
|
||||
if (type)
|
||||
return;
|
||||
this.showPopup = true;
|
||||
this.showTrans = true;
|
||||
},
|
||||
center(type) {
|
||||
this.popupstyle = "center";
|
||||
this.ani = ["zoom-out", "fade"];
|
||||
this.transClass = {
|
||||
position: "fixed",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
top: 0,
|
||||
justifyContent: "center",
|
||||
alignItems: "center"
|
||||
};
|
||||
if (type)
|
||||
return;
|
||||
this.showPopup = true;
|
||||
this.showTrans = true;
|
||||
},
|
||||
left(type) {
|
||||
this.popupstyle = "left";
|
||||
this.ani = ["slide-left"];
|
||||
this.transClass = {
|
||||
position: "fixed",
|
||||
left: 0,
|
||||
bottom: 0,
|
||||
top: 0,
|
||||
backgroundColor: this.bg,
|
||||
display: "flex",
|
||||
flexDirection: "column"
|
||||
};
|
||||
if (type)
|
||||
return;
|
||||
this.showPopup = true;
|
||||
this.showTrans = true;
|
||||
},
|
||||
right(type) {
|
||||
this.popupstyle = "right";
|
||||
this.ani = ["slide-right"];
|
||||
this.transClass = {
|
||||
position: "fixed",
|
||||
bottom: 0,
|
||||
right: 0,
|
||||
top: 0,
|
||||
backgroundColor: this.bg,
|
||||
display: "flex",
|
||||
flexDirection: "column"
|
||||
};
|
||||
if (type)
|
||||
return;
|
||||
this.showPopup = true;
|
||||
this.showTrans = true;
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!Array) {
|
||||
const _easycom_uni_transition2 = common_vendor.resolveComponent("uni-transition");
|
||||
_easycom_uni_transition2();
|
||||
}
|
||||
const _easycom_uni_transition = () => "../../../uni-transition/components/uni-transition/uni-transition.js";
|
||||
if (!Math) {
|
||||
_easycom_uni_transition();
|
||||
}
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: $data.showPopup
|
||||
}, $data.showPopup ? common_vendor.e({
|
||||
b: $data.maskShow
|
||||
}, $data.maskShow ? {
|
||||
c: common_vendor.o($options.onTap),
|
||||
d: common_vendor.p({
|
||||
name: "mask",
|
||||
["mode-class"]: "fade",
|
||||
styles: $data.maskClass,
|
||||
duration: $data.duration,
|
||||
show: $data.showTrans
|
||||
})
|
||||
} : {}, {
|
||||
e: $options.bg,
|
||||
f: common_vendor.n($data.popupstyle),
|
||||
g: common_vendor.o((...args) => $options.clear && $options.clear(...args)),
|
||||
h: common_vendor.o($options.onTap),
|
||||
i: common_vendor.p({
|
||||
["mode-class"]: $data.ani,
|
||||
name: "content",
|
||||
styles: $data.transClass,
|
||||
duration: $data.duration,
|
||||
show: $data.showTrans
|
||||
}),
|
||||
j: common_vendor.o((...args) => $options.touchstart && $options.touchstart(...args)),
|
||||
k: common_vendor.n($data.popupstyle),
|
||||
l: common_vendor.n($options.isDesktop ? "fixforpc-z-index" : "")
|
||||
}) : {});
|
||||
}
|
||||
var Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "E:/project/project-wl-yonghuduan-uniapp-vue3/uni_modules/uni-popup/components/uni-popup/uni-popup.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"uni-transition": "../../../uni-transition/components/uni-transition/uni-transition"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<view wx:if="{{a}}" class="{{['uni-popup', k, l]}}"><view bindtouchstart="{{j}}"><uni-transition wx:if="{{b}}" key="1" bindclick="{{c}}" u-i="1f086398-0" bind:__l="__l" u-p="{{d}}"/><uni-transition wx:if="{{i}}" u-s="{{['d']}}" key="2" bindclick="{{h}}" u-i="1f086398-1" bind:__l="__l" u-p="{{i}}"><view style="{{'background-color:' + e}}" class="{{['uni-popup__wrapper', f]}}" bindtap="{{g}}"><slot/></view></uni-transition></view></view>
|
||||
@@ -0,0 +1,24 @@
|
||||
/* 水平间距 */
|
||||
/* 水平间距 */
|
||||
.uni-popup {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
}
|
||||
.uni-popup.top, .uni-popup.left, .uni-popup.right {
|
||||
top: 0;
|
||||
}
|
||||
.uni-popup .uni-popup__wrapper {
|
||||
display: block;
|
||||
position: relative;
|
||||
/* iphonex 等安全区设置，底部安全区适配 */
|
||||
}
|
||||
.uni-popup .uni-popup__wrapper.left, .uni-popup .uni-popup__wrapper.right {
|
||||
padding-top: 0;
|
||||
flex: 1;
|
||||
}
|
||||
.fixforpc-z-index {
|
||||
z-index: 999;
|
||||
}
|
||||
.fixforpc-top {
|
||||
top: 0;
|
||||
}
|
||||
@@ -0,0 +1,19 @@
|
||||
"use strict";
|
||||
var en = {
|
||||
"uni-search-bar.cancel": "cancel",
|
||||
"uni-search-bar.placeholder": "Search enter content"
|
||||
};
|
||||
var zhHans = {
|
||||
"uni-search-bar.cancel": "cancel",
|
||||
"uni-search-bar.placeholder": "\u8BF7\u8F93\u5165\u641C\u7D22\u5185\u5BB9"
|
||||
};
|
||||
var zhHant = {
|
||||
"uni-search-bar.cancel": "cancel",
|
||||
"uni-search-bar.placeholder": "\u8ACB\u8F38\u5165\u641C\u7D22\u5167\u5BB9"
|
||||
};
|
||||
var messages = {
|
||||
en,
|
||||
"zh-Hans": zhHans,
|
||||
"zh-Hant": zhHant
|
||||
};
|
||||
exports.messages = messages;
|
||||
@@ -0,0 +1,193 @@
|
||||
"use strict";
|
||||
var common_vendor = require("../../../../common/vendor.js");
|
||||
var uni_modules_uniSearchBar_components_uniSearchBar_i18n_index = require("./i18n/index.js");
|
||||
const {
|
||||
t
|
||||
} = common_vendor.initVueI18n(uni_modules_uniSearchBar_components_uniSearchBar_i18n_index.messages);
|
||||
const _sfc_main = {
|
||||
name: "UniSearchBar",
|
||||
emits: ["input", "update:modelValue", "clear", "cancel", "confirm", "blur", "focus"],
|
||||
props: {
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
radius: {
|
||||
type: [Number, String],
|
||||
default: 5
|
||||
},
|
||||
clearButton: {
|
||||
type: String,
|
||||
default: "auto"
|
||||
},
|
||||
cancelButton: {
|
||||
type: String,
|
||||
default: "auto"
|
||||
},
|
||||
cancelText: {
|
||||
type: String,
|
||||
default: "\u53D6\u6D88"
|
||||
},
|
||||
bgColor: {
|
||||
type: String,
|
||||
default: "#F8F8F8"
|
||||
},
|
||||
maxlength: {
|
||||
type: [Number, String],
|
||||
default: 100
|
||||
},
|
||||
value: {
|
||||
type: [Number, String],
|
||||
default: ""
|
||||
},
|
||||
modelValue: {
|
||||
type: [Number, String],
|
||||
default: ""
|
||||
},
|
||||
focus: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
showSync: false,
|
||||
searchVal: ""
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
cancelTextI18n() {
|
||||
return this.cancelText || t("uni-search-bar.cancel");
|
||||
},
|
||||
placeholderText() {
|
||||
return this.placeholder || t("uni-search-bar.placeholder");
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
modelValue: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
this.searchVal = newVal;
|
||||
if (newVal) {
|
||||
this.show = true;
|
||||
}
|
||||
}
|
||||
},
|
||||
focus: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
if (newVal) {
|
||||
if (this.readonly)
|
||||
return;
|
||||
this.show = true;
|
||||
this.$nextTick(() => {
|
||||
this.showSync = true;
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
searchVal(newVal, oldVal) {
|
||||
this.$emit("input", newVal);
|
||||
this.$emit("update:modelValue", newVal);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
searchClick() {
|
||||
if (this.readonly)
|
||||
return;
|
||||
if (this.show) {
|
||||
return;
|
||||
}
|
||||
this.show = true;
|
||||
this.$nextTick(() => {
|
||||
this.showSync = true;
|
||||
});
|
||||
},
|
||||
clear() {
|
||||
this.$emit("clear", {
|
||||
value: this.searchVal
|
||||
});
|
||||
this.searchVal = "";
|
||||
},
|
||||
cancel() {
|
||||
if (this.readonly)
|
||||
return;
|
||||
this.$emit("cancel", {
|
||||
value: this.searchVal
|
||||
});
|
||||
this.searchVal = "";
|
||||
this.show = false;
|
||||
this.showSync = false;
|
||||
common_vendor.index.hideKeyboard();
|
||||
},
|
||||
confirm() {
|
||||
common_vendor.index.hideKeyboard();
|
||||
this.$emit("confirm", {
|
||||
value: this.searchVal
|
||||
});
|
||||
},
|
||||
blur() {
|
||||
common_vendor.index.hideKeyboard();
|
||||
this.$emit("blur", {
|
||||
value: this.searchVal
|
||||
});
|
||||
},
|
||||
emitFocus(e) {
|
||||
this.$emit("focus", e.detail);
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!Array) {
|
||||
const _easycom_uni_icons2 = common_vendor.resolveComponent("uni-icons");
|
||||
_easycom_uni_icons2();
|
||||
}
|
||||
const _easycom_uni_icons = () => "../../../uni-icons/components/uni-icons/uni-icons.js";
|
||||
if (!Math) {
|
||||
_easycom_uni_icons();
|
||||
}
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: common_vendor.p({
|
||||
color: "#c0c4cc",
|
||||
size: "18",
|
||||
type: "search"
|
||||
}),
|
||||
b: $data.show || $data.searchVal
|
||||
}, $data.show || $data.searchVal ? {
|
||||
c: $data.showSync,
|
||||
d: $props.readonly,
|
||||
e: $options.placeholderText,
|
||||
f: $props.maxlength,
|
||||
g: common_vendor.o((...args) => $options.confirm && $options.confirm(...args)),
|
||||
h: common_vendor.o((...args) => $options.blur && $options.blur(...args)),
|
||||
i: common_vendor.o((...args) => $options.emitFocus && $options.emitFocus(...args)),
|
||||
j: $data.searchVal,
|
||||
k: common_vendor.o(($event) => $data.searchVal = $event.detail.value)
|
||||
} : {
|
||||
l: common_vendor.t($props.placeholder)
|
||||
}, {
|
||||
m: $data.show && ($props.clearButton === "always" || $props.clearButton === "auto" && $data.searchVal !== "") && !$props.readonly
|
||||
}, $data.show && ($props.clearButton === "always" || $props.clearButton === "auto" && $data.searchVal !== "") && !$props.readonly ? {
|
||||
n: common_vendor.p({
|
||||
color: "#c0c4cc",
|
||||
size: "20",
|
||||
type: "clear"
|
||||
}),
|
||||
o: common_vendor.o((...args) => $options.clear && $options.clear(...args))
|
||||
} : {}, {
|
||||
p: $props.radius + "px",
|
||||
q: $props.bgColor,
|
||||
r: common_vendor.o((...args) => $options.searchClick && $options.searchClick(...args)),
|
||||
s: $props.cancelButton === "always" || $data.show && $props.cancelButton === "auto"
|
||||
}, $props.cancelButton === "always" || $data.show && $props.cancelButton === "auto" ? {
|
||||
t: common_vendor.t($options.cancelTextI18n),
|
||||
v: common_vendor.o((...args) => $options.cancel && $options.cancel(...args))
|
||||
} : {});
|
||||
}
|
||||
var Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "E:/project/project-wl-yonghuduan-uniapp-vue3/uni_modules/uni-search-bar/components/uni-search-bar/uni-search-bar.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"uni-icons": "../../../uni-icons/components/uni-icons/uni-icons"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<view class="uni-searchbar"><view style="{{'border-radius:' + p + ';' + ('background-color:' + q)}}" class="uni-searchbar__box" bindtap="{{r}}"><view class="uni-searchbar__box-icon-search"><block wx:if="{{$slots.searchIcon}}"><slot name="searchIcon"></slot></block><block wx:else><uni-icons wx:if="{{a}}" u-i="48e12ecc-0" bind:__l="__l" u-p="{{a}}"/></block></view><input wx:if="{{b}}" focus="{{c}}" disabled="{{d}}" placeholder="{{e}}" maxlength="{{f}}" class="uni-searchbar__box-search-input" confirm-type="search" type="text" bindconfirm="{{g}}" bindblur="{{h}}" bindfocus="{{i}}" value="{{j}}" bindinput="{{k}}"/><text wx:else class="uni-searchbar__text-placeholder">{{l}}</text><view wx:if="{{m}}" class="uni-searchbar__box-icon-clear" bindtap="{{o}}"><block wx:if="{{$slots.clearIcon}}"><slot name="clearIcon"></slot></block><block wx:else><uni-icons wx:if="{{n}}" u-i="48e12ecc-1" bind:__l="__l" u-p="{{n}}"/></block></view></view><text wx:if="{{s}}" bindtap="{{v}}" class="uni-searchbar__cancel">{{t}}</text></view>
|
||||
@@ -0,0 +1,49 @@
|
||||
/* 水平间距 */
|
||||
/* 水平间距 */
|
||||
.uni-searchbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
position: relative;
|
||||
padding: 10px;
|
||||
}
|
||||
.uni-searchbar__box {
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
flex: 1;
|
||||
justify-content: center;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
height: 36px;
|
||||
padding: 5px 8px 5px 0px;
|
||||
}
|
||||
.uni-searchbar__box-icon-search {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 0 8px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #B3B3B3;
|
||||
}
|
||||
.uni-searchbar__box-search-input {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
}
|
||||
.uni-searchbar__box-icon-clear {
|
||||
align-items: center;
|
||||
line-height: 24px;
|
||||
padding-left: 8px;
|
||||
}
|
||||
.uni-searchbar__text-placeholder {
|
||||
font-size: 14px;
|
||||
color: #B3B3B3;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.uni-searchbar__cancel {
|
||||
padding-left: 10px;
|
||||
line-height: 36px;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
}
|
||||
@@ -0,0 +1,128 @@
|
||||
"use strict";
|
||||
var __defProp = Object.defineProperty;
|
||||
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
||||
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
||||
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 __spreadValues = (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;
|
||||
};
|
||||
var common_vendor = require("../../../../common/vendor.js");
|
||||
class MPAnimation {
|
||||
constructor(options, _this) {
|
||||
this.options = options;
|
||||
this.animation = common_vendor.index.createAnimation(options);
|
||||
this.currentStepAnimates = {};
|
||||
this.next = 0;
|
||||
this.$ = _this;
|
||||
}
|
||||
_nvuePushAnimates(type, args) {
|
||||
let aniObj = this.currentStepAnimates[this.next];
|
||||
let styles = {};
|
||||
if (!aniObj) {
|
||||
styles = {
|
||||
styles: {},
|
||||
config: {}
|
||||
};
|
||||
} else {
|
||||
styles = aniObj;
|
||||
}
|
||||
if (animateTypes1.includes(type)) {
|
||||
if (!styles.styles.transform) {
|
||||
styles.styles.transform = "";
|
||||
}
|
||||
let unit = "";
|
||||
if (type === "rotate") {
|
||||
unit = "deg";
|
||||
}
|
||||
styles.styles.transform += `${type}(${args + unit}) `;
|
||||
} else {
|
||||
styles.styles[type] = `${args}`;
|
||||
}
|
||||
this.currentStepAnimates[this.next] = styles;
|
||||
}
|
||||
_animateRun(styles = {}, config = {}) {
|
||||
let ref = this.$.$refs["ani"].ref;
|
||||
if (!ref)
|
||||
return;
|
||||
return new Promise((resolve, reject) => {
|
||||
nvueAnimation.transition(ref, __spreadValues({
|
||||
styles
|
||||
}, config), (res) => {
|
||||
resolve();
|
||||
});
|
||||
});
|
||||
}
|
||||
_nvueNextAnimate(animates, step = 0, fn) {
|
||||
let obj = animates[step];
|
||||
if (obj) {
|
||||
let {
|
||||
styles,
|
||||
config
|
||||
} = obj;
|
||||
this._animateRun(styles, config).then(() => {
|
||||
step += 1;
|
||||
this._nvueNextAnimate(animates, step, fn);
|
||||
});
|
||||
} else {
|
||||
this.currentStepAnimates = {};
|
||||
typeof fn === "function" && fn();
|
||||
this.isEnd = true;
|
||||
}
|
||||
}
|
||||
step(config = {}) {
|
||||
this.animation.step(config);
|
||||
return this;
|
||||
}
|
||||
run(fn) {
|
||||
this.$.animationData = this.animation.export();
|
||||
this.$.timer = setTimeout(() => {
|
||||
typeof fn === "function" && fn();
|
||||
}, this.$.durationTime);
|
||||
}
|
||||
}
|
||||
const animateTypes1 = [
|
||||
"matrix",
|
||||
"matrix3d",
|
||||
"rotate",
|
||||
"rotate3d",
|
||||
"rotateX",
|
||||
"rotateY",
|
||||
"rotateZ",
|
||||
"scale",
|
||||
"scale3d",
|
||||
"scaleX",
|
||||
"scaleY",
|
||||
"scaleZ",
|
||||
"skew",
|
||||
"skewX",
|
||||
"skewY",
|
||||
"translate",
|
||||
"translate3d",
|
||||
"translateX",
|
||||
"translateY",
|
||||
"translateZ"
|
||||
];
|
||||
const animateTypes2 = ["opacity", "backgroundColor"];
|
||||
const animateTypes3 = ["width", "height", "left", "right", "top", "bottom"];
|
||||
animateTypes1.concat(animateTypes2, animateTypes3).forEach((type) => {
|
||||
MPAnimation.prototype[type] = function(...args) {
|
||||
this.animation[type](...args);
|
||||
return this;
|
||||
};
|
||||
});
|
||||
function createAnimation(option, _this) {
|
||||
if (!_this)
|
||||
return;
|
||||
clearTimeout(_this.timer);
|
||||
return new MPAnimation(option, _this);
|
||||
}
|
||||
exports.createAnimation = createAnimation;
|
||||
@@ -0,0 +1,259 @@
|
||||
"use strict";
|
||||
var __defProp = Object.defineProperty;
|
||||
var __defProps = Object.defineProperties;
|
||||
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
||||
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
||||
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
||||
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 __spreadValues = (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;
|
||||
};
|
||||
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
||||
var uni_modules_uniTransition_components_uniTransition_createAnimation = require("./createAnimation.js");
|
||||
var common_vendor = require("../../../../common/vendor.js");
|
||||
const _sfc_main = {
|
||||
name: "uniTransition",
|
||||
emits: ["click", "change"],
|
||||
props: {
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
modeClass: {
|
||||
type: [Array, String],
|
||||
default() {
|
||||
return "fade";
|
||||
}
|
||||
},
|
||||
duration: {
|
||||
type: Number,
|
||||
default: 300
|
||||
},
|
||||
styles: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {};
|
||||
}
|
||||
},
|
||||
customClass: {
|
||||
type: String,
|
||||
default: ""
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isShow: false,
|
||||
transform: "",
|
||||
opacity: 1,
|
||||
animationData: {},
|
||||
durationTime: 300,
|
||||
config: {}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
show: {
|
||||
handler(newVal) {
|
||||
if (newVal) {
|
||||
this.open();
|
||||
} else {
|
||||
if (this.isShow) {
|
||||
this.close();
|
||||
}
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
stylesObject() {
|
||||
let styles = __spreadProps(__spreadValues({}, this.styles), {
|
||||
"transition-duration": this.duration / 1e3 + "s"
|
||||
});
|
||||
let transform = "";
|
||||
for (let i in styles) {
|
||||
let line = this.toLine(i);
|
||||
transform += line + ":" + styles[i] + ";";
|
||||
}
|
||||
return transform;
|
||||
},
|
||||
transformStyles() {
|
||||
return "transform:" + this.transform + ";opacity:" + this.opacity + ";" + this.stylesObject;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.config = {
|
||||
duration: this.duration,
|
||||
timingFunction: "ease",
|
||||
transformOrigin: "50% 50%",
|
||||
delay: 0
|
||||
};
|
||||
this.durationTime = this.duration;
|
||||
},
|
||||
methods: {
|
||||
init(obj = {}) {
|
||||
if (obj.duration) {
|
||||
this.durationTime = obj.duration;
|
||||
}
|
||||
this.animation = uni_modules_uniTransition_components_uniTransition_createAnimation.createAnimation(Object.assign(this.config, obj), this);
|
||||
},
|
||||
onClick() {
|
||||
this.$emit("click", {
|
||||
detail: this.isShow
|
||||
});
|
||||
},
|
||||
step(obj, config = {}) {
|
||||
if (!this.animation)
|
||||
return;
|
||||
for (let i in obj) {
|
||||
try {
|
||||
if (typeof obj[i] === "object") {
|
||||
this.animation[i](...obj[i]);
|
||||
} else {
|
||||
this.animation[i](obj[i]);
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(`\u65B9\u6CD5 ${i} \u4E0D\u5B58\u5728`);
|
||||
}
|
||||
}
|
||||
this.animation.step(config);
|
||||
return this;
|
||||
},
|
||||
run(fn) {
|
||||
if (!this.animation)
|
||||
return;
|
||||
this.animation.run(fn);
|
||||
},
|
||||
open() {
|
||||
clearTimeout(this.timer);
|
||||
this.transform = "";
|
||||
this.isShow = true;
|
||||
let { opacity, transform } = this.styleInit(false);
|
||||
if (typeof opacity !== "undefined") {
|
||||
this.opacity = opacity;
|
||||
}
|
||||
this.transform = transform;
|
||||
this.$nextTick(() => {
|
||||
this.timer = setTimeout(() => {
|
||||
this.animation = uni_modules_uniTransition_components_uniTransition_createAnimation.createAnimation(this.config, this);
|
||||
this.tranfromInit(false).step();
|
||||
this.animation.run();
|
||||
this.$emit("change", {
|
||||
detail: this.isShow
|
||||
});
|
||||
}, 20);
|
||||
});
|
||||
},
|
||||
close(type) {
|
||||
if (!this.animation)
|
||||
return;
|
||||
this.tranfromInit(true).step().run(() => {
|
||||
this.isShow = false;
|
||||
this.animationData = null;
|
||||
this.animation = null;
|
||||
let { opacity, transform } = this.styleInit(false);
|
||||
this.opacity = opacity || 1;
|
||||
this.transform = transform;
|
||||
this.$emit("change", {
|
||||
detail: this.isShow
|
||||
});
|
||||
});
|
||||
},
|
||||
styleInit(type) {
|
||||
let styles = {
|
||||
transform: ""
|
||||
};
|
||||
let buildStyle = (type2, mode) => {
|
||||
if (mode === "fade") {
|
||||
styles.opacity = this.animationType(type2)[mode];
|
||||
} else {
|
||||
styles.transform += this.animationType(type2)[mode] + " ";
|
||||
}
|
||||
};
|
||||
if (typeof this.modeClass === "string") {
|
||||
buildStyle(type, this.modeClass);
|
||||
} else {
|
||||
this.modeClass.forEach((mode) => {
|
||||
buildStyle(type, mode);
|
||||
});
|
||||
}
|
||||
return styles;
|
||||
},
|
||||
tranfromInit(type) {
|
||||
let buildTranfrom = (type2, mode) => {
|
||||
let aniNum = null;
|
||||
if (mode === "fade") {
|
||||
aniNum = type2 ? 0 : 1;
|
||||
} else {
|
||||
aniNum = type2 ? "-100%" : "0";
|
||||
if (mode === "zoom-in") {
|
||||
aniNum = type2 ? 0.8 : 1;
|
||||
}
|
||||
if (mode === "zoom-out") {
|
||||
aniNum = type2 ? 1.2 : 1;
|
||||
}
|
||||
if (mode === "slide-right") {
|
||||
aniNum = type2 ? "100%" : "0";
|
||||
}
|
||||
if (mode === "slide-bottom") {
|
||||
aniNum = type2 ? "100%" : "0";
|
||||
}
|
||||
}
|
||||
this.animation[this.animationMode()[mode]](aniNum);
|
||||
};
|
||||
if (typeof this.modeClass === "string") {
|
||||
buildTranfrom(type, this.modeClass);
|
||||
} else {
|
||||
this.modeClass.forEach((mode) => {
|
||||
buildTranfrom(type, mode);
|
||||
});
|
||||
}
|
||||
return this.animation;
|
||||
},
|
||||
animationType(type) {
|
||||
return {
|
||||
fade: type ? 1 : 0,
|
||||
"slide-top": `translateY(${type ? "0" : "-100%"})`,
|
||||
"slide-right": `translateX(${type ? "0" : "100%"})`,
|
||||
"slide-bottom": `translateY(${type ? "0" : "100%"})`,
|
||||
"slide-left": `translateX(${type ? "0" : "-100%"})`,
|
||||
"zoom-in": `scaleX(${type ? 1 : 0.8}) scaleY(${type ? 1 : 0.8})`,
|
||||
"zoom-out": `scaleX(${type ? 1 : 1.2}) scaleY(${type ? 1 : 1.2})`
|
||||
};
|
||||
},
|
||||
animationMode() {
|
||||
return {
|
||||
fade: "opacity",
|
||||
"slide-top": "translateY",
|
||||
"slide-right": "translateX",
|
||||
"slide-bottom": "translateY",
|
||||
"slide-left": "translateX",
|
||||
"zoom-in": "scale",
|
||||
"zoom-out": "scale"
|
||||
};
|
||||
},
|
||||
toLine(name) {
|
||||
return name.replace(/([A-Z])/g, "-$1").toLowerCase();
|
||||
}
|
||||
}
|
||||
};
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: $data.isShow
|
||||
}, $data.isShow ? {
|
||||
b: $data.animationData,
|
||||
c: common_vendor.n($props.customClass),
|
||||
d: common_vendor.s($options.transformStyles),
|
||||
e: common_vendor.o((...args) => $options.onClick && $options.onClick(...args))
|
||||
} : {});
|
||||
}
|
||||
var Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "E:/project/project-wl-yonghuduan-uniapp-vue3/uni_modules/uni-transition/components/uni-transition/uni-transition.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<view wx:if="{{a}}" ref="ani" animation="{{b}}" class="{{c}}" style="{{d}}" bindtap="{{e}}"><slot></slot></view>
|
||||
Reference in New Issue
Block a user