bi-element-ui 0.1.49 → 0.1.51
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/package.json
CHANGED
@@ -0,0 +1,101 @@
|
|
1
|
+
# 前端 ui 样式规范
|
2
|
+
|
3
|
+
### 字体
|
4
|
+
|
5
|
+
```css
|
6
|
+
.text-12 {
|
7
|
+
font-size: 12px;
|
8
|
+
line-height: 18px;
|
9
|
+
}
|
10
|
+
.text-14 {
|
11
|
+
font-size: 14px;
|
12
|
+
line-height: 20px;
|
13
|
+
}
|
14
|
+
.text-16 {
|
15
|
+
font-size: 16px;
|
16
|
+
line-height: 22px;
|
17
|
+
}
|
18
|
+
.text-24 {
|
19
|
+
font-size: 16px;
|
20
|
+
line-height: 34px;
|
21
|
+
}
|
22
|
+
```
|
23
|
+
|
24
|
+
### 布局
|
25
|
+
|
26
|
+
```html
|
27
|
+
<div class="container"></div>
|
28
|
+
```
|
29
|
+
|
30
|
+
```css
|
31
|
+
.container {
|
32
|
+
padding: 20px;
|
33
|
+
}
|
34
|
+
.container + .container {
|
35
|
+
margin-top: 10px;
|
36
|
+
}
|
37
|
+
```
|
38
|
+
|
39
|
+
### 表单布局
|
40
|
+
|
41
|
+
![搜索条件布局][service_life]
|
42
|
+
|
43
|
+
```html
|
44
|
+
<div class="search-form">
|
45
|
+
<div class="search-item">
|
46
|
+
<div class="item-label">常规搜索项</div>
|
47
|
+
<div class="item-content"><el-input /></div>
|
48
|
+
</div>
|
49
|
+
<div class="search-item">
|
50
|
+
<div class="select-label"><el-select /></div>
|
51
|
+
<div class="select-content"><el-input /></div>
|
52
|
+
</div>
|
53
|
+
</div>
|
54
|
+
```
|
55
|
+
|
56
|
+
### 表格
|
57
|
+
|
58
|
+
```vue
|
59
|
+
<template>
|
60
|
+
<el-table :data="tableData" border height="200" :summary-method="getSummaries" show-summary>
|
61
|
+
<el-table-column prop="id" label="ID" width="180"> </el-table-column>
|
62
|
+
<el-table-column prop="name" label="姓名"> </el-table-column>
|
63
|
+
<el-table-column prop="amount1" label="数值 1(元)"> </el-table-column>
|
64
|
+
<el-table-column prop="amount2" label="数值 2(元)"> </el-table-column>
|
65
|
+
<el-table-column prop="amount3" label="数值 3(元)"> </el-table-column>
|
66
|
+
</el-table>
|
67
|
+
</template>
|
68
|
+
<script>
|
69
|
+
export default {
|
70
|
+
data() {
|
71
|
+
return {
|
72
|
+
tableData: [
|
73
|
+
{
|
74
|
+
id: '12987122',
|
75
|
+
name: '王小虎',
|
76
|
+
amount1: '234',
|
77
|
+
amount2: '3.2',
|
78
|
+
amount3: 10
|
79
|
+
},
|
80
|
+
{
|
81
|
+
id: '12987123',
|
82
|
+
name: '王小虎',
|
83
|
+
amount1: '165',
|
84
|
+
amount2: '4.43',
|
85
|
+
amount3: 12
|
86
|
+
}
|
87
|
+
]
|
88
|
+
}
|
89
|
+
},
|
90
|
+
methods: {
|
91
|
+
getSummaries() {
|
92
|
+
// 合计行现支持 返回 数组和对象两种方式
|
93
|
+
// return ['总计','xxxx','123','45','32']
|
94
|
+
// return { id:'总计',name:'xxxx',amount1:'123',amount2:'45',amount3:'32', }
|
95
|
+
}
|
96
|
+
}
|
97
|
+
}
|
98
|
+
</script>
|
99
|
+
```
|
100
|
+
|
101
|
+
[service_life]: data:image/jpeg;base64,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
|