meixioacomponent 0.3.36 → 0.3.39
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/lib/meixioacomponent.common.js +204 -188
- package/lib/meixioacomponent.umd.js +204 -188
- package/lib/meixioacomponent.umd.min.js +11 -11
- package/package.json +1 -1
- package/packages/components/base/baseImg/baseImg.vue +2 -0
- package/packages/components/dynamicmount/dynamicMount.vue +26 -28
- package/packages/components/proForm/proForm/pro_form.vue +13 -4
- package/packages/components/proForm/proForm/pro_form_item.vue +8 -3
- package/src/App.vue +0 -13
package/package.json
CHANGED
|
@@ -76,6 +76,7 @@ export default {
|
|
|
76
76
|
return true
|
|
77
77
|
}
|
|
78
78
|
this.loading = false
|
|
79
|
+
this.isError = true
|
|
79
80
|
return false
|
|
80
81
|
},
|
|
81
82
|
},
|
|
@@ -152,6 +153,7 @@ export default {
|
|
|
152
153
|
img {
|
|
153
154
|
width: 100%;
|
|
154
155
|
height: 100%;
|
|
156
|
+
border-radius: inherit;
|
|
155
157
|
}
|
|
156
158
|
.img-error-wrap {
|
|
157
159
|
width: 100%;
|
|
@@ -3,10 +3,10 @@
|
|
|
3
3
|
</template>
|
|
4
4
|
|
|
5
5
|
<script>
|
|
6
|
-
import Vue from
|
|
7
|
-
import componentConfig from
|
|
6
|
+
import Vue from 'vue'
|
|
7
|
+
import componentConfig from '../../config/componentConfig'
|
|
8
8
|
export default {
|
|
9
|
-
name:
|
|
9
|
+
name: 'dynamicMount',
|
|
10
10
|
data() {
|
|
11
11
|
return {
|
|
12
12
|
id: null,
|
|
@@ -18,13 +18,13 @@ export default {
|
|
|
18
18
|
vueComponent: null,
|
|
19
19
|
//传递给被挂载的组件的props值
|
|
20
20
|
componentProps: null,
|
|
21
|
-
}
|
|
21
|
+
}
|
|
22
22
|
},
|
|
23
23
|
mounted() {
|
|
24
24
|
//console.log("dyMounted");
|
|
25
25
|
this.$nextTick(() => {
|
|
26
26
|
//console.log(this.componentMounted);
|
|
27
|
-
})
|
|
27
|
+
})
|
|
28
28
|
},
|
|
29
29
|
|
|
30
30
|
computed: {},
|
|
@@ -32,24 +32,22 @@ export default {
|
|
|
32
32
|
methods: {
|
|
33
33
|
init() {
|
|
34
34
|
// 初始化并且赋予需要挂载的组件props值
|
|
35
|
-
let props = this.vueComponent.props
|
|
36
|
-
console.log(props);
|
|
37
|
-
|
|
35
|
+
let props = this.vueComponent.props
|
|
38
36
|
if (props) {
|
|
39
|
-
if (
|
|
37
|
+
if (props instanceof Array) {
|
|
40
38
|
for (const key in this.componentProps) {
|
|
41
|
-
this.vueComponent.props.push(`${key}`)
|
|
39
|
+
this.vueComponent.props.push(`${key}`)
|
|
42
40
|
}
|
|
43
41
|
} else {
|
|
44
42
|
for (const key in this.componentProps) {
|
|
45
43
|
if (!props.hasOwnProperty(`${key}`)) {
|
|
46
|
-
Vue.set(props, `${key}`, null)
|
|
44
|
+
Vue.set(props, `${key}`, null)
|
|
47
45
|
}
|
|
48
46
|
}
|
|
49
47
|
}
|
|
50
48
|
}
|
|
51
49
|
|
|
52
|
-
const components = Vue.extend(this.vueComponent)
|
|
50
|
+
const components = Vue.extend(this.vueComponent)
|
|
53
51
|
this.componentMounted = new components({
|
|
54
52
|
propsData: {
|
|
55
53
|
...this.componentProps,
|
|
@@ -57,35 +55,35 @@ export default {
|
|
|
57
55
|
store: componentConfig.store,
|
|
58
56
|
parent: this,
|
|
59
57
|
router: componentConfig.router,
|
|
60
|
-
})
|
|
61
|
-
this.registerListen()
|
|
62
|
-
this.$children.push(this.componentMounted)
|
|
58
|
+
})
|
|
59
|
+
this.registerListen()
|
|
60
|
+
this.$children.push(this.componentMounted)
|
|
63
61
|
this.$nextTick(() => {
|
|
64
|
-
this.componentMounted.$mount()
|
|
65
|
-
this.$refs.dynamicMount.appendChild(this.componentMounted.$el)
|
|
66
|
-
})
|
|
62
|
+
this.componentMounted.$mount()
|
|
63
|
+
this.$refs.dynamicMount.appendChild(this.componentMounted.$el)
|
|
64
|
+
})
|
|
67
65
|
},
|
|
68
66
|
registerListen() {
|
|
69
|
-
this.componentMounted.$on(
|
|
70
|
-
this.componentMounted.$on(
|
|
71
|
-
this.mountedDom = null
|
|
67
|
+
this.componentMounted.$on('hook:mounted', () => {})
|
|
68
|
+
this.componentMounted.$on('hook:destroyed', () => {
|
|
69
|
+
this.mountedDom = null
|
|
72
70
|
//console.log("destroyed");
|
|
73
|
-
this.close()
|
|
74
|
-
})
|
|
71
|
+
this.close()
|
|
72
|
+
})
|
|
75
73
|
},
|
|
76
74
|
|
|
77
75
|
close() {
|
|
78
|
-
this.$destroy()
|
|
76
|
+
this.$destroy()
|
|
79
77
|
if (this.mountedDom) {
|
|
80
|
-
this.mountedDom.$destroy()
|
|
78
|
+
this.mountedDom.$destroy()
|
|
81
79
|
}
|
|
82
|
-
let dom = document.getElementById(`dynamic-${this.id}`)
|
|
80
|
+
let dom = document.getElementById(`dynamic-${this.id}`)
|
|
83
81
|
if (dom) {
|
|
84
|
-
dom.remove()
|
|
82
|
+
dom.remove()
|
|
85
83
|
}
|
|
86
84
|
},
|
|
87
85
|
},
|
|
88
|
-
}
|
|
86
|
+
}
|
|
89
87
|
</script>
|
|
90
88
|
|
|
91
89
|
<style lang="less" scoped>
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
:config="item"
|
|
33
33
|
:disabled="disabled"
|
|
34
34
|
v-model="item.value"
|
|
35
|
-
:
|
|
35
|
+
:width="formItemWidth"
|
|
36
36
|
:labelPosition="labelPosition"
|
|
37
37
|
:class="[`form-item-${item.key}`]"
|
|
38
38
|
@formItemConfirm="formItemConfirm"
|
|
@@ -45,10 +45,11 @@
|
|
|
45
45
|
</template>
|
|
46
46
|
</pro_form_itemVue>
|
|
47
47
|
<baseAreaVue
|
|
48
|
+
v-model="item.value"
|
|
48
49
|
:disable="item.disabled"
|
|
49
50
|
v-if="item.type == 'area'"
|
|
50
51
|
:ref="`area-${item.key}`"
|
|
51
|
-
|
|
52
|
+
:style="{ width: `100%` }"
|
|
52
53
|
:class="[`form-item-${item.key}`]"
|
|
53
54
|
@confirmAreaValue="
|
|
54
55
|
formItemConfirm({
|
|
@@ -102,12 +103,15 @@ export default {
|
|
|
102
103
|
name: 'baseForm',
|
|
103
104
|
data() {
|
|
104
105
|
return {
|
|
106
|
+
loading: true,
|
|
105
107
|
handleConfig: [],
|
|
106
108
|
chunkLength: null,
|
|
107
|
-
|
|
109
|
+
formItemWidth: null,
|
|
108
110
|
}
|
|
109
111
|
},
|
|
110
|
-
created() {
|
|
112
|
+
created() {
|
|
113
|
+
this.setFormItemWidth()
|
|
114
|
+
},
|
|
111
115
|
mounted() {
|
|
112
116
|
this.$nextTick(() => {
|
|
113
117
|
this.init()
|
|
@@ -363,6 +367,11 @@ export default {
|
|
|
363
367
|
disableWatcherResult(params) {
|
|
364
368
|
this.$emit('disableWatcherResult', params)
|
|
365
369
|
},
|
|
370
|
+
|
|
371
|
+
setFormItemWidth() {
|
|
372
|
+
const { labelWidth } = this.$props
|
|
373
|
+
this.formItemWidth = `calc(100% - ${labelWidth}) !important`
|
|
374
|
+
},
|
|
366
375
|
},
|
|
367
376
|
watch: {
|
|
368
377
|
chunkLength(newVal, oldVal) {
|
|
@@ -78,6 +78,7 @@
|
|
|
78
78
|
:size="size"
|
|
79
79
|
v-model="module"
|
|
80
80
|
:disabled="isDisabled"
|
|
81
|
+
:maxlength="config.maxlength"
|
|
81
82
|
v-if="config.type == 'input'"
|
|
82
83
|
style="width: 100%; height: 100%;"
|
|
83
84
|
></el-input>
|
|
@@ -88,6 +89,7 @@
|
|
|
88
89
|
:controls="false"
|
|
89
90
|
v-model.number="module"
|
|
90
91
|
:disabled="isDisabled"
|
|
92
|
+
:maxlength="config.maxlength"
|
|
91
93
|
v-else-if="config.type == 'number'"
|
|
92
94
|
style="width: 100%; height: 100%;"
|
|
93
95
|
></el-input-number>
|
|
@@ -99,6 +101,7 @@
|
|
|
99
101
|
:controls="false"
|
|
100
102
|
v-model.number="module"
|
|
101
103
|
:disabled="isDisabled"
|
|
104
|
+
:maxlength="config.maxlength"
|
|
102
105
|
style="width: 100%; height: 100%;"
|
|
103
106
|
v-else-if="config.type == 'number2'"
|
|
104
107
|
></el-input-number>
|
|
@@ -225,9 +228,9 @@ export default {
|
|
|
225
228
|
},
|
|
226
229
|
mounted() {
|
|
227
230
|
this.$nextTick(() => {
|
|
228
|
-
const {
|
|
231
|
+
const { labelPosition, width } = this.$props
|
|
229
232
|
if (labelPosition != 'top') {
|
|
230
|
-
this.$refs.formItemRef.parentNode.style.cssText +=
|
|
233
|
+
this.$refs.formItemRef.parentNode.style.cssText += `width:${width}`
|
|
231
234
|
}
|
|
232
235
|
if (this.$props.disableWatcher) {
|
|
233
236
|
this.triggerDisable(this.$props.value)
|
|
@@ -260,7 +263,9 @@ export default {
|
|
|
260
263
|
default: 'small',
|
|
261
264
|
},
|
|
262
265
|
|
|
263
|
-
|
|
266
|
+
width: {
|
|
267
|
+
type: String,
|
|
268
|
+
},
|
|
264
269
|
},
|
|
265
270
|
|
|
266
271
|
computed: {
|
package/src/App.vue
CHANGED
|
@@ -1,20 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div id="app">
|
|
3
3
|
<div style="height: 100vh">
|
|
4
|
-
<test />
|
|
5
4
|
|
|
6
|
-
<!-- <base-time-line
|
|
7
|
-
:hasTimeWeek="false"
|
|
8
|
-
:timeLineSource="items"
|
|
9
|
-
></base-time-line> -->
|
|
10
|
-
|
|
11
|
-
<!-- <base-popover-button
|
|
12
|
-
v-model="test"
|
|
13
|
-
iconClass="element"
|
|
14
|
-
buttonIcon="el-icon-delete-solid"
|
|
15
|
-
></base-popover-button>
|
|
16
|
-
|
|
17
|
-
<base-icon iconClass="element" name="el-icon-delete-solid" :event="true"> </base-icon> -->
|
|
18
5
|
</div>
|
|
19
6
|
</div>
|
|
20
7
|
</template>
|