Skip to content

Commit e66f670

Browse files
wlxuquwlxuqu
committed
完成select组件文档编写
1 parent 4ca43c3 commit e66f670

File tree

8 files changed

+372
-448
lines changed

8 files changed

+372
-448
lines changed

‎pages.json

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"current": 0, //当前激活的模式(list 的索引项)
77
"list": [{
88
"name": "test", //模式名称
9-
"path": "pages/componentsA/form/index", //启动页面，必选
9+
"path": "pages/componentsA/calendar/index", //启动页面，必选
1010
"query": "id=1&name=2" //启动参数，在页面的onLoad函数里面得到
1111
}]
1212
},
@@ -450,6 +450,13 @@
450450
{
451451
"root": "pages/componentsA",
452452
"pages": [
453+
// calendar-日历
454+
{
455+
"path": "calendar/index",
456+
"style": {
457+
"navigationBarTitleText": "calendar-日历"
458+
}
459+
},
453460
// form-表单
454461
{
455462
"path": "form/index",

‎pages/componentsA/calendar/index.vue

Lines changed: 26 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,20 @@
33
<view class="u-demo-wrap" style="background-color: #FFFFFF;">
44
<view class="u-demo-title">演示效果</view>
55
<view class="u-demo-area">
6-
<u-calendar isFixed :minDate="minDate" :maxDate="maxDate" :btnType="btnType" :activeBgColor="activeBgColor"
6+
<u-calendar v-model="show" :minDate="minDate" :maxDate="maxDate" :btnType="btnType" :activeBgColor="activeBgColor"
77
:rangeBgColor="rangeBgColor" :rangeColor="rangeColor" :startText="startText" :endText="endText" :arrowType="arrowType"
8-
:type="type" ref="calendar" @change="change"></-calendar>
8+
:mode="mode" ref="calendar" @change="change">
9+
10+
</u-calendar>
911
</view>
1012
</view>
1113
<view class="u-config-wrap">
1214
<view class="u-config-title u-border-bottom">
1315
参数配置
1416
</view>
1517
<view class="u-config-item">
16-
<view class="u-item-title">右侧按钮</view>
17-
<u-subsection vibrateShort current="1" :list="['是', '否']" @change="showBtnChange"></u-subsection>
18+
<view class="u-item-title">状态</view>
19+
<u-subsection vibrateShort :current="showBtnStatus" :list="['显示', '隐藏']" @change="showChange"></u-subsection>
1820
</view>
1921
<view class="u-config-item">
2022
<view class="u-item-title">显示错误信息</view>
@@ -40,23 +42,28 @@
4042
export default {
4143
data() {
4244
return {
43-
type: 1,
44-
status: [],
45+
show: true,
46+
mode: 'range',
4547
arrowType: 1,
4648
minDate: "1920-01-01",
4749
maxDate: "",
4850
btnType: "primary",
49-
activeBgColor: "#5677fc",
50-
rangeBgColor: "rgba(86,119,252,0.1)",
51-
rangeColor: "#5677fc",
51+
activeBgColor: "#2979ff",
52+
rangeBgColor: "rgba(41,121,255,0.13)",
53+
rangeColor: "#2979ff",
5254
startText: "开始",
5355
endText: "结束",
5456
result: ""
5557
}
5658
},
59+
computed: {
60+
showBtnStatus() {
61+
return this.show ? 0 : 1;
62+
}
63+
},
5764
methods: {
58-
showBtnChange(index) {
59-
this.showBtn = index == 0 ? true : false;
65+
showChange(index) {
66+
this.show = !index;
6067
},
6168
errorMessageChange(index) {
6269
this.errorMessage = index == 0 ? '手机号有误' : false
@@ -77,6 +84,14 @@
7784
},
7885
textareaChange(index) {
7986
this.type = index == 0 ? 'textarea' : 'text';
87+
},
88+
change(e) {
89+
console.log(e)
90+
if (this.type == 1) {
91+
this.result = e.result
92+
} else {
93+
this.result = `${e.startDate} 至 ${e.endDate}`
94+
}
8095
}
8196
}
8297
}

‎pages/componentsA/icon/index.vue

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,12 @@
1414
data() {
1515
return {
1616
iconList: [
17+
{
18+
name: 'arrow-left-double'
19+
},
20+
{
21+
name: 'arrow-right-double'
22+
},
1723
{
1824
name: 'chat'
1925
},

‎pages/componentsC/test/index.vue

Lines changed: 67 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,77 @@
11
<template>
2-
<view class="u-demo">
3-
<view class="u-demo-wrap">
4-
<u-icon label="uView" size="40" name="https://cdn.uviewui.com/uview/example/button.png"></u-icon>
5-
</view>
6-
<view class="u-config-wrap">
7-
<view class="u-config-title u-border-bottom">参数配置</view>
8-
<view class="u-config-item">
9-
<view class="u-item-title">状态</view>
10-
<u-button @click="value = true">打开Picker</u-button>
11-
</view>
12-
</view>
13-
</view>
2+
<u-select v-model="show" mode="mutil-column-auto" :list="list" @confirm="confirm"></u-select>
143
</template>
154

165
<script>
17-
import citySelect from './u-city-select.vue';
18-
export default {
19-
components: {
20-
citySelect
21-
},
22-
data() {
23-
return {
24-
height: 30,
25-
bgColor: this.$u.color.bgColor,
26-
marginTop: 30,
27-
marginBottom: 30,
28-
value: false,
29-
input: '',
30-
};
31-
},
32-
methods: {
33-
cityChange(e) {
34-
this.input = e.province.label + '-' + e.city.label + '-' + e.area.label;
6+
export default {
7+
data() {
8+
return {
9+
show: true,
10+
list: [
11+
{
12+
value: 1,
13+
label: '中国',
14+
children: [
15+
{
16+
value: 2,
17+
label: '广东',
18+
children: [
19+
{
20+
value: 3,
21+
label: '深圳'
22+
},
23+
{
24+
value: 4,
25+
label: '广州'
26+
}
27+
]
28+
},
29+
{
30+
value: 5,
31+
label: '广西',
32+
children: [
33+
{
34+
value: 6,
35+
label: '南宁'
36+
},
37+
{
38+
value: 7,
39+
label: '桂林'
40+
}
41+
]
42+
}
43+
]
44+
},
45+
{
46+
value: 8,
47+
label: '美国',
48+
children: [
49+
{
50+
value: 9,
51+
label: '纽约',
52+
children: [
53+
{
54+
value: 10,
55+
label: '皇后街区'
56+
}
57+
]
58+
}
59+
]
60+
}
61+
]
62+
}
63+
},
64+
methods: {
65+
confirm(e) {
66+
console.log(e);
67+
}
3568
}
3669
}
37-
};
3870
</script>
3971

40-
<style scoped>
41-
.btn-wrap {
42-
margin: 100rpx 30rpx;
72+
<style lang="scss">
73+
.money{
74+
font-size: 80rpx;
75+
color: $u-type-primary;
4376
}
4477
</style>

‎pages/example/components.config.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,10 @@ export default [{
3333
{
3434
groupName: '表单组件',
3535
list: [{
36+
path: '/pages/componentsA/calendar/index',
37+
icon: 'calendar',
38+
title: 'Calendar 日历',
39+
},{
3640
path: '/pages/componentsA/select/index',
3741
icon: 'select',
3842
title: 'Select 列选择器',

0 commit comments

Comments
 (0)