1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
| import { type App, reactive } from "vue";
| import { mitt } from "./utils/mitt";
| import { emitter } from "./emitter";
| import { locale } from "./locale";
| import { merge } from "./utils";
|
| // 设置配置
| function setConfig(app: App, options: Options = {}) {
| const config = merge(
| {
| permission: {
| update: true,
| page: true,
| info: true,
| list: true,
| add: true,
| delete: true
| },
| dict: {
| primaryId: "id",
| api: {
| list: "list",
| add: "add",
| update: "update",
| delete: "delete",
| info: "info",
| page: "page"
| },
| pagination: {
| page: "page",
| size: "size"
| },
| search: {
| keyWord: "keyWord",
| query: "query"
| },
| sort: {
| order: "order",
| prop: "prop"
| },
| label: locale["zh-cn"]
| },
| style: {
| colors: [
| "#d42ca8",
| "#1c109d",
| "#6d17c3",
| "#6dc9f1",
| "#04c273",
| "#06b31c",
| "#f9f494",
| "#aa7a24",
| "#d57121",
| "#e93f4d"
| ],
| form: {
| labelPostion: "right",
| labelWidth: "100px",
| span: 24
| },
| table: {
| border: true,
| highlightCurrentRow: true,
| autoHeight: true,
| contextMenu: ["refresh", "check", "edit", "delete", "order-asc", "order-desc"],
| column: {
| align: "center",
| opWidth: 180
| }
| }
| },
| events: {}
| } as Options,
| options
| );
|
| // 初始化事件
| if (config.events) {
| emitter.init(config.events);
| }
|
| app.provide("__config__", config);
|
| return config;
| }
|
| // 设置浏览器
| function setBrowser(app: App) {
| // 浏览器信息
| const browser = reactive({
| isMini: false,
| screen: "full"
| });
|
| // 更新信息
| function update() {
| const w = document.body.clientWidth;
|
| if (w < 768) {
| browser.screen = "xs";
| } else if (w < 992) {
| browser.screen = "sm";
| } else if (w < 1200) {
| browser.screen = "md";
| } else if (w < 1920) {
| browser.screen = "xl";
| } else {
| browser.screen = "full";
| }
|
| browser.isMini = browser.screen === "xs";
| }
|
| // 监听浏览器窗口变化
| window.addEventListener("resize", () => {
| update();
|
| // 事件
| mitt.emit("resize");
| });
|
| update();
| app.provide("__browser__", browser);
| }
|
| export function useProvide(app: App, options: Options = {}) {
| setBrowser(app);
| setConfig(app, options);
| }
|
|