fdb2 1.0.34 → 1.0.36
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/README.md +24 -3
- package/dist/public/explorer.css +1322 -1235
- package/dist/public/explorer.js +908 -872
- package/dist/public/index.css +717 -118
- package/dist/public/index.js +277 -27
- package/dist/public/layout.css +320 -125
- package/dist/public/layout.js +186 -28
- package/dist/public/vue.js +1 -1
- package/dist/server/index.d.ts.map +1 -1
- package/dist/server/index.js.map +1 -1
- package/dist/server/index.ts +0 -1
- package/dist/server/service/database/clickhouse-connection.d.ts.map +1 -1
- package/dist/server/service/database/clickhouse-connection.js +3 -3
- package/dist/server/service/database/clickhouse-connection.js.map +1 -1
- package/dist/server/service/database/clickhouse-connection.ts +3 -3
- package/package.json +6 -2
- package/public/fdb2.png +0 -0
package/dist/public/explorer.css
CHANGED
|
@@ -1,416 +1,425 @@
|
|
|
1
1
|
|
|
2
2
|
/* 继承原有的样式，这里可以添加组件特定的样式 */
|
|
3
|
-
.connection-form-modern[data-v-
|
|
3
|
+
.connection-form-modern[data-v-7681a313] {
|
|
4
4
|
padding: 0;
|
|
5
5
|
}
|
|
6
|
-
.form-section[data-v-
|
|
7
|
-
margin-bottom:
|
|
6
|
+
.form-section[data-v-7681a313] {
|
|
7
|
+
margin-bottom: 1.25rem;
|
|
8
8
|
}
|
|
9
|
-
.section-header[data-v-
|
|
9
|
+
.section-header[data-v-7681a313] {
|
|
10
10
|
display: flex;
|
|
11
11
|
align-items: center;
|
|
12
|
-
margin-bottom:
|
|
13
|
-
padding-bottom: 0.
|
|
14
|
-
border-bottom:
|
|
12
|
+
margin-bottom: 0.75rem;
|
|
13
|
+
padding-bottom: 0.5rem;
|
|
14
|
+
border-bottom: 1px solid var(--db-border);
|
|
15
15
|
}
|
|
16
|
-
.section-icon[data-v-
|
|
17
|
-
width:
|
|
18
|
-
height:
|
|
19
|
-
border-radius:
|
|
20
|
-
background:
|
|
16
|
+
.section-icon[data-v-7681a313] {
|
|
17
|
+
width: 26px;
|
|
18
|
+
height: 26px;
|
|
19
|
+
border-radius: 5px;
|
|
20
|
+
background: var(--db-primary-bg);
|
|
21
21
|
display: flex;
|
|
22
22
|
align-items: center;
|
|
23
23
|
justify-content: center;
|
|
24
|
-
color:
|
|
25
|
-
|
|
24
|
+
color: var(--db-primary-color);
|
|
25
|
+
font-size: 0.8125rem;
|
|
26
|
+
margin-right: 0.5rem;
|
|
27
|
+
flex-shrink: 0;
|
|
26
28
|
}
|
|
27
|
-
.section-title[data-v-
|
|
28
|
-
font-size:
|
|
29
|
+
.section-title[data-v-7681a313] {
|
|
30
|
+
font-size: 0.875rem;
|
|
29
31
|
font-weight: 600;
|
|
30
32
|
margin: 0;
|
|
31
|
-
color:
|
|
33
|
+
color: var(--db-dark-color);
|
|
32
34
|
}
|
|
33
|
-
.section-content[data-v-
|
|
34
|
-
padding-left:
|
|
35
|
+
.section-content[data-v-7681a313] {
|
|
36
|
+
padding-left: 0;
|
|
35
37
|
}
|
|
36
|
-
.form-grid[data-v-
|
|
38
|
+
.form-grid[data-v-7681a313] {
|
|
37
39
|
display: grid;
|
|
38
|
-
grid-template-columns: repeat(auto-fit, minmax(
|
|
39
|
-
gap:
|
|
40
|
+
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
|
41
|
+
gap: 0.75rem;
|
|
40
42
|
}
|
|
41
|
-
.form-group-modern[data-v-
|
|
42
|
-
margin-bottom:
|
|
43
|
+
.form-group-modern[data-v-7681a313] {
|
|
44
|
+
margin-bottom: 0.625rem;
|
|
43
45
|
}
|
|
44
|
-
.form-label-modern[data-v-
|
|
46
|
+
.form-label-modern[data-v-7681a313] {
|
|
45
47
|
display: flex;
|
|
46
48
|
align-items: center;
|
|
47
49
|
font-weight: 600;
|
|
48
|
-
color:
|
|
49
|
-
margin-bottom: 0.
|
|
50
|
-
font-size: 0.
|
|
50
|
+
color: var(--db-text-muted);
|
|
51
|
+
margin-bottom: 0.25rem;
|
|
52
|
+
font-size: 0.75rem;
|
|
51
53
|
}
|
|
52
|
-
.form-control-modern[data-v-
|
|
53
|
-
.form-select-modern[data-v-
|
|
54
|
+
.form-control-modern[data-v-7681a313],
|
|
55
|
+
.form-select-modern[data-v-7681a313] {
|
|
54
56
|
width: 100%;
|
|
55
|
-
padding: 0.
|
|
56
|
-
border:
|
|
57
|
-
border-radius:
|
|
58
|
-
font-size: 0.
|
|
59
|
-
transition:
|
|
60
|
-
color:
|
|
61
|
-
background-color:
|
|
57
|
+
padding: 0.3rem 0.5rem;
|
|
58
|
+
border: 1px solid var(--db-border-light);
|
|
59
|
+
border-radius: 4px;
|
|
60
|
+
font-size: 0.8125rem;
|
|
61
|
+
transition: border-color 0.15s ease, box-shadow 0.15s ease;
|
|
62
|
+
color: var(--db-text-body);
|
|
63
|
+
background-color: var(--db-bg-soft);
|
|
62
64
|
}
|
|
63
|
-
.form-control-modern[data-v-
|
|
64
|
-
.form-select-modern[data-v-
|
|
65
|
+
.form-control-modern[data-v-7681a313]:focus,
|
|
66
|
+
.form-select-modern[data-v-7681a313]:focus {
|
|
65
67
|
outline: none;
|
|
66
|
-
border-color:
|
|
67
|
-
box-shadow: 0 0 0
|
|
68
|
+
border-color: var(--db-primary-color);
|
|
69
|
+
box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.25);
|
|
68
70
|
}
|
|
69
|
-
.form-check-modern[data-v-
|
|
71
|
+
.form-check-modern[data-v-7681a313] {
|
|
70
72
|
display: flex;
|
|
71
73
|
align-items: flex-start;
|
|
72
74
|
padding: 0;
|
|
73
75
|
}
|
|
74
|
-
.form-check-input-modern[data-v-
|
|
75
|
-
margin-right: 0.
|
|
76
|
-
margin-top: 0.
|
|
76
|
+
.form-check-input-modern[data-v-7681a313] {
|
|
77
|
+
margin-right: 0.5rem;
|
|
78
|
+
margin-top: 0.2rem;
|
|
77
79
|
}
|
|
78
|
-
.form-check-label-modern[data-v-
|
|
80
|
+
.form-check-label-modern[data-v-7681a313] {
|
|
79
81
|
display: flex;
|
|
80
82
|
flex-direction: column;
|
|
81
83
|
cursor: pointer;
|
|
82
84
|
}
|
|
83
|
-
.check-text[data-v-
|
|
85
|
+
.check-text[data-v-7681a313] {
|
|
84
86
|
font-weight: 500;
|
|
85
|
-
|
|
86
|
-
|
|
87
|
+
font-size: 0.8125rem;
|
|
88
|
+
color: var(--db-text-body);
|
|
89
|
+
margin-bottom: 0.125rem;
|
|
87
90
|
}
|
|
88
|
-
.check-description[data-v-
|
|
89
|
-
font-size: 0.
|
|
90
|
-
color:
|
|
91
|
+
.check-description[data-v-7681a313] {
|
|
92
|
+
font-size: 0.6875rem;
|
|
93
|
+
color: var(--db-text-muted);
|
|
91
94
|
}
|
|
92
|
-
.required[data-v-
|
|
93
|
-
color:
|
|
95
|
+
.required[data-v-7681a313] {
|
|
96
|
+
color: var(--db-danger-color);
|
|
94
97
|
margin-left: 0.25rem;
|
|
95
98
|
}
|
|
96
|
-
.error-content[data-v-
|
|
99
|
+
.error-content[data-v-7681a313] {
|
|
97
100
|
display: flex;
|
|
98
101
|
align-items: center;
|
|
99
|
-
padding:
|
|
100
|
-
gap:
|
|
102
|
+
padding: 0.75rem;
|
|
103
|
+
gap: 0.625rem;
|
|
104
|
+
background-color: var(--db-danger-bg);
|
|
105
|
+
border: 1px solid rgba(239, 68, 68, 0.35);
|
|
106
|
+
border-radius: 4px;
|
|
101
107
|
}
|
|
102
|
-
.error-icon[data-v-
|
|
103
|
-
width:
|
|
104
|
-
height:
|
|
108
|
+
.error-icon[data-v-7681a313] {
|
|
109
|
+
width: 28px;
|
|
110
|
+
height: 28px;
|
|
105
111
|
border-radius: 50%;
|
|
106
|
-
background:
|
|
112
|
+
background: rgba(239, 68, 68, 0.18);
|
|
107
113
|
display: flex;
|
|
108
114
|
align-items: center;
|
|
109
115
|
justify-content: center;
|
|
110
|
-
color:
|
|
111
|
-
font-size:
|
|
116
|
+
color: var(--db-danger-color);
|
|
117
|
+
font-size: 0.9375rem;
|
|
112
118
|
flex-shrink: 0;
|
|
113
119
|
}
|
|
114
|
-
.error-message[data-v-
|
|
120
|
+
.error-message[data-v-7681a313] {
|
|
115
121
|
flex: 1;
|
|
116
|
-
color:
|
|
117
|
-
font-size: 0.
|
|
122
|
+
color: var(--db-text-body);
|
|
123
|
+
font-size: 0.8125rem;
|
|
118
124
|
line-height: 1.6;
|
|
119
125
|
}
|
|
120
126
|
|
|
121
|
-
.sql-executor[data-v-
|
|
127
|
+
.sql-executor[data-v-4b956460] {
|
|
122
128
|
width: 100%;
|
|
123
129
|
flex: 1;
|
|
124
130
|
display: flex;
|
|
125
131
|
flex-direction: column;
|
|
126
|
-
gap:
|
|
132
|
+
gap: 8px;
|
|
127
133
|
}
|
|
128
|
-
.sql-toolbar[data-v-
|
|
134
|
+
.sql-toolbar[data-v-4b956460] {
|
|
129
135
|
display: flex;
|
|
130
136
|
justify-content: space-between;
|
|
131
137
|
align-items: center;
|
|
132
|
-
margin-bottom:
|
|
133
|
-
padding:
|
|
134
|
-
background-color:
|
|
138
|
+
margin-bottom: 8px;
|
|
139
|
+
padding: 6px 8px;
|
|
140
|
+
background-color: var(--db-bg-soft2);
|
|
135
141
|
border-radius: 4px;
|
|
136
142
|
}
|
|
137
|
-
.toolbar-left[data-v-
|
|
138
|
-
.toolbar-right[data-v-
|
|
143
|
+
.toolbar-left[data-v-4b956460],
|
|
144
|
+
.toolbar-right[data-v-4b956460] {
|
|
139
145
|
display: flex;
|
|
140
|
-
gap:
|
|
146
|
+
gap: 6px;
|
|
141
147
|
}
|
|
142
|
-
.sql-container[data-v-
|
|
148
|
+
.sql-container[data-v-4b956460] {
|
|
143
149
|
position: relative;
|
|
144
|
-
border: 1px solid
|
|
150
|
+
border: 1px solid var(--db-border);
|
|
145
151
|
border-radius: 4px;
|
|
146
152
|
overflow: hidden;
|
|
147
153
|
flex: 1;
|
|
148
154
|
display: flex;
|
|
149
155
|
flex-direction: column;
|
|
150
156
|
}
|
|
151
|
-
.sql-editor[data-v-
|
|
157
|
+
.sql-editor[data-v-4b956460] {
|
|
152
158
|
position: relative;
|
|
153
159
|
overflow: auto;
|
|
154
|
-
flex: 0 1
|
|
155
|
-
min-height:
|
|
160
|
+
flex: 0 1 260px;
|
|
161
|
+
min-height: 160px;
|
|
156
162
|
}
|
|
157
|
-
.sql-result[data-v-
|
|
163
|
+
.sql-result[data-v-4b956460] {
|
|
158
164
|
position: relative;
|
|
159
165
|
overflow: auto;
|
|
160
|
-
border-top: 1px solid
|
|
166
|
+
border-top: 1px solid var(--db-border-lighter);
|
|
161
167
|
flex: 1;
|
|
162
168
|
}
|
|
163
|
-
.codemirror-editor[data-v-
|
|
169
|
+
.codemirror-editor[data-v-4b956460] {
|
|
164
170
|
height: 100%;
|
|
165
171
|
width: 100%;
|
|
166
172
|
}
|
|
167
|
-
.resizer[data-v-
|
|
173
|
+
.resizer[data-v-4b956460] {
|
|
168
174
|
height: 8px;
|
|
169
|
-
background-color:
|
|
175
|
+
background-color: var(--db-border-soft);
|
|
170
176
|
cursor: ns-resize;
|
|
171
177
|
display: flex;
|
|
172
178
|
align-items: center;
|
|
173
179
|
justify-content: center;
|
|
174
180
|
}
|
|
175
|
-
.resizer[data-v-
|
|
176
|
-
background-color:
|
|
181
|
+
.resizer[data-v-4b956460]:hover {
|
|
182
|
+
background-color: var(--db-border-lighter);
|
|
177
183
|
}
|
|
178
|
-
.resizer[data-v-
|
|
184
|
+
.resizer[data-v-4b956460]::before {
|
|
179
185
|
content: '';
|
|
180
186
|
width: 40px;
|
|
181
187
|
height: 2px;
|
|
182
|
-
background-color:
|
|
188
|
+
background-color: var(--db-border-light);
|
|
183
189
|
border-radius: 1px;
|
|
184
190
|
}
|
|
185
|
-
.resizer.resizing[data-v-
|
|
186
|
-
background-color:
|
|
191
|
+
.resizer.resizing[data-v-4b956460] {
|
|
192
|
+
background-color: var(--db-border-lighter);
|
|
187
193
|
}
|
|
188
|
-
.resizer.resizing[data-v-
|
|
189
|
-
background-color:
|
|
194
|
+
.resizer.resizing[data-v-4b956460]::before {
|
|
195
|
+
background-color: var(--db-text-muted);
|
|
190
196
|
}
|
|
191
|
-
.sql-result[data-v-
|
|
197
|
+
.sql-result[data-v-4b956460] {
|
|
192
198
|
position: relative;
|
|
193
199
|
overflow: auto;
|
|
194
|
-
border-top: 1px solid
|
|
200
|
+
border-top: 1px solid var(--db-border-lighter);
|
|
195
201
|
}
|
|
196
|
-
.result-content[data-v-
|
|
202
|
+
.result-content[data-v-4b956460] {
|
|
197
203
|
height: 100%;
|
|
198
204
|
display: flex;
|
|
199
205
|
flex-direction: column;
|
|
200
206
|
}
|
|
201
|
-
.result-header[data-v-
|
|
207
|
+
.result-header[data-v-4b956460] {
|
|
202
208
|
display: flex;
|
|
203
209
|
justify-content: space-between;
|
|
204
210
|
align-items: center;
|
|
205
|
-
padding:
|
|
206
|
-
background-color:
|
|
207
|
-
border-bottom: 1px solid
|
|
211
|
+
padding: 6px 10px;
|
|
212
|
+
background-color: var(--db-bg-soft2);
|
|
213
|
+
border-bottom: 1px solid var(--db-border);
|
|
208
214
|
}
|
|
209
|
-
.result-title[data-v-
|
|
215
|
+
.result-title[data-v-4b956460] {
|
|
210
216
|
margin: 0;
|
|
211
|
-
font-size:
|
|
217
|
+
font-size: 13px;
|
|
212
218
|
font-weight: 600;
|
|
213
219
|
display: flex;
|
|
214
220
|
align-items: center;
|
|
215
221
|
gap: 8px;
|
|
216
222
|
}
|
|
217
|
-
.sql-loading[data-v-
|
|
223
|
+
.sql-loading[data-v-4b956460] {
|
|
218
224
|
display: flex;
|
|
219
225
|
align-items: center;
|
|
220
226
|
gap: 8px;
|
|
221
227
|
}
|
|
222
|
-
.result-stats[data-v-
|
|
228
|
+
.result-stats[data-v-4b956460] {
|
|
223
229
|
display: flex;
|
|
224
230
|
gap: 8px;
|
|
225
231
|
}
|
|
226
|
-
.result-info[data-v-
|
|
232
|
+
.result-info[data-v-4b956460] {
|
|
227
233
|
display: flex;
|
|
228
234
|
justify-content: space-between;
|
|
229
235
|
align-items: center;
|
|
230
|
-
padding: 10px
|
|
231
|
-
background-color:
|
|
232
|
-
border-bottom: 1px solid
|
|
236
|
+
padding: 6px 10px;
|
|
237
|
+
background-color: var(--db-bg-soft2);
|
|
238
|
+
border-bottom: 1px solid var(--db-border);
|
|
233
239
|
}
|
|
234
|
-
.result-actions[data-v-
|
|
240
|
+
.result-actions[data-v-4b956460] {
|
|
235
241
|
display: flex;
|
|
236
|
-
gap:
|
|
242
|
+
gap: 6px;
|
|
237
243
|
}
|
|
238
|
-
.result-table-container[data-v-
|
|
244
|
+
.result-table-container[data-v-4b956460] {
|
|
239
245
|
flex: 1;
|
|
240
246
|
overflow: auto;
|
|
241
247
|
}
|
|
242
248
|
|
|
243
249
|
/* 对象结果样式 */
|
|
244
|
-
.result-object[data-v-
|
|
250
|
+
.result-object[data-v-4b956460] {
|
|
245
251
|
display: flex;
|
|
246
252
|
flex-direction: column;
|
|
247
253
|
height: 100%;
|
|
248
254
|
}
|
|
249
|
-
.object-container[data-v-
|
|
255
|
+
.object-container[data-v-4b956460] {
|
|
250
256
|
flex: 1;
|
|
251
257
|
overflow: auto;
|
|
252
258
|
}
|
|
253
|
-
.object-container table[data-v-
|
|
259
|
+
.object-container table[data-v-4b956460] {
|
|
254
260
|
width: 100%;
|
|
255
261
|
}
|
|
256
|
-
.object-container th[data-v-
|
|
262
|
+
.object-container th[data-v-4b956460]:first-child {
|
|
257
263
|
width: 20%;
|
|
258
264
|
min-width: 100px;
|
|
259
265
|
}
|
|
260
|
-
.object-container td[data-v-
|
|
266
|
+
.object-container td[data-v-4b956460]:first-child {
|
|
261
267
|
font-weight: 500;
|
|
262
|
-
background-color:
|
|
268
|
+
background-color: var(--db-bg-soft2);
|
|
263
269
|
}
|
|
264
|
-
.sql-loading-state[data-v-
|
|
270
|
+
.sql-loading-state[data-v-4b956460] {
|
|
265
271
|
display: flex;
|
|
266
272
|
align-items: center;
|
|
267
273
|
justify-content: center;
|
|
268
274
|
height: 100%;
|
|
269
275
|
flex: 1;
|
|
270
276
|
}
|
|
271
|
-
.sql-empty-result[data-v-
|
|
272
|
-
.sql-error[data-v-
|
|
277
|
+
.sql-empty-result[data-v-4b956460],
|
|
278
|
+
.sql-error[data-v-4b956460] {
|
|
273
279
|
padding: 12px;
|
|
274
280
|
flex: 1;
|
|
275
281
|
}
|
|
276
|
-
.result-empty[data-v-
|
|
282
|
+
.result-empty[data-v-4b956460] {
|
|
277
283
|
display: flex;
|
|
278
284
|
flex-direction: column;
|
|
279
285
|
align-items: center;
|
|
280
286
|
justify-content: center;
|
|
281
287
|
height: 100%;
|
|
282
|
-
color:
|
|
288
|
+
color: var(--db-text-muted);
|
|
283
289
|
gap: 10px;
|
|
284
290
|
}
|
|
285
|
-
.result-empty i[data-v-
|
|
286
|
-
font-size:
|
|
287
|
-
opacity: 0.
|
|
291
|
+
.result-empty i[data-v-4b956460] {
|
|
292
|
+
font-size: 24px;
|
|
293
|
+
opacity: 0.4;
|
|
288
294
|
}
|
|
289
|
-
.json-result[data-v-
|
|
295
|
+
.json-result[data-v-4b956460] {
|
|
290
296
|
flex: 1;
|
|
291
297
|
overflow: hidden;
|
|
292
298
|
}
|
|
293
|
-
.json-result .codemirror-editor[data-v-
|
|
299
|
+
.json-result .codemirror-editor[data-v-4b956460] {
|
|
294
300
|
height: 100%;
|
|
295
301
|
width: 100%;
|
|
296
302
|
}
|
|
297
303
|
|
|
298
304
|
/* 响应式设计 */
|
|
299
305
|
@media (max-width: 768px) {
|
|
300
|
-
.sql-toolbar[data-v-
|
|
306
|
+
.sql-toolbar[data-v-4b956460] {
|
|
301
307
|
flex-direction: column;
|
|
302
308
|
align-items: stretch;
|
|
303
309
|
gap: 8px;
|
|
304
310
|
}
|
|
305
|
-
.toolbar-left[data-v-
|
|
306
|
-
.toolbar-right[data-v-
|
|
311
|
+
.toolbar-left[data-v-4b956460],
|
|
312
|
+
.toolbar-right[data-v-4b956460] {
|
|
307
313
|
justify-content: center;
|
|
308
314
|
}
|
|
309
315
|
}
|
|
310
316
|
|
|
311
|
-
.connection-detail[data-v-
|
|
312
|
-
padding:
|
|
317
|
+
.connection-detail[data-v-ef9effac] {
|
|
318
|
+
padding: 10px;
|
|
313
319
|
display: flex;
|
|
314
320
|
flex-direction: column;
|
|
315
321
|
height: 100%;
|
|
316
|
-
gap:
|
|
322
|
+
gap: 10px;
|
|
317
323
|
}
|
|
318
|
-
.connection-header[data-v-
|
|
324
|
+
.connection-header[data-v-ef9effac] {
|
|
319
325
|
display: flex;
|
|
320
326
|
justify-content: space-between;
|
|
321
327
|
align-items: center;
|
|
322
|
-
margin-bottom:
|
|
323
|
-
padding:
|
|
324
|
-
background-color:
|
|
325
|
-
border-radius:
|
|
326
|
-
border: 1px solid
|
|
328
|
+
margin-bottom: 0;
|
|
329
|
+
padding: 8px 12px;
|
|
330
|
+
background-color: var(--db-bg-soft2);
|
|
331
|
+
border-radius: 6px;
|
|
332
|
+
border: 1px solid var(--db-border);
|
|
327
333
|
}
|
|
328
|
-
.connection-info[data-v-
|
|
334
|
+
.connection-info[data-v-ef9effac] {
|
|
329
335
|
display: flex;
|
|
330
336
|
align-items: center;
|
|
331
|
-
gap:
|
|
337
|
+
gap: 12px;
|
|
332
338
|
}
|
|
333
|
-
.connection-avatar[data-v-
|
|
334
|
-
width:
|
|
335
|
-
height:
|
|
339
|
+
.connection-avatar[data-v-ef9effac] {
|
|
340
|
+
width: 34px;
|
|
341
|
+
height: 34px;
|
|
336
342
|
display: flex;
|
|
337
343
|
align-items: center;
|
|
338
344
|
justify-content: center;
|
|
339
|
-
border-radius:
|
|
340
|
-
background-color:
|
|
341
|
-
border: 1px solid
|
|
345
|
+
border-radius: 6px;
|
|
346
|
+
background-color: var(--db-border);
|
|
347
|
+
border: 1px solid var(--db-border);
|
|
348
|
+
flex-shrink: 0;
|
|
342
349
|
}
|
|
343
|
-
.db-logo[data-v-
|
|
344
|
-
font-size:
|
|
345
|
-
font-weight:
|
|
346
|
-
|
|
350
|
+
.db-logo[data-v-ef9effac] {
|
|
351
|
+
font-size: 13px;
|
|
352
|
+
font-weight: 700;
|
|
353
|
+
letter-spacing: 0.02em;
|
|
354
|
+
color: var(--db-gray-dark);
|
|
347
355
|
}
|
|
348
|
-
.db-mysql[data-v-
|
|
356
|
+
.db-mysql[data-v-ef9effac] {
|
|
349
357
|
background-color: #4CAF50;
|
|
350
|
-
color:
|
|
358
|
+
color: var(--db-on-accent);
|
|
351
359
|
}
|
|
352
|
-
.db-postgres[data-v-
|
|
360
|
+
.db-postgres[data-v-ef9effac] {
|
|
353
361
|
background-color: #336791;
|
|
354
|
-
color:
|
|
362
|
+
color: var(--db-on-accent);
|
|
355
363
|
}
|
|
356
|
-
.db-mssql[data-v-
|
|
364
|
+
.db-mssql[data-v-ef9effac] {
|
|
357
365
|
background-color: #0078d4;
|
|
358
|
-
color:
|
|
366
|
+
color: var(--db-on-accent);
|
|
359
367
|
}
|
|
360
|
-
.db-sqlite[data-v-
|
|
368
|
+
.db-sqlite[data-v-ef9effac] {
|
|
361
369
|
background-color: #003B57;
|
|
362
|
-
color:
|
|
370
|
+
color: var(--db-on-accent);
|
|
363
371
|
}
|
|
364
|
-
.db-oracle[data-v-
|
|
372
|
+
.db-oracle[data-v-ef9effac] {
|
|
365
373
|
background-color: #F80000;
|
|
366
|
-
color:
|
|
374
|
+
color: var(--db-on-accent);
|
|
367
375
|
}
|
|
368
|
-
.connection-meta[data-v-
|
|
376
|
+
.connection-meta[data-v-ef9effac] {
|
|
369
377
|
display: flex;
|
|
370
378
|
flex-direction: column;
|
|
371
379
|
gap: 4px;
|
|
372
380
|
}
|
|
373
|
-
.connection-name[data-v-
|
|
381
|
+
.connection-name[data-v-ef9effac] {
|
|
374
382
|
margin: 0;
|
|
375
|
-
font-size:
|
|
383
|
+
font-size: 15px;
|
|
376
384
|
font-weight: 600;
|
|
377
385
|
}
|
|
378
|
-
.connection-type-info[data-v-
|
|
386
|
+
.connection-type-info[data-v-ef9effac] {
|
|
379
387
|
display: flex;
|
|
380
388
|
align-items: center;
|
|
381
|
-
gap:
|
|
389
|
+
gap: 8px;
|
|
382
390
|
}
|
|
383
|
-
.db-type[data-v-
|
|
384
|
-
padding:
|
|
385
|
-
border-radius:
|
|
386
|
-
background-color:
|
|
387
|
-
font-size:
|
|
388
|
-
font-weight:
|
|
389
|
-
color:
|
|
391
|
+
.db-type[data-v-ef9effac] {
|
|
392
|
+
padding: 1px 7px;
|
|
393
|
+
border-radius: 999px;
|
|
394
|
+
background-color: var(--db-primary-bg);
|
|
395
|
+
font-size: 11px;
|
|
396
|
+
font-weight: 500;
|
|
397
|
+
color: var(--db-primary-color);
|
|
390
398
|
}
|
|
391
|
-
.connection-status[data-v-
|
|
399
|
+
.connection-status[data-v-ef9effac] {
|
|
392
400
|
display: flex;
|
|
393
401
|
align-items: center;
|
|
394
402
|
gap: 6px;
|
|
395
|
-
font-size:
|
|
403
|
+
font-size: 12px;
|
|
404
|
+
color: var(--db-text-muted);
|
|
396
405
|
}
|
|
397
|
-
.status-dot[data-v-
|
|
398
|
-
width:
|
|
399
|
-
height:
|
|
406
|
+
.status-dot[data-v-ef9effac] {
|
|
407
|
+
width: 7px;
|
|
408
|
+
height: 7px;
|
|
400
409
|
border-radius: 50%;
|
|
401
|
-
background-color:
|
|
410
|
+
background-color: var(--db-gray-dark);
|
|
402
411
|
}
|
|
403
|
-
.status-online .status-dot[data-v-
|
|
412
|
+
.status-online .status-dot[data-v-ef9effac] {
|
|
404
413
|
background-color: #28a745;
|
|
405
414
|
}
|
|
406
|
-
.status-offline .status-dot[data-v-
|
|
415
|
+
.status-offline .status-dot[data-v-ef9effac] {
|
|
407
416
|
background-color: #dc3545;
|
|
408
417
|
}
|
|
409
|
-
.status-testing .status-dot[data-v-
|
|
418
|
+
.status-testing .status-dot[data-v-ef9effac] {
|
|
410
419
|
background-color: #ffc107;
|
|
411
|
-
animation: pulse-
|
|
420
|
+
animation: pulse-ef9effac 1s infinite;
|
|
412
421
|
}
|
|
413
|
-
@keyframes pulse-
|
|
422
|
+
@keyframes pulse-ef9effac {
|
|
414
423
|
0%, 100% {
|
|
415
424
|
opacity: 1;
|
|
416
425
|
}
|
|
@@ -418,26 +427,26 @@
|
|
|
418
427
|
opacity: 0.5;
|
|
419
428
|
}
|
|
420
429
|
}
|
|
421
|
-
.connection-actions[data-v-
|
|
430
|
+
.connection-actions[data-v-ef9effac] {
|
|
422
431
|
display: flex;
|
|
423
432
|
gap: 8px;
|
|
424
433
|
}
|
|
425
|
-
.connection-details-panel[data-v-
|
|
426
|
-
margin-bottom:
|
|
427
|
-
animation: fadeIn-
|
|
434
|
+
.connection-details-panel[data-v-ef9effac] {
|
|
435
|
+
margin-bottom: 0;
|
|
436
|
+
animation: fadeIn-ef9effac 0.3s ease;
|
|
428
437
|
}
|
|
429
|
-
.section-title[data-v-
|
|
430
|
-
margin: 0 0
|
|
431
|
-
font-size:
|
|
438
|
+
.section-title[data-v-ef9effac] {
|
|
439
|
+
margin: 0 0 10px 0;
|
|
440
|
+
font-size: 13px;
|
|
432
441
|
font-weight: 600;
|
|
433
442
|
display: flex;
|
|
434
443
|
align-items: center;
|
|
435
444
|
gap: 8px;
|
|
436
|
-
color:
|
|
437
|
-
padding-bottom:
|
|
438
|
-
border-bottom: 1px solid
|
|
445
|
+
color: var(--db-dark-color);
|
|
446
|
+
padding-bottom: 6px;
|
|
447
|
+
border-bottom: 1px solid var(--db-border);
|
|
439
448
|
}
|
|
440
|
-
@keyframes fadeIn-
|
|
449
|
+
@keyframes fadeIn-ef9effac {
|
|
441
450
|
from {
|
|
442
451
|
opacity: 0;
|
|
443
452
|
transform: translateY(-10px);
|
|
@@ -447,286 +456,366 @@ to {
|
|
|
447
456
|
transform: translateY(0);
|
|
448
457
|
}
|
|
449
458
|
}
|
|
450
|
-
.detail-card[data-v-
|
|
451
|
-
border: 1px solid
|
|
452
|
-
border-radius:
|
|
459
|
+
.detail-card[data-v-ef9effac] {
|
|
460
|
+
border: 1px solid var(--db-border);
|
|
461
|
+
border-radius: 6px;
|
|
453
462
|
overflow: hidden;
|
|
454
463
|
}
|
|
455
|
-
.card-header[data-v-
|
|
456
|
-
padding:
|
|
457
|
-
background-color:
|
|
458
|
-
border-bottom: 1px solid
|
|
464
|
+
.card-header[data-v-ef9effac] {
|
|
465
|
+
padding: 10px;
|
|
466
|
+
background-color: var(--db-bg-soft);
|
|
467
|
+
border-bottom: 1px solid var(--db-border);
|
|
459
468
|
}
|
|
460
|
-
.card-title[data-v-
|
|
469
|
+
.card-title[data-v-ef9effac] {
|
|
461
470
|
margin: 0;
|
|
462
|
-
font-size:
|
|
471
|
+
font-size: 13px;
|
|
463
472
|
font-weight: 600;
|
|
464
473
|
display: flex;
|
|
465
474
|
align-items: center;
|
|
466
475
|
gap: 8px;
|
|
467
476
|
}
|
|
468
|
-
.card-body[data-v-
|
|
469
|
-
padding:
|
|
477
|
+
.card-body[data-v-ef9effac] {
|
|
478
|
+
padding: 10px;
|
|
470
479
|
}
|
|
471
|
-
.info-grid[data-v-
|
|
480
|
+
.info-grid[data-v-ef9effac] {
|
|
472
481
|
display: grid;
|
|
473
482
|
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
|
|
474
|
-
gap:
|
|
475
|
-
margin-bottom:
|
|
483
|
+
gap: 8px;
|
|
484
|
+
margin-bottom: 0;
|
|
476
485
|
}
|
|
477
|
-
.info-item[data-v-
|
|
486
|
+
.info-item[data-v-ef9effac] {
|
|
478
487
|
display: flex;
|
|
479
488
|
flex-direction: column;
|
|
480
|
-
gap:
|
|
481
|
-
padding:
|
|
482
|
-
background-color:
|
|
483
|
-
border-radius:
|
|
484
|
-
transition:
|
|
485
|
-
border: 1px solid
|
|
489
|
+
gap: 2px;
|
|
490
|
+
padding: 6px 8px;
|
|
491
|
+
background-color: var(--db-bg-soft);
|
|
492
|
+
border-radius: 4px;
|
|
493
|
+
transition: background-color 0.15s ease;
|
|
494
|
+
border: 1px solid var(--db-border);
|
|
486
495
|
}
|
|
487
|
-
.info-item[data-v-
|
|
488
|
-
background-color:
|
|
489
|
-
transform: translateY(-1px);
|
|
496
|
+
.info-item[data-v-ef9effac]:hover {
|
|
497
|
+
background-color: var(--db-bg-soft2);
|
|
490
498
|
}
|
|
491
|
-
.info-label[data-v-
|
|
492
|
-
font-size:
|
|
499
|
+
.info-label[data-v-ef9effac] {
|
|
500
|
+
font-size: 10px;
|
|
493
501
|
font-weight: 600;
|
|
494
|
-
color:
|
|
502
|
+
color: var(--db-text-muted);
|
|
495
503
|
text-transform: uppercase;
|
|
496
|
-
letter-spacing: 0.
|
|
504
|
+
letter-spacing: 0.04em;
|
|
497
505
|
}
|
|
498
|
-
.info-value[data-v-
|
|
499
|
-
font-size:
|
|
506
|
+
.info-value[data-v-ef9effac] {
|
|
507
|
+
font-size: 12px;
|
|
500
508
|
font-weight: 500;
|
|
501
|
-
color:
|
|
509
|
+
color: var(--db-dark-color);
|
|
502
510
|
}
|
|
503
|
-
.db-type-badge[data-v-
|
|
504
|
-
padding:
|
|
505
|
-
border-radius:
|
|
506
|
-
font-size:
|
|
511
|
+
.db-type-badge[data-v-ef9effac] {
|
|
512
|
+
padding: 1px 7px;
|
|
513
|
+
border-radius: 999px;
|
|
514
|
+
font-size: 11px;
|
|
507
515
|
font-weight: 500;
|
|
508
516
|
}
|
|
509
|
-
.stats-grid[data-v-
|
|
517
|
+
.stats-grid[data-v-ef9effac] {
|
|
510
518
|
display: grid;
|
|
511
519
|
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
|
|
512
|
-
gap:
|
|
520
|
+
gap: 8px;
|
|
513
521
|
}
|
|
514
|
-
.stat-item[data-v-
|
|
515
|
-
text-align:
|
|
516
|
-
padding:
|
|
517
|
-
background-color:
|
|
518
|
-
border-radius:
|
|
519
|
-
transition:
|
|
520
|
-
border: 1px solid
|
|
522
|
+
.stat-item[data-v-ef9effac] {
|
|
523
|
+
text-align: left;
|
|
524
|
+
padding: 8px;
|
|
525
|
+
background-color: var(--db-bg-soft);
|
|
526
|
+
border-radius: 4px;
|
|
527
|
+
transition: background-color 0.15s ease;
|
|
528
|
+
border: 1px solid var(--db-border);
|
|
521
529
|
}
|
|
522
|
-
.stat-item[data-v-
|
|
523
|
-
background-color:
|
|
524
|
-
transform: translateY(-1px);
|
|
525
|
-
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
|
|
530
|
+
.stat-item[data-v-ef9effac]:hover {
|
|
531
|
+
background-color: var(--db-bg-soft2);
|
|
526
532
|
}
|
|
527
|
-
.stat-value[data-v-
|
|
528
|
-
font-size:
|
|
533
|
+
.stat-value[data-v-ef9effac] {
|
|
534
|
+
font-size: 15px;
|
|
529
535
|
font-weight: 600;
|
|
530
|
-
|
|
536
|
+
line-height: 1.25;
|
|
537
|
+
color: var(--db-dark-color);
|
|
531
538
|
}
|
|
532
|
-
.stat-label[data-v-
|
|
533
|
-
font-size:
|
|
534
|
-
color:
|
|
535
|
-
margin-top:
|
|
539
|
+
.stat-label[data-v-ef9effac] {
|
|
540
|
+
font-size: 11px;
|
|
541
|
+
color: var(--db-text-muted);
|
|
542
|
+
margin-top: 2px;
|
|
536
543
|
}
|
|
537
|
-
.quick-actions[data-v-
|
|
538
|
-
margin-bottom:
|
|
539
|
-
padding:
|
|
540
|
-
background-color:
|
|
541
|
-
border-radius:
|
|
542
|
-
border: 1px solid
|
|
544
|
+
.quick-actions[data-v-ef9effac] {
|
|
545
|
+
margin-bottom: 0;
|
|
546
|
+
padding: 10px 12px;
|
|
547
|
+
background-color: var(--db-bg-soft2);
|
|
548
|
+
border-radius: 6px;
|
|
549
|
+
border: 1px solid var(--db-border);
|
|
543
550
|
}
|
|
544
|
-
.actions-header[data-v-
|
|
545
|
-
margin-bottom:
|
|
551
|
+
.actions-header[data-v-ef9effac] {
|
|
552
|
+
margin-bottom: 8px;
|
|
546
553
|
}
|
|
547
|
-
.actions-title[data-v-
|
|
554
|
+
.actions-title[data-v-ef9effac] {
|
|
548
555
|
margin: 0;
|
|
549
|
-
font-size:
|
|
556
|
+
font-size: 13px;
|
|
550
557
|
font-weight: 600;
|
|
551
558
|
display: flex;
|
|
552
559
|
align-items: center;
|
|
553
560
|
gap: 8px;
|
|
554
561
|
}
|
|
555
|
-
.actions-grid[data-v-
|
|
562
|
+
.actions-grid[data-v-ef9effac] {
|
|
556
563
|
display: grid;
|
|
557
|
-
grid-template-columns: repeat(auto-
|
|
558
|
-
gap:
|
|
564
|
+
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
|
|
565
|
+
gap: 6px;
|
|
559
566
|
}
|
|
560
|
-
.action-btn[data-v-
|
|
567
|
+
.action-btn[data-v-ef9effac] {
|
|
561
568
|
display: flex;
|
|
562
|
-
flex-direction:
|
|
569
|
+
flex-direction: row;
|
|
563
570
|
align-items: center;
|
|
571
|
+
justify-content: flex-start;
|
|
564
572
|
gap: 8px;
|
|
565
|
-
padding:
|
|
566
|
-
background-color:
|
|
567
|
-
border: 1px solid
|
|
568
|
-
border-radius:
|
|
573
|
+
padding: 6px 10px;
|
|
574
|
+
background-color: var(--db-bg-soft);
|
|
575
|
+
border: 1px solid var(--db-border);
|
|
576
|
+
border-radius: 4px;
|
|
569
577
|
cursor: pointer;
|
|
570
|
-
transition:
|
|
571
|
-
|
|
572
|
-
.action-btn[data-v-15dc1761]:hover {
|
|
573
|
-
background-color: #e9ecef;
|
|
574
|
-
transform: translateY(-2px);
|
|
575
|
-
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
578
|
+
transition: background-color 0.15s ease, border-color 0.15s ease;
|
|
579
|
+
color: var(--db-text-body);
|
|
576
580
|
}
|
|
577
|
-
.action-
|
|
578
|
-
|
|
579
|
-
color:
|
|
581
|
+
.action-btn[data-v-ef9effac]:hover {
|
|
582
|
+
background-color: var(--db-bg-soft2);
|
|
583
|
+
border-color: var(--db-primary-color);
|
|
580
584
|
}
|
|
581
|
-
.action-
|
|
585
|
+
.action-icon[data-v-ef9effac] {
|
|
582
586
|
font-size: 14px;
|
|
587
|
+
color: var(--db-primary-color);
|
|
588
|
+
}
|
|
589
|
+
.action-text[data-v-ef9effac] {
|
|
590
|
+
font-size: 12px;
|
|
583
591
|
font-weight: 500;
|
|
584
|
-
color:
|
|
592
|
+
color: var(--db-text-body);
|
|
585
593
|
}
|
|
586
|
-
.connection-tabs[data-v-
|
|
587
|
-
border: 1px solid
|
|
588
|
-
border-radius:
|
|
594
|
+
.connection-tabs[data-v-ef9effac] {
|
|
595
|
+
border: 1px solid var(--db-border);
|
|
596
|
+
border-radius: 6px;
|
|
589
597
|
flex: 1;
|
|
590
598
|
display: flex;
|
|
591
599
|
flex-direction: column;
|
|
600
|
+
/* flex 子项默认 min-height:auto 会拒绝收缩，内容撑破后被外层
|
|
601
|
+
overflow:hidden 裁掉且不出现滚动条，必须显式允许收缩 */
|
|
602
|
+
min-height: 0;
|
|
592
603
|
}
|
|
593
|
-
.nav-tabs[data-v-
|
|
594
|
-
border-bottom: 1px solid
|
|
595
|
-
background-color:
|
|
604
|
+
.nav-tabs[data-v-ef9effac] {
|
|
605
|
+
border-bottom: 1px solid var(--db-border);
|
|
606
|
+
background-color: var(--db-gray-light);
|
|
607
|
+
padding: 0 4px;
|
|
608
|
+
gap: 0;
|
|
596
609
|
}
|
|
597
|
-
.nav-link[data-v-
|
|
610
|
+
.nav-link[data-v-ef9effac] {
|
|
598
611
|
border: none;
|
|
599
612
|
border-radius: 0;
|
|
600
|
-
padding: 12px
|
|
601
|
-
font-size:
|
|
613
|
+
padding: 6px 12px;
|
|
614
|
+
font-size: 12px;
|
|
602
615
|
font-weight: 500;
|
|
603
|
-
transition:
|
|
604
|
-
color:
|
|
616
|
+
transition: color 0.15s ease, background-color 0.15s ease;
|
|
617
|
+
color: var(--db-text-muted);
|
|
605
618
|
}
|
|
606
|
-
.nav-link[data-v-
|
|
607
|
-
background-color:
|
|
619
|
+
.nav-link[data-v-ef9effac]:hover {
|
|
620
|
+
background-color: var(--db-bg-soft);
|
|
621
|
+
color: var(--db-dark-color);
|
|
608
622
|
}
|
|
609
|
-
.nav-link.active[data-v-
|
|
610
|
-
background-color:
|
|
611
|
-
|
|
623
|
+
.nav-link.active[data-v-ef9effac] {
|
|
624
|
+
background-color: transparent;
|
|
625
|
+
color: var(--db-primary-color);
|
|
626
|
+
border-bottom: 2px solid var(--db-primary-color);
|
|
612
627
|
}
|
|
613
|
-
.tab-content[data-v-
|
|
628
|
+
.tab-content[data-v-ef9effac] {
|
|
614
629
|
flex: 1;
|
|
615
630
|
display: flex;
|
|
616
631
|
flex-direction: column;
|
|
617
632
|
overflow: hidden;
|
|
633
|
+
min-height: 0;
|
|
618
634
|
}
|
|
619
|
-
.tab-panel[data-v-
|
|
620
|
-
padding:
|
|
635
|
+
.tab-panel[data-v-ef9effac] {
|
|
636
|
+
padding: 0;
|
|
621
637
|
flex: 1;
|
|
622
638
|
display: flex;
|
|
623
639
|
flex-direction: column;
|
|
624
640
|
overflow: hidden;
|
|
641
|
+
min-height: 0;
|
|
625
642
|
}
|
|
626
|
-
.databases-section[data-v-
|
|
643
|
+
.databases-section[data-v-ef9effac] {
|
|
627
644
|
display: flex;
|
|
628
645
|
flex-direction: column;
|
|
629
|
-
gap:
|
|
646
|
+
gap: 10px;
|
|
630
647
|
flex: 1;
|
|
631
648
|
overflow: hidden;
|
|
649
|
+
min-height: 0;
|
|
632
650
|
}
|
|
633
|
-
.section-header[data-v-
|
|
651
|
+
.section-header[data-v-ef9effac] {
|
|
634
652
|
display: flex;
|
|
635
653
|
justify-content: flex-end;
|
|
636
654
|
align-items: center;
|
|
655
|
+
gap: 8px;
|
|
637
656
|
}
|
|
638
|
-
.
|
|
657
|
+
.db-search[data-v-ef9effac] {
|
|
639
658
|
display: flex;
|
|
640
659
|
align-items: center;
|
|
641
|
-
gap:
|
|
660
|
+
gap: 6px;
|
|
661
|
+
height: 26px;
|
|
662
|
+
padding: 0 8px;
|
|
663
|
+
border: 1px solid var(--db-border-light);
|
|
664
|
+
border-radius: 4px;
|
|
665
|
+
background: var(--db-bg-soft);
|
|
666
|
+
transition: border-color 0.15s ease, box-shadow 0.15s ease;
|
|
642
667
|
}
|
|
643
|
-
.
|
|
644
|
-
|
|
645
|
-
|
|
668
|
+
.db-search[data-v-ef9effac]:focus-within {
|
|
669
|
+
border-color: var(--db-primary-color);
|
|
670
|
+
box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.15);
|
|
671
|
+
}
|
|
672
|
+
.db-search > i[data-v-ef9effac] {
|
|
673
|
+
font-size: 12px;
|
|
674
|
+
color: var(--db-gray-dark);
|
|
675
|
+
flex-shrink: 0;
|
|
676
|
+
}
|
|
677
|
+
.db-search-input[data-v-ef9effac] {
|
|
678
|
+
border: none;
|
|
679
|
+
outline: none;
|
|
680
|
+
background: transparent;
|
|
681
|
+
color: var(--db-dark-color);
|
|
682
|
+
font-size: 12px;
|
|
683
|
+
line-height: 1;
|
|
684
|
+
width: 150px;
|
|
685
|
+
padding: 0;
|
|
686
|
+
}
|
|
687
|
+
.db-search-input[data-v-ef9effac]::placeholder {
|
|
688
|
+
color: var(--db-gray-dark);
|
|
689
|
+
opacity: 0.8;
|
|
690
|
+
}
|
|
691
|
+
.db-refresh-btn[data-v-ef9effac] {
|
|
692
|
+
display: inline-flex;
|
|
693
|
+
align-items: center;
|
|
694
|
+
justify-content: center;
|
|
695
|
+
width: 26px;
|
|
696
|
+
height: 26px;
|
|
697
|
+
padding: 0;
|
|
698
|
+
border: 1px solid var(--db-border-light);
|
|
699
|
+
border-radius: 4px;
|
|
700
|
+
background: transparent;
|
|
701
|
+
color: var(--db-text-muted);
|
|
702
|
+
cursor: pointer;
|
|
703
|
+
transition: all 0.15s ease;
|
|
704
|
+
}
|
|
705
|
+
.db-refresh-btn[data-v-ef9effac]:hover:not(:disabled) {
|
|
706
|
+
color: var(--db-primary-color);
|
|
707
|
+
border-color: var(--db-primary-color);
|
|
708
|
+
background: var(--db-primary-bg);
|
|
709
|
+
}
|
|
710
|
+
.db-refresh-btn[data-v-ef9effac]:disabled {
|
|
711
|
+
opacity: 0.6;
|
|
712
|
+
cursor: default;
|
|
713
|
+
}
|
|
714
|
+
.databases-list[data-v-ef9effac] {
|
|
715
|
+
flex: 1;
|
|
716
|
+
min-height: 0;
|
|
646
717
|
overflow-y: auto;
|
|
647
718
|
padding-right: 8px;
|
|
648
719
|
}
|
|
649
|
-
.loading-state[data-v-
|
|
720
|
+
.loading-state[data-v-ef9effac] {
|
|
650
721
|
display: flex;
|
|
651
722
|
flex-direction: column;
|
|
652
723
|
align-items: center;
|
|
653
724
|
justify-content: center;
|
|
654
|
-
padding:
|
|
655
|
-
gap:
|
|
725
|
+
padding: 28px 16px;
|
|
726
|
+
gap: 10px;
|
|
656
727
|
}
|
|
657
|
-
.empty-state[data-v-
|
|
728
|
+
.empty-state[data-v-ef9effac] {
|
|
658
729
|
display: flex;
|
|
659
730
|
flex-direction: column;
|
|
660
731
|
align-items: center;
|
|
661
732
|
justify-content: center;
|
|
662
|
-
padding:
|
|
663
|
-
gap:
|
|
733
|
+
padding: 28px 16px;
|
|
734
|
+
gap: 10px;
|
|
664
735
|
text-align: center;
|
|
665
736
|
}
|
|
666
|
-
.empty-state i[data-v-
|
|
667
|
-
font-size:
|
|
668
|
-
color:
|
|
737
|
+
.empty-state i[data-v-ef9effac] {
|
|
738
|
+
font-size: 28px;
|
|
739
|
+
color: var(--db-text-faint);
|
|
669
740
|
}
|
|
670
|
-
.empty-state p[data-v-
|
|
741
|
+
.empty-state p[data-v-ef9effac] {
|
|
671
742
|
margin: 0;
|
|
672
|
-
color:
|
|
673
|
-
font-size:
|
|
743
|
+
color: var(--db-text-muted);
|
|
744
|
+
font-size: 12px;
|
|
674
745
|
}
|
|
675
|
-
.databases-list-simple[data-v-
|
|
746
|
+
.databases-list-simple[data-v-ef9effac] {
|
|
676
747
|
display: grid;
|
|
677
|
-
grid-template-columns: repeat(auto-fill, minmax(
|
|
678
|
-
gap:
|
|
748
|
+
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
|
749
|
+
gap: 6px;
|
|
679
750
|
}
|
|
680
|
-
.database-item[data-v-
|
|
751
|
+
.database-item[data-v-ef9effac] {
|
|
681
752
|
display: flex;
|
|
682
|
-
flex-direction:
|
|
753
|
+
flex-direction: row;
|
|
683
754
|
align-items: center;
|
|
684
755
|
gap: 8px;
|
|
685
|
-
padding:
|
|
686
|
-
border: 1px solid
|
|
687
|
-
border-radius:
|
|
756
|
+
padding: 6px 8px;
|
|
757
|
+
border: 1px solid var(--db-border);
|
|
758
|
+
border-radius: 4px;
|
|
759
|
+
background: var(--db-bg-soft);
|
|
688
760
|
cursor: pointer;
|
|
689
|
-
transition:
|
|
690
|
-
text-align:
|
|
691
|
-
min-height: 100px;
|
|
761
|
+
transition: background-color 0.15s ease, border-color 0.15s ease;
|
|
762
|
+
text-align: left;
|
|
692
763
|
}
|
|
693
|
-
.database-item[data-v-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
transform: translateY(-2px);
|
|
697
|
-
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
764
|
+
.database-item[data-v-ef9effac]:hover {
|
|
765
|
+
background: var(--db-bg-soft2);
|
|
766
|
+
border-color: var(--db-primary-color);
|
|
698
767
|
}
|
|
699
|
-
.database-item-icon[data-v-
|
|
700
|
-
font-size:
|
|
701
|
-
color:
|
|
768
|
+
.database-item-icon[data-v-ef9effac] {
|
|
769
|
+
font-size: 12px;
|
|
770
|
+
color: var(--db-primary-color);
|
|
771
|
+
flex-shrink: 0;
|
|
702
772
|
}
|
|
703
|
-
.database-item-name[data-v-
|
|
704
|
-
|
|
773
|
+
.database-item-name[data-v-ef9effac] {
|
|
774
|
+
flex: 1;
|
|
775
|
+
font-size: 12px;
|
|
705
776
|
font-weight: 500;
|
|
706
|
-
color:
|
|
777
|
+
color: var(--db-dark-color);
|
|
707
778
|
overflow: hidden;
|
|
708
779
|
text-overflow: ellipsis;
|
|
709
780
|
white-space: nowrap;
|
|
710
|
-
|
|
781
|
+
min-width: 0;
|
|
711
782
|
}
|
|
712
|
-
.database-item-actions[data-v-
|
|
783
|
+
.database-item-actions[data-v-ef9effac] {
|
|
713
784
|
display: flex;
|
|
714
785
|
gap: 4px;
|
|
715
|
-
|
|
786
|
+
flex-shrink: 0;
|
|
787
|
+
opacity: 0.55;
|
|
788
|
+
transition: opacity 0.15s ease;
|
|
789
|
+
}
|
|
790
|
+
.database-item:hover .database-item-actions[data-v-ef9effac] {
|
|
791
|
+
opacity: 1;
|
|
792
|
+
}
|
|
793
|
+
.database-item-actions .btn[data-v-ef9effac] {
|
|
794
|
+
padding: 1px 5px;
|
|
795
|
+
font-size: 12px;
|
|
796
|
+
line-height: 1.3;
|
|
797
|
+
border: none;
|
|
798
|
+
background: transparent;
|
|
799
|
+
color: var(--db-darker-color);
|
|
800
|
+
}
|
|
801
|
+
.database-item-actions .btn[data-v-ef9effac]:hover {
|
|
802
|
+
color: var(--db-primary-color);
|
|
803
|
+
background: var(--db-bg-soft2);
|
|
716
804
|
}
|
|
717
|
-
.sql-section[data-v-
|
|
805
|
+
.sql-section[data-v-ef9effac] {
|
|
718
806
|
display: flex;
|
|
719
807
|
flex-direction: column;
|
|
720
808
|
gap: 16px;
|
|
721
809
|
flex: 1;
|
|
722
810
|
overflow: hidden;
|
|
811
|
+
min-height: 0;
|
|
723
812
|
}
|
|
724
|
-
.sql-header[data-v-
|
|
813
|
+
.sql-header[data-v-ef9effac] {
|
|
725
814
|
display: flex;
|
|
726
815
|
justify-content: space-between;
|
|
727
816
|
align-items: center;
|
|
728
817
|
}
|
|
729
|
-
.sql-title[data-v-
|
|
818
|
+
.sql-title[data-v-ef9effac] {
|
|
730
819
|
margin: 0;
|
|
731
820
|
font-size: 16px;
|
|
732
821
|
font-weight: 600;
|
|
@@ -734,7 +823,7 @@ to {
|
|
|
734
823
|
align-items: center;
|
|
735
824
|
gap: 8px;
|
|
736
825
|
}
|
|
737
|
-
.sql-db-info[data-v-
|
|
826
|
+
.sql-db-info[data-v-ef9effac] {
|
|
738
827
|
display: flex;
|
|
739
828
|
align-items: center;
|
|
740
829
|
gap: 8px;
|
|
@@ -742,778 +831,868 @@ to {
|
|
|
742
831
|
|
|
743
832
|
/* 响应式设计 */
|
|
744
833
|
@media (max-width: 768px) {
|
|
745
|
-
.connection-header[data-v-
|
|
834
|
+
.connection-header[data-v-ef9effac] {
|
|
746
835
|
flex-direction: column;
|
|
747
836
|
align-items: flex-start;
|
|
748
837
|
gap: 16px;
|
|
749
838
|
}
|
|
750
|
-
.connection-actions[data-v-
|
|
839
|
+
.connection-actions[data-v-ef9effac] {
|
|
751
840
|
align-self: flex-end;
|
|
752
841
|
}
|
|
753
|
-
.connection-cards[data-v-
|
|
842
|
+
.connection-cards[data-v-ef9effac] {
|
|
754
843
|
grid-template-columns: 1fr;
|
|
755
844
|
}
|
|
756
|
-
.info-grid[data-v-
|
|
845
|
+
.info-grid[data-v-ef9effac] {
|
|
757
846
|
grid-template-columns: 1fr;
|
|
758
847
|
}
|
|
759
|
-
.stats-grid[data-v-
|
|
848
|
+
.stats-grid[data-v-ef9effac] {
|
|
760
849
|
grid-template-columns: repeat(2, 1fr);
|
|
761
850
|
}
|
|
762
|
-
.actions-grid[data-v-
|
|
851
|
+
.actions-grid[data-v-ef9effac] {
|
|
763
852
|
grid-template-columns: repeat(2, 1fr);
|
|
764
853
|
}
|
|
765
|
-
.databases-list-simple[data-v-
|
|
766
|
-
grid-template-columns: repeat(auto-fill, minmax(
|
|
767
|
-
gap:
|
|
854
|
+
.databases-list-simple[data-v-ef9effac] {
|
|
855
|
+
grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
|
|
856
|
+
gap: 6px;
|
|
768
857
|
}
|
|
769
|
-
.database-item[data-v-
|
|
770
|
-
padding:
|
|
771
|
-
min-height: 80px;
|
|
858
|
+
.database-item[data-v-ef9effac] {
|
|
859
|
+
padding: 6px 8px;
|
|
772
860
|
}
|
|
773
|
-
.database-item-icon[data-v-
|
|
774
|
-
font-size:
|
|
861
|
+
.database-item-icon[data-v-ef9effac] {
|
|
862
|
+
font-size: 14px;
|
|
775
863
|
}
|
|
776
|
-
.database-item-name[data-v-
|
|
864
|
+
.database-item-name[data-v-ef9effac] {
|
|
777
865
|
font-size: 12px;
|
|
778
866
|
}
|
|
779
|
-
.nav-link[data-v-
|
|
867
|
+
.nav-link[data-v-ef9effac] {
|
|
780
868
|
padding: 10px 16px;
|
|
781
869
|
font-size: 13px;
|
|
782
870
|
}
|
|
783
871
|
}
|
|
784
872
|
|
|
785
|
-
.section-title[data-v-
|
|
786
|
-
color:
|
|
873
|
+
.section-title[data-v-0d3b1052] {
|
|
874
|
+
color: var(--db-text-body);
|
|
787
875
|
font-weight: 600;
|
|
788
|
-
border-bottom: 2px solid
|
|
876
|
+
border-bottom: 2px solid var(--db-border-soft);
|
|
789
877
|
padding-bottom: 0.5rem;
|
|
790
878
|
margin-bottom: 1rem;
|
|
791
879
|
}
|
|
792
|
-
.sql-preview[data-v-
|
|
880
|
+
.sql-preview[data-v-0d3b1052] {
|
|
793
881
|
font-family: 'Courier New', monospace;
|
|
794
882
|
font-size: 0.875rem;
|
|
795
883
|
max-height: 200px;
|
|
796
884
|
overflow-y: auto;
|
|
797
|
-
border: 1px solid
|
|
885
|
+
border: 1px solid var(--db-border-lighter);
|
|
798
886
|
}
|
|
799
|
-
.table th[data-v-
|
|
887
|
+
.table th[data-v-0d3b1052] {
|
|
800
888
|
font-size: 0.875rem;
|
|
801
889
|
font-weight: 600;
|
|
802
890
|
}
|
|
803
|
-
.table td[data-v-
|
|
891
|
+
.table td[data-v-0d3b1052] {
|
|
804
892
|
padding: 0!important;
|
|
805
893
|
}
|
|
806
|
-
.table .form-control[data-v-
|
|
894
|
+
.table .form-control[data-v-0d3b1052], .table .form-select[data-v-0d3b1052] {
|
|
807
895
|
border: none;
|
|
808
896
|
border-radius: 0;
|
|
809
897
|
box-shadow: none;
|
|
810
898
|
}
|
|
811
|
-
.form-control-sm[data-v-
|
|
899
|
+
.form-control-sm[data-v-0d3b1052], .form-select-sm[data-v-0d3b1052] {
|
|
812
900
|
font-size: 0.875rem;
|
|
813
901
|
}
|
|
814
|
-
.modal-content[data-v-
|
|
902
|
+
.modal-content[data-v-0d3b1052] {
|
|
815
903
|
max-height: 90vh;
|
|
816
904
|
overflow-y: auto;
|
|
817
905
|
}
|
|
818
|
-
.modal-body[data-v-
|
|
906
|
+
.modal-body[data-v-0d3b1052] {
|
|
819
907
|
max-height: calc(90vh - 120px);
|
|
820
908
|
overflow-y: auto;
|
|
821
909
|
}
|
|
822
|
-
.input-group-sm .form-control[data-v-
|
|
910
|
+
.input-group-sm .form-control[data-v-0d3b1052] {
|
|
823
911
|
border-radius: 0;
|
|
824
912
|
}
|
|
825
|
-
.input-group-sm .form-control[data-v-
|
|
913
|
+
.input-group-sm .form-control[data-v-0d3b1052]:first-child {
|
|
826
914
|
border-top-left-radius: 0.25rem;
|
|
827
915
|
border-bottom-left-radius: 0.25rem;
|
|
828
916
|
}
|
|
829
|
-
.input-group-sm .form-control[data-v-
|
|
917
|
+
.input-group-sm .form-control[data-v-0d3b1052]:last-child {
|
|
830
918
|
border-top-right-radius: 0.25rem;
|
|
831
919
|
border-bottom-right-radius: 0.25rem;
|
|
832
920
|
}
|
|
833
|
-
.text-muted[data-v-
|
|
834
|
-
color:
|
|
921
|
+
.text-muted[data-v-0d3b1052] {
|
|
922
|
+
color: var(--db-text-muted) !important;
|
|
835
923
|
}
|
|
836
924
|
|
|
837
|
-
.db-tools[data-v-
|
|
838
|
-
background:
|
|
839
|
-
border-radius:
|
|
840
|
-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
925
|
+
.db-tools[data-v-c49117ce] {
|
|
926
|
+
background: var(--db-surface);
|
|
927
|
+
border-radius: 8px;
|
|
841
928
|
}
|
|
842
|
-
.tools-header[data-v-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
padding: 1rem 1.5rem;
|
|
846
|
-
border-bottom: 1px solid #cbd5e1;
|
|
929
|
+
.tools-header[data-v-c49117ce] {
|
|
930
|
+
padding: 6px 12px;
|
|
931
|
+
border-bottom: 1px solid var(--db-border);
|
|
847
932
|
}
|
|
848
|
-
.tools-title[data-v-
|
|
933
|
+
.tools-title[data-v-c49117ce] {
|
|
849
934
|
margin: 0;
|
|
850
|
-
font-size:
|
|
935
|
+
font-size: 0.875rem;
|
|
851
936
|
font-weight: 600;
|
|
937
|
+
color: var(--db-dark-color);
|
|
852
938
|
display: flex;
|
|
853
939
|
align-items: center;
|
|
854
|
-
gap: 0.
|
|
940
|
+
gap: 0.375rem;
|
|
855
941
|
}
|
|
856
|
-
.tools-content[data-v-
|
|
857
|
-
padding:
|
|
942
|
+
.tools-content[data-v-c49117ce] {
|
|
943
|
+
padding: 12px;
|
|
858
944
|
overflow-y: auto;
|
|
859
945
|
}
|
|
860
|
-
.tool-section[data-v-
|
|
861
|
-
margin-bottom:
|
|
946
|
+
.tool-section[data-v-c49117ce] {
|
|
947
|
+
margin-bottom: 1rem;
|
|
862
948
|
}
|
|
863
|
-
.section
|
|
864
|
-
|
|
949
|
+
.tool-section[data-v-c49117ce]:last-child {
|
|
950
|
+
margin-bottom: 0;
|
|
951
|
+
}
|
|
952
|
+
.section-title[data-v-c49117ce] {
|
|
953
|
+
font-size: 0.75rem;
|
|
865
954
|
font-weight: 600;
|
|
866
|
-
|
|
867
|
-
|
|
955
|
+
letter-spacing: 0.04em;
|
|
956
|
+
text-transform: uppercase;
|
|
957
|
+
color: var(--db-text-muted);
|
|
958
|
+
margin-bottom: 0.5rem;
|
|
868
959
|
display: flex;
|
|
869
960
|
align-items: center;
|
|
870
|
-
gap: 0.
|
|
961
|
+
gap: 0.375rem;
|
|
871
962
|
}
|
|
872
|
-
.tool-actions[data-v-
|
|
963
|
+
.tool-actions[data-v-c49117ce] {
|
|
873
964
|
display: flex;
|
|
874
965
|
flex-wrap: wrap;
|
|
875
|
-
gap: 0.
|
|
966
|
+
gap: 0.375rem;
|
|
876
967
|
}
|
|
877
|
-
.tool-actions .btn[data-v-
|
|
878
|
-
min-width:
|
|
968
|
+
.tool-actions .btn[data-v-c49117ce] {
|
|
969
|
+
min-width: 108px;
|
|
879
970
|
display: flex;
|
|
880
971
|
align-items: center;
|
|
881
|
-
gap: 0.
|
|
972
|
+
gap: 0.375rem;
|
|
882
973
|
}
|
|
883
|
-
.modal[data-v-
|
|
974
|
+
.modal[data-v-c49117ce] {
|
|
884
975
|
background-color: rgba(0, 0, 0, 0.5);
|
|
885
976
|
}
|
|
886
|
-
.modal-dialog[data-v-
|
|
977
|
+
.modal-dialog[data-v-c49117ce] {
|
|
887
978
|
max-width: 600px;
|
|
888
979
|
}
|
|
889
|
-
.modal-header[data-v-
|
|
890
|
-
background:
|
|
891
|
-
border-bottom: 1px solid
|
|
980
|
+
.modal-header[data-v-c49117ce] {
|
|
981
|
+
background: var(--db-light-color);
|
|
982
|
+
border-bottom: 1px solid var(--db-gray-medium);
|
|
892
983
|
}
|
|
893
|
-
.modal-title[data-v-
|
|
894
|
-
color:
|
|
984
|
+
.modal-title[data-v-c49117ce] {
|
|
985
|
+
color: var(--db-dark-color);
|
|
895
986
|
font-weight: 600;
|
|
896
987
|
}
|
|
897
|
-
.modal-footer[data-v-
|
|
898
|
-
background:
|
|
899
|
-
border-top: 1px solid
|
|
988
|
+
.modal-footer[data-v-c49117ce] {
|
|
989
|
+
background: var(--db-light-color);
|
|
990
|
+
border-top: 1px solid var(--db-gray-medium);
|
|
900
991
|
}
|
|
901
992
|
|
|
902
993
|
/* 工具组件区域 */
|
|
903
|
-
.tool-component-area[data-v-
|
|
904
|
-
border-top: 1px solid
|
|
905
|
-
background:
|
|
994
|
+
.tool-component-area[data-v-c49117ce] {
|
|
995
|
+
border-top: 1px solid var(--db-gray-medium);
|
|
996
|
+
background: var(--db-light-color);
|
|
906
997
|
}
|
|
907
|
-
.component-header[data-v-
|
|
998
|
+
.component-header[data-v-c49117ce] {
|
|
908
999
|
display: flex;
|
|
909
1000
|
justify-content: space-between;
|
|
910
1001
|
align-items: center;
|
|
911
|
-
padding:
|
|
912
|
-
background:
|
|
913
|
-
border-bottom: 1px solid
|
|
1002
|
+
padding: 6px 12px;
|
|
1003
|
+
background: var(--db-bg-soft);
|
|
1004
|
+
border-bottom: 1px solid var(--db-border);
|
|
914
1005
|
}
|
|
915
|
-
.component-title[data-v-
|
|
1006
|
+
.component-title[data-v-c49117ce] {
|
|
916
1007
|
margin: 0;
|
|
917
|
-
font-size:
|
|
1008
|
+
font-size: 0.875rem;
|
|
918
1009
|
font-weight: 600;
|
|
919
|
-
color:
|
|
1010
|
+
color: var(--db-dark-color);
|
|
920
1011
|
display: flex;
|
|
921
1012
|
align-items: center;
|
|
922
|
-
gap: 0.
|
|
1013
|
+
gap: 0.375rem;
|
|
923
1014
|
}
|
|
924
|
-
.tool-component[data-v-
|
|
925
|
-
padding:
|
|
1015
|
+
.tool-component[data-v-c49117ce] {
|
|
1016
|
+
padding: 12px;
|
|
926
1017
|
}
|
|
927
|
-
.sync-component[data-v-
|
|
928
|
-
background:
|
|
929
|
-
border-radius:
|
|
1018
|
+
.sync-component[data-v-c49117ce] {
|
|
1019
|
+
background: var(--db-surface);
|
|
1020
|
+
border-radius: 4px;
|
|
930
1021
|
}
|
|
931
1022
|
|
|
932
1023
|
/* 执行结果区域 */
|
|
933
|
-
.execution-results[data-v-
|
|
934
|
-
border-top: 1px solid
|
|
935
|
-
background:
|
|
1024
|
+
.execution-results[data-v-c49117ce] {
|
|
1025
|
+
border-top: 1px solid var(--db-border);
|
|
1026
|
+
background: var(--db-bg-soft);
|
|
936
1027
|
}
|
|
937
|
-
.results-header[data-v-
|
|
1028
|
+
.results-header[data-v-c49117ce] {
|
|
938
1029
|
display: flex;
|
|
939
1030
|
justify-content: space-between;
|
|
940
1031
|
align-items: center;
|
|
941
|
-
padding:
|
|
942
|
-
background:
|
|
943
|
-
border-bottom: 1px solid
|
|
1032
|
+
padding: 6px 12px;
|
|
1033
|
+
background: var(--db-bg-soft);
|
|
1034
|
+
border-bottom: 1px solid var(--db-border);
|
|
944
1035
|
}
|
|
945
|
-
.results-title[data-v-
|
|
1036
|
+
.results-title[data-v-c49117ce] {
|
|
946
1037
|
margin: 0;
|
|
947
|
-
font-size:
|
|
1038
|
+
font-size: 0.875rem;
|
|
948
1039
|
font-weight: 600;
|
|
949
|
-
color:
|
|
1040
|
+
color: var(--db-dark-color);
|
|
950
1041
|
display: flex;
|
|
951
1042
|
align-items: center;
|
|
952
|
-
gap: 0.
|
|
1043
|
+
gap: 0.375rem;
|
|
953
1044
|
}
|
|
954
|
-
.results-content[data-v-
|
|
1045
|
+
.results-content[data-v-c49117ce] {
|
|
955
1046
|
max-height: 400px;
|
|
956
1047
|
overflow-y: auto;
|
|
957
|
-
padding:
|
|
1048
|
+
padding: 8px;
|
|
958
1049
|
}
|
|
959
|
-
.no-results[data-v-
|
|
1050
|
+
.no-results[data-v-c49117ce] {
|
|
960
1051
|
display: flex;
|
|
961
1052
|
flex-direction: column;
|
|
962
1053
|
align-items: center;
|
|
963
1054
|
justify-content: center;
|
|
964
|
-
|
|
965
|
-
|
|
1055
|
+
gap: 0.5rem;
|
|
1056
|
+
padding: 32px 16px;
|
|
1057
|
+
color: var(--db-text-muted);
|
|
966
1058
|
}
|
|
967
|
-
.no-results i[data-v-
|
|
968
|
-
font-size:
|
|
969
|
-
margin-bottom:
|
|
1059
|
+
.no-results i[data-v-c49117ce] {
|
|
1060
|
+
font-size: 1.5rem;
|
|
1061
|
+
margin-bottom: 0;
|
|
1062
|
+
opacity: 0.5;
|
|
970
1063
|
}
|
|
971
|
-
.no-results p[data-v-
|
|
1064
|
+
.no-results p[data-v-c49117ce] {
|
|
972
1065
|
margin: 0;
|
|
973
|
-
font-size:
|
|
1066
|
+
font-size: 0.8125rem;
|
|
974
1067
|
}
|
|
975
|
-
.result-item[data-v-
|
|
976
|
-
margin-bottom: 0.
|
|
977
|
-
border: 1px solid
|
|
978
|
-
border-radius:
|
|
979
|
-
background:
|
|
1068
|
+
.result-item[data-v-c49117ce] {
|
|
1069
|
+
margin-bottom: 0.5rem;
|
|
1070
|
+
border: 1px solid var(--db-border);
|
|
1071
|
+
border-radius: 6px;
|
|
1072
|
+
background: var(--db-surface);
|
|
980
1073
|
overflow: hidden;
|
|
981
1074
|
transition: box-shadow 0.2s;
|
|
982
1075
|
}
|
|
983
|
-
.result-item[data-v-
|
|
1076
|
+
.result-item[data-v-c49117ce]:hover {
|
|
984
1077
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
985
1078
|
}
|
|
986
|
-
.result-item.result-success[data-v-
|
|
1079
|
+
.result-item.result-success[data-v-c49117ce] {
|
|
987
1080
|
border-left: 4px solid #22c55e;
|
|
988
1081
|
}
|
|
989
|
-
.result-item.result-error[data-v-
|
|
1082
|
+
.result-item.result-error[data-v-c49117ce] {
|
|
990
1083
|
border-left: 4px solid #ef4444;
|
|
991
1084
|
}
|
|
992
|
-
.result-item.result-info[data-v-
|
|
1085
|
+
.result-item.result-info[data-v-c49117ce] {
|
|
993
1086
|
border-left: 4px solid #3b82f6;
|
|
994
1087
|
}
|
|
995
|
-
.result-header[data-v-
|
|
1088
|
+
.result-header[data-v-c49117ce] {
|
|
996
1089
|
display: flex;
|
|
997
1090
|
justify-content: space-between;
|
|
998
1091
|
align-items: center;
|
|
999
1092
|
padding: 0.75rem 1rem;
|
|
1000
1093
|
cursor: pointer;
|
|
1001
|
-
background:
|
|
1094
|
+
background: var(--db-surface);
|
|
1002
1095
|
transition: background 0.2s;
|
|
1003
1096
|
}
|
|
1004
|
-
.result-header[data-v-
|
|
1005
|
-
background:
|
|
1097
|
+
.result-header[data-v-c49117ce]:hover {
|
|
1098
|
+
background: var(--db-light-color);
|
|
1006
1099
|
}
|
|
1007
|
-
.result-title[data-v-
|
|
1100
|
+
.result-title[data-v-c49117ce] {
|
|
1008
1101
|
display: flex;
|
|
1009
1102
|
align-items: center;
|
|
1010
1103
|
gap: 0.75rem;
|
|
1011
1104
|
flex: 1;
|
|
1012
1105
|
}
|
|
1013
|
-
.result-title i[data-v-
|
|
1106
|
+
.result-title i[data-v-c49117ce] {
|
|
1014
1107
|
font-size: 1.1rem;
|
|
1015
1108
|
}
|
|
1016
|
-
.operation-name[data-v-
|
|
1109
|
+
.operation-name[data-v-c49117ce] {
|
|
1017
1110
|
font-weight: 600;
|
|
1018
|
-
color:
|
|
1111
|
+
color: var(--db-dark-color);
|
|
1019
1112
|
font-size: 0.95rem;
|
|
1020
1113
|
}
|
|
1021
|
-
.operation-time[data-v-
|
|
1022
|
-
color:
|
|
1114
|
+
.operation-time[data-v-c49117ce] {
|
|
1115
|
+
color: var(--db-darker-color);
|
|
1023
1116
|
font-size: 0.85rem;
|
|
1024
1117
|
margin-left: auto;
|
|
1025
1118
|
}
|
|
1026
|
-
.toggle-icon[data-v-
|
|
1119
|
+
.toggle-icon[data-v-c49117ce] {
|
|
1027
1120
|
transition: transform 0.2s;
|
|
1028
|
-
color:
|
|
1121
|
+
color: var(--db-gray-dark);
|
|
1029
1122
|
font-size: 0.9rem;
|
|
1030
1123
|
}
|
|
1031
|
-
.toggle-icon.expanded[data-v-
|
|
1124
|
+
.toggle-icon.expanded[data-v-c49117ce] {
|
|
1032
1125
|
transform: rotate(180deg);
|
|
1033
1126
|
}
|
|
1034
|
-
.result-body[data-v-
|
|
1127
|
+
.result-body[data-v-c49117ce] {
|
|
1035
1128
|
padding: 1rem;
|
|
1036
|
-
background:
|
|
1037
|
-
border-top: 1px solid
|
|
1129
|
+
background: var(--db-bg-soft4);
|
|
1130
|
+
border-top: 1px solid var(--db-gray-medium);
|
|
1038
1131
|
}
|
|
1039
|
-
.result-body pre[data-v-
|
|
1132
|
+
.result-body pre[data-v-c49117ce] {
|
|
1040
1133
|
margin: 0;
|
|
1041
1134
|
font-size: 0.85rem;
|
|
1042
1135
|
line-height: 1.5;
|
|
1043
1136
|
max-height: 300px;
|
|
1044
1137
|
overflow: auto;
|
|
1045
1138
|
}
|
|
1046
|
-
.result-body code[data-v-
|
|
1139
|
+
.result-body code[data-v-c49117ce] {
|
|
1047
1140
|
font-family: 'Fira Code', 'Consolas', 'Monaco', monospace;
|
|
1048
1141
|
}
|
|
1049
1142
|
|
|
1050
1143
|
/* JSON 语法高亮 - 不使用 scoped 以确保 v-html 内容能应用样式 */
|
|
1051
|
-
[data-v-
|
|
1144
|
+
[data-v-c49117ce] .json-key {
|
|
1052
1145
|
color: #d04255;
|
|
1053
1146
|
font-weight: 500;
|
|
1054
1147
|
}
|
|
1055
|
-
[data-v-
|
|
1148
|
+
[data-v-c49117ce] .json-string {
|
|
1056
1149
|
color: #22863a;
|
|
1057
1150
|
}
|
|
1058
|
-
[data-v-
|
|
1151
|
+
[data-v-c49117ce] .json-number {
|
|
1059
1152
|
color: #005cc5;
|
|
1060
1153
|
}
|
|
1061
|
-
[data-v-
|
|
1154
|
+
[data-v-c49117ce] .json-boolean {
|
|
1062
1155
|
color: #d73a49;
|
|
1063
1156
|
}
|
|
1064
|
-
[data-v-
|
|
1157
|
+
[data-v-c49117ce] .json-null {
|
|
1065
1158
|
color: #6f42c1;
|
|
1066
1159
|
}
|
|
1067
1160
|
|
|
1068
1161
|
/* 滚动条样式 */
|
|
1069
|
-
.results-content[data-v-
|
|
1070
|
-
.result-body pre[data-v-
|
|
1162
|
+
.results-content[data-v-c49117ce]::-webkit-scrollbar,
|
|
1163
|
+
.result-body pre[data-v-c49117ce]::-webkit-scrollbar {
|
|
1071
1164
|
width: 8px;
|
|
1072
1165
|
height: 8px;
|
|
1073
1166
|
}
|
|
1074
|
-
.results-content[data-v-
|
|
1075
|
-
.result-body pre[data-v-
|
|
1076
|
-
background:
|
|
1167
|
+
.results-content[data-v-c49117ce]::-webkit-scrollbar-track,
|
|
1168
|
+
.result-body pre[data-v-c49117ce]::-webkit-scrollbar-track {
|
|
1169
|
+
background: var(--db-gray-light);
|
|
1077
1170
|
border-radius: 4px;
|
|
1078
1171
|
}
|
|
1079
|
-
.results-content[data-v-
|
|
1080
|
-
.result-body pre[data-v-
|
|
1081
|
-
background:
|
|
1172
|
+
.results-content[data-v-c49117ce]::-webkit-scrollbar-thumb,
|
|
1173
|
+
.result-body pre[data-v-c49117ce]::-webkit-scrollbar-thumb {
|
|
1174
|
+
background: var(--db-gray-medium);
|
|
1082
1175
|
border-radius: 4px;
|
|
1083
1176
|
}
|
|
1084
|
-
.results-content[data-v-
|
|
1085
|
-
.result-body pre[data-v-
|
|
1086
|
-
background:
|
|
1177
|
+
.results-content[data-v-c49117ce]::-webkit-scrollbar-thumb:hover,
|
|
1178
|
+
.result-body pre[data-v-c49117ce]::-webkit-scrollbar-thumb:hover {
|
|
1179
|
+
background: var(--db-text-faint);
|
|
1087
1180
|
}
|
|
1088
1181
|
|
|
1089
|
-
.database-detail[data-v-
|
|
1182
|
+
.database-detail[data-v-822c95b7] {
|
|
1090
1183
|
width: 100%;
|
|
1091
1184
|
height: 100%;
|
|
1092
1185
|
display: flex;
|
|
1093
1186
|
flex-direction: column;
|
|
1094
1187
|
}
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
|
|
1098
|
-
|
|
1099
|
-
|
|
1100
|
-
|
|
1188
|
+
|
|
1189
|
+
/* SQL 面板直接铺满 tab 内容区（内边距由 .tab-content 统一提供） */
|
|
1190
|
+
.sql-executor-section[data-v-822c95b7] {
|
|
1191
|
+
margin: 0;
|
|
1192
|
+
padding: 0;
|
|
1193
|
+
background-color: transparent;
|
|
1194
|
+
border: none;
|
|
1195
|
+
border-radius: 0;
|
|
1101
1196
|
flex: 1;
|
|
1102
1197
|
display: flex;
|
|
1103
1198
|
}
|
|
1104
1199
|
|
|
1105
1200
|
/* 加载状态样式 */
|
|
1106
|
-
.loading-state[data-v-
|
|
1201
|
+
.loading-state[data-v-822c95b7] {
|
|
1107
1202
|
display: flex;
|
|
1108
1203
|
flex-direction: column;
|
|
1109
1204
|
align-items: center;
|
|
1110
1205
|
justify-content: center;
|
|
1111
|
-
padding:
|
|
1112
|
-
color:
|
|
1206
|
+
padding: 24px 0;
|
|
1207
|
+
color: var(--db-text-muted);
|
|
1113
1208
|
}
|
|
1114
|
-
.loading-state .spinner-border[data-v-
|
|
1115
|
-
margin-bottom:
|
|
1116
|
-
color:
|
|
1209
|
+
.loading-state .spinner-border[data-v-822c95b7] {
|
|
1210
|
+
margin-bottom: 10px;
|
|
1211
|
+
color: var(--db-primary-color);
|
|
1117
1212
|
}
|
|
1118
|
-
.loading-state p[data-v-
|
|
1213
|
+
.loading-state p[data-v-822c95b7] {
|
|
1119
1214
|
margin: 0;
|
|
1120
|
-
font-size:
|
|
1215
|
+
font-size: 12px;
|
|
1121
1216
|
}
|
|
1122
|
-
.database-header[data-v-
|
|
1123
|
-
padding:
|
|
1124
|
-
background:
|
|
1125
|
-
border-bottom: 1px solid
|
|
1217
|
+
.database-header[data-v-822c95b7] {
|
|
1218
|
+
padding: 8px 12px;
|
|
1219
|
+
background: var(--db-bg-soft2);
|
|
1220
|
+
border-bottom: 1px solid var(--db-border);
|
|
1126
1221
|
}
|
|
1127
|
-
.database-header-content[data-v-
|
|
1222
|
+
.database-header-content[data-v-822c95b7] {
|
|
1128
1223
|
display: flex;
|
|
1129
1224
|
justify-content: space-between;
|
|
1130
1225
|
align-items: center;
|
|
1131
|
-
gap:
|
|
1226
|
+
gap: 1rem;
|
|
1132
1227
|
}
|
|
1133
|
-
.database-info[data-v-
|
|
1228
|
+
.database-info[data-v-822c95b7] {
|
|
1134
1229
|
display: flex;
|
|
1135
1230
|
align-items: center;
|
|
1136
|
-
gap:
|
|
1231
|
+
gap: 0.625rem;
|
|
1137
1232
|
}
|
|
1138
|
-
.database-icon[data-v-
|
|
1139
|
-
width:
|
|
1140
|
-
height:
|
|
1141
|
-
background:
|
|
1142
|
-
border
|
|
1233
|
+
.database-icon[data-v-822c95b7] {
|
|
1234
|
+
width: 34px;
|
|
1235
|
+
height: 34px;
|
|
1236
|
+
background: var(--db-primary-bg);
|
|
1237
|
+
border: 1px solid var(--db-border);
|
|
1238
|
+
border-radius: 6px;
|
|
1143
1239
|
display: flex;
|
|
1144
1240
|
align-items: center;
|
|
1145
1241
|
justify-content: center;
|
|
1146
|
-
color:
|
|
1147
|
-
font-size:
|
|
1242
|
+
color: var(--db-primary-color);
|
|
1243
|
+
font-size: 1rem;
|
|
1244
|
+
flex-shrink: 0;
|
|
1148
1245
|
}
|
|
1149
|
-
.database-meta h4[data-v-
|
|
1150
|
-
margin: 0 0 0.
|
|
1151
|
-
|
|
1246
|
+
.database-meta h4[data-v-822c95b7] {
|
|
1247
|
+
margin: 0 0 0.25rem 0;
|
|
1248
|
+
font-size: 0.9375rem;
|
|
1249
|
+
color: var(--db-dark-color);
|
|
1152
1250
|
font-weight: 600;
|
|
1153
1251
|
}
|
|
1154
|
-
.connection-info[data-v-
|
|
1252
|
+
.connection-info[data-v-822c95b7] {
|
|
1155
1253
|
display: flex;
|
|
1156
|
-
|
|
1254
|
+
align-items: center;
|
|
1255
|
+
gap: 0.375rem;
|
|
1256
|
+
font-size: 0.75rem;
|
|
1157
1257
|
}
|
|
1158
|
-
.connection-
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
padding: 0
|
|
1162
|
-
border-radius:
|
|
1163
|
-
font-size: 0.
|
|
1258
|
+
.connection-info .crumb[data-v-822c95b7] {
|
|
1259
|
+
display: inline-flex;
|
|
1260
|
+
align-items: center;
|
|
1261
|
+
padding: 0;
|
|
1262
|
+
border-radius: 0;
|
|
1263
|
+
font-size: 0.75rem;
|
|
1264
|
+
transition: color 0.15s ease;
|
|
1265
|
+
}
|
|
1266
|
+
.connection-info .crumb-link[data-v-822c95b7] {
|
|
1267
|
+
cursor: pointer;
|
|
1268
|
+
background: transparent;
|
|
1269
|
+
color: var(--db-primary-color);
|
|
1270
|
+
}
|
|
1271
|
+
.connection-info .crumb-link[data-v-822c95b7]:hover {
|
|
1272
|
+
color: var(--db-primary-light);
|
|
1273
|
+
text-decoration: underline;
|
|
1274
|
+
}
|
|
1275
|
+
.connection-info .crumb-current[data-v-822c95b7] {
|
|
1164
1276
|
font-weight: 500;
|
|
1277
|
+
color: var(--db-text-muted);
|
|
1165
1278
|
}
|
|
1166
|
-
.connection-
|
|
1167
|
-
background:
|
|
1168
|
-
color:
|
|
1169
|
-
padding: 0
|
|
1170
|
-
border-radius:
|
|
1171
|
-
font-size: 0.
|
|
1172
|
-
font-weight:
|
|
1279
|
+
.connection-name[data-v-822c95b7] {
|
|
1280
|
+
background: transparent;
|
|
1281
|
+
color: var(--db-primary-color);
|
|
1282
|
+
padding: 0;
|
|
1283
|
+
border-radius: 0;
|
|
1284
|
+
font-size: 0.75rem;
|
|
1285
|
+
font-weight: 500;
|
|
1286
|
+
}
|
|
1287
|
+
.connection-type[data-v-822c95b7] {
|
|
1288
|
+
background: var(--db-primary-bg);
|
|
1289
|
+
color: var(--db-primary-color);
|
|
1290
|
+
padding: 1px 7px;
|
|
1291
|
+
border-radius: 999px;
|
|
1292
|
+
font-size: 0.6875rem;
|
|
1293
|
+
font-weight: 500;
|
|
1173
1294
|
}
|
|
1174
|
-
.database-stats[data-v-
|
|
1295
|
+
.database-stats[data-v-822c95b7] {
|
|
1175
1296
|
display: flex;
|
|
1176
|
-
gap:
|
|
1297
|
+
gap: 1.5rem;
|
|
1177
1298
|
}
|
|
1178
|
-
.stat-item[data-v-
|
|
1179
|
-
text-align:
|
|
1299
|
+
.stat-item[data-v-822c95b7] {
|
|
1300
|
+
text-align: right;
|
|
1180
1301
|
}
|
|
1181
|
-
.stat-value[data-v-
|
|
1182
|
-
font-size:
|
|
1302
|
+
.stat-value[data-v-822c95b7] {
|
|
1303
|
+
font-size: 1rem;
|
|
1183
1304
|
font-weight: 700;
|
|
1184
|
-
|
|
1185
|
-
|
|
1305
|
+
line-height: 1.2;
|
|
1306
|
+
color: var(--db-dark-color);
|
|
1307
|
+
margin-bottom: 0;
|
|
1186
1308
|
}
|
|
1187
|
-
.stat-label[data-v-
|
|
1188
|
-
font-size: 0.
|
|
1189
|
-
color:
|
|
1190
|
-
font-weight:
|
|
1309
|
+
.stat-label[data-v-822c95b7] {
|
|
1310
|
+
font-size: 0.6875rem;
|
|
1311
|
+
color: var(--db-text-muted);
|
|
1312
|
+
font-weight: 400;
|
|
1191
1313
|
}
|
|
1192
|
-
.database-tabs[data-v-
|
|
1314
|
+
.database-tabs[data-v-822c95b7] {
|
|
1193
1315
|
flex: 1;
|
|
1194
1316
|
overflow: hidden;
|
|
1195
1317
|
display: flex;
|
|
1196
1318
|
flex-direction: column;
|
|
1319
|
+
min-height: 0;
|
|
1197
1320
|
}
|
|
1198
|
-
.nav-tabs[data-v-
|
|
1199
|
-
background:
|
|
1200
|
-
border-bottom: 1px solid
|
|
1201
|
-
padding: 0
|
|
1321
|
+
.nav-tabs[data-v-822c95b7] {
|
|
1322
|
+
background: var(--db-gray-light);
|
|
1323
|
+
border-bottom: 1px solid var(--db-border);
|
|
1324
|
+
padding: 0 0.5rem;
|
|
1325
|
+
gap: 0;
|
|
1202
1326
|
}
|
|
1203
|
-
.nav-link[data-v-
|
|
1327
|
+
.nav-link[data-v-822c95b7] {
|
|
1204
1328
|
border: none;
|
|
1205
1329
|
background: transparent;
|
|
1206
|
-
color:
|
|
1207
|
-
padding:
|
|
1330
|
+
color: var(--db-text-muted);
|
|
1331
|
+
padding: 6px 12px;
|
|
1332
|
+
font-size: 12px;
|
|
1208
1333
|
font-weight: 500;
|
|
1209
|
-
transition:
|
|
1334
|
+
transition: color 0.15s ease, background-color 0.15s ease;
|
|
1210
1335
|
}
|
|
1211
|
-
.nav-link[data-v-
|
|
1212
|
-
color:
|
|
1213
|
-
background:
|
|
1336
|
+
.nav-link[data-v-822c95b7]:hover {
|
|
1337
|
+
color: var(--db-dark-color);
|
|
1338
|
+
background: var(--db-bg-soft);
|
|
1214
1339
|
}
|
|
1215
|
-
.nav-link.active[data-v-
|
|
1216
|
-
color:
|
|
1217
|
-
background:
|
|
1218
|
-
border-bottom: 2px solid
|
|
1340
|
+
.nav-link.active[data-v-822c95b7] {
|
|
1341
|
+
color: var(--db-primary-color);
|
|
1342
|
+
background: transparent;
|
|
1343
|
+
border-bottom: 2px solid var(--db-primary-color);
|
|
1219
1344
|
}
|
|
1220
|
-
.tab-content[data-v-
|
|
1345
|
+
.tab-content[data-v-822c95b7] {
|
|
1221
1346
|
overflow-y: auto;
|
|
1222
1347
|
flex: 1;
|
|
1223
1348
|
display: flex;
|
|
1224
1349
|
flex-direction: column;
|
|
1225
|
-
height:
|
|
1350
|
+
min-height: 0;
|
|
1226
1351
|
}
|
|
1227
|
-
.tab-panel[data-v-
|
|
1352
|
+
.tab-panel[data-v-822c95b7] {
|
|
1228
1353
|
flex: 1;
|
|
1229
1354
|
overflow-y: auto;
|
|
1230
1355
|
display: flex;
|
|
1231
1356
|
flex-direction: column;
|
|
1232
|
-
height:
|
|
1357
|
+
min-height: 0;
|
|
1233
1358
|
}
|
|
1234
|
-
.table-grid[data-v-
|
|
1359
|
+
.table-grid[data-v-822c95b7] {
|
|
1235
1360
|
display: grid;
|
|
1236
|
-
grid-template-columns: repeat(auto-fill, minmax(
|
|
1237
|
-
gap:
|
|
1361
|
+
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
|
1362
|
+
gap: 8px;
|
|
1238
1363
|
}
|
|
1239
|
-
.table-card[data-v-
|
|
1240
|
-
background:
|
|
1241
|
-
border: 1px solid
|
|
1242
|
-
border-radius:
|
|
1364
|
+
.table-card[data-v-822c95b7] {
|
|
1365
|
+
background: var(--db-bg-soft2);
|
|
1366
|
+
border: 1px solid var(--db-border);
|
|
1367
|
+
border-radius: 6px;
|
|
1243
1368
|
overflow: hidden;
|
|
1244
|
-
transition:
|
|
1369
|
+
transition: border-color 0.15s ease, background-color 0.15s ease;
|
|
1245
1370
|
cursor: pointer;
|
|
1246
1371
|
}
|
|
1247
|
-
.table-card[data-v-
|
|
1248
|
-
border-color:
|
|
1249
|
-
|
|
1250
|
-
|
|
1372
|
+
.table-card[data-v-822c95b7]:hover {
|
|
1373
|
+
border-color: var(--db-primary-color);
|
|
1374
|
+
background: var(--db-bg-soft);
|
|
1375
|
+
box-shadow: none;
|
|
1251
1376
|
}
|
|
1252
|
-
.card-header[data-v-
|
|
1253
|
-
background:
|
|
1254
|
-
padding:
|
|
1377
|
+
.card-header[data-v-822c95b7] {
|
|
1378
|
+
background: var(--db-bg-soft);
|
|
1379
|
+
padding: 6px 8px;
|
|
1255
1380
|
display: flex;
|
|
1256
1381
|
align-items: center;
|
|
1257
|
-
gap: 0.
|
|
1382
|
+
gap: 0.5rem;
|
|
1258
1383
|
}
|
|
1259
|
-
.table-icon[data-v-
|
|
1260
|
-
width:
|
|
1261
|
-
height:
|
|
1262
|
-
|
|
1263
|
-
|
|
1384
|
+
.table-icon[data-v-822c95b7] {
|
|
1385
|
+
width: 22px;
|
|
1386
|
+
height: 22px;
|
|
1387
|
+
font-size: 0.75rem;
|
|
1388
|
+
background: var(--db-success-bg);
|
|
1389
|
+
border-radius: 4px;
|
|
1264
1390
|
display: flex;
|
|
1265
1391
|
align-items: center;
|
|
1266
1392
|
justify-content: center;
|
|
1267
|
-
color:
|
|
1393
|
+
color: var(--db-accent-color);
|
|
1394
|
+
flex-shrink: 0;
|
|
1268
1395
|
}
|
|
1269
|
-
.table-info[data-v-
|
|
1396
|
+
.table-info[data-v-822c95b7] {
|
|
1270
1397
|
flex: 1;
|
|
1271
1398
|
min-width: 0; /* 允许子元素截断 */
|
|
1272
1399
|
}
|
|
1273
|
-
.table-name-wrapper[data-v-
|
|
1400
|
+
.table-name-wrapper[data-v-822c95b7] {
|
|
1274
1401
|
display: flex;
|
|
1275
1402
|
align-items: center;
|
|
1276
|
-
gap: 0.
|
|
1277
|
-
margin-bottom: 0
|
|
1403
|
+
gap: 0.375rem;
|
|
1404
|
+
margin-bottom: 0;
|
|
1278
1405
|
}
|
|
1279
|
-
.table-name[data-v-
|
|
1280
|
-
font-
|
|
1281
|
-
|
|
1406
|
+
.table-name[data-v-822c95b7] {
|
|
1407
|
+
font-size: 0.8125rem;
|
|
1408
|
+
font-weight: 500;
|
|
1409
|
+
color: var(--db-dark-color);
|
|
1282
1410
|
white-space: nowrap;
|
|
1283
1411
|
overflow: hidden;
|
|
1284
1412
|
text-overflow: ellipsis;
|
|
1413
|
+
min-width: 0;
|
|
1285
1414
|
}
|
|
1286
|
-
.table-engine[data-v-
|
|
1287
|
-
font-size: 0.
|
|
1288
|
-
color:
|
|
1289
|
-
background:
|
|
1290
|
-
padding: 0
|
|
1291
|
-
border-radius:
|
|
1415
|
+
.table-engine[data-v-822c95b7] {
|
|
1416
|
+
font-size: 0.625rem;
|
|
1417
|
+
color: var(--db-primary-color);
|
|
1418
|
+
background: var(--db-primary-bg);
|
|
1419
|
+
padding: 0 0.375rem;
|
|
1420
|
+
border-radius: 999px;
|
|
1292
1421
|
flex-shrink: 0;
|
|
1293
1422
|
}
|
|
1294
|
-
.table-comment-header[data-v-
|
|
1295
|
-
font-size: 0.
|
|
1296
|
-
color:
|
|
1423
|
+
.table-comment-header[data-v-822c95b7] {
|
|
1424
|
+
font-size: 0.6875rem;
|
|
1425
|
+
color: var(--db-text-muted);
|
|
1297
1426
|
white-space: nowrap;
|
|
1298
1427
|
overflow: hidden;
|
|
1299
1428
|
text-overflow: ellipsis;
|
|
1300
1429
|
}
|
|
1301
|
-
|
|
1302
|
-
|
|
1430
|
+
|
|
1431
|
+
/* 卡片正文：标签在上、数值在下，右下角编辑按钮（对齐 VSCode 数据库插件的表格卡片） */
|
|
1432
|
+
.card-body[data-v-822c95b7] {
|
|
1433
|
+
padding: 8px;
|
|
1434
|
+
display: flex;
|
|
1435
|
+
flex-direction: column;
|
|
1436
|
+
align-items: stretch;
|
|
1437
|
+
gap: 8px;
|
|
1303
1438
|
}
|
|
1304
|
-
.table-stats[data-v-
|
|
1439
|
+
.table-stats[data-v-822c95b7] {
|
|
1305
1440
|
display: flex;
|
|
1306
|
-
|
|
1307
|
-
|
|
1441
|
+
align-items: flex-start;
|
|
1442
|
+
gap: 1.25rem;
|
|
1443
|
+
margin-bottom: 0;
|
|
1444
|
+
flex-wrap: wrap;
|
|
1445
|
+
min-width: 0;
|
|
1308
1446
|
}
|
|
1309
|
-
.stat[data-v-
|
|
1447
|
+
.stat[data-v-822c95b7] {
|
|
1310
1448
|
display: flex;
|
|
1311
1449
|
flex-direction: column;
|
|
1312
|
-
|
|
1450
|
+
align-items: flex-start;
|
|
1451
|
+
gap: 0;
|
|
1313
1452
|
}
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1453
|
+
|
|
1454
|
+
/* 卡片内的统计字号覆盖（不影响顶部数据库统计的大号数字） */
|
|
1455
|
+
.table-card .stat-label[data-v-822c95b7] {
|
|
1456
|
+
font-size: 0.6875rem;
|
|
1457
|
+
color: var(--db-text-muted);
|
|
1458
|
+
}
|
|
1459
|
+
.table-card .stat-value[data-v-822c95b7] {
|
|
1460
|
+
font-size: 0.9375rem;
|
|
1461
|
+
font-weight: 600;
|
|
1462
|
+
color: var(--db-dark-color);
|
|
1463
|
+
}
|
|
1464
|
+
.table-comment[data-v-822c95b7] {
|
|
1465
|
+
font-size: 0.8125rem;
|
|
1466
|
+
color: var(--db-text-muted);
|
|
1317
1467
|
font-style: italic;
|
|
1318
|
-
margin-bottom: 0.
|
|
1468
|
+
margin-bottom: 0.5rem;
|
|
1319
1469
|
line-height: 1.4;
|
|
1320
1470
|
}
|
|
1321
|
-
.table-actions[data-v-
|
|
1471
|
+
.table-actions[data-v-822c95b7] {
|
|
1322
1472
|
display: flex;
|
|
1323
|
-
gap: 0.
|
|
1473
|
+
gap: 0.375rem;
|
|
1474
|
+
flex-shrink: 0;
|
|
1324
1475
|
}
|
|
1325
|
-
.
|
|
1476
|
+
.table-actions .btn[data-v-822c95b7] {
|
|
1477
|
+
width: 22px;
|
|
1478
|
+
height: 22px;
|
|
1479
|
+
padding: 0;
|
|
1480
|
+
display: inline-flex;
|
|
1481
|
+
align-items: center;
|
|
1482
|
+
justify-content: center;
|
|
1483
|
+
font-size: 0.6875rem;
|
|
1484
|
+
line-height: 1;
|
|
1485
|
+
border: 1px solid var(--db-primary-color);
|
|
1486
|
+
border-radius: 4px;
|
|
1487
|
+
background: transparent;
|
|
1488
|
+
color: var(--db-primary-color);
|
|
1489
|
+
}
|
|
1490
|
+
.table-actions .btn[data-v-822c95b7]:hover {
|
|
1491
|
+
background: var(--db-primary-bg);
|
|
1492
|
+
color: var(--db-primary-color);
|
|
1493
|
+
border-color: var(--db-primary-color);
|
|
1494
|
+
}
|
|
1495
|
+
.empty-state[data-v-822c95b7] {
|
|
1326
1496
|
display: flex;
|
|
1327
1497
|
flex-direction: column;
|
|
1328
1498
|
align-items: center;
|
|
1329
1499
|
justify-content: center;
|
|
1330
|
-
|
|
1331
|
-
|
|
1500
|
+
gap: 0.5rem;
|
|
1501
|
+
height: 140px;
|
|
1502
|
+
color: var(--db-text-muted);
|
|
1332
1503
|
text-align: center;
|
|
1333
|
-
font-size:
|
|
1504
|
+
font-size: 0.8125rem;
|
|
1334
1505
|
}
|
|
1335
|
-
.empty-state i[data-v-
|
|
1336
|
-
|
|
1506
|
+
.empty-state i[data-v-822c95b7] {
|
|
1507
|
+
font-size: 1.5rem;
|
|
1508
|
+
margin-bottom: 0;
|
|
1337
1509
|
opacity: 0.5;
|
|
1338
1510
|
}
|
|
1339
1511
|
|
|
1340
1512
|
/* 视图和存储过程卡片样式 */
|
|
1341
|
-
.views-grid[data-v-
|
|
1513
|
+
.views-grid[data-v-822c95b7], .procedures-grid[data-v-822c95b7] {
|
|
1342
1514
|
display: grid;
|
|
1343
|
-
grid-template-columns: repeat(auto-fill, minmax(
|
|
1344
|
-
gap:
|
|
1515
|
+
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
|
|
1516
|
+
gap: 8px;
|
|
1345
1517
|
}
|
|
1346
|
-
.view-card[data-v-
|
|
1347
|
-
background:
|
|
1348
|
-
border: 1px solid
|
|
1349
|
-
border-radius:
|
|
1518
|
+
.view-card[data-v-822c95b7], .procedure-card[data-v-822c95b7] {
|
|
1519
|
+
background: var(--db-bg-soft2);
|
|
1520
|
+
border: 1px solid var(--db-border);
|
|
1521
|
+
border-radius: 6px;
|
|
1350
1522
|
overflow: hidden;
|
|
1351
|
-
transition:
|
|
1523
|
+
transition: border-color 0.15s ease, background-color 0.15s ease;
|
|
1352
1524
|
}
|
|
1353
|
-
.view-card[data-v-
|
|
1354
|
-
border-color:
|
|
1355
|
-
|
|
1356
|
-
|
|
1525
|
+
.view-card[data-v-822c95b7]:hover, .procedure-card[data-v-822c95b7]:hover {
|
|
1526
|
+
border-color: var(--db-primary-color);
|
|
1527
|
+
background: var(--db-bg-soft);
|
|
1528
|
+
box-shadow: none;
|
|
1529
|
+
transform: none;
|
|
1357
1530
|
}
|
|
1358
|
-
.view-card .card-header[data-v-
|
|
1359
|
-
background:
|
|
1360
|
-
padding:
|
|
1531
|
+
.view-card .card-header[data-v-822c95b7], .procedure-card .card-header[data-v-822c95b7] {
|
|
1532
|
+
background: var(--db-bg-soft);
|
|
1533
|
+
padding: 8px 10px;
|
|
1361
1534
|
display: flex;
|
|
1362
1535
|
align-items: center;
|
|
1363
|
-
gap: 0.
|
|
1536
|
+
gap: 0.5rem;
|
|
1364
1537
|
}
|
|
1365
|
-
.view-icon[data-v-
|
|
1366
|
-
width:
|
|
1367
|
-
height:
|
|
1368
|
-
|
|
1369
|
-
|
|
1538
|
+
.view-icon[data-v-822c95b7], .procedure-icon[data-v-822c95b7] {
|
|
1539
|
+
width: 26px;
|
|
1540
|
+
height: 26px;
|
|
1541
|
+
font-size: 0.8125rem;
|
|
1542
|
+
background: var(--db-info-bg);
|
|
1543
|
+
border-radius: 4px;
|
|
1370
1544
|
display: flex;
|
|
1371
1545
|
align-items: center;
|
|
1372
1546
|
justify-content: center;
|
|
1373
|
-
color:
|
|
1547
|
+
color: var(--db-info-color);
|
|
1548
|
+
flex-shrink: 0;
|
|
1374
1549
|
}
|
|
1375
|
-
.procedure-icon[data-v-
|
|
1376
|
-
background:
|
|
1550
|
+
.procedure-icon[data-v-822c95b7] {
|
|
1551
|
+
background: var(--db-warning-bg);
|
|
1552
|
+
color: var(--db-warning-color);
|
|
1377
1553
|
}
|
|
1378
|
-
.view-name[data-v-
|
|
1379
|
-
font-
|
|
1380
|
-
|
|
1381
|
-
|
|
1554
|
+
.view-name[data-v-822c95b7], .procedure-name[data-v-822c95b7] {
|
|
1555
|
+
font-size: 0.8125rem;
|
|
1556
|
+
font-weight: 500;
|
|
1557
|
+
color: var(--db-dark-color);
|
|
1558
|
+
margin-bottom: 0.125rem;
|
|
1382
1559
|
}
|
|
1383
|
-
.view-comment[data-v-
|
|
1384
|
-
font-size: 0.
|
|
1385
|
-
color:
|
|
1386
|
-
margin-bottom: 0.
|
|
1560
|
+
.view-comment[data-v-822c95b7], .procedure-comment[data-v-822c95b7] {
|
|
1561
|
+
font-size: 0.6875rem;
|
|
1562
|
+
color: var(--db-text-muted);
|
|
1563
|
+
margin-bottom: 0.375rem;
|
|
1387
1564
|
line-height: 1.4;
|
|
1388
1565
|
}
|
|
1389
|
-
.procedure-type[data-v-
|
|
1566
|
+
.procedure-type[data-v-822c95b7] {
|
|
1390
1567
|
display: flex;
|
|
1391
1568
|
gap: 0.25rem;
|
|
1392
1569
|
flex-wrap: wrap;
|
|
1393
1570
|
}
|
|
1394
|
-
.view-card .card-body[data-v-
|
|
1395
|
-
padding:
|
|
1571
|
+
.view-card .card-body[data-v-822c95b7], .procedure-card .card-body[data-v-822c95b7] {
|
|
1572
|
+
padding: 8px 10px;
|
|
1396
1573
|
}
|
|
1397
|
-
.view-actions[data-v-
|
|
1574
|
+
.view-actions[data-v-822c95b7], .procedure-actions[data-v-822c95b7] {
|
|
1398
1575
|
display: flex;
|
|
1399
|
-
gap: 0.
|
|
1576
|
+
gap: 0.375rem;
|
|
1400
1577
|
}
|
|
1401
|
-
|
|
1578
|
+
|
|
1579
|
+
/* 操作栏：无底色无边框，只是一行工具按钮（对齐 VSCode 插件的 Create Table / Refresh） */
|
|
1580
|
+
.views-actions[data-v-822c95b7], .procedures-actions[data-v-822c95b7], .tables-actions[data-v-822c95b7] {
|
|
1402
1581
|
display: flex;
|
|
1403
|
-
gap: 0.
|
|
1404
|
-
margin-bottom:
|
|
1405
|
-
padding: 0
|
|
1406
|
-
background:
|
|
1407
|
-
border-radius:
|
|
1582
|
+
gap: 0.375rem;
|
|
1583
|
+
margin-bottom: 10px;
|
|
1584
|
+
padding: 0;
|
|
1585
|
+
background: transparent;
|
|
1586
|
+
border-radius: 0;
|
|
1408
1587
|
}
|
|
1409
1588
|
|
|
1410
1589
|
/* 模态框样式 */
|
|
1411
|
-
.modal-dialog[data-v-
|
|
1590
|
+
.modal-dialog[data-v-822c95b7] {
|
|
1412
1591
|
margin-top: 10vh;
|
|
1413
1592
|
}
|
|
1414
|
-
.modal-content[data-v-
|
|
1593
|
+
.modal-content[data-v-822c95b7] {
|
|
1415
1594
|
border-radius: 12px;
|
|
1416
1595
|
border: none;
|
|
1417
1596
|
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
|
|
1418
1597
|
}
|
|
1419
|
-
.modal-header[data-v-
|
|
1420
|
-
border-bottom: 1px solid
|
|
1598
|
+
.modal-header[data-v-822c95b7] {
|
|
1599
|
+
border-bottom: 1px solid var(--db-gray-medium);
|
|
1421
1600
|
padding: 1rem 1.5rem;
|
|
1422
1601
|
}
|
|
1423
|
-
.modal-title[data-v-
|
|
1602
|
+
.modal-title[data-v-822c95b7] {
|
|
1424
1603
|
margin: 0;
|
|
1425
1604
|
font-weight: 600;
|
|
1426
|
-
color:
|
|
1605
|
+
color: var(--db-dark-color);
|
|
1427
1606
|
}
|
|
1428
|
-
.modal-body[data-v-
|
|
1607
|
+
.modal-body[data-v-822c95b7] {
|
|
1429
1608
|
padding: 1.5rem;
|
|
1430
1609
|
}
|
|
1431
|
-
.modal-footer[data-v-
|
|
1432
|
-
border-top: 1px solid
|
|
1610
|
+
.modal-footer[data-v-822c95b7] {
|
|
1611
|
+
border-top: 1px solid var(--db-gray-medium);
|
|
1433
1612
|
padding: 1rem 1.5rem;
|
|
1434
1613
|
display: flex;
|
|
1435
1614
|
justify-content: flex-end;
|
|
1436
1615
|
gap: 0.5rem;
|
|
1437
1616
|
}
|
|
1438
1617
|
|
|
1439
|
-
.modal[data-v-
|
|
1618
|
+
.modal[data-v-d9b3ed26] {
|
|
1440
1619
|
background-color: rgba(0, 0, 0, 0.5);
|
|
1441
1620
|
}
|
|
1442
|
-
.modal-dialog[data-v-
|
|
1621
|
+
.modal-dialog[data-v-d9b3ed26] {
|
|
1443
1622
|
max-width: 800px;
|
|
1444
1623
|
}
|
|
1445
|
-
.form-label[data-v-
|
|
1624
|
+
.form-label[data-v-d9b3ed26] {
|
|
1446
1625
|
font-weight: 500;
|
|
1447
|
-
color:
|
|
1626
|
+
color: var(--db-text-body);
|
|
1448
1627
|
}
|
|
1449
|
-
.form-control[data-v-
|
|
1450
|
-
border: 1px solid
|
|
1628
|
+
.form-control[data-v-d9b3ed26], .form-select[data-v-d9b3ed26] {
|
|
1629
|
+
border: 1px solid var(--db-border-light);
|
|
1451
1630
|
border-radius: 6px;
|
|
1452
1631
|
}
|
|
1453
|
-
.form-control[data-v-
|
|
1632
|
+
.form-control[data-v-d9b3ed26]:focus, .form-select[data-v-d9b3ed26]:focus {
|
|
1454
1633
|
border-color: #3b82f6;
|
|
1455
1634
|
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
|
|
1456
1635
|
}
|
|
1457
|
-
.modal-header[data-v-
|
|
1458
|
-
background: linear-gradient(135deg,
|
|
1459
|
-
border-bottom: 1px solid
|
|
1636
|
+
.modal-header[data-v-d9b3ed26] {
|
|
1637
|
+
background: linear-gradient(135deg, var(--db-light-color) 0%, var(--db-gray-light) 100%);
|
|
1638
|
+
border-bottom: 1px solid var(--db-border);
|
|
1460
1639
|
}
|
|
1461
|
-
.modal-title[data-v-
|
|
1462
|
-
color:
|
|
1640
|
+
.modal-title[data-v-d9b3ed26] {
|
|
1641
|
+
color: var(--db-dark-color);
|
|
1463
1642
|
font-weight: 600;
|
|
1464
1643
|
}
|
|
1465
|
-
.modal-footer[data-v-
|
|
1466
|
-
background:
|
|
1467
|
-
border-top: 1px solid
|
|
1644
|
+
.modal-footer[data-v-d9b3ed26] {
|
|
1645
|
+
background: var(--db-light-color);
|
|
1646
|
+
border-top: 1px solid var(--db-border);
|
|
1468
1647
|
}
|
|
1469
|
-
.text-danger[data-v-
|
|
1648
|
+
.text-danger[data-v-d9b3ed26] {
|
|
1470
1649
|
color: #ef4444;
|
|
1471
1650
|
}
|
|
1472
|
-
.text-muted[data-v-
|
|
1473
|
-
color:
|
|
1651
|
+
.text-muted[data-v-d9b3ed26] {
|
|
1652
|
+
color: var(--db-text-muted);
|
|
1474
1653
|
font-size: 0.875rem;
|
|
1475
1654
|
}
|
|
1476
|
-
.json-editor .text-muted[data-v-
|
|
1655
|
+
.json-editor .text-muted[data-v-d9b3ed26] {
|
|
1477
1656
|
font-size: 0.75rem;
|
|
1478
1657
|
}
|
|
1479
|
-
.json-editor[data-v-
|
|
1658
|
+
.json-editor[data-v-d9b3ed26] .cm-editor {
|
|
1480
1659
|
height: 100%;
|
|
1481
1660
|
}
|
|
1482
1661
|
|
|
1483
|
-
.table-data-grid[data-v-
|
|
1662
|
+
.table-data-grid[data-v-f6763da8] {
|
|
1484
1663
|
display: flex;
|
|
1485
1664
|
flex-direction: column;
|
|
1486
1665
|
height: 100%;
|
|
1487
1666
|
}
|
|
1488
|
-
.data-grid-wrapper[data-v-
|
|
1667
|
+
.data-grid-wrapper[data-v-f6763da8] {
|
|
1489
1668
|
flex: 1;
|
|
1490
1669
|
overflow: hidden;
|
|
1491
1670
|
}
|
|
1492
|
-
.column-header-custom[data-v-
|
|
1671
|
+
.column-header-custom[data-v-f6763da8] {
|
|
1493
1672
|
display: flex;
|
|
1494
1673
|
flex-direction: column;
|
|
1495
1674
|
cursor: pointer;
|
|
1496
1675
|
user-select: none;
|
|
1497
1676
|
}
|
|
1498
|
-
.header-main[data-v-
|
|
1677
|
+
.header-main[data-v-f6763da8] {
|
|
1499
1678
|
display: flex;
|
|
1500
1679
|
align-items: center;
|
|
1501
1680
|
}
|
|
1502
|
-
.column-name[data-v-
|
|
1681
|
+
.column-name[data-v-f6763da8] {
|
|
1503
1682
|
font-weight: 600;
|
|
1504
1683
|
}
|
|
1505
|
-
.header-sub[data-v-
|
|
1684
|
+
.header-sub[data-v-f6763da8] {
|
|
1506
1685
|
display: flex;
|
|
1507
1686
|
align-items: center;
|
|
1508
1687
|
margin-top: 2px;
|
|
1509
1688
|
max-width: 150px; /* 限制子标题区域的最大宽度 */
|
|
1510
1689
|
}
|
|
1511
|
-
.column-type[data-v-
|
|
1690
|
+
.column-type[data-v-f6763da8] {
|
|
1512
1691
|
font-size: 0.7rem;
|
|
1513
1692
|
line-height: 1;
|
|
1514
1693
|
flex-shrink: 0; /* 防止类型被压缩 */
|
|
1515
1694
|
}
|
|
1516
|
-
.column-comment[data-v-
|
|
1695
|
+
.column-comment[data-v-f6763da8] {
|
|
1517
1696
|
font-size: 0.7rem;
|
|
1518
1697
|
line-height: 1;
|
|
1519
1698
|
opacity: 0.8;
|
|
@@ -1522,641 +1701,549 @@ to {
|
|
|
1522
1701
|
text-overflow: ellipsis;
|
|
1523
1702
|
flex: 1; /* 允许注释占据剩余空间并截断 */
|
|
1524
1703
|
}
|
|
1525
|
-
.cell-value[data-v-
|
|
1704
|
+
.cell-value[data-v-f6763da8] {
|
|
1526
1705
|
max-width: 300px;
|
|
1527
1706
|
overflow: hidden;
|
|
1528
1707
|
text-overflow: ellipsis;
|
|
1529
1708
|
white-space: nowrap;
|
|
1530
1709
|
}
|
|
1531
|
-
.grid-footer-bar[data-v-
|
|
1532
|
-
background:
|
|
1533
|
-
border-top: 1px solid
|
|
1534
|
-
padding:
|
|
1710
|
+
.grid-footer-bar[data-v-f6763da8] {
|
|
1711
|
+
background: var(--db-bg-soft2);
|
|
1712
|
+
border-top: 1px solid var(--db-border);
|
|
1713
|
+
padding: 6px 12px;
|
|
1714
|
+
}
|
|
1715
|
+
.footer-pagination[data-v-f6763da8] .pagination {
|
|
1716
|
+
margin-bottom: 0;
|
|
1535
1717
|
}
|
|
1536
1718
|
|
|
1537
|
-
.table-detail[data-v-
|
|
1719
|
+
.table-detail[data-v-15c7e3be] {
|
|
1538
1720
|
width: 100%;
|
|
1539
1721
|
height: 100%;
|
|
1540
1722
|
display: flex;
|
|
1541
1723
|
flex-direction: column;
|
|
1542
1724
|
}
|
|
1543
|
-
.table-header[data-v-
|
|
1544
|
-
background-color:
|
|
1545
|
-
border-bottom: 1px solid
|
|
1546
|
-
padding:
|
|
1725
|
+
.table-header[data-v-15c7e3be] {
|
|
1726
|
+
background-color: var(--db-bg-soft2);
|
|
1727
|
+
border-bottom: 1px solid var(--db-border);
|
|
1728
|
+
padding: 8px 12px;
|
|
1547
1729
|
}
|
|
1548
|
-
.table-header-content[data-v-
|
|
1730
|
+
.table-header-content[data-v-15c7e3be] {
|
|
1549
1731
|
display: flex;
|
|
1550
1732
|
justify-content: space-between;
|
|
1551
1733
|
align-items: center;
|
|
1552
1734
|
}
|
|
1553
|
-
.table-info[data-v-
|
|
1735
|
+
.table-info[data-v-15c7e3be] {
|
|
1554
1736
|
display: flex;
|
|
1555
1737
|
align-items: center;
|
|
1556
|
-
gap:
|
|
1738
|
+
gap: 10px;
|
|
1557
1739
|
}
|
|
1558
|
-
.table-icon[data-v-
|
|
1559
|
-
font-size:
|
|
1560
|
-
color:
|
|
1740
|
+
.table-icon[data-v-15c7e3be] {
|
|
1741
|
+
font-size: 20px;
|
|
1742
|
+
color: var(--db-primary-color);
|
|
1561
1743
|
}
|
|
1562
|
-
.table-meta[data-v-
|
|
1744
|
+
.table-meta[data-v-15c7e3be] {
|
|
1563
1745
|
display: flex;
|
|
1564
1746
|
flex-direction: column;
|
|
1565
|
-
gap:
|
|
1747
|
+
gap: 2px;
|
|
1566
1748
|
}
|
|
1567
|
-
.table-name[data-v-
|
|
1749
|
+
.table-name[data-v-15c7e3be] {
|
|
1568
1750
|
margin: 0;
|
|
1569
|
-
font-size:
|
|
1751
|
+
font-size: 0.9375rem;
|
|
1570
1752
|
font-weight: 600;
|
|
1571
1753
|
}
|
|
1572
|
-
.table-breadcrumb[data-v-
|
|
1754
|
+
.table-breadcrumb[data-v-15c7e3be] {
|
|
1573
1755
|
display: flex;
|
|
1574
1756
|
align-items: center;
|
|
1575
|
-
gap:
|
|
1576
|
-
font-size: 0.
|
|
1577
|
-
color:
|
|
1757
|
+
gap: 6px;
|
|
1758
|
+
font-size: 0.75rem;
|
|
1759
|
+
color: var(--db-text-muted);
|
|
1760
|
+
}
|
|
1761
|
+
.table-breadcrumb .crumb[data-v-15c7e3be] {
|
|
1762
|
+
display: inline-flex;
|
|
1763
|
+
align-items: center;
|
|
1764
|
+
padding: 0;
|
|
1765
|
+
border-radius: 0;
|
|
1766
|
+
transition: color 0.15s ease;
|
|
1767
|
+
}
|
|
1768
|
+
.table-breadcrumb .crumb-link[data-v-15c7e3be] {
|
|
1769
|
+
cursor: pointer;
|
|
1770
|
+
color: var(--db-primary-color);
|
|
1771
|
+
}
|
|
1772
|
+
.table-breadcrumb .crumb-link[data-v-15c7e3be]:hover {
|
|
1773
|
+
background-color: transparent;
|
|
1774
|
+
color: var(--db-primary-light);
|
|
1775
|
+
text-decoration: underline;
|
|
1776
|
+
}
|
|
1777
|
+
.table-breadcrumb .crumb-current[data-v-15c7e3be] {
|
|
1778
|
+
font-weight: 500;
|
|
1779
|
+
color: var(--db-text-muted);
|
|
1578
1780
|
}
|
|
1579
|
-
.table-stats[data-v-
|
|
1781
|
+
.table-stats[data-v-15c7e3be] {
|
|
1580
1782
|
display: flex;
|
|
1581
|
-
gap:
|
|
1783
|
+
gap: 14px;
|
|
1582
1784
|
}
|
|
1583
|
-
.stat-item[data-v-
|
|
1785
|
+
.stat-item[data-v-15c7e3be] {
|
|
1584
1786
|
display: flex;
|
|
1585
1787
|
flex-direction: column;
|
|
1586
|
-
align-items:
|
|
1587
|
-
gap:
|
|
1788
|
+
align-items: flex-end;
|
|
1789
|
+
gap: 0;
|
|
1588
1790
|
}
|
|
1589
|
-
.stat-value[data-v-
|
|
1590
|
-
font-size:
|
|
1791
|
+
.stat-value[data-v-15c7e3be] {
|
|
1792
|
+
font-size: 0.9375rem;
|
|
1591
1793
|
font-weight: 600;
|
|
1592
|
-
|
|
1794
|
+
line-height: 1.25;
|
|
1795
|
+
color: var(--db-dark-color);
|
|
1593
1796
|
}
|
|
1594
|
-
.stat-label[data-v-
|
|
1595
|
-
font-size: 0.
|
|
1596
|
-
color:
|
|
1797
|
+
.stat-label[data-v-15c7e3be] {
|
|
1798
|
+
font-size: 0.6875rem;
|
|
1799
|
+
color: var(--db-text-muted);
|
|
1597
1800
|
}
|
|
1598
|
-
.table-toolbar[data-v-
|
|
1801
|
+
.table-toolbar[data-v-15c7e3be] {
|
|
1599
1802
|
display: flex;
|
|
1600
1803
|
justify-content: space-between;
|
|
1601
1804
|
align-items: center;
|
|
1602
|
-
padding:
|
|
1603
|
-
background-color:
|
|
1604
|
-
border-bottom: 1px solid
|
|
1805
|
+
padding: 6px 12px;
|
|
1806
|
+
background-color: var(--db-bg-soft2);
|
|
1807
|
+
border-bottom: 1px solid var(--db-border);
|
|
1605
1808
|
}
|
|
1606
|
-
.toolbar-left[data-v-
|
|
1809
|
+
.toolbar-left[data-v-15c7e3be] {
|
|
1607
1810
|
display: flex;
|
|
1608
|
-
gap:
|
|
1811
|
+
gap: 6px;
|
|
1609
1812
|
align-items: center;
|
|
1610
1813
|
}
|
|
1611
|
-
.toolbar-right[data-v-
|
|
1814
|
+
.toolbar-right[data-v-15c7e3be] {
|
|
1612
1815
|
display: flex;
|
|
1613
|
-
gap:
|
|
1816
|
+
gap: 6px;
|
|
1614
1817
|
align-items: center;
|
|
1615
1818
|
}
|
|
1616
|
-
.table-tabs[data-v-
|
|
1819
|
+
.table-tabs[data-v-15c7e3be] {
|
|
1617
1820
|
flex: 1;
|
|
1618
1821
|
display: flex;
|
|
1619
1822
|
flex-direction: column;
|
|
1620
1823
|
overflow: hidden;
|
|
1621
1824
|
}
|
|
1622
|
-
.nav-tabs[data-v-
|
|
1623
|
-
border-bottom: 1px solid
|
|
1624
|
-
background-color:
|
|
1825
|
+
.nav-tabs[data-v-15c7e3be] {
|
|
1826
|
+
border-bottom: 1px solid var(--db-border);
|
|
1827
|
+
background-color: var(--db-gray-light);
|
|
1625
1828
|
flex-shrink: 0;
|
|
1829
|
+
padding: 0 6px;
|
|
1626
1830
|
}
|
|
1627
|
-
.nav-tabs .nav-link[data-v-
|
|
1628
|
-
color:
|
|
1831
|
+
.nav-tabs .nav-link[data-v-15c7e3be] {
|
|
1832
|
+
color: var(--db-text-muted);
|
|
1629
1833
|
border: none;
|
|
1630
|
-
border-bottom:
|
|
1834
|
+
border-bottom: 2px solid transparent;
|
|
1631
1835
|
border-radius: 0;
|
|
1632
|
-
padding:
|
|
1836
|
+
padding: 6px 12px;
|
|
1837
|
+
font-size: 12px;
|
|
1633
1838
|
font-weight: 500;
|
|
1634
1839
|
}
|
|
1635
|
-
.nav-tabs .nav-link[data-v-
|
|
1636
|
-
background-color:
|
|
1637
|
-
border-bottom-color:
|
|
1840
|
+
.nav-tabs .nav-link[data-v-15c7e3be]:hover {
|
|
1841
|
+
background-color: var(--db-bg-soft);
|
|
1842
|
+
border-bottom-color: var(--db-border-light);
|
|
1843
|
+
color: var(--db-dark-color);
|
|
1638
1844
|
}
|
|
1639
|
-
.nav-tabs .nav-link.active[data-v-
|
|
1640
|
-
background-color:
|
|
1641
|
-
border-bottom-color:
|
|
1642
|
-
color:
|
|
1845
|
+
.nav-tabs .nav-link.active[data-v-15c7e3be] {
|
|
1846
|
+
background-color: transparent;
|
|
1847
|
+
border-bottom-color: var(--db-primary-color);
|
|
1848
|
+
color: var(--db-primary-color);
|
|
1643
1849
|
}
|
|
1644
|
-
.tab-content[data-v-
|
|
1850
|
+
.tab-content[data-v-15c7e3be] {
|
|
1645
1851
|
flex: 1;
|
|
1646
1852
|
overflow: auto;
|
|
1647
|
-
padding:
|
|
1648
|
-
background-color:
|
|
1853
|
+
padding: 10px 12px;
|
|
1854
|
+
background-color: transparent;
|
|
1649
1855
|
display: flex;
|
|
1650
1856
|
flex-direction: column;
|
|
1651
1857
|
}
|
|
1652
|
-
.tab-panel[data-v-
|
|
1858
|
+
.tab-panel[data-v-15c7e3be] {
|
|
1653
1859
|
flex: 1;
|
|
1654
1860
|
display: flex;
|
|
1655
1861
|
flex-direction: column;
|
|
1656
1862
|
height: 100%;
|
|
1657
1863
|
overflow: auto;
|
|
1658
1864
|
}
|
|
1659
|
-
.data-content[data-v-
|
|
1865
|
+
.data-content[data-v-15c7e3be] {
|
|
1660
1866
|
height: 100%;
|
|
1661
1867
|
display: flex;
|
|
1662
1868
|
flex-direction: column;
|
|
1663
1869
|
}
|
|
1664
|
-
.data-content.loading[data-v-
|
|
1870
|
+
.data-content.loading[data-v-15c7e3be] {
|
|
1665
1871
|
opacity: 0.7;
|
|
1666
1872
|
pointer-events: none;
|
|
1667
1873
|
}
|
|
1668
|
-
.table-responsive[data-v-
|
|
1874
|
+
.table-responsive[data-v-15c7e3be] {
|
|
1669
1875
|
flex: 1;
|
|
1670
1876
|
overflow: auto;
|
|
1671
1877
|
}
|
|
1672
|
-
.column-header[data-v-
|
|
1878
|
+
.column-header[data-v-15c7e3be] {
|
|
1673
1879
|
position: relative;
|
|
1674
1880
|
}
|
|
1675
|
-
.column-key[data-v-
|
|
1881
|
+
.column-key[data-v-15c7e3be] {
|
|
1676
1882
|
position: absolute;
|
|
1677
1883
|
top: -5px;
|
|
1678
1884
|
right: -15px;
|
|
1679
|
-
color:
|
|
1885
|
+
color: var(--db-primary-color);
|
|
1680
1886
|
font-size: 0.75rem;
|
|
1681
1887
|
}
|
|
1682
|
-
.cell-value[data-v-
|
|
1888
|
+
.cell-value[data-v-15c7e3be] {
|
|
1683
1889
|
max-width: 200px;
|
|
1684
1890
|
overflow: hidden;
|
|
1685
1891
|
text-overflow: ellipsis;
|
|
1686
1892
|
white-space: nowrap;
|
|
1687
1893
|
}
|
|
1688
|
-
.loading-state[data-v-
|
|
1894
|
+
.loading-state[data-v-15c7e3be] {
|
|
1689
1895
|
display: flex;
|
|
1690
1896
|
flex-direction: column;
|
|
1691
1897
|
align-items: center;
|
|
1692
1898
|
justify-content: center;
|
|
1693
|
-
height:
|
|
1694
|
-
gap:
|
|
1899
|
+
height: 200px;
|
|
1900
|
+
gap: 10px;
|
|
1695
1901
|
}
|
|
1696
|
-
.empty-state[data-v-
|
|
1902
|
+
.empty-state[data-v-15c7e3be] {
|
|
1697
1903
|
display: flex;
|
|
1698
1904
|
flex-direction: column;
|
|
1699
1905
|
align-items: center;
|
|
1700
1906
|
justify-content: center;
|
|
1701
|
-
height:
|
|
1702
|
-
gap:
|
|
1703
|
-
color:
|
|
1907
|
+
height: 200px;
|
|
1908
|
+
gap: 10px;
|
|
1909
|
+
color: var(--db-text-muted);
|
|
1704
1910
|
}
|
|
1705
|
-
.empty-state i[data-v-
|
|
1706
|
-
font-size:
|
|
1911
|
+
.empty-state i[data-v-15c7e3be] {
|
|
1912
|
+
font-size: 28px;
|
|
1707
1913
|
opacity: 0.5;
|
|
1708
1914
|
}
|
|
1709
|
-
.pagination-nav[data-v-
|
|
1710
|
-
margin-top:
|
|
1711
|
-
border-top: 1px solid
|
|
1712
|
-
padding-top:
|
|
1915
|
+
.pagination-nav[data-v-15c7e3be] {
|
|
1916
|
+
margin-top: 10px;
|
|
1917
|
+
border-top: 1px solid var(--db-border);
|
|
1918
|
+
padding-top: 10px;
|
|
1713
1919
|
}
|
|
1714
|
-
.pagination-container[data-v-
|
|
1920
|
+
.pagination-container[data-v-15c7e3be] {
|
|
1715
1921
|
display: flex;
|
|
1716
1922
|
align-items: center;
|
|
1717
1923
|
justify-content: space-between;
|
|
1718
1924
|
flex-wrap: wrap;
|
|
1719
1925
|
gap: 10px;
|
|
1720
1926
|
}
|
|
1721
|
-
.pagination-info[data-v-
|
|
1722
|
-
font-size: 0.
|
|
1723
|
-
color:
|
|
1927
|
+
.pagination-info[data-v-15c7e3be] {
|
|
1928
|
+
font-size: 0.75rem;
|
|
1929
|
+
color: var(--db-text-muted);
|
|
1724
1930
|
}
|
|
1725
|
-
.page-size-selector[data-v-
|
|
1931
|
+
.page-size-selector[data-v-15c7e3be] {
|
|
1726
1932
|
display: flex;
|
|
1727
1933
|
align-items: center;
|
|
1728
1934
|
gap: 5px;
|
|
1729
1935
|
}
|
|
1730
|
-
.page-jump[data-v-
|
|
1936
|
+
.page-jump[data-v-15c7e3be] {
|
|
1731
1937
|
display: flex;
|
|
1732
1938
|
align-items: center;
|
|
1733
1939
|
gap: 5px;
|
|
1734
1940
|
}
|
|
1735
|
-
.structure-actions[data-v-
|
|
1941
|
+
.structure-actions[data-v-15c7e3be] {
|
|
1736
1942
|
display: flex;
|
|
1737
|
-
gap:
|
|
1738
|
-
margin-bottom:
|
|
1943
|
+
gap: 6px;
|
|
1944
|
+
margin-bottom: 10px;
|
|
1739
1945
|
}
|
|
1740
|
-
.structure-table[data-v-
|
|
1946
|
+
.structure-table[data-v-15c7e3be], .indexes-table[data-v-15c7e3be], .relations-table[data-v-15c7e3be] {
|
|
1741
1947
|
overflow: auto;
|
|
1742
1948
|
}
|
|
1743
|
-
.structure-table table[data-v-
|
|
1949
|
+
.structure-table table[data-v-15c7e3be], .indexes-table table[data-v-15c7e3be], .relations-table table[data-v-15c7e3be] {
|
|
1744
1950
|
width: 100%;
|
|
1745
1951
|
}
|
|
1746
|
-
.sql-section[data-v-
|
|
1952
|
+
.sql-section[data-v-15c7e3be] {
|
|
1747
1953
|
height: 100%;
|
|
1748
1954
|
}
|
|
1749
1955
|
|
|
1750
1956
|
/* 响应式设计 */
|
|
1751
1957
|
@media (max-width: 768px) {
|
|
1752
|
-
.table-header-content[data-v-
|
|
1958
|
+
.table-header-content[data-v-15c7e3be] {
|
|
1753
1959
|
flex-direction: column;
|
|
1754
1960
|
align-items: flex-start;
|
|
1755
1961
|
gap: 15px;
|
|
1756
1962
|
}
|
|
1757
|
-
.table-stats[data-v-
|
|
1963
|
+
.table-stats[data-v-15c7e3be] {
|
|
1758
1964
|
width: 100%;
|
|
1759
1965
|
justify-content: space-around;
|
|
1760
1966
|
}
|
|
1761
|
-
.table-toolbar[data-v-
|
|
1967
|
+
.table-toolbar[data-v-15c7e3be] {
|
|
1762
1968
|
flex-direction: column;
|
|
1763
1969
|
align-items: stretch;
|
|
1764
1970
|
gap: 10px;
|
|
1765
1971
|
}
|
|
1766
|
-
.toolbar-left[data-v-
|
|
1972
|
+
.toolbar-left[data-v-15c7e3be], .toolbar-right[data-v-15c7e3be] {
|
|
1767
1973
|
justify-content: center;
|
|
1768
1974
|
}
|
|
1769
|
-
.pagination-container[data-v-
|
|
1975
|
+
.pagination-container[data-v-15c7e3be] {
|
|
1770
1976
|
flex-direction: column;
|
|
1771
1977
|
align-items: flex-start;
|
|
1772
1978
|
gap: 15px;
|
|
1773
1979
|
}
|
|
1774
|
-
.pagination[data-v-
|
|
1980
|
+
.pagination[data-v-15c7e3be] {
|
|
1775
1981
|
width: 100%;
|
|
1776
1982
|
justify-content: center;
|
|
1777
1983
|
}
|
|
1778
1984
|
}
|
|
1779
1985
|
|
|
1780
|
-
.
|
|
1781
|
-
padding: 2rem;
|
|
1782
|
-
max-width: 800px;
|
|
1783
|
-
margin: 0 auto;
|
|
1784
|
-
}
|
|
1785
|
-
.about-header[data-v-5a974f04] {
|
|
1786
|
-
display: flex;
|
|
1787
|
-
align-items: center;
|
|
1788
|
-
gap: 1rem;
|
|
1789
|
-
margin-bottom: 2rem;
|
|
1790
|
-
padding-bottom: 1rem;
|
|
1791
|
-
border-bottom: 1px solid #e2e8f0;
|
|
1792
|
-
}
|
|
1793
|
-
.about-logo[data-v-5a974f04] {
|
|
1794
|
-
width: 60px;
|
|
1795
|
-
height: 60px;
|
|
1796
|
-
border-radius: 12px;
|
|
1797
|
-
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
1798
|
-
display: flex;
|
|
1799
|
-
align-items: center;
|
|
1800
|
-
justify-content: center;
|
|
1801
|
-
color: white;
|
|
1802
|
-
font-size: 2rem;
|
|
1803
|
-
}
|
|
1804
|
-
.about-title h2[data-v-5a974f04] {
|
|
1805
|
-
margin: 0;
|
|
1806
|
-
font-size: 2rem;
|
|
1807
|
-
font-weight: 700;
|
|
1808
|
-
color: #1e293b;
|
|
1809
|
-
}
|
|
1810
|
-
.about-title p[data-v-5a974f04] {
|
|
1811
|
-
margin: 0.25rem 0 0 0;
|
|
1812
|
-
color: #64748b;
|
|
1813
|
-
font-size: 1.125rem;
|
|
1814
|
-
}
|
|
1815
|
-
.about-content[data-v-5a974f04] {
|
|
1816
|
-
display: flex;
|
|
1817
|
-
flex-direction: column;
|
|
1818
|
-
gap: 2rem;
|
|
1819
|
-
}
|
|
1820
|
-
.about-section[data-v-5a974f04] {
|
|
1821
|
-
background: white;
|
|
1822
|
-
padding: 1.5rem;
|
|
1823
|
-
border-radius: 12px;
|
|
1824
|
-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
|
|
1825
|
-
}
|
|
1826
|
-
.about-section h3[data-v-5a974f04] {
|
|
1827
|
-
margin: 0 0 1rem 0;
|
|
1828
|
-
font-size: 1.25rem;
|
|
1829
|
-
font-weight: 600;
|
|
1830
|
-
color: #1e293b;
|
|
1831
|
-
}
|
|
1832
|
-
.about-section p[data-v-5a974f04] {
|
|
1833
|
-
margin: 0 0 1rem 0;
|
|
1834
|
-
color: #64748b;
|
|
1835
|
-
line-height: 1.6;
|
|
1836
|
-
}
|
|
1837
|
-
.feature-list[data-v-5a974f04] {
|
|
1838
|
-
list-style: none;
|
|
1839
|
-
padding: 0;
|
|
1840
|
-
margin: 0;
|
|
1841
|
-
}
|
|
1842
|
-
.feature-list li[data-v-5a974f04] {
|
|
1843
|
-
display: flex;
|
|
1844
|
-
align-items: flex-start;
|
|
1845
|
-
gap: 0.75rem;
|
|
1846
|
-
margin-bottom: 0.75rem;
|
|
1847
|
-
color: #64748b;
|
|
1848
|
-
}
|
|
1849
|
-
.feature-list li i[data-v-5a974f04] {
|
|
1850
|
-
color: #10b981;
|
|
1851
|
-
margin-top: 0.25rem;
|
|
1852
|
-
flex-shrink: 0;
|
|
1853
|
-
}
|
|
1854
|
-
.database-types[data-v-5a974f04] {
|
|
1855
|
-
display: grid;
|
|
1856
|
-
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
|
1857
|
-
gap: 0.5rem;
|
|
1858
|
-
}
|
|
1859
|
-
.db-type[data-v-5a974f04] {
|
|
1860
|
-
display: flex;
|
|
1861
|
-
justify-content: space-between;
|
|
1862
|
-
align-items: center;
|
|
1863
|
-
padding: 0.5rem;
|
|
1864
|
-
background: #f8fafc;
|
|
1865
|
-
border-radius: 6px;
|
|
1866
|
-
}
|
|
1867
|
-
.db-name[data-v-5a974f04] {
|
|
1868
|
-
font-weight: 500;
|
|
1869
|
-
color: #374151;
|
|
1870
|
-
}
|
|
1871
|
-
.db-port[data-v-5a974f04] {
|
|
1872
|
-
color: #6b7280;
|
|
1873
|
-
font-size: 0.875rem;
|
|
1874
|
-
}
|
|
1875
|
-
.about-links[data-v-5a974f04] {
|
|
1876
|
-
display: flex;
|
|
1877
|
-
flex-direction: column;
|
|
1878
|
-
gap: 0.75rem;
|
|
1879
|
-
}
|
|
1880
|
-
.about-link[data-v-5a974f04] {
|
|
1881
|
-
display: flex;
|
|
1882
|
-
align-items: center;
|
|
1883
|
-
gap: 0.75rem;
|
|
1884
|
-
padding: 0.75rem;
|
|
1885
|
-
background: #f8fafc;
|
|
1886
|
-
border-radius: 8px;
|
|
1887
|
-
color: #667eea;
|
|
1888
|
-
text-decoration: none;
|
|
1889
|
-
font-weight: 500;
|
|
1890
|
-
transition: all 0.3s ease;
|
|
1891
|
-
}
|
|
1892
|
-
.about-link[data-v-5a974f04]:hover {
|
|
1893
|
-
background: #e0e7ff;
|
|
1894
|
-
transform: translateX(4px);
|
|
1895
|
-
}
|
|
1896
|
-
.about-link i[data-v-5a974f04] {
|
|
1897
|
-
flex-shrink: 0;
|
|
1898
|
-
}
|
|
1899
|
-
|
|
1900
|
-
.database-explorer[data-v-2566be8b] {
|
|
1986
|
+
.database-explorer[data-v-50189218] {
|
|
1901
1987
|
height: 100vh;
|
|
1902
1988
|
min-height: 600px;
|
|
1903
1989
|
}
|
|
1904
|
-
.explorer-layout[data-v-
|
|
1990
|
+
.explorer-layout[data-v-50189218] {
|
|
1905
1991
|
display: flex;
|
|
1906
1992
|
height: 100%;
|
|
1907
|
-
background:
|
|
1908
|
-
border-radius: 12px;
|
|
1909
|
-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
1993
|
+
background: var(--db-surface);
|
|
1910
1994
|
overflow: hidden;
|
|
1911
|
-
border: 1px solid #cbd5e1;
|
|
1912
1995
|
}
|
|
1913
1996
|
|
|
1914
1997
|
/* 左侧边栏 */
|
|
1915
|
-
.explorer-sidebar[data-v-
|
|
1916
|
-
width:
|
|
1998
|
+
.explorer-sidebar[data-v-50189218] {
|
|
1999
|
+
width: 264px;
|
|
1917
2000
|
flex-shrink: 0;
|
|
1918
|
-
border-right: 1px solid
|
|
2001
|
+
border-right: 1px solid var(--db-border);
|
|
1919
2002
|
display: flex;
|
|
1920
2003
|
flex-direction: column;
|
|
1921
|
-
background:
|
|
2004
|
+
background: var(--db-gray-light);
|
|
1922
2005
|
}
|
|
1923
|
-
.sidebar-content[data-v-
|
|
2006
|
+
.sidebar-content[data-v-50189218] {
|
|
1924
2007
|
flex: 1;
|
|
1925
2008
|
overflow-y: auto;
|
|
1926
2009
|
padding: 0.5rem 0;
|
|
1927
2010
|
display: flex;
|
|
1928
2011
|
flex-direction: column;
|
|
1929
2012
|
}
|
|
1930
|
-
.tree-container[data-v-
|
|
2013
|
+
.tree-container[data-v-50189218] {
|
|
1931
2014
|
flex: 1;
|
|
1932
2015
|
}
|
|
1933
2016
|
|
|
1934
2017
|
/* 工具信息样式 - 固定在左下角 */
|
|
1935
|
-
.sidebar-tool-info[data-v-
|
|
1936
|
-
padding: 0.
|
|
1937
|
-
border-top: 1px solid
|
|
1938
|
-
background:
|
|
2018
|
+
.sidebar-tool-info[data-v-50189218] {
|
|
2019
|
+
padding: 0.5rem 0.625rem;
|
|
2020
|
+
border-top: 1px solid var(--db-border);
|
|
2021
|
+
background: transparent;
|
|
1939
2022
|
display: flex;
|
|
1940
2023
|
align-items: center;
|
|
1941
|
-
gap: 0.
|
|
2024
|
+
gap: 0.5rem;
|
|
1942
2025
|
cursor: pointer;
|
|
1943
|
-
transition:
|
|
2026
|
+
transition: background-color 0.15s ease;
|
|
1944
2027
|
}
|
|
1945
|
-
.sidebar-tool-info[data-v-
|
|
1946
|
-
background:
|
|
1947
|
-
transform: translateY(-1px);
|
|
2028
|
+
.sidebar-tool-info[data-v-50189218]:hover {
|
|
2029
|
+
background: var(--db-bg-soft);
|
|
1948
2030
|
}
|
|
1949
|
-
.tool-logo[data-v-
|
|
1950
|
-
width:
|
|
1951
|
-
height:
|
|
1952
|
-
border-radius:
|
|
1953
|
-
background:
|
|
2031
|
+
.tool-logo[data-v-50189218] {
|
|
2032
|
+
width: 24px;
|
|
2033
|
+
height: 24px;
|
|
2034
|
+
border-radius: 4px;
|
|
2035
|
+
background: var(--db-primary-color);
|
|
1954
2036
|
display: flex;
|
|
1955
2037
|
align-items: center;
|
|
1956
2038
|
justify-content: center;
|
|
1957
|
-
color:
|
|
1958
|
-
font-size:
|
|
2039
|
+
color: var(--db-on-accent);
|
|
2040
|
+
font-size: 0.8125rem;
|
|
1959
2041
|
flex-shrink: 0;
|
|
1960
2042
|
}
|
|
1961
|
-
.tool-details[data-v-
|
|
2043
|
+
.tool-details[data-v-50189218] {
|
|
1962
2044
|
flex: 1;
|
|
1963
2045
|
display: flex;
|
|
1964
2046
|
flex-direction: column;
|
|
1965
2047
|
gap: 0.125rem;
|
|
1966
2048
|
}
|
|
1967
|
-
.tool-name[data-v-
|
|
2049
|
+
.tool-name[data-v-50189218] {
|
|
1968
2050
|
font-size: 0.875rem;
|
|
1969
2051
|
font-weight: 600;
|
|
1970
|
-
color:
|
|
2052
|
+
color: var(--db-black);
|
|
1971
2053
|
}
|
|
1972
|
-
.tool-description[data-v-
|
|
2054
|
+
.tool-description[data-v-50189218] {
|
|
1973
2055
|
font-size: 0.75rem;
|
|
1974
|
-
color:
|
|
2056
|
+
color: var(--db-darker-color);
|
|
1975
2057
|
}
|
|
1976
|
-
.sidebar-header[data-v-
|
|
1977
|
-
padding:
|
|
1978
|
-
border-bottom: 1px solid
|
|
1979
|
-
background:
|
|
2058
|
+
.sidebar-header[data-v-50189218] {
|
|
2059
|
+
padding: 0.5rem 0.625rem;
|
|
2060
|
+
border-bottom: 1px solid var(--db-border);
|
|
2061
|
+
background: transparent;
|
|
1980
2062
|
display: flex;
|
|
1981
2063
|
justify-content: space-between;
|
|
1982
2064
|
align-items: center;
|
|
1983
2065
|
}
|
|
1984
|
-
.sidebar-title[data-v-
|
|
2066
|
+
.sidebar-title[data-v-50189218] {
|
|
1985
2067
|
margin: 0;
|
|
1986
|
-
font-size: 0.
|
|
2068
|
+
font-size: 0.6875rem;
|
|
1987
2069
|
font-weight: 600;
|
|
1988
|
-
|
|
2070
|
+
letter-spacing: 0.06em;
|
|
2071
|
+
text-transform: uppercase;
|
|
2072
|
+
color: var(--db-text-muted);
|
|
1989
2073
|
display: flex;
|
|
1990
2074
|
align-items: center;
|
|
1991
|
-
gap: 0.
|
|
2075
|
+
gap: 0.375rem;
|
|
1992
2076
|
}
|
|
1993
|
-
.sidebar-title i[data-v-
|
|
1994
|
-
color:
|
|
2077
|
+
.sidebar-title i[data-v-50189218] {
|
|
2078
|
+
color: var(--db-text-muted);
|
|
1995
2079
|
}
|
|
1996
|
-
.sidebar-actions[data-v-
|
|
2080
|
+
.sidebar-actions[data-v-50189218] {
|
|
1997
2081
|
display: flex;
|
|
1998
2082
|
gap: 0.25rem;
|
|
1999
2083
|
}
|
|
2000
|
-
.sidebar-actions .btn[data-v-
|
|
2001
|
-
padding: 0.
|
|
2084
|
+
.sidebar-actions .btn[data-v-50189218] {
|
|
2085
|
+
padding: 0.15rem 0.4rem;
|
|
2002
2086
|
font-size: 0.75rem;
|
|
2003
|
-
border: 1px solid
|
|
2004
|
-
background-color:
|
|
2005
|
-
color:
|
|
2006
|
-
border-radius:
|
|
2087
|
+
border: 1px solid var(--db-border);
|
|
2088
|
+
background-color: transparent;
|
|
2089
|
+
color: var(--db-text-muted);
|
|
2090
|
+
border-radius: 4px;
|
|
2007
2091
|
transition: all 0.15s ease;
|
|
2008
2092
|
}
|
|
2009
|
-
.sidebar-actions .btn[data-v-
|
|
2010
|
-
background-color:
|
|
2011
|
-
border-color:
|
|
2093
|
+
.sidebar-actions .btn[data-v-50189218]:hover {
|
|
2094
|
+
background-color: var(--db-bg-soft);
|
|
2095
|
+
border-color: var(--db-border-light);
|
|
2096
|
+
color: var(--db-dark-color);
|
|
2012
2097
|
}
|
|
2013
|
-
.sidebar-actions .btn-outline-primary[data-v-
|
|
2014
|
-
border-color:
|
|
2015
|
-
color:
|
|
2098
|
+
.sidebar-actions .btn-outline-primary[data-v-50189218] {
|
|
2099
|
+
border-color: var(--db-border);
|
|
2100
|
+
color: var(--db-text-muted);
|
|
2016
2101
|
}
|
|
2017
|
-
.sidebar-actions .btn-outline-primary[data-v-
|
|
2018
|
-
background-color:
|
|
2019
|
-
border-color:
|
|
2020
|
-
color:
|
|
2102
|
+
.sidebar-actions .btn-outline-primary[data-v-50189218]:hover {
|
|
2103
|
+
background-color: var(--db-primary-bg);
|
|
2104
|
+
border-color: var(--db-primary-color);
|
|
2105
|
+
color: var(--db-primary-color);
|
|
2021
2106
|
}
|
|
2022
|
-
.sidebar-actions .btn-outline-success[data-v-
|
|
2023
|
-
border-color:
|
|
2024
|
-
color:
|
|
2107
|
+
.sidebar-actions .btn-outline-success[data-v-50189218] {
|
|
2108
|
+
border-color: var(--db-border);
|
|
2109
|
+
color: var(--db-text-muted);
|
|
2025
2110
|
}
|
|
2026
|
-
.sidebar-actions .btn-outline-success[data-v-
|
|
2027
|
-
background-color:
|
|
2028
|
-
border-color:
|
|
2029
|
-
color:
|
|
2111
|
+
.sidebar-actions .btn-outline-success[data-v-50189218]:hover {
|
|
2112
|
+
background-color: var(--db-success-bg);
|
|
2113
|
+
border-color: var(--db-accent-color);
|
|
2114
|
+
color: var(--db-accent-color);
|
|
2030
2115
|
}
|
|
2031
|
-
.sidebar-content[data-v-
|
|
2116
|
+
.sidebar-content[data-v-50189218] {
|
|
2032
2117
|
flex: 1;
|
|
2033
2118
|
overflow-y: auto;
|
|
2034
|
-
padding: 0.
|
|
2119
|
+
padding: 0.25rem 0;
|
|
2035
2120
|
}
|
|
2036
2121
|
|
|
2037
2122
|
/* 树形结构 */
|
|
2038
|
-
.tree-container[data-v-
|
|
2039
|
-
font-size: 0.
|
|
2123
|
+
.tree-container[data-v-50189218] {
|
|
2124
|
+
font-size: 0.8125rem;
|
|
2040
2125
|
user-select: none;
|
|
2041
2126
|
}
|
|
2042
|
-
.tree-node[data-v-
|
|
2127
|
+
.tree-node[data-v-50189218] {
|
|
2043
2128
|
margin-bottom: 0;
|
|
2044
2129
|
}
|
|
2045
|
-
.tree-children[data-v-
|
|
2046
|
-
margin-left: 0.
|
|
2047
|
-
border-left: 1px solid
|
|
2048
|
-
padding-left: 0.
|
|
2130
|
+
.tree-children[data-v-50189218] {
|
|
2131
|
+
margin-left: 0.5rem;
|
|
2132
|
+
border-left: 1px solid var(--db-border);
|
|
2133
|
+
padding-left: 0.375rem;
|
|
2049
2134
|
}
|
|
2050
|
-
.node-content[data-v-
|
|
2135
|
+
.node-content[data-v-50189218] {
|
|
2051
2136
|
display: flex;
|
|
2052
2137
|
align-items: center;
|
|
2053
|
-
padding: 0.
|
|
2138
|
+
padding: 0.175rem 0.5rem;
|
|
2054
2139
|
cursor: pointer;
|
|
2055
2140
|
transition: background-color 0.15s ease;
|
|
2056
2141
|
position: relative;
|
|
2057
|
-
margin-right: 0.
|
|
2058
|
-
border-radius:
|
|
2059
|
-
gap: 0.
|
|
2142
|
+
margin-right: 0.25rem;
|
|
2143
|
+
border-radius: 4px;
|
|
2144
|
+
gap: 0.125rem;
|
|
2060
2145
|
}
|
|
2061
|
-
.node-expand[data-v-
|
|
2062
|
-
width:
|
|
2063
|
-
height:
|
|
2146
|
+
.node-expand[data-v-50189218] {
|
|
2147
|
+
width: 14px;
|
|
2148
|
+
height: 14px;
|
|
2064
2149
|
display: flex;
|
|
2065
2150
|
align-items: center;
|
|
2066
2151
|
justify-content: center;
|
|
2067
2152
|
flex-shrink: 0;
|
|
2068
|
-
margin-right: 0.
|
|
2153
|
+
margin-right: 0.125rem;
|
|
2069
2154
|
}
|
|
2070
|
-
.node-expand i[data-v-
|
|
2071
|
-
font-size: 0.
|
|
2072
|
-
color:
|
|
2155
|
+
.node-expand i[data-v-50189218] {
|
|
2156
|
+
font-size: 0.625rem;
|
|
2157
|
+
color: var(--db-text-muted);
|
|
2073
2158
|
transition: transform 0.15s ease;
|
|
2074
2159
|
}
|
|
2075
|
-
.node-expand i.expanded[data-v-
|
|
2160
|
+
.node-expand i.expanded[data-v-50189218] {
|
|
2076
2161
|
transform: rotate(90deg);
|
|
2077
2162
|
}
|
|
2078
|
-
.node-main[data-v-
|
|
2163
|
+
.node-main[data-v-50189218] {
|
|
2079
2164
|
display: flex;
|
|
2080
2165
|
align-items: center;
|
|
2081
2166
|
flex: 1;
|
|
2082
2167
|
min-width: 0;
|
|
2083
2168
|
}
|
|
2084
|
-
.node-content[data-v-
|
|
2085
|
-
background-color:
|
|
2169
|
+
.node-content[data-v-50189218]:hover {
|
|
2170
|
+
background-color: var(--db-bg-soft);
|
|
2086
2171
|
}
|
|
2087
|
-
.tree-node.selected .node-content[data-v-
|
|
2088
|
-
background-color:
|
|
2089
|
-
color:
|
|
2090
|
-
|
|
2091
|
-
box-shadow: 0 2px 8px rgba(9, 105, 218, 0.15);
|
|
2172
|
+
.tree-node.selected .node-content[data-v-50189218] {
|
|
2173
|
+
background-color: var(--db-primary-bg);
|
|
2174
|
+
color: var(--db-dark-color);
|
|
2175
|
+
box-shadow: none;
|
|
2092
2176
|
}
|
|
2093
|
-
.tree-node.selected .node-content[data-v-
|
|
2177
|
+
.tree-node.selected .node-content[data-v-50189218]::before {
|
|
2094
2178
|
content: '';
|
|
2095
2179
|
position: absolute;
|
|
2096
2180
|
left: 0;
|
|
2097
2181
|
top: 0;
|
|
2098
2182
|
bottom: 0;
|
|
2099
|
-
width:
|
|
2100
|
-
background:
|
|
2101
|
-
border-radius:
|
|
2183
|
+
width: 2px;
|
|
2184
|
+
background: var(--db-primary-color);
|
|
2185
|
+
border-radius: 2px 0 0 2px;
|
|
2102
2186
|
}
|
|
2103
|
-
.node-icon[data-v-
|
|
2104
|
-
width:
|
|
2187
|
+
.node-icon[data-v-50189218] {
|
|
2188
|
+
width: 16px;
|
|
2105
2189
|
display: flex;
|
|
2106
2190
|
justify-content: center;
|
|
2107
2191
|
flex-shrink: 0;
|
|
2108
|
-
margin-right: 0.
|
|
2192
|
+
margin-right: 0.375rem;
|
|
2109
2193
|
}
|
|
2110
|
-
.node-icon i[data-v-
|
|
2111
|
-
font-size: 0.
|
|
2194
|
+
.node-icon i[data-v-50189218] {
|
|
2195
|
+
font-size: 0.8125rem;
|
|
2196
|
+
color: var(--db-text-muted);
|
|
2112
2197
|
}
|
|
2113
|
-
.node-label[data-v-
|
|
2198
|
+
.node-label[data-v-50189218] {
|
|
2114
2199
|
flex: 1;
|
|
2115
2200
|
display: flex;
|
|
2116
2201
|
align-items: center;
|
|
2117
2202
|
gap: 0.375rem;
|
|
2118
2203
|
min-width: 0;
|
|
2119
2204
|
}
|
|
2120
|
-
.connection-name[data-v-
|
|
2121
|
-
.database-name[data-v-
|
|
2122
|
-
.table-name[data-v-
|
|
2123
|
-
font-weight:
|
|
2205
|
+
.connection-name[data-v-50189218],
|
|
2206
|
+
.database-name[data-v-50189218],
|
|
2207
|
+
.table-name[data-v-50189218] {
|
|
2208
|
+
font-weight: 400;
|
|
2124
2209
|
white-space: nowrap;
|
|
2125
2210
|
overflow: hidden;
|
|
2126
2211
|
text-overflow: ellipsis;
|
|
2127
|
-
line-height: 1.
|
|
2128
|
-
}
|
|
2129
|
-
.tree-node.selected .connection-name[data-v-2566be8b],
|
|
2130
|
-
.tree-node.selected .database-name[data-v-2566be8b],
|
|
2131
|
-
.tree-node.selected .table-name[data-v-2566be8b] {
|
|
2132
|
-
font-weight: 600;
|
|
2212
|
+
line-height: 1.4;
|
|
2133
2213
|
}
|
|
2134
|
-
.connection-
|
|
2135
|
-
.
|
|
2136
|
-
|
|
2137
|
-
color: #374151;
|
|
2138
|
-
background-color: #e2e8f0;
|
|
2139
|
-
padding: 0.125rem 0.375rem;
|
|
2140
|
-
border-radius: 12px;
|
|
2214
|
+
.tree-node.selected .connection-name[data-v-50189218],
|
|
2215
|
+
.tree-node.selected .database-name[data-v-50189218],
|
|
2216
|
+
.tree-node.selected .table-name[data-v-50189218] {
|
|
2141
2217
|
font-weight: 500;
|
|
2218
|
+
}
|
|
2219
|
+
|
|
2220
|
+
/* 类型 / 行数说明：走 VSCode 树的「描述文字」样式，浅灰无底色，减少噪声 */
|
|
2221
|
+
.connection-type[data-v-50189218],
|
|
2222
|
+
.table-info[data-v-50189218] {
|
|
2223
|
+
font-size: 0.6875rem;
|
|
2224
|
+
color: var(--db-text-faint);
|
|
2225
|
+
background-color: transparent;
|
|
2226
|
+
padding: 0;
|
|
2227
|
+
border-radius: 0;
|
|
2228
|
+
font-weight: 400;
|
|
2142
2229
|
white-space: nowrap;
|
|
2143
2230
|
}
|
|
2144
|
-
.tree-node.selected .connection-type[data-v-
|
|
2145
|
-
.tree-node.selected .table-info[data-v-
|
|
2146
|
-
background-color:
|
|
2147
|
-
color:
|
|
2231
|
+
.tree-node.selected .connection-type[data-v-50189218],
|
|
2232
|
+
.tree-node.selected .table-info[data-v-50189218] {
|
|
2233
|
+
background-color: transparent;
|
|
2234
|
+
color: var(--db-text-muted);
|
|
2148
2235
|
}
|
|
2149
|
-
.node-actions[data-v-
|
|
2236
|
+
.node-actions[data-v-50189218] {
|
|
2150
2237
|
display: flex;
|
|
2151
2238
|
gap: 0.125rem;
|
|
2152
2239
|
opacity: 0;
|
|
2153
2240
|
transition: opacity 0.15s ease;
|
|
2154
2241
|
}
|
|
2155
|
-
.node-content:hover .node-actions[data-v-
|
|
2242
|
+
.node-content:hover .node-actions[data-v-50189218] {
|
|
2156
2243
|
opacity: 1;
|
|
2157
2244
|
}
|
|
2158
|
-
.btn-icon[data-v-
|
|
2159
|
-
padding: 0
|
|
2245
|
+
.btn-icon[data-v-50189218] {
|
|
2246
|
+
padding: 0;
|
|
2160
2247
|
background: transparent;
|
|
2161
2248
|
border: none;
|
|
2162
2249
|
border-radius: 4px;
|
|
@@ -2164,179 +2251,179 @@ to {
|
|
|
2164
2251
|
display: flex;
|
|
2165
2252
|
align-items: center;
|
|
2166
2253
|
justify-content: center;
|
|
2167
|
-
width:
|
|
2168
|
-
height:
|
|
2254
|
+
width: 18px;
|
|
2255
|
+
height: 18px;
|
|
2169
2256
|
}
|
|
2170
|
-
.btn-icon[data-v-
|
|
2171
|
-
background-color:
|
|
2257
|
+
.btn-icon[data-v-50189218]:hover {
|
|
2258
|
+
background-color: var(--db-bg-soft);
|
|
2172
2259
|
}
|
|
2173
|
-
.btn-icon i[data-v-
|
|
2260
|
+
.btn-icon i[data-v-50189218] {
|
|
2174
2261
|
font-size: 0.6875rem;
|
|
2175
|
-
color:
|
|
2262
|
+
color: var(--db-text-muted);
|
|
2176
2263
|
}
|
|
2177
|
-
.tree-node.selected .btn-icon[data-v-
|
|
2178
|
-
background-color:
|
|
2264
|
+
.tree-node.selected .btn-icon[data-v-50189218]:hover {
|
|
2265
|
+
background-color: var(--db-bg-soft);
|
|
2179
2266
|
}
|
|
2180
|
-
.tree-node.selected .btn-icon i[data-v-
|
|
2181
|
-
color:
|
|
2267
|
+
.tree-node.selected .btn-icon i[data-v-50189218] {
|
|
2268
|
+
color: var(--db-text-muted);
|
|
2182
2269
|
}
|
|
2183
|
-
.tree-node.selected .btn-icon:hover i[data-v-
|
|
2184
|
-
color:
|
|
2270
|
+
.tree-node.selected .btn-icon:hover i[data-v-50189218] {
|
|
2271
|
+
color: var(--db-dark-color);
|
|
2185
2272
|
}
|
|
2186
|
-
.btn-icon-danger[data-v-
|
|
2187
|
-
background-color:
|
|
2273
|
+
.btn-icon-danger[data-v-50189218]:hover {
|
|
2274
|
+
background-color: var(--db-danger-bg);
|
|
2188
2275
|
}
|
|
2189
|
-
.btn-icon-danger:hover i[data-v-
|
|
2276
|
+
.btn-icon-danger:hover i[data-v-50189218] {
|
|
2190
2277
|
color: #dc2626;
|
|
2191
2278
|
}
|
|
2192
|
-
.node-spinner[data-v-
|
|
2279
|
+
.node-spinner[data-v-50189218] {
|
|
2193
2280
|
display: flex;
|
|
2194
2281
|
align-items: center;
|
|
2195
2282
|
justify-content: center;
|
|
2196
2283
|
}
|
|
2197
|
-
.spinner-border-sm[data-v-
|
|
2284
|
+
.spinner-border-sm[data-v-50189218] {
|
|
2198
2285
|
width: 1rem;
|
|
2199
2286
|
height: 1rem;
|
|
2200
2287
|
border-width: 0.15em;
|
|
2201
2288
|
}
|
|
2202
2289
|
|
|
2203
2290
|
/* 连接节点样式 */
|
|
2204
|
-
.connection-content[data-v-
|
|
2291
|
+
.connection-content[data-v-50189218] {
|
|
2205
2292
|
font-weight: 500;
|
|
2206
|
-
color:
|
|
2293
|
+
color: var(--db-text-body);
|
|
2207
2294
|
}
|
|
2208
|
-
.connection-content[data-v-
|
|
2209
|
-
background-color:
|
|
2295
|
+
.connection-content[data-v-50189218]:hover {
|
|
2296
|
+
background-color: var(--db-bg-soft);
|
|
2210
2297
|
}
|
|
2211
|
-
.tree-node.selected .connection-content[data-v-
|
|
2212
|
-
background-color:
|
|
2213
|
-
color:
|
|
2298
|
+
.tree-node.selected .connection-content[data-v-50189218] {
|
|
2299
|
+
background-color: var(--db-primary-bg);
|
|
2300
|
+
color: var(--db-dark-color);
|
|
2214
2301
|
}
|
|
2215
2302
|
|
|
2216
2303
|
/* 数据库节点样式 */
|
|
2217
|
-
.database-content[data-v-
|
|
2218
|
-
color:
|
|
2304
|
+
.database-content[data-v-50189218] {
|
|
2305
|
+
color: var(--db-text-body);
|
|
2219
2306
|
}
|
|
2220
|
-
.database-content[data-v-
|
|
2221
|
-
background-color:
|
|
2307
|
+
.database-content[data-v-50189218]:hover {
|
|
2308
|
+
background-color: var(--db-bg-soft);
|
|
2222
2309
|
}
|
|
2223
|
-
.tree-node.selected .database-content[data-v-
|
|
2224
|
-
background-color:
|
|
2225
|
-
color:
|
|
2310
|
+
.tree-node.selected .database-content[data-v-50189218] {
|
|
2311
|
+
background-color: var(--db-primary-bg);
|
|
2312
|
+
color: var(--db-dark-color);
|
|
2226
2313
|
}
|
|
2227
2314
|
|
|
2228
2315
|
/* 表节点样式 */
|
|
2229
|
-
.table-content[data-v-
|
|
2230
|
-
color:
|
|
2316
|
+
.table-content[data-v-50189218] {
|
|
2317
|
+
color: var(--db-text-body);
|
|
2231
2318
|
}
|
|
2232
|
-
.table-content[data-v-
|
|
2233
|
-
background-color:
|
|
2319
|
+
.table-content[data-v-50189218]:hover {
|
|
2320
|
+
background-color: var(--db-bg-soft);
|
|
2234
2321
|
}
|
|
2235
|
-
.tree-node.selected .table-content[data-v-
|
|
2236
|
-
background-color:
|
|
2237
|
-
color:
|
|
2322
|
+
.tree-node.selected .table-content[data-v-50189218] {
|
|
2323
|
+
background-color: var(--db-primary-bg);
|
|
2324
|
+
color: var(--db-dark-color);
|
|
2238
2325
|
}
|
|
2239
2326
|
|
|
2240
2327
|
/* 数据库品牌色彩 */
|
|
2241
|
-
.db-mysql[data-v-
|
|
2328
|
+
.db-mysql[data-v-50189218] {
|
|
2242
2329
|
color: #00758f !important;
|
|
2243
|
-
background:
|
|
2330
|
+
background: #00758f;
|
|
2244
2331
|
-webkit-background-clip: text;
|
|
2245
2332
|
-webkit-text-fill-color: transparent;
|
|
2246
2333
|
}
|
|
2247
|
-
.db-mysql-bg[data-v-
|
|
2334
|
+
.db-mysql-bg[data-v-50189218] { background: #00758f;
|
|
2248
2335
|
}
|
|
2249
|
-
.db-postgres[data-v-
|
|
2336
|
+
.db-postgres[data-v-50189218] {
|
|
2250
2337
|
color: #336791 !important;
|
|
2251
|
-
background:
|
|
2338
|
+
background: #336791;
|
|
2252
2339
|
-webkit-background-clip: text;
|
|
2253
2340
|
-webkit-text-fill-color: transparent;
|
|
2254
2341
|
}
|
|
2255
|
-
.db-postgres-bg[data-v-
|
|
2342
|
+
.db-postgres-bg[data-v-50189218] { background: #336791;
|
|
2256
2343
|
}
|
|
2257
|
-
.db-sqlite[data-v-
|
|
2344
|
+
.db-sqlite[data-v-50189218] {
|
|
2258
2345
|
color: #003b57 !important;
|
|
2259
|
-
background:
|
|
2346
|
+
background: #003b57;
|
|
2260
2347
|
-webkit-background-clip: text;
|
|
2261
2348
|
-webkit-text-fill-color: transparent;
|
|
2262
2349
|
}
|
|
2263
|
-
.db-sqlite-bg[data-v-
|
|
2350
|
+
.db-sqlite-bg[data-v-50189218] { background: #003b57;
|
|
2264
2351
|
}
|
|
2265
|
-
.db-mssql[data-v-
|
|
2352
|
+
.db-mssql[data-v-50189218] {
|
|
2266
2353
|
color: #cc2927 !important;
|
|
2267
|
-
background:
|
|
2354
|
+
background: #cc2927;
|
|
2268
2355
|
-webkit-background-clip: text;
|
|
2269
2356
|
-webkit-text-fill-color: transparent;
|
|
2270
2357
|
}
|
|
2271
|
-
.db-mssql-bg[data-v-
|
|
2358
|
+
.db-mssql-bg[data-v-50189218] { background: #cc2927;
|
|
2272
2359
|
}
|
|
2273
|
-
.db-oracle[data-v-
|
|
2360
|
+
.db-oracle[data-v-50189218] {
|
|
2274
2361
|
color: #f80000 !important;
|
|
2275
|
-
background:
|
|
2362
|
+
background: #f80000;
|
|
2276
2363
|
-webkit-background-clip: text;
|
|
2277
2364
|
-webkit-text-fill-color: transparent;
|
|
2278
2365
|
}
|
|
2279
|
-
.db-oracle-bg[data-v-
|
|
2366
|
+
.db-oracle-bg[data-v-50189218] { background: #f80000;
|
|
2280
2367
|
}
|
|
2281
|
-
.db-default[data-v-
|
|
2282
|
-
color:
|
|
2283
|
-
background: linear-gradient(135deg,
|
|
2368
|
+
.db-default[data-v-50189218] {
|
|
2369
|
+
color: var(--db-text-muted) !important;
|
|
2370
|
+
background: linear-gradient(135deg, var(--db-text-muted), var(--db-gray-dark));
|
|
2284
2371
|
-webkit-background-clip: text;
|
|
2285
2372
|
-webkit-text-fill-color: transparent;
|
|
2286
2373
|
}
|
|
2287
|
-
.db-default-bg[data-v-
|
|
2374
|
+
.db-default-bg[data-v-50189218] { background: linear-gradient(135deg, var(--db-text-muted), var(--db-gray-dark));
|
|
2288
2375
|
}
|
|
2289
|
-
.tree-node.selected .db-mysql[data-v-
|
|
2290
|
-
.tree-node.selected .db-postgres[data-v-
|
|
2291
|
-
.tree-node.selected .db-sqlite[data-v-
|
|
2292
|
-
.tree-node.selected .db-mssql[data-v-
|
|
2293
|
-
.tree-node.selected .db-oracle[data-v-
|
|
2294
|
-
.tree-node.selected .db-default[data-v-
|
|
2295
|
-
color:
|
|
2376
|
+
.tree-node.selected .db-mysql[data-v-50189218],
|
|
2377
|
+
.tree-node.selected .db-postgres[data-v-50189218],
|
|
2378
|
+
.tree-node.selected .db-sqlite[data-v-50189218],
|
|
2379
|
+
.tree-node.selected .db-mssql[data-v-50189218],
|
|
2380
|
+
.tree-node.selected .db-oracle[data-v-50189218],
|
|
2381
|
+
.tree-node.selected .db-default[data-v-50189218] {
|
|
2382
|
+
color: var(--db-on-accent) !important;
|
|
2296
2383
|
background: none;
|
|
2297
|
-
-webkit-text-fill-color:
|
|
2384
|
+
-webkit-text-fill-color: var(--db-on-accent);
|
|
2298
2385
|
}
|
|
2299
2386
|
|
|
2300
2387
|
/* 数据库Logo图标 */
|
|
2301
|
-
.db-logo[data-v-
|
|
2302
|
-
width:
|
|
2303
|
-
height:
|
|
2304
|
-
border-radius:
|
|
2388
|
+
.db-logo[data-v-50189218] {
|
|
2389
|
+
width: 16px;
|
|
2390
|
+
height: 16px;
|
|
2391
|
+
border-radius: 3px;
|
|
2305
2392
|
display: flex;
|
|
2306
2393
|
align-items: center;
|
|
2307
2394
|
justify-content: center;
|
|
2308
2395
|
font-weight: 700;
|
|
2309
|
-
font-size: 0.
|
|
2310
|
-
|
|
2311
|
-
|
|
2396
|
+
font-size: 0.625rem;
|
|
2397
|
+
line-height: 1;
|
|
2398
|
+
color: var(--db-on-accent);
|
|
2312
2399
|
}
|
|
2313
|
-
.db-logo-mysql[data-v-
|
|
2314
|
-
background:
|
|
2400
|
+
.db-logo-mysql[data-v-50189218] {
|
|
2401
|
+
background: #00758f;
|
|
2315
2402
|
border: 1px solid #004d61;
|
|
2316
2403
|
}
|
|
2317
|
-
.db-logo-postgres[data-v-
|
|
2318
|
-
background:
|
|
2404
|
+
.db-logo-postgres[data-v-50189218] {
|
|
2405
|
+
background: #336791;
|
|
2319
2406
|
border: 1px solid #244566;
|
|
2320
2407
|
}
|
|
2321
|
-
.db-logo-sqlite[data-v-
|
|
2322
|
-
background:
|
|
2408
|
+
.db-logo-sqlite[data-v-50189218] {
|
|
2409
|
+
background: #003b57;
|
|
2323
2410
|
border: 1px solid #002939;
|
|
2324
2411
|
}
|
|
2325
|
-
.db-logo-mssql[data-v-
|
|
2326
|
-
background:
|
|
2412
|
+
.db-logo-mssql[data-v-50189218] {
|
|
2413
|
+
background: #cc2927;
|
|
2327
2414
|
border: 1px solid #8b1f1d;
|
|
2328
2415
|
}
|
|
2329
|
-
.db-logo-oracle[data-v-
|
|
2330
|
-
background:
|
|
2416
|
+
.db-logo-oracle[data-v-50189218] {
|
|
2417
|
+
background: #f80000;
|
|
2331
2418
|
border: 1px solid #b30000;
|
|
2332
2419
|
}
|
|
2333
|
-
.db-logo-default[data-v-
|
|
2334
|
-
background: linear-gradient(135deg,
|
|
2335
|
-
border: 1px solid
|
|
2420
|
+
.db-logo-default[data-v-50189218] {
|
|
2421
|
+
background: linear-gradient(135deg, var(--db-text-muted), var(--db-gray-dark));
|
|
2422
|
+
border: 1px solid var(--db-darker-color);
|
|
2336
2423
|
}
|
|
2337
2424
|
|
|
2338
2425
|
/* 右侧主内容 */
|
|
2339
|
-
.explorer-main[data-v-
|
|
2426
|
+
.explorer-main[data-v-50189218] {
|
|
2340
2427
|
flex: 1;
|
|
2341
2428
|
display: flex;
|
|
2342
2429
|
flex-direction: column;
|
|
@@ -2345,208 +2432,208 @@ to {
|
|
|
2345
2432
|
}
|
|
2346
2433
|
|
|
2347
2434
|
/* 详情组件容器 */
|
|
2348
|
-
.explorer-main[data-v-
|
|
2435
|
+
.explorer-main[data-v-50189218] > * {
|
|
2349
2436
|
flex: 1;
|
|
2350
2437
|
display: flex;
|
|
2351
2438
|
flex-direction: column;
|
|
2352
2439
|
height: 100%;
|
|
2353
2440
|
}
|
|
2354
|
-
.content-tabs[data-v-
|
|
2441
|
+
.content-tabs[data-v-50189218] {
|
|
2355
2442
|
flex: 1;
|
|
2356
2443
|
display: flex;
|
|
2357
2444
|
flex-direction: column;
|
|
2358
2445
|
height: 100%;
|
|
2359
2446
|
}
|
|
2360
|
-
.nav-tabs[data-v-
|
|
2361
|
-
background:
|
|
2362
|
-
border-bottom: 1px solid
|
|
2447
|
+
.nav-tabs[data-v-50189218] {
|
|
2448
|
+
background: var(--db-light-color);
|
|
2449
|
+
border-bottom: 1px solid var(--db-gray-medium);
|
|
2363
2450
|
padding: 0 1rem;
|
|
2364
2451
|
}
|
|
2365
|
-
.nav-link[data-v-
|
|
2452
|
+
.nav-link[data-v-50189218] {
|
|
2366
2453
|
border: none;
|
|
2367
2454
|
background: transparent;
|
|
2368
|
-
color:
|
|
2455
|
+
color: var(--db-darker-color);
|
|
2369
2456
|
padding: 1rem 1.5rem;
|
|
2370
2457
|
font-weight: 500;
|
|
2371
2458
|
transition: all 0.2s ease;
|
|
2372
2459
|
}
|
|
2373
|
-
.nav-link[data-v-
|
|
2460
|
+
.nav-link[data-v-50189218]:hover {
|
|
2374
2461
|
color: #667eea;
|
|
2375
2462
|
background: rgba(102, 126, 234, 0.1);
|
|
2376
2463
|
}
|
|
2377
|
-
.nav-link.active[data-v-
|
|
2464
|
+
.nav-link.active[data-v-50189218] {
|
|
2378
2465
|
color: #667eea;
|
|
2379
|
-
background:
|
|
2466
|
+
background: var(--db-surface);
|
|
2380
2467
|
border-bottom: 2px solid #667eea;
|
|
2381
2468
|
}
|
|
2382
|
-
.tab-content[data-v-
|
|
2469
|
+
.tab-content[data-v-50189218] {
|
|
2383
2470
|
flex: 1;
|
|
2384
2471
|
overflow-y: auto;
|
|
2385
|
-
padding: 1.
|
|
2472
|
+
padding: 1.25rem;
|
|
2386
2473
|
height: calc(100% - 60px); /* 减去导航栏高度 */
|
|
2387
2474
|
}
|
|
2388
2475
|
|
|
2389
2476
|
/* 概览样式 */
|
|
2390
|
-
.overview-section[data-v-
|
|
2477
|
+
.overview-section[data-v-50189218] {
|
|
2391
2478
|
padding: 1rem 0;
|
|
2392
2479
|
}
|
|
2393
|
-
.info-cards[data-v-
|
|
2480
|
+
.info-cards[data-v-50189218] {
|
|
2394
2481
|
display: grid;
|
|
2395
2482
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
|
2396
|
-
gap:
|
|
2483
|
+
gap: 0.75rem;
|
|
2397
2484
|
}
|
|
2398
|
-
.info-card[data-v-
|
|
2399
|
-
background: linear-gradient(135deg,
|
|
2400
|
-
border-radius:
|
|
2401
|
-
padding:
|
|
2485
|
+
.info-card[data-v-50189218] {
|
|
2486
|
+
background: linear-gradient(135deg, var(--db-light-color) 0%, var(--db-border) 100%);
|
|
2487
|
+
border-radius: 8px;
|
|
2488
|
+
padding: 0.875rem;
|
|
2402
2489
|
display: flex;
|
|
2403
2490
|
align-items: center;
|
|
2404
|
-
gap:
|
|
2405
|
-
border: 1px solid
|
|
2491
|
+
gap: 0.75rem;
|
|
2492
|
+
border: 1px solid var(--db-gray-medium);
|
|
2406
2493
|
}
|
|
2407
|
-
.card-icon[data-v-
|
|
2408
|
-
width:
|
|
2409
|
-
height:
|
|
2410
|
-
background:
|
|
2411
|
-
border-radius:
|
|
2494
|
+
.card-icon[data-v-50189218] {
|
|
2495
|
+
width: 36px;
|
|
2496
|
+
height: 36px;
|
|
2497
|
+
background: var(--db-primary-color);
|
|
2498
|
+
border-radius: 8px;
|
|
2412
2499
|
display: flex;
|
|
2413
2500
|
align-items: center;
|
|
2414
2501
|
justify-content: center;
|
|
2415
|
-
color:
|
|
2416
|
-
font-size:
|
|
2502
|
+
color: var(--db-on-accent);
|
|
2503
|
+
font-size: 1rem;
|
|
2417
2504
|
}
|
|
2418
|
-
.card-content h6[data-v-
|
|
2505
|
+
.card-content h6[data-v-50189218] {
|
|
2419
2506
|
margin: 0 0 0.25rem 0;
|
|
2420
|
-
color:
|
|
2421
|
-
font-size: 0.
|
|
2507
|
+
color: var(--db-darker-color);
|
|
2508
|
+
font-size: 0.8125rem;
|
|
2422
2509
|
font-weight: 500;
|
|
2423
2510
|
}
|
|
2424
|
-
.card-value[data-v-
|
|
2511
|
+
.card-value[data-v-50189218] {
|
|
2425
2512
|
margin: 0;
|
|
2426
|
-
color:
|
|
2513
|
+
color: var(--db-dark-color);
|
|
2427
2514
|
font-weight: 600;
|
|
2428
|
-
font-size:
|
|
2515
|
+
font-size: 1rem;
|
|
2429
2516
|
}
|
|
2430
2517
|
|
|
2431
2518
|
/* 表格网格 */
|
|
2432
|
-
.table-grid[data-v-
|
|
2519
|
+
.table-grid[data-v-50189218] {
|
|
2433
2520
|
display: grid;
|
|
2434
|
-
grid-template-columns: repeat(auto-fill, minmax(
|
|
2435
|
-
gap:
|
|
2521
|
+
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
|
|
2522
|
+
gap: 0.75rem;
|
|
2436
2523
|
}
|
|
2437
|
-
.table-card[data-v-
|
|
2438
|
-
background:
|
|
2439
|
-
border: 1px solid
|
|
2440
|
-
border-radius:
|
|
2441
|
-
padding:
|
|
2524
|
+
.table-card[data-v-50189218] {
|
|
2525
|
+
background: var(--db-surface);
|
|
2526
|
+
border: 1px solid var(--db-gray-medium);
|
|
2527
|
+
border-radius: 8px;
|
|
2528
|
+
padding: 0.75rem;
|
|
2442
2529
|
cursor: pointer;
|
|
2443
2530
|
transition: all 0.2s ease;
|
|
2444
2531
|
}
|
|
2445
|
-
.table-card[data-v-
|
|
2446
|
-
border-color:
|
|
2532
|
+
.table-card[data-v-50189218]:hover {
|
|
2533
|
+
border-color: var(--db-primary-color);
|
|
2447
2534
|
box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
|
|
2448
2535
|
transform: translateY(-2px);
|
|
2449
2536
|
}
|
|
2450
|
-
.table-card .card-header[data-v-
|
|
2537
|
+
.table-card .card-header[data-v-50189218] {
|
|
2451
2538
|
display: flex;
|
|
2452
2539
|
align-items: center;
|
|
2453
|
-
gap: 0.
|
|
2454
|
-
margin-bottom: 0.
|
|
2540
|
+
gap: 0.5rem;
|
|
2541
|
+
margin-bottom: 0.5rem;
|
|
2455
2542
|
}
|
|
2456
|
-
.table-icon[data-v-
|
|
2457
|
-
width:
|
|
2458
|
-
height:
|
|
2459
|
-
background:
|
|
2460
|
-
border-radius:
|
|
2543
|
+
.table-icon[data-v-50189218] {
|
|
2544
|
+
width: 28px;
|
|
2545
|
+
height: 28px;
|
|
2546
|
+
background: var(--db-accent-color);
|
|
2547
|
+
border-radius: 6px;
|
|
2461
2548
|
display: flex;
|
|
2462
2549
|
align-items: center;
|
|
2463
2550
|
justify-content: center;
|
|
2464
|
-
color:
|
|
2551
|
+
color: var(--db-on-accent);
|
|
2465
2552
|
}
|
|
2466
|
-
.table-name[data-v-
|
|
2553
|
+
.table-name[data-v-50189218] {
|
|
2467
2554
|
font-weight: 600;
|
|
2468
|
-
color:
|
|
2555
|
+
color: var(--db-dark-color);
|
|
2469
2556
|
}
|
|
2470
|
-
.table-stats[data-v-
|
|
2557
|
+
.table-stats[data-v-50189218] {
|
|
2471
2558
|
display: flex;
|
|
2472
|
-
gap:
|
|
2559
|
+
gap: 0.75rem;
|
|
2473
2560
|
margin-bottom: 0.5rem;
|
|
2474
2561
|
}
|
|
2475
|
-
.stat[data-v-
|
|
2562
|
+
.stat[data-v-50189218] {
|
|
2476
2563
|
display: flex;
|
|
2477
2564
|
flex-direction: column;
|
|
2478
2565
|
gap: 0.25rem;
|
|
2479
2566
|
}
|
|
2480
|
-
.stat-label[data-v-
|
|
2567
|
+
.stat-label[data-v-50189218] {
|
|
2481
2568
|
font-size: 0.75rem;
|
|
2482
|
-
color:
|
|
2569
|
+
color: var(--db-darker-color);
|
|
2483
2570
|
}
|
|
2484
|
-
.stat-value[data-v-
|
|
2571
|
+
.stat-value[data-v-50189218] {
|
|
2485
2572
|
font-size: 0.875rem;
|
|
2486
2573
|
font-weight: 600;
|
|
2487
|
-
color:
|
|
2574
|
+
color: var(--db-black);
|
|
2488
2575
|
}
|
|
2489
|
-
.table-comment[data-v-
|
|
2576
|
+
.table-comment[data-v-50189218] {
|
|
2490
2577
|
font-size: 0.75rem;
|
|
2491
|
-
color:
|
|
2578
|
+
color: var(--db-darker-color);
|
|
2492
2579
|
font-style: italic;
|
|
2493
2580
|
}
|
|
2494
2581
|
|
|
2495
2582
|
/* 数据工具栏 */
|
|
2496
|
-
.data-toolbar[data-v-
|
|
2583
|
+
.data-toolbar[data-v-50189218] {
|
|
2497
2584
|
display: flex;
|
|
2498
2585
|
justify-content: space-between;
|
|
2499
2586
|
align-items: center;
|
|
2500
2587
|
margin-bottom: 1rem;
|
|
2501
2588
|
padding: 0.75rem;
|
|
2502
|
-
background:
|
|
2589
|
+
background: var(--db-light-color);
|
|
2503
2590
|
border-radius: 8px;
|
|
2504
2591
|
}
|
|
2505
|
-
.toolbar-left[data-v-
|
|
2506
|
-
.toolbar-right[data-v-
|
|
2592
|
+
.toolbar-left[data-v-50189218],
|
|
2593
|
+
.toolbar-right[data-v-50189218] {
|
|
2507
2594
|
display: flex;
|
|
2508
2595
|
gap: 0.5rem;
|
|
2509
2596
|
align-items: center;
|
|
2510
2597
|
}
|
|
2511
2598
|
|
|
2512
2599
|
/* 空状态 */
|
|
2513
|
-
.empty-state[data-v-
|
|
2514
|
-
.default-state[data-v-
|
|
2600
|
+
.empty-state[data-v-50189218],
|
|
2601
|
+
.default-state[data-v-50189218] {
|
|
2515
2602
|
display: flex;
|
|
2516
2603
|
flex-direction: column;
|
|
2517
2604
|
align-items: center;
|
|
2518
2605
|
justify-content: center;
|
|
2519
2606
|
height: 100%;
|
|
2520
|
-
color:
|
|
2607
|
+
color: var(--db-darker-color);
|
|
2521
2608
|
text-align: center;
|
|
2522
2609
|
}
|
|
2523
|
-
.empty-icon[data-v-
|
|
2524
|
-
.default-icon[data-v-
|
|
2525
|
-
font-size:
|
|
2526
|
-
margin-bottom:
|
|
2527
|
-
opacity: 0.
|
|
2610
|
+
.empty-icon[data-v-50189218],
|
|
2611
|
+
.default-icon[data-v-50189218] {
|
|
2612
|
+
font-size: 1.75rem;
|
|
2613
|
+
margin-bottom: 0.5rem;
|
|
2614
|
+
opacity: 0.4;
|
|
2528
2615
|
}
|
|
2529
|
-
.empty-text h5[data-v-
|
|
2530
|
-
.default-content h5[data-v-
|
|
2531
|
-
color:
|
|
2616
|
+
.empty-text h5[data-v-50189218],
|
|
2617
|
+
.default-content h5[data-v-50189218] {
|
|
2618
|
+
color: var(--db-dark-color);
|
|
2532
2619
|
margin-bottom: 0.5rem;
|
|
2533
2620
|
}
|
|
2534
2621
|
|
|
2535
2622
|
/* 响应式 */
|
|
2536
2623
|
@media (max-width: 768px) {
|
|
2537
|
-
.explorer-layout[data-v-
|
|
2624
|
+
.explorer-layout[data-v-50189218] {
|
|
2538
2625
|
flex-direction: column;
|
|
2539
2626
|
}
|
|
2540
|
-
.explorer-sidebar[data-v-
|
|
2627
|
+
.explorer-sidebar[data-v-50189218] {
|
|
2541
2628
|
width: 100%;
|
|
2542
2629
|
height: 40vh;
|
|
2543
2630
|
border-right: none;
|
|
2544
|
-
border-bottom: 1px solid
|
|
2631
|
+
border-bottom: 1px solid var(--db-gray-medium);
|
|
2545
2632
|
}
|
|
2546
|
-
.info-cards[data-v-
|
|
2633
|
+
.info-cards[data-v-50189218] {
|
|
2547
2634
|
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
|
|
2548
2635
|
}
|
|
2549
|
-
.table-grid[data-v-
|
|
2636
|
+
.table-grid[data-v-50189218] {
|
|
2550
2637
|
grid-template-columns: 1fr;
|
|
2551
2638
|
}
|
|
2552
2639
|
}
|