meixioacomponent 0.2.20 → 0.2.23
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 +451 -257
- package/lib/meixioacomponent.umd.js +451 -257
- package/lib/meixioacomponent.umd.min.js +6 -6
- package/package.json +1 -1
- package/packages/components/base/baseAvatar/baseAvatar.vue +1 -1
- package/packages/components/base/baseIcon/index.vue +13 -4
- package/packages/components/base/baseLineInfoItem/baseLineInfoItem.vue +2 -1
- package/packages/components/base/basePopoverButton/index.js +6 -0
- package/packages/components/base/basePopoverButton/index.vue +128 -0
- package/packages/components/index.js +3 -0
- package/packages/components/proForm/proForm/pro_form_item.vue +1 -0
- package/packages/components/proPageTable/oa_pro_footer.vue +14 -24
- package/packages/config/selectStore/SelectStore.js +3 -1
package/package.json
CHANGED
|
@@ -5,10 +5,7 @@
|
|
|
5
5
|
@click.stop="iconClick"
|
|
6
6
|
:class="{ event: event && !disable, plain: plain, disable: disable }"
|
|
7
7
|
>
|
|
8
|
-
<i
|
|
9
|
-
:class="`meixicomponenticonfont ${name}`"
|
|
10
|
-
:style="{ color: _color, fontSize: _size }"
|
|
11
|
-
></i>
|
|
8
|
+
<i :class="iconName" :style="{ color: _color, fontSize: _size }"></i>
|
|
12
9
|
</div>
|
|
13
10
|
</template>
|
|
14
11
|
|
|
@@ -20,6 +17,10 @@ export default {
|
|
|
20
17
|
},
|
|
21
18
|
|
|
22
19
|
props: {
|
|
20
|
+
iconClass: {
|
|
21
|
+
type: String,
|
|
22
|
+
default: "meixi",
|
|
23
|
+
},
|
|
23
24
|
event: {
|
|
24
25
|
type: Boolean,
|
|
25
26
|
default: false,
|
|
@@ -94,6 +95,14 @@ export default {
|
|
|
94
95
|
}
|
|
95
96
|
return size;
|
|
96
97
|
},
|
|
98
|
+
iconName() {
|
|
99
|
+
let _iconClass = this.$props.iconClass;
|
|
100
|
+
if (_iconClass == "meixi") {
|
|
101
|
+
return `meixicomponenticonfont ${this.$props.name}`;
|
|
102
|
+
} else if (_iconClass == "element") {
|
|
103
|
+
return `${this.$props.name}`;
|
|
104
|
+
}
|
|
105
|
+
},
|
|
97
106
|
},
|
|
98
107
|
methods: {
|
|
99
108
|
iconClick() {
|
|
@@ -147,7 +147,8 @@ export default {
|
|
|
147
147
|
}
|
|
148
148
|
.infor-value {
|
|
149
149
|
box-sizing: border-box;
|
|
150
|
-
padding: var(--padding-5)
|
|
150
|
+
padding: var(--padding-5) 0px;
|
|
151
|
+
padding-left: var(--padding-5);
|
|
151
152
|
span {
|
|
152
153
|
color: var(--font-color-d);
|
|
153
154
|
font-size: var(--font-size-base);
|
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<el-popover
|
|
3
|
+
v-model="module"
|
|
4
|
+
:trigger="trigger"
|
|
5
|
+
@show="popoverShow"
|
|
6
|
+
@hide="popoverHide"
|
|
7
|
+
:placement="placement"
|
|
8
|
+
>
|
|
9
|
+
<template>
|
|
10
|
+
<div class="popover-content" ref="popoverContent">
|
|
11
|
+
<slot name="popoverContent"></slot>
|
|
12
|
+
</div>
|
|
13
|
+
</template>
|
|
14
|
+
<el-button
|
|
15
|
+
slot="reference"
|
|
16
|
+
:size="buttonSize"
|
|
17
|
+
class="popover-button"
|
|
18
|
+
:type="module ? 'selected' : 'info'"
|
|
19
|
+
>
|
|
20
|
+
<base-icon
|
|
21
|
+
:size="`s`"
|
|
22
|
+
:color="module ? 'text-white' : 'd'"
|
|
23
|
+
:plain="true"
|
|
24
|
+
:event="true"
|
|
25
|
+
v-if="buttonIcon"
|
|
26
|
+
:name="buttonIcon"
|
|
27
|
+
class="button-icon"
|
|
28
|
+
:iconClass="iconClass"
|
|
29
|
+
@iconClick="iconClick"
|
|
30
|
+
></base-icon>
|
|
31
|
+
<span class="inner-span" v-if="buttonText"> {{ buttonText }}</span>
|
|
32
|
+
</el-button>
|
|
33
|
+
</el-popover>
|
|
34
|
+
</template>
|
|
35
|
+
|
|
36
|
+
<script>
|
|
37
|
+
export default {
|
|
38
|
+
name: "basePopoverButton",
|
|
39
|
+
data() {
|
|
40
|
+
return {};
|
|
41
|
+
},
|
|
42
|
+
|
|
43
|
+
props: {
|
|
44
|
+
// 是否禁用
|
|
45
|
+
disabled: {
|
|
46
|
+
type: Boolean,
|
|
47
|
+
default: false,
|
|
48
|
+
},
|
|
49
|
+
// 触发方式
|
|
50
|
+
// click/focus/hover/manual
|
|
51
|
+
trigger: {
|
|
52
|
+
type: String,
|
|
53
|
+
default: "click",
|
|
54
|
+
},
|
|
55
|
+
// 位置
|
|
56
|
+
// top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end
|
|
57
|
+
placement: {
|
|
58
|
+
default: "bottom",
|
|
59
|
+
type: String,
|
|
60
|
+
},
|
|
61
|
+
// button 按钮的大小
|
|
62
|
+
buttonSize: {
|
|
63
|
+
default: "small",
|
|
64
|
+
},
|
|
65
|
+
// 控制显影的参数
|
|
66
|
+
value: {
|
|
67
|
+
default: false,
|
|
68
|
+
},
|
|
69
|
+
|
|
70
|
+
// button文字内容
|
|
71
|
+
buttonText: {
|
|
72
|
+
type: String,
|
|
73
|
+
default: "",
|
|
74
|
+
},
|
|
75
|
+
|
|
76
|
+
// icon的类名
|
|
77
|
+
buttonIcon: {
|
|
78
|
+
type: String,
|
|
79
|
+
|
|
80
|
+
require: false,
|
|
81
|
+
},
|
|
82
|
+
|
|
83
|
+
iconClass: {
|
|
84
|
+
type: String,
|
|
85
|
+
default: "meixi",
|
|
86
|
+
},
|
|
87
|
+
},
|
|
88
|
+
computed: {
|
|
89
|
+
module: {
|
|
90
|
+
set(val) {
|
|
91
|
+
this.$emit("input", val);
|
|
92
|
+
},
|
|
93
|
+
get() {
|
|
94
|
+
return this.$props.value;
|
|
95
|
+
},
|
|
96
|
+
},
|
|
97
|
+
},
|
|
98
|
+
methods: {
|
|
99
|
+
popoverShow() {
|
|
100
|
+
this.$emit("popoverShow");
|
|
101
|
+
},
|
|
102
|
+
popoverHide() {
|
|
103
|
+
this.$emit("poporverHide");
|
|
104
|
+
},
|
|
105
|
+
iconClick() {
|
|
106
|
+
this.module = true;
|
|
107
|
+
},
|
|
108
|
+
},
|
|
109
|
+
};
|
|
110
|
+
</script>
|
|
111
|
+
|
|
112
|
+
<style lang="less" scoped>
|
|
113
|
+
.popover-content {
|
|
114
|
+
}
|
|
115
|
+
.popover-button {
|
|
116
|
+
.button-icon {
|
|
117
|
+
}
|
|
118
|
+
/deep/ span {
|
|
119
|
+
display: flex;
|
|
120
|
+
align-items: center;
|
|
121
|
+
flex-flow: row nowrap;
|
|
122
|
+
justify-content: flex-start;
|
|
123
|
+
}
|
|
124
|
+
.inner-span {
|
|
125
|
+
margin-left: var(--margin-3);
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
</style>
|
|
@@ -32,6 +32,7 @@ import baseFormWrap from "./proForm/proFormWrap/index";
|
|
|
32
32
|
import baseProTable from "./proPageTable/index";
|
|
33
33
|
import baseMoverVerifiBar from "./base/baseMoverVerifiBar";
|
|
34
34
|
import baseTimeLine from "./base/baseTimeLine";
|
|
35
|
+
import basePopoverButton from "./base/basePopoverButton";
|
|
35
36
|
// js 文件相关
|
|
36
37
|
import Theme from "../config/theme/theme";
|
|
37
38
|
import DynamicMount from "./dynamicmount/index.js";
|
|
@@ -77,6 +78,7 @@ const meixicomponents = [
|
|
|
77
78
|
baseProTable,
|
|
78
79
|
baseMoverVerifiBar,
|
|
79
80
|
baseTimeLine,
|
|
81
|
+
basePopoverButton,
|
|
80
82
|
];
|
|
81
83
|
|
|
82
84
|
const install = (Vue) => {
|
|
@@ -128,6 +130,7 @@ export default {
|
|
|
128
130
|
baseProTable,
|
|
129
131
|
baseMoverVerifiBar,
|
|
130
132
|
baseTimeLine,
|
|
133
|
+
basePopoverButton,
|
|
131
134
|
Theme,
|
|
132
135
|
SelectStore,
|
|
133
136
|
useImg,
|
|
@@ -7,25 +7,16 @@
|
|
|
7
7
|
</div>
|
|
8
8
|
</div>
|
|
9
9
|
<div class="footer-right">
|
|
10
|
-
<
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
@hide="popoverHide"
|
|
10
|
+
<basePopoverButton
|
|
11
|
+
:placement="`top`"
|
|
12
|
+
v-model="popoverFlag"
|
|
13
|
+
:iconClass="`element`"
|
|
14
|
+
:buttonIcon="`el-icon-s-fold`"
|
|
16
15
|
>
|
|
17
|
-
<template>
|
|
16
|
+
<template slot="popoverContent">
|
|
18
17
|
<oa_pro_handle_table_borderVue></oa_pro_handle_table_borderVue>
|
|
19
18
|
</template>
|
|
20
|
-
|
|
21
|
-
size="mini"
|
|
22
|
-
:type="selected ? 'selected' : 'info'"
|
|
23
|
-
slot="reference"
|
|
24
|
-
class="handle-table-border"
|
|
25
|
-
>
|
|
26
|
-
<i class="el-icon-s-fold"></i>
|
|
27
|
-
</el-button>
|
|
28
|
-
</el-popover>
|
|
19
|
+
</basePopoverButton>
|
|
29
20
|
|
|
30
21
|
<base-pagination
|
|
31
22
|
:config="pageConfig"
|
|
@@ -38,11 +29,12 @@
|
|
|
38
29
|
</template>
|
|
39
30
|
|
|
40
31
|
<script>
|
|
32
|
+
import basePopoverButton from "../base/basePopoverButton/index.vue";
|
|
41
33
|
import oa_pro_handle_table_borderVue from "./oa_pro_handle_table_border.vue";
|
|
42
34
|
export default {
|
|
43
35
|
data() {
|
|
44
36
|
return {
|
|
45
|
-
|
|
37
|
+
popoverFlag: false,
|
|
46
38
|
};
|
|
47
39
|
},
|
|
48
40
|
props: {
|
|
@@ -57,6 +49,7 @@ export default {
|
|
|
57
49
|
},
|
|
58
50
|
},
|
|
59
51
|
components: {
|
|
52
|
+
basePopoverButton,
|
|
60
53
|
oa_pro_handle_table_borderVue,
|
|
61
54
|
},
|
|
62
55
|
methods: {
|
|
@@ -68,13 +61,6 @@ export default {
|
|
|
68
61
|
this.$emit("pageCurrentChange");
|
|
69
62
|
this.$parent.startHttp(false);
|
|
70
63
|
},
|
|
71
|
-
popoverShow() {
|
|
72
|
-
this.selected = true;
|
|
73
|
-
},
|
|
74
|
-
|
|
75
|
-
popoverHide() {
|
|
76
|
-
this.selected = false;
|
|
77
|
-
},
|
|
78
64
|
},
|
|
79
65
|
};
|
|
80
66
|
</script>
|
|
@@ -137,5 +123,9 @@ export default {
|
|
|
137
123
|
justify-content: flex-end;
|
|
138
124
|
}
|
|
139
125
|
}
|
|
126
|
+
|
|
127
|
+
/deep/ .el-button--small {
|
|
128
|
+
padding: 10px !important;
|
|
129
|
+
}
|
|
140
130
|
}
|
|
141
131
|
</style>
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import componentConfig from "../componentConfig";
|
|
2
1
|
class SelectStore {
|
|
3
2
|
constructor(params) {
|
|
4
3
|
this.data = [];
|
|
@@ -8,6 +7,9 @@ class SelectStore {
|
|
|
8
7
|
}
|
|
9
8
|
|
|
10
9
|
async loadData() {
|
|
10
|
+
if (this.loading) {
|
|
11
|
+
return;
|
|
12
|
+
}
|
|
11
13
|
this.loading = true;
|
|
12
14
|
let result = await this.request();
|
|
13
15
|
|