完成简易版的充值和充值记录查询页面，简单的我的页面
This commit is contained in:
@@ -1 +0,0 @@
|
||||
export {};
|
||||
@@ -1,223 +0,0 @@
|
||||
"use strict";
|
||||
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
||||
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
||||
if (ar || !(i in from)) {
|
||||
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
||||
ar[i] = from[i];
|
||||
}
|
||||
}
|
||||
return to.concat(ar || Array.prototype.slice.call(from));
|
||||
};
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var component_1 = require("../common/component");
|
||||
var FieldName;
|
||||
(function (FieldName) {
|
||||
FieldName["TEXT"] = "text";
|
||||
FieldName["VALUE"] = "value";
|
||||
FieldName["CHILDREN"] = "children";
|
||||
})(FieldName || (FieldName = {}));
|
||||
var defaultFieldNames = {
|
||||
text: FieldName.TEXT,
|
||||
value: FieldName.VALUE,
|
||||
children: FieldName.CHILDREN,
|
||||
};
|
||||
(0, component_1.VantComponent)({
|
||||
props: {
|
||||
title: String,
|
||||
value: {
|
||||
type: String,
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
value: '请选择',
|
||||
},
|
||||
activeColor: {
|
||||
type: String,
|
||||
value: '#1989fa',
|
||||
},
|
||||
options: {
|
||||
type: Array,
|
||||
value: [],
|
||||
},
|
||||
swipeable: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
closeable: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
showHeader: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
closeIcon: {
|
||||
type: String,
|
||||
value: 'cross',
|
||||
},
|
||||
fieldNames: {
|
||||
type: Object,
|
||||
value: defaultFieldNames,
|
||||
observer: 'updateFieldNames',
|
||||
},
|
||||
useTitleSlot: Boolean,
|
||||
},
|
||||
data: {
|
||||
tabs: [],
|
||||
activeTab: 0,
|
||||
textKey: FieldName.TEXT,
|
||||
valueKey: FieldName.VALUE,
|
||||
childrenKey: FieldName.CHILDREN,
|
||||
innerValue: '',
|
||||
},
|
||||
watch: {
|
||||
options: function () {
|
||||
this.updateTabs();
|
||||
},
|
||||
value: function (newVal) {
|
||||
this.updateValue(newVal);
|
||||
},
|
||||
},
|
||||
created: function () {
|
||||
this.updateTabs();
|
||||
},
|
||||
methods: {
|
||||
updateValue: function (val) {
|
||||
var _this = this;
|
||||
if (val !== undefined) {
|
||||
var values = this.data.tabs.map(function (tab) { return tab.selected && tab.selected[_this.data.valueKey]; });
|
||||
if (values.indexOf(val) > -1) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
this.innerValue = val;
|
||||
this.updateTabs();
|
||||
},
|
||||
updateFieldNames: function () {
|
||||
var _a = this.data.fieldNames || defaultFieldNames, _b = _a.text, text = _b === void 0 ? 'text' : _b, _c = _a.value, value = _c === void 0 ? 'value' : _c, _d = _a.children, children = _d === void 0 ? 'children' : _d;
|
||||
this.setData({
|
||||
textKey: text,
|
||||
valueKey: value,
|
||||
childrenKey: children,
|
||||
});
|
||||
},
|
||||
getSelectedOptionsByValue: function (options, value) {
|
||||
for (var i = 0; i < options.length; i++) {
|
||||
var option = options[i];
|
||||
if (option[this.data.valueKey] === value) {
|
||||
return [option];
|
||||
}
|
||||
if (option[this.data.childrenKey]) {
|
||||
var selectedOptions = this.getSelectedOptionsByValue(option[this.data.childrenKey], value);
|
||||
if (selectedOptions) {
|
||||
return __spreadArray([option], selectedOptions, true);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
updateTabs: function () {
|
||||
var _this = this;
|
||||
var options = this.data.options;
|
||||
var innerValue = this.innerValue;
|
||||
if (!options.length) {
|
||||
return;
|
||||
}
|
||||
if (innerValue !== undefined) {
|
||||
var selectedOptions = this.getSelectedOptionsByValue(options, innerValue);
|
||||
if (selectedOptions) {
|
||||
var optionsCursor_1 = options;
|
||||
var tabs_1 = selectedOptions.map(function (option) {
|
||||
var tab = {
|
||||
options: optionsCursor_1,
|
||||
selected: option,
|
||||
};
|
||||
var next = optionsCursor_1.find(function (item) { return item[_this.data.valueKey] === option[_this.data.valueKey]; });
|
||||
if (next) {
|
||||
optionsCursor_1 = next[_this.data.childrenKey];
|
||||
}
|
||||
return tab;
|
||||
});
|
||||
if (optionsCursor_1) {
|
||||
tabs_1.push({
|
||||
options: optionsCursor_1,
|
||||
selected: null,
|
||||
});
|
||||
}
|
||||
this.setData({
|
||||
tabs: tabs_1,
|
||||
});
|
||||
wx.nextTick(function () {
|
||||
_this.setData({
|
||||
activeTab: tabs_1.length - 1,
|
||||
});
|
||||
});
|
||||
return;
|
||||
}
|
||||
}
|
||||
this.setData({
|
||||
tabs: [
|
||||
{
|
||||
options: options,
|
||||
selected: null,
|
||||
},
|
||||
],
|
||||
});
|
||||
},
|
||||
onClose: function () {
|
||||
this.$emit('close');
|
||||
},
|
||||
onClickTab: function (e) {
|
||||
var _a = e.detail, tabIndex = _a.index, title = _a.title;
|
||||
this.$emit('click-tab', { title: title, tabIndex: tabIndex });
|
||||
this.setData({
|
||||
activeTab: tabIndex,
|
||||
});
|
||||
},
|
||||
// 选中
|
||||
onSelect: function (e) {
|
||||
var _this = this;
|
||||
var _a = e.currentTarget.dataset, option = _a.option, tabIndex = _a.tabIndex;
|
||||
if (option && option.disabled) {
|
||||
return;
|
||||
}
|
||||
var _b = this.data, valueKey = _b.valueKey, childrenKey = _b.childrenKey;
|
||||
var tabs = this.data.tabs;
|
||||
tabs[tabIndex].selected = option;
|
||||
if (tabs.length > tabIndex + 1) {
|
||||
tabs = tabs.slice(0, tabIndex + 1);
|
||||
}
|
||||
if (option[childrenKey]) {
|
||||
var nextTab = {
|
||||
options: option[childrenKey],
|
||||
selected: null,
|
||||
};
|
||||
if (tabs[tabIndex + 1]) {
|
||||
tabs[tabIndex + 1] = nextTab;
|
||||
}
|
||||
else {
|
||||
tabs.push(nextTab);
|
||||
}
|
||||
wx.nextTick(function () {
|
||||
_this.setData({
|
||||
activeTab: tabIndex + 1,
|
||||
});
|
||||
});
|
||||
}
|
||||
this.setData({
|
||||
tabs: tabs,
|
||||
});
|
||||
var selectedOptions = tabs.map(function (tab) { return tab.selected; }).filter(Boolean);
|
||||
var value = option[valueKey];
|
||||
var params = {
|
||||
value: value,
|
||||
tabIndex: tabIndex,
|
||||
selectedOptions: selectedOptions,
|
||||
};
|
||||
this.innerValue = value;
|
||||
this.$emit('change', params);
|
||||
if (!option[childrenKey]) {
|
||||
this.$emit('finish', params);
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -1,8 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"van-icon": "../icon/index",
|
||||
"van-tab": "../tab/index",
|
||||
"van-tabs": "../tabs/index"
|
||||
}
|
||||
}
|
||||
@@ -1,54 +0,0 @@
|
||||
<wxs src="./index.wxs" module="utils" />
|
||||
|
||||
<view wx:if="{{ showHeader }}" class="van-cascader__header">
|
||||
<slot name="title" wx:if="{{ useTitleSlot }}"></slot>
|
||||
<text class="van-cascader__title" wx:else>{{ title }}</text>
|
||||
<van-icon
|
||||
wx:if="{{ closeable }}"
|
||||
name="{{ closeIcon }}"
|
||||
class="van-cascader__close-icon"
|
||||
bind:tap="onClose"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<van-tabs
|
||||
active="{{ activeTab }}"
|
||||
custom-class="van-cascader__tabs"
|
||||
wrap-class="van-cascader__tabs-wrap"
|
||||
tab-class="van-cascader__tab"
|
||||
color="{{ activeColor }}"
|
||||
border="{{ false }}"
|
||||
swipeable="{{ swipeable }}"
|
||||
bind:click="onClickTab"
|
||||
>
|
||||
<van-tab
|
||||
wx:for="{{ tabs }}"
|
||||
wx:for-item="tab"
|
||||
wx:for-index="tabIndex"
|
||||
wx:key="tabIndex"
|
||||
title="{{ tab.selected ? tab.selected[textKey] : placeholder }}"
|
||||
style="width: 100%;"
|
||||
title-style="{{ !tab.selected ? 'color: #969799;font-weight:normal;' : '' }}"
|
||||
>
|
||||
<!-- 暂不支持 -->
|
||||
<!-- <slot name="options-top"></slot> -->
|
||||
|
||||
<view class="van-cascader__options">
|
||||
<view
|
||||
wx:for="{{ tab.options }}"
|
||||
wx:for-item="option"
|
||||
wx:key="index"
|
||||
class="{{ option.className }} {{ utils.optionClass(tab, valueKey, option) }}"
|
||||
style="{{ utils.optionStyle({ tab, valueKey, option, activeColor }) }}"
|
||||
data-option="{{ option }}"
|
||||
data-tab-index="{{ tabIndex }}"
|
||||
bind:tap="onSelect"
|
||||
>
|
||||
<text>{{ option[textKey] }}</text>
|
||||
<van-icon wx:if="{{ utils.isSelected(tab, valueKey, option) }}" name="success" size="18" />
|
||||
</view>
|
||||
</view>
|
||||
<!-- 暂不支持 -->
|
||||
<!-- <slot name="options-bottom"></slot> -->
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
@@ -1,24 +0,0 @@
|
||||
var utils = require('../wxs/utils.wxs');
|
||||
var style = require('../wxs/style.wxs');
|
||||
|
||||
function isSelected(tab, valueKey, option) {
|
||||
return tab.selected && tab.selected[valueKey] === option[valueKey]
|
||||
}
|
||||
|
||||
function optionClass(tab, valueKey, option) {
|
||||
return utils.bem('cascader__option', { selected: isSelected(tab, valueKey, option), disabled: option.disabled })
|
||||
}
|
||||
|
||||
function optionStyle(data) {
|
||||
var color = data.option.color || (isSelected(data.tab, data.valueKey, data.option) ? data.activeColor : undefined);
|
||||
return style({
|
||||
color
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
module.exports = {
|
||||
isSelected: isSelected,
|
||||
optionClass: optionClass,
|
||||
optionStyle: optionStyle,
|
||||
};
|
||||
@@ -1 +0,0 @@
|
||||
@import '../common/index.wxss';.van-cascader__header{align-items:center;display:flex;height:48px;justify-content:space-between;padding:0 16px}.van-cascader__title{font-size:16px;font-weight:600;line-height:20px}.van-cascader__close-icon{color:#c8c9cc;font-size:22px;height:22px}.van-cascader__tabs-wrap{height:48px!important;padding:0 8px}.van-cascader__tab{color:#323233!important;flex:none!important;font-weight:600!important;padding:0 8px!important}.van-cascader__tab--unselected{color:#969799!important;font-weight:400!important}.van-cascader__option{align-items:center;cursor:pointer;display:flex;font-size:14px;justify-content:space-between;line-height:20px;padding:10px 16px}.van-cascader__option:active{background-color:#f2f3f5}.van-cascader__option--selected{color:#1989fa;font-weight:600}.van-cascader__option--disabled{color:#c8c9cc;cursor:not-allowed}.van-cascader__option--disabled:active{background-color:initial}.van-cascader__options{-webkit-overflow-scrolling:touch;box-sizing:border-box;height:384px;overflow-y:auto;padding-top:6px}
|
||||
Reference in New Issue
Block a user