1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
| <template>
| <div class="tree-container">
| <a-tree
| :dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
| :expandedKeys.sync='expandedKeys'
| :selectedKeys='selectedKeys'
| :treeData='treeDataSource'
| checkStrictly
| default-expand-all
| show-icon
| @select='handleTreeSelect'
| >
| <a-icon slot="flag" type="flag" theme="filled" />
| <a-icon slot="switcher" type="switcher" theme="filled"/>
| <a-icon slot="star" type="star" theme="filled"/>
| </a-tree>
| </div>
| </template>
| <script>
| export default {
| name: 'TreeLeft',
| props: ['value'],
| data() {
| return {
| cardLoading: true,
| loading: true,
| treeDataSource: [
| {
| title: '保留字',
| key: '0',
| slots: {
| icon: 'switcher',
| },
| children: [
| {
| title: '关键字',
| key: '0-1',
| slots: {
| icon: 'flag',
| },
| children: [
| { title: 'void', slots: { icon: 'star'},key: 'void' },
| { title: 'bool', key: 'bool', slots: { icon: 'star'} },
| { title: 'int', key: 'int' , slots: { icon: 'star'}},
| { title: 'long', key: 'long' , slots: { icon: 'star'}},
| { title: 'float', key: 'float', slots: { icon: 'star'} },
| { title: 'double', key: 'double' , slots: { icon: 'star'}},
| { title: 'string', key: 'string' , slots: { icon: 'star'}},
| { title: 'DateTime', key: 'DateTime', slots: { icon: 'star'} },
| { title: 'TimeSpan', key: 'TimeSpan' , slots: { icon: 'star'}},
| { title: 'true', key: 'true' , slots: { icon: 'star'}},
| { title: 'false', key: 'false' , slots: { icon: 'star'}},
| { title: 'null', key: 'null' , slots: { icon: 'star'}}
| ]
| },
| {
| title: '控制声明',
| key: '0-2',
| slots: {
| icon: 'flag',
| },
| children: [
| { title: 'if', key: 'if' },
| { title: 'else', key: 'else' },
| { title: 'switch', key: 'switch' },
| { title: 'case', key: 'case' },
| { title: 'default', key: 'default' },
| { title: 'continue', key: 'continue' },
| { title: 'for', key: 'for' },
| { title: 'while', key: 'while' },
| { title: 'do', key: 'do' },
| { title: 'break', key: 'break' },
| { title: 'return', key: 'return' },
| { title: 'new', key: 'new' }
| ]
| },
| {
| title: '运算符',
| key: '0-3',
| slots: {
| icon: 'flag',
| },
| children: [
| { title: '+', key: '+' },
| { title: '-', key: '-' },
| { title: '*', key: '*' },
| { title: '/', key: '/' },
| { title: '%', key: '%' },
| { title: '|', key: '|' },
| { title: '++', key: '++' },
| { title: '+=', key: '+=' },
| { title: '-=', key: '-=' }
| ]
| },
| {
| title: '关系操作符',
| key: '0-4',
| slots: {
| icon: 'flag',
| },
| children: [
| { title: '==', key: '==' },
| { title: '>', key: '>' },
| { title: '<', key: '<' },
| { title: '>=', key: '>=' },
| { title: '<=', key: '<=' },
| { title: '!=', key: '!=' },
| { title: '@', key: '@' }
| ]
| },
| {
| title: '逻辑操作符',
| key: '0-5',
| slots: {
| icon: 'flag',
| },
| children: [
| { title: '&&', key: '&&' },
| { title: '||', key: '||' }
| ]
| },
| {
| title: '全局变量',
| key: '0-6',
| slots: {
| icon: 'flag',
| },
| children: [
| { title: 'Int', key: 'GlobalVariable[x].Int' },
| { title: 'Uint', key: 'GlobalVariable[x].Uint' },
| { title: 'Bool', key: 'GlobalVariable[x].Bool' },
| { title: 'Byte', key: 'GlobalVariable[x].Byte' },
| { title: 'Sbyte', key: 'GlobalVariable[x].Sbyte' },
| { title: 'Short', key: 'GlobalVariable[x].Short' },
| { title: 'Ushort', key: 'GlobalVariable[x].Ushort' },
| { title: 'Long', key: 'GlobalVariable[x].Long' },
| { title: 'Ulong', key: 'GlobalVariable[x].Ulong' },
| { title: 'Float', key: 'GlobalVariable[x].Float' },
| { title: 'Double', key: 'GlobalVariable[x].Double' },
| { title: 'String', key: 'GlobalVariable[x].String' },
| { title: 'Object', key: 'GlobalVariable[x].Object' },
| { title: 'DateTime', key: 'GlobalVariable[x].DateTime' },
| { title: 'Decimal', key: 'GlobalVariable[x].Decimal' },
| { title: 'Char', key: 'GlobalVariable[x].Char' },
|
| { title: 'IntArray[x]', key: 'GlobalVariable[x].IntArray[x]' },
| { title: 'UintArray[x]', key: 'GlobalVariable[x].UintArray[x]' },
| { title: 'BoolArray[x]', key: 'GlobalVariable[x].BoolArray[x]' },
| { title: 'ByteArray[x]', key: 'GlobalVariable[x].ByteArray[x]' },
| { title: 'SbyteArray[x]', key: 'GlobalVariable[x].SbyteArray[x]' },
| { title: 'ShortArray[x]', key: 'GlobalVariable[x].ShortArray[x]' },
| { title: 'UshortArray[x]', key: 'GlobalVariable[x].UshortArray[x]' },
| { title: 'LongArray[x]', key: 'GlobalVariable[x].LongArray[x]' },
| { title: 'UlongArray[x]', key: 'GlobalVariable[x].UlongArray[x]' },
| { title: 'FloatArray[x]', key: 'GlobalVariable[x].FloatArray[x]' },
| { title: 'DoubleArray[x]', key: 'GlobalVariable[x].DoubleArray[x]' },
| { title: 'StringArray[x]', key: 'GlobalVariable[x].StringArray[x]' },
| { title: 'ObjectArray[x]', key: 'GlobalVariable[x].ObjectArray[x]' },
| { title: 'DateTimeArray[x]', key: 'GlobalVariable[x].DateTimeArray[x]' },
| { title: 'DecimalArray[x]', key: 'GlobalVariable[x].DecimalArray[x]' },
| { title: 'CharArray[x]', key: 'GlobalVariable[x].CharArray[x]' }
| ]
| }
| ]
| }
| ],
| selectedKeys: [],
| expandedKeys: ['0','0-1']
| }
| },
| methods: {
| handleTreeSelect(selectedKeys, event) {
| if (!selectedKeys[0].includes('0')) {
| this.$emit('insertTextAtCursor', selectedKeys[0])
| }
| }
| }
| }
| </script>
| <style scoped>
| /* 使用深度选择器修改图标颜色 */
| ::v-deep .ant-tree-iconEle {
| color: #1890FF; /* 修改为你想要的颜色，这里以红色为例 */
| }
| .tree-container {
| height: 620px;
| overflow: auto;
| }
| </style>
|
|
