mali-applet-ui 0.2.53 → 0.2.55
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/ml-button/ml-button.vue +3 -0
- package/components/ml-cascader-picker/ml-cascader-picker.vue +8 -3
- package/components/ml-checkbox/ml-checkbox.vue +3 -0
- package/components/ml-checkbox-button/ml-checkbox-button.vue +3 -0
- package/components/ml-checkbox-group/ml-checkbox-group.vue +5 -0
- package/components/ml-echarts/ml-echarts.vue +64 -22
- package/components/ml-modal/ml-modal.vue +25 -1
- package/components/ml-picker-drawer/ml-picker-drawer.vue +3 -0
- package/components/ml-radio/ml-radio.vue +3 -0
- package/components/ml-radio-button/ml-radio-button.vue +3 -0
- package/components/ml-radio-group/ml-radio-group.vue +5 -0
- package/components/ml-select-picker/ml-select-picker.vue +3 -4
- package/components/ml-tabbar/ml-tabbar.vue +3 -0
- package/components/ml-text/ml-text.vue +3 -0
- package/package.json +1 -1
|
@@ -169,12 +169,17 @@ export default {
|
|
|
169
169
|
this.$emit('clear', { value })
|
|
170
170
|
},
|
|
171
171
|
confirmEvent () {
|
|
172
|
-
const value =
|
|
172
|
+
const value = []
|
|
173
|
+
const selection = []
|
|
174
|
+
const labels = []
|
|
175
|
+
this.selectIndexs.slice(0, this.countLevel).forEach((valIndex, colIndex) => {
|
|
173
176
|
const item = this.pickerDataMaps[colIndex][valIndex]
|
|
174
|
-
|
|
177
|
+
selection.push(item || null)
|
|
178
|
+
value.push(item ? item[this.optValueField] : null)
|
|
179
|
+
labels.push(item ? item[this.optLabelField] : '')
|
|
175
180
|
})
|
|
176
181
|
this.$emit('input', value)
|
|
177
|
-
this.$emit('change', { value })
|
|
182
|
+
this.$emit('change', { value, labels, selection })
|
|
178
183
|
this.closePopup()
|
|
179
184
|
}
|
|
180
185
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<view class="ml-echarts" :class="className" :style="{height: height || '400rpx', width: width || '100%'}">
|
|
3
|
-
<canvas type="2d" class="ml-canvas" :canvas-id="canvasId" @touchstart="touchStart" @touchmove="touchMove" @touchend="touchEnd"></canvas>
|
|
3
|
+
<canvas ref="canvasRef" type="2d" class="ml-canvas" :canvas-id="canvasId" :id="canvasId" @touchstart="touchStart" @touchmove="touchMove" @touchend="touchEnd"></canvas>
|
|
4
4
|
</view>
|
|
5
5
|
</template>
|
|
6
6
|
|
|
@@ -56,9 +56,21 @@ export default {
|
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
});
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
59
|
+
this.$nextTick(() => {
|
|
60
|
+
if (!this.lazyLoad) {
|
|
61
|
+
// #ifdef MP-WEIXIN
|
|
62
|
+
this.initWxApplet()
|
|
63
|
+
// #endif
|
|
64
|
+
|
|
65
|
+
// #ifdef MP-ALIPAY
|
|
66
|
+
this.initAlipyApplet()
|
|
67
|
+
// #endif
|
|
68
|
+
|
|
69
|
+
// #ifdef H5
|
|
70
|
+
this.initWeb()
|
|
71
|
+
// #endif
|
|
72
|
+
}
|
|
73
|
+
})
|
|
62
74
|
},
|
|
63
75
|
beforeDestroy () {
|
|
64
76
|
if (this.chart) {
|
|
@@ -87,24 +99,23 @@ export default {
|
|
|
87
99
|
}
|
|
88
100
|
}
|
|
89
101
|
},
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
init() {
|
|
102
|
+
// #ifdef H5
|
|
103
|
+
initWeb () {
|
|
104
|
+
const chart = echarts.init(this.$refs.canvasRef.$el.firstChild)
|
|
105
|
+
this.chart = chart
|
|
106
|
+
this.loadChart()
|
|
107
|
+
},
|
|
108
|
+
// #endif
|
|
109
|
+
|
|
110
|
+
// #ifdef MP-WEIXIN
|
|
111
|
+
initWxApplet() {
|
|
101
112
|
const query = uni.createSelectorQuery().in(this)
|
|
102
113
|
query
|
|
103
|
-
.in(this)
|
|
104
114
|
.select('.ml-canvas')
|
|
105
115
|
.fields({
|
|
106
116
|
node: true,
|
|
107
|
-
size: true
|
|
117
|
+
size: true,
|
|
118
|
+
context: true
|
|
108
119
|
})
|
|
109
120
|
.exec(res => {
|
|
110
121
|
const canvasNode = res[0].node
|
|
@@ -121,15 +132,46 @@ export default {
|
|
|
121
132
|
echarts.setCanvasCreator(() => {
|
|
122
133
|
return canvas
|
|
123
134
|
})
|
|
124
|
-
|
|
125
|
-
this.$emit('init', {
|
|
126
|
-
canvas: canvas,
|
|
135
|
+
const chart = echarts.init(canvas, null, {
|
|
127
136
|
width: canvasWidth,
|
|
128
137
|
height: canvasHeight,
|
|
129
|
-
|
|
130
|
-
})
|
|
138
|
+
devicePixelRatio: canvasDpr
|
|
139
|
+
});
|
|
140
|
+
canvas.setChart(chart)
|
|
141
|
+
this.chart = chart
|
|
142
|
+
this.loadChart()
|
|
131
143
|
})
|
|
132
144
|
},
|
|
145
|
+
// #endif
|
|
146
|
+
|
|
147
|
+
// #ifdef MP-ALIPAY
|
|
148
|
+
initAlipyApplet() {
|
|
149
|
+
const query = uni.createSelectorQuery().in(this)
|
|
150
|
+
query
|
|
151
|
+
.select('.ml-canvas')
|
|
152
|
+
.boundingClientRect(res => {
|
|
153
|
+
debugger
|
|
154
|
+
const ctx = uni.createCanvasContext(this.canvasId, this)
|
|
155
|
+
this.ctx = ctx
|
|
156
|
+
const canvas = new WxCanvas(ctx, this.canvasId);
|
|
157
|
+
|
|
158
|
+
const canvasWidth = res.width
|
|
159
|
+
const canvasHeight = res.height
|
|
160
|
+
|
|
161
|
+
echarts.setCanvasCreator(() => {
|
|
162
|
+
return canvas
|
|
163
|
+
})
|
|
164
|
+
|
|
165
|
+
const chart = echarts.init(canvas, null, {
|
|
166
|
+
width: canvasWidth,
|
|
167
|
+
height: canvasHeight
|
|
168
|
+
});
|
|
169
|
+
canvas.setChart(chart)
|
|
170
|
+
this.chart = chart
|
|
171
|
+
this.loadChart()
|
|
172
|
+
}).exec()
|
|
173
|
+
},
|
|
174
|
+
// #endif
|
|
133
175
|
canvasToTempFilePath(opt) {
|
|
134
176
|
if (this.isUseNewCanvas) {
|
|
135
177
|
// 新版
|
|
@@ -3,7 +3,10 @@
|
|
|
3
3
|
<view v-if="visible" class="ml-modal-warpper" @tap.stop.prevent>
|
|
4
4
|
<view v-if="showHeader" class="ml-modal-header">
|
|
5
5
|
<slot name="header">
|
|
6
|
-
<view
|
|
6
|
+
<view class="ml-modal-header-title">{{ title }}</view>
|
|
7
|
+
<view v-if="showClose" class="ml-modal-header-close" @click="closeEvent">
|
|
8
|
+
<ml-icon name="close" />
|
|
9
|
+
</view>
|
|
7
10
|
</slot>
|
|
8
11
|
</view>
|
|
9
12
|
<view class="ml-modal-body" :style="bodyStyles">
|
|
@@ -34,6 +37,10 @@ export default {
|
|
|
34
37
|
default: true
|
|
35
38
|
},
|
|
36
39
|
showFooter: Boolean,
|
|
40
|
+
showClose: {
|
|
41
|
+
type: Boolean,
|
|
42
|
+
default: true
|
|
43
|
+
},
|
|
37
44
|
maskClosable: {
|
|
38
45
|
type: Boolean,
|
|
39
46
|
default: true
|
|
@@ -101,6 +108,9 @@ export default {
|
|
|
101
108
|
this.close()
|
|
102
109
|
}
|
|
103
110
|
},
|
|
111
|
+
closeEvent () {
|
|
112
|
+
this.close()
|
|
113
|
+
},
|
|
104
114
|
cancelEvent () {
|
|
105
115
|
if (this.cancelClosable) {
|
|
106
116
|
this.close()
|
|
@@ -150,14 +160,28 @@ export default {
|
|
|
150
160
|
font-size: $uni-font-size-lg;
|
|
151
161
|
}
|
|
152
162
|
.ml-modal-header-title {
|
|
163
|
+
flex-grow: 1;
|
|
153
164
|
text-align: center;
|
|
154
165
|
overflow: hidden;
|
|
155
166
|
text-overflow: ellipsis;
|
|
156
167
|
white-space: nowrap;
|
|
157
168
|
}
|
|
169
|
+
.ml-modal-header-close {
|
|
170
|
+
flex-shrink: 0;
|
|
171
|
+
padding-left: 10rpx;
|
|
172
|
+
font-size: 36rpx;
|
|
173
|
+
// #ifdef H5
|
|
174
|
+
cursor: pointer;
|
|
175
|
+
// #endif
|
|
176
|
+
}
|
|
158
177
|
.ml-modal-body {
|
|
159
178
|
padding: 20rpx;
|
|
179
|
+
// #ifdef MP
|
|
160
180
|
width: 600rpx;
|
|
181
|
+
// #endif
|
|
182
|
+
// #ifdef H5
|
|
183
|
+
min-width: 600rpx;
|
|
184
|
+
// #endif
|
|
161
185
|
overflow: auto;
|
|
162
186
|
max-height: 600rpx;
|
|
163
187
|
}
|
|
@@ -102,9 +102,6 @@ export default {
|
|
|
102
102
|
},
|
|
103
103
|
changeEvent (e) {
|
|
104
104
|
const index = e.detail.value
|
|
105
|
-
if (index === this.selectIndex) {
|
|
106
|
-
return
|
|
107
|
-
}
|
|
108
105
|
const item = this.optionList[index]
|
|
109
106
|
this.selectIndex = index
|
|
110
107
|
let value = null
|
|
@@ -112,7 +109,9 @@ export default {
|
|
|
112
109
|
value = item[this.optValueField]
|
|
113
110
|
}
|
|
114
111
|
this.$emit('input', value)
|
|
115
|
-
this
|
|
112
|
+
if (this.value !== value) {
|
|
113
|
+
this.$emit('change', { value, option: item })
|
|
114
|
+
}
|
|
116
115
|
},
|
|
117
116
|
clearEvent () {
|
|
118
117
|
const value = null
|