no message
This commit is contained in:
@@ -0,0 +1,253 @@
|
||||
var e = require("../../../../common/vendor.js"),
|
||||
t = {
|
||||
name: "uni-data-select",
|
||||
mixins: [e.Ws.mixinDatacom || {}],
|
||||
props: {
|
||||
localdata: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
value: { type: [String, Number], default: "" },
|
||||
modelValue: { type: [String, Number], default: "" },
|
||||
label: { type: String, default: "" },
|
||||
placeholder: { type: String, default: "请选择" },
|
||||
emptyTips: { type: String, default: "无选项" },
|
||||
clear: { type: Boolean, default: !0 },
|
||||
defItem: { type: Number, default: 0 },
|
||||
disabled: { type: Boolean, default: !1 },
|
||||
format: { type: String, default: "" },
|
||||
},
|
||||
data: function () {
|
||||
return {
|
||||
showSelector: !1,
|
||||
current: "",
|
||||
mixinDatacomResData: [],
|
||||
apps: [],
|
||||
channels: [],
|
||||
cacheKey: "uni-data-select-lastSelectedValue",
|
||||
};
|
||||
},
|
||||
created: function () {
|
||||
var e = this;
|
||||
(this.debounceGet = this.debounce(function () {
|
||||
e.query();
|
||||
}, 300)),
|
||||
this.collection && !this.localdata.length && this.debounceGet();
|
||||
},
|
||||
computed: {
|
||||
typePlaceholder: function () {
|
||||
var e = this.placeholder,
|
||||
t = {
|
||||
"opendb-stat-app-versions": "版本",
|
||||
"opendb-app-channels": "渠道",
|
||||
"opendb-app-list": "应用",
|
||||
}[this.collection];
|
||||
return t ? e + t : e;
|
||||
},
|
||||
valueCom: function () {
|
||||
return this.modelValue;
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
localdata: {
|
||||
immediate: !0,
|
||||
handler: function (e, t) {
|
||||
Array.isArray(e) && t !== e && (this.mixinDatacomResData = e);
|
||||
},
|
||||
},
|
||||
valueCom: function (e, t) {
|
||||
this.initDefVal();
|
||||
},
|
||||
mixinDatacomResData: {
|
||||
immediate: !0,
|
||||
handler: function (e) {
|
||||
e.length && this.initDefVal();
|
||||
},
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
debounce: function (e) {
|
||||
var t =
|
||||
arguments.length > 1 && void 0 !== arguments[1]
|
||||
? arguments[1]
|
||||
: 100,
|
||||
a = null;
|
||||
return function () {
|
||||
for (
|
||||
var i = this, n = arguments.length, o = new Array(n), c = 0;
|
||||
c < n;
|
||||
c++
|
||||
)
|
||||
o[c] = arguments[c];
|
||||
a && clearTimeout(a),
|
||||
(a = setTimeout(function () {
|
||||
e.apply(i, o);
|
||||
}, t));
|
||||
};
|
||||
},
|
||||
query: function () {
|
||||
this.mixinDatacomEasyGet();
|
||||
},
|
||||
onMixinDatacomPropsChange: function () {
|
||||
this.collection && this.debounceGet();
|
||||
},
|
||||
initDefVal: function () {
|
||||
var e = "";
|
||||
if (
|
||||
(!this.valueCom && 0 !== this.valueCom) ||
|
||||
this.isDisabled(this.valueCom)
|
||||
) {
|
||||
var t;
|
||||
if ((this.collection && (t = this.getCache()), t || 0 === t)) e = t;
|
||||
else {
|
||||
var a = "";
|
||||
this.defItem > 0 &&
|
||||
this.defItem <= this.mixinDatacomResData.length &&
|
||||
(a = this.mixinDatacomResData[this.defItem - 1].value),
|
||||
(e = a);
|
||||
}
|
||||
(e || 0 === e) && this.emit(e);
|
||||
} else e = this.valueCom;
|
||||
var i = this.mixinDatacomResData.find(function (t) {
|
||||
return t.value === e;
|
||||
});
|
||||
this.current = i ? this.formatItemName(i) : "";
|
||||
},
|
||||
isDisabled: function (e) {
|
||||
var t = !1;
|
||||
return (
|
||||
this.mixinDatacomResData.forEach(function (a) {
|
||||
a.value === e && (t = a.disable);
|
||||
}),
|
||||
t
|
||||
);
|
||||
},
|
||||
clearVal: function () {
|
||||
this.emit(""), this.collection && this.removeCache();
|
||||
},
|
||||
change: function (e) {
|
||||
e.disable ||
|
||||
((this.showSelector = !1),
|
||||
(this.current = this.formatItemName(e)),
|
||||
this.emit(e.value));
|
||||
},
|
||||
emit: function (e) {
|
||||
this.$emit("input", e),
|
||||
this.$emit("update:modelValue", e),
|
||||
this.$emit("change", e),
|
||||
this.collection && this.setCache(e);
|
||||
},
|
||||
toggleSelector: function () {
|
||||
this.disabled || (this.showSelector = !this.showSelector);
|
||||
},
|
||||
formatItemName: function (e) {
|
||||
var t = e.text,
|
||||
a = e.value,
|
||||
i = e.channel_code;
|
||||
if (((i = i ? "(".concat(i, ")") : ""), this.format)) {
|
||||
var n = "";
|
||||
for (var o in ((n = this.format), e))
|
||||
n = n.replace(new RegExp("{".concat(o, "}"), "g"), e[o]);
|
||||
return n;
|
||||
}
|
||||
return this.collection.indexOf("app-list") > 0
|
||||
? "".concat(t, "(").concat(a, ")")
|
||||
: t || "未命名".concat(i);
|
||||
},
|
||||
getLoadData: function () {
|
||||
return this.mixinDatacomResData;
|
||||
},
|
||||
getCurrentCacheKey: function () {
|
||||
return this.collection;
|
||||
},
|
||||
getCache: function () {
|
||||
var t =
|
||||
arguments.length > 0 && void 0 !== arguments[0]
|
||||
? arguments[0]
|
||||
: this.getCurrentCacheKey();
|
||||
return (e.index.getStorageSync(this.cacheKey) || {})[t];
|
||||
},
|
||||
setCache: function (t) {
|
||||
var a =
|
||||
arguments.length > 1 && void 0 !== arguments[1]
|
||||
? arguments[1]
|
||||
: this.getCurrentCacheKey(),
|
||||
i = e.index.getStorageSync(this.cacheKey) || {};
|
||||
(i[a] = t), e.index.setStorageSync(this.cacheKey, i);
|
||||
},
|
||||
removeCache: function () {
|
||||
var t =
|
||||
arguments.length > 0 && void 0 !== arguments[0]
|
||||
? arguments[0]
|
||||
: this.getCurrentCacheKey(),
|
||||
a = e.index.getStorageSync(this.cacheKey) || {};
|
||||
delete a[t], e.index.setStorageSync(this.cacheKey, a);
|
||||
},
|
||||
},
|
||||
};
|
||||
Array || e.resolveComponent("uni-icons")(), Math;
|
||||
var a = e._export_sfc(t, [
|
||||
[
|
||||
"render",
|
||||
function (t, a, i, n, o, c) {
|
||||
return e.e(
|
||||
{ a: i.label },
|
||||
i.label ? { b: e.t(i.label + "：") } : {},
|
||||
{ c: o.current },
|
||||
o.current ? { d: e.t(o.current) } : { e: e.t(c.typePlaceholder) },
|
||||
{ f: o.current && i.clear && !i.disabled },
|
||||
o.current && i.clear && !i.disabled
|
||||
? {
|
||||
g: e.p({ type: "clear", color: "#c0c4cc", size: "20" }),
|
||||
h: e.o(function () {
|
||||
return c.clearVal && c.clearVal.apply(c, arguments);
|
||||
}),
|
||||
}
|
||||
: {
|
||||
i: e.p({
|
||||
type: o.showSelector ? "top" : "bottom",
|
||||
size: "14",
|
||||
color: "#999",
|
||||
}),
|
||||
},
|
||||
{
|
||||
j: e.o(function () {
|
||||
return c.toggleSelector && c.toggleSelector.apply(c, arguments);
|
||||
}),
|
||||
k: o.showSelector,
|
||||
},
|
||||
o.showSelector
|
||||
? {
|
||||
l: e.o(function () {
|
||||
return c.toggleSelector && c.toggleSelector.apply(c, arguments);
|
||||
}),
|
||||
}
|
||||
: {},
|
||||
{ m: o.showSelector },
|
||||
o.showSelector
|
||||
? e.e(
|
||||
{ n: 0 === o.mixinDatacomResData.length },
|
||||
0 === o.mixinDatacomResData.length
|
||||
? { o: e.t(i.emptyTips) }
|
||||
: {
|
||||
p: e.f(o.mixinDatacomResData, function (t, a, i) {
|
||||
return {
|
||||
a: e.t(c.formatItemName(t)),
|
||||
b: t.disable ? 1 : "",
|
||||
c: a,
|
||||
d: e.o(function (e) {
|
||||
return c.change(t);
|
||||
}, a),
|
||||
};
|
||||
}),
|
||||
}
|
||||
)
|
||||
: {},
|
||||
{ q: i.disabled ? 1 : "", r: o.current ? 1 : "" }
|
||||
);
|
||||
},
|
||||
],
|
||||
]);
|
||||
wx.createComponent(a);
|
||||
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"uni-icons": "../../../uni-icons/components/uni-icons/uni-icons"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,52 @@
|
||||
<view class="uni-stat__select">
|
||||
<label class="uni-label-text hide-on-phone" wx:if="{{a}}">{{b}}</label>
|
||||
<view class="{{['uni-stat-box',r&&'uni-stat__actived']}}">
|
||||
<view class="{{['uni-select',q&&'uni-select--disabled']}}">
|
||||
<view bindtap="{{j}}" class="uni-select__input-box">
|
||||
<view class="uni-select__input-text" wx:if="{{c}}">{{d}}</view>
|
||||
<view
|
||||
class="uni-select__input-text uni-select__input-placeholder"
|
||||
wx:else
|
||||
>{{e}}</view
|
||||
>
|
||||
<view catchtap="{{h}}" wx:if="{{f}}">
|
||||
<uni-icons
|
||||
bind:__l="__l"
|
||||
uI="2211b7d3-0"
|
||||
uP="{{g}}"
|
||||
wx:if="{{g}}"
|
||||
></uni-icons>
|
||||
</view>
|
||||
<view wx:else>
|
||||
<uni-icons
|
||||
bind:__l="__l"
|
||||
uI="2211b7d3-1"
|
||||
uP="{{i}}"
|
||||
wx:if="{{i}}"
|
||||
></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
<view bindtap="{{l}}" class="uni-select--mask" wx:if="{{k}}"></view>
|
||||
<view class="uni-select__selector" wx:if="{{m}}">
|
||||
<view class="uni-popper__arrow"></view>
|
||||
<scroll-view class="uni-select__selector-scroll" scrollY="true">
|
||||
<view class="uni-select__selector-empty" wx:if="{{n}}">
|
||||
<text>{{o}}</text>
|
||||
</view>
|
||||
<block wx:else>
|
||||
<view
|
||||
bindtap="{{item.d}}"
|
||||
class="uni-select__selector-item"
|
||||
wx:for="{{p}}"
|
||||
wx:key="c"
|
||||
>
|
||||
<text class="{{[item.b&&'uni-select__selector__disabled']}}"
|
||||
>{{item.a}}</text
|
||||
>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -0,0 +1,146 @@
|
||||
@media screen and (max-width: 500px) {
|
||||
.hide-on-phone {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.uni-stat__select {
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
}
|
||||
.uni-stat-box,
|
||||
.uni-stat__actived,
|
||||
.uni-stat__select {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
}
|
||||
.uni-label-text {
|
||||
color: #6a6a6a;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
margin: auto 5px auto 0;
|
||||
}
|
||||
.uni-select {
|
||||
align-items: center;
|
||||
border: 1px solid #1f68e9;
|
||||
border-radius: 8rpx;
|
||||
box-sizing: border-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: row;
|
||||
font-size: 30rpx;
|
||||
padding: 20rpx 30rpx;
|
||||
position: relative;
|
||||
user-select: none;
|
||||
width: 100%;
|
||||
}
|
||||
.uni-select--disabled {
|
||||
background-color: #f5f7fa;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.uni-select__label {
|
||||
color: #909399;
|
||||
font-size: 16px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
.uni-select__input-box {
|
||||
align-items: center;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: row;
|
||||
font-size: 30rpx;
|
||||
position: relative;
|
||||
}
|
||||
.uni-select__input {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
height: 22px;
|
||||
line-height: 22px;
|
||||
}
|
||||
.uni-select__input-plac {
|
||||
color: #909399;
|
||||
font-size: 14px;
|
||||
}
|
||||
.uni-select__selector {
|
||||
background-color: #fff;
|
||||
border: 1px solid #ebeef5;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
|
||||
box-sizing: border-box;
|
||||
left: 0;
|
||||
padding: 4px 0;
|
||||
position: absolute;
|
||||
top: calc(100% + 12px);
|
||||
width: 100%;
|
||||
z-index: 3;
|
||||
}
|
||||
.uni-select__selector-scroll {
|
||||
box-sizing: border-box;
|
||||
max-height: 200px;
|
||||
}
|
||||
.uni-select__selector-empty,
|
||||
.uni-select__selector-item {
|
||||
cursor: pointer;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
font-size: 30rpx;
|
||||
padding: 20rpx 30rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.uni-select__selector-item:hover {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
.uni-select__selector-empty:last-child,
|
||||
.uni-select__selector-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
.uni-select__selector__disabled {
|
||||
cursor: default;
|
||||
opacity: 0.4;
|
||||
}
|
||||
.uni-popper__arrow,
|
||||
.uni-popper__arrow:after {
|
||||
border: 6px solid transparent;
|
||||
display: block;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
width: 0;
|
||||
}
|
||||
.uni-popper__arrow {
|
||||
border-bottom-color: #ebeef5;
|
||||
border-top-width: 0;
|
||||
filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
|
||||
left: 10%;
|
||||
margin-right: 3px;
|
||||
top: -6px;
|
||||
}
|
||||
.uni-popper__arrow:after {
|
||||
border-bottom-color: #fff;
|
||||
border-top-width: 0;
|
||||
content: " ";
|
||||
margin-left: -6px;
|
||||
top: 1px;
|
||||
}
|
||||
.uni-select__input-text {
|
||||
color: #333;
|
||||
font-size: 30rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
.uni-select__input-placeholder {
|
||||
color: #6a6a6a;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.uni-select--mask {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
Reference in New Issue
Block a user