meixioacomponent 0.1.92 → 0.1.93
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 +126 -59
- package/lib/meixioacomponent.umd.js +126 -59
- package/lib/meixioacomponent.umd.min.js +5 -5
- package/lib/style/theme/dark.less +3 -3
- package/lib/style/theme/light.less +2 -0
- package/package.json +1 -1
- package/packages/components/proPageTable/oa_pro_table-header.vue +1 -2
- package/packages/components/proPageTable/oa_pro_table.vue +1 -0
- package/packages/components/style/theme/dark.less +3 -3
- package/packages/components/style/theme/light.less +2 -0
- package/packages/config/componentConfig.js +4 -1
- package/packages/config/theme/theme.js +42 -0
- package/public/index.html +1 -1
|
@@ -29,13 +29,13 @@
|
|
|
29
29
|
0px 6px 30px rgba(0, 0, 0, 0.12), 0px 8px 10px rgba(0, 0, 0, 0.2);
|
|
30
30
|
// table border颜色
|
|
31
31
|
--color-table-border: var(--color-border);
|
|
32
|
+
|
|
33
|
+
// table header背景颜色
|
|
34
|
+
--color-table-header: var(--color-gray-d);
|
|
32
35
|
// tooltip 背景颜色
|
|
33
36
|
--color-tooltip: var(--color-gray-d);
|
|
34
37
|
//
|
|
35
38
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
39
|
/* CSS Document */
|
|
40
40
|
|
|
41
41
|
/** code highlight */
|
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div class="table-header" v-show="config.
|
|
2
|
+
<div class="table-header" v-show="config.key != 'noData'">
|
|
3
3
|
<div class="table-header-left">
|
|
4
4
|
<span class="cell-text">{{ scope.column.label }} </span>
|
|
5
5
|
<span class="caret-wrapper defind">
|
|
@@ -8,7 +8,6 @@
|
|
|
8
8
|
</span>
|
|
9
9
|
</div>
|
|
10
10
|
<div class="table-header-right">
|
|
11
|
-
<!-- <i :class="lockClass" @click="test"></i> -->
|
|
12
11
|
<base-icon
|
|
13
12
|
:color="`s`"
|
|
14
13
|
:size="`s`"
|
|
@@ -29,13 +29,13 @@
|
|
|
29
29
|
0px 6px 30px rgba(0, 0, 0, 0.12), 0px 8px 10px rgba(0, 0, 0, 0.2);
|
|
30
30
|
// table border颜色
|
|
31
31
|
--color-table-border: var(--color-border);
|
|
32
|
+
|
|
33
|
+
// table header背景颜色
|
|
34
|
+
--color-table-header: var(--color-gray-d);
|
|
32
35
|
// tooltip 背景颜色
|
|
33
36
|
--color-tooltip: var(--color-gray-d);
|
|
34
37
|
//
|
|
35
38
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
39
|
/* CSS Document */
|
|
40
40
|
|
|
41
41
|
/** code highlight */
|
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
import Theme from "./theme/theme";
|
|
2
2
|
import selectStore from "./storeModule/selectStore";
|
|
3
3
|
const componentConfig = {
|
|
4
4
|
store: null,
|
|
5
5
|
router: null,
|
|
6
6
|
dynamicId: 0,
|
|
7
|
+
theme: null,
|
|
7
8
|
selectStore: null,
|
|
8
9
|
|
|
9
10
|
setDynamicId: () => {
|
|
@@ -19,6 +20,8 @@ const componentConfig = {
|
|
|
19
20
|
componentConfig.router = _router;
|
|
20
21
|
componentConfig.selectStore =
|
|
21
22
|
componentConfig.store.getters["selectStore/getSelectStore"];
|
|
23
|
+
// 初始化主题
|
|
24
|
+
componentConfig.theme = new Theme();
|
|
22
25
|
},
|
|
23
26
|
};
|
|
24
27
|
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
class Theme {
|
|
2
|
+
constructor() {
|
|
3
|
+
// 主题支持的类型
|
|
4
|
+
this.config = ["light", "dark"];
|
|
5
|
+
// 当前被选中的类型
|
|
6
|
+
this.currentTheme = null;
|
|
7
|
+
this.init();
|
|
8
|
+
}
|
|
9
|
+
init() {
|
|
10
|
+
let localConfig = window.localStorage.getItem("theme");
|
|
11
|
+
if (localConfig) {
|
|
12
|
+
let index = this.config.findIndex((item) => {
|
|
13
|
+
return item == localConfig;
|
|
14
|
+
});
|
|
15
|
+
if (index > -1) {
|
|
16
|
+
this.setCurrentTheme(this.config[index]);
|
|
17
|
+
} else {
|
|
18
|
+
this.setCurrentTheme(this.config[0]);
|
|
19
|
+
}
|
|
20
|
+
} else {
|
|
21
|
+
this.setCurrentTheme(this.config[0]);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
addThemeConfig(text) {
|
|
25
|
+
this.config.push(text);
|
|
26
|
+
}
|
|
27
|
+
setTheme(themeText) {
|
|
28
|
+
document.documentElement.setAttribute("theme-mode", `${themeText}`);
|
|
29
|
+
// 保存至本地
|
|
30
|
+
window.localStorage.setItem("theme", this.currentTheme);
|
|
31
|
+
}
|
|
32
|
+
setCurrentTheme(themeText) {
|
|
33
|
+
this.currentTheme = themeText;
|
|
34
|
+
// 设置html 属性 同步视图层
|
|
35
|
+
this.setTheme(this.currentTheme);
|
|
36
|
+
}
|
|
37
|
+
getCurrentTheme() {
|
|
38
|
+
return this.currentTheme;
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
export default Theme;
|
package/public/index.html
CHANGED