|
2 | 2 | <div class="index">
|
3 | 3 | <img class="home-img" :src="$store.state.meta.homePageImg" alt="homeImg" />
|
4 | 4 | </div>
|
5 |
| - <!--<div class="index">--> |
6 |
| - <!--<h2>data-table generator</h2>--> |
7 |
| - <!--<el-form-renderer :content="renderInput" ref="renderInput"></el-form-renderer>--> |
8 |
| - <!--<el-form-renderer :content="renderCheckbox" ref="renderCheckbox"></el-form-renderer>--> |
9 |
| - <!--<div>columns</div>--> |
10 |
| - <!--<el-form inline>--> |
11 |
| - <!--<div v-for="(col, index) in columns" :key="index">--> |
12 |
| - <!--<el-form-item label="列名">--> |
13 |
| - <!--<el-input v-model.trim="col.label"></el-input>--> |
14 |
| - <!--</el-form-item>--> |
15 |
| - <!--<el-form-item label="字段值">--> |
16 |
| - <!--<el-input v-model.trim="col.prop"></el-input>--> |
17 |
| - <!--</el-form-item>--> |
18 |
| - <!--</div>--> |
19 |
| - <!--<el-form-item label="">--> |
20 |
| - <!--<el-button @click="addColumn">添加列</el-button>--> |
21 |
| - <!--</el-form-item>--> |
22 |
| - <!--</el-form>--> |
23 |
| - <!--<div>extraButtons</div>--> |
24 |
| - <!--<el-form inline>--> |
25 |
| - <!--<div v-for="(btn, index) in extraButtons" :key="index">--> |
26 |
| - <!--<!–<el-form-item label="类型">–>--> |
27 |
| - <!--<!–<el-input v-model.trim="btn.type"></el-input>–>--> |
28 |
| - <!--<!–</el-form-item>–>--> |
29 |
| - <!--<el-form-item label="text">--> |
30 |
| - <!--<el-input v-model.trim="btn.text"></el-input>--> |
31 |
| - <!--</el-form-item>--> |
32 |
| - <!--<el-form-item label="@click">--> |
33 |
| - <!--<el-input v-model.trim="btn.onClick"></el-input>--> |
34 |
| - <!--</el-form-item>--> |
35 |
| - <!--</div>--> |
36 |
| - <!--<el-form-item label="">--> |
37 |
| - <!--<el-button @click="addBtn">添加按钮</el-button>--> |
38 |
| - <!--</el-form-item>--> |
39 |
| - <!--</el-form>--> |
40 |
| - <!--<div>查询字段</div>--> |
41 |
| - <!--<el-form inline>--> |
42 |
| - <!--<div v-for="(search, index) in searchForm" :key="index">--> |
43 |
| - <!--<el-form-item label="label">--> |
44 |
| - <!--<el-input v-model.trim="search.label"></el-input>--> |
45 |
| - <!--</el-form-item>--> |
46 |
| - <!--<el-form-item label="value">--> |
47 |
| - <!--<el-input v-model.trim="search.$id"></el-input>--> |
48 |
| - <!--</el-form-item>--> |
49 |
| - <!--</div>--> |
50 |
| - <!--<el-form-item label="">--> |
51 |
| - <!--<el-button @click="addSearch">添加查询</el-button>--> |
52 |
| - <!--</el-form-item>--> |
53 |
| - <!--</el-form>--> |
54 |
| - <!--<el-form>--> |
55 |
| - <!--<el-form-item label="">--> |
56 |
| - <!--<el-button @click="generate" type="primary">生成</el-button>--> |
57 |
| - <!--</el-form-item>--> |
58 |
| - <!--</el-form>--> |
59 |
| - <!--</div>--> |
60 | 5 | </template>
|
61 | 6 |
|
62 | 7 | <script>
|
63 |
| -//import fileSaver from 'file-saver' |
64 |
| -
|
65 | 8 | export default {
|
66 | 9 | data() {
|
67 |
| - return { |
68 |
| - renderInput: [ |
69 |
| - { |
70 |
| - $type: 'input', |
71 |
| - $id: 'pageName', |
72 |
| - label: '页面名字(对应路由名字)', |
73 |
| - rules: [{required: true}] |
74 |
| - }, |
75 |
| - { |
76 |
| - $type: 'input', |
77 |
| - $id: 'url', |
78 |
| - label: '接口url', |
79 |
| - rules: [{required: true}] |
80 |
| - } |
81 |
| - ], |
82 |
| - renderCheckbox: [ |
83 |
| - { |
84 |
| - $type: 'checkbox', |
85 |
| - $id: 'hasNew', |
86 |
| - label: '新增', |
87 |
| - $default: true |
88 |
| - }, |
89 |
| - { |
90 |
| - $type: 'checkbox', |
91 |
| - $id: 'hasEdit', |
92 |
| - label: '修改', |
93 |
| - $default: true |
94 |
| - }, |
95 |
| - { |
96 |
| - $type: 'checkbox', |
97 |
| - $id: 'hasDelete', |
98 |
| - label: '删除', |
99 |
| - $default: true |
100 |
| - }, |
101 |
| - { |
102 |
| - $type: 'checkbox', |
103 |
| - $id: 'hasSelect', |
104 |
| - label: '是否有选择(多选)', |
105 |
| - $default: true |
106 |
| - }, |
107 |
| - { |
108 |
| - $type: 'checkbox', |
109 |
| - $id: 'single', |
110 |
| - label: '是否单选(上一项必须勾选才生效)', |
111 |
| - $default: false |
112 |
| - }, |
113 |
| - { |
114 |
| - $type: 'checkbox', |
115 |
| - $id: 'hasPagination', |
116 |
| - label: '是否分页', |
117 |
| - $default: true |
118 |
| - }, |
119 |
| - { |
120 |
| - $type: 'checkbox', |
121 |
| - $id: 'hasOperation', |
122 |
| - label: '是否有操作列', |
123 |
| - $default: true |
124 |
| - }, |
125 |
| - { |
126 |
| - $type: 'checkbox', |
127 |
| - $id: 'isTree', |
128 |
| - label: '是否树形结构', |
129 |
| - $default: false |
130 |
| - } |
131 |
| - ], |
132 |
| - searchForm: [], |
133 |
| - extraButtons: [], |
134 |
| - columns: [], |
135 |
| - form: [], |
136 |
| - query: {} |
137 |
| - } |
| 10 | + return {} |
138 | 11 | },
|
139 |
| - methods: { |
140 |
| - addColumn() { |
141 |
| - this.columns.push({ |
142 |
| - prop: '', |
143 |
| - label: '' |
144 |
| - }) |
145 |
| - }, |
146 |
| - addBtn() { |
147 |
| - this.extraButtons.push({ |
148 |
| - text: '', |
149 |
| - onClick: '' |
150 |
| - }) |
151 |
| - }, |
152 |
| - addSearch() { |
153 |
| - this.searchForm.push({ |
154 |
| - $type: 'input', |
155 |
| - $id: '', |
156 |
| - label: '', |
157 |
| - $el: { |
158 |
| - placeholder: '请输入' |
159 |
| - } |
160 |
| - }) |
161 |
| - }, |
162 |
| - generate() { |
163 |
| - // let host = 'levy.ren' |
164 |
| - let host = 'localhost' |
165 |
| -
|
166 |
| - let api = `http://${host}:30000/generator/data-table` |
167 |
| -
|
168 |
| - if (!this.columns.length) return alert('至少有一个列') |
169 |
| -
|
170 |
| - this.$refs.renderInput.validate(valid => { |
171 |
| - if (!valid) return |
172 |
| -
|
173 |
| - this.$refs.renderCheckbox.validate(valid => { |
174 |
| - if (!valid) return |
175 |
| - }) |
176 |
| -
|
177 |
| - let extraButtons = this.extraButtons.map(btn => ({ |
178 |
| - text: btn.text, |
179 |
| - type: btn.type, |
180 |
| - atClick: `row => ${btn.onClick}` |
181 |
| - })) |
182 |
| -
|
183 |
| - let data = Object.assign( |
184 |
| - {}, |
185 |
| - this.$refs.renderInput.getFormValue(), |
186 |
| - this.$refs.renderCheckbox.getFormValue() |
187 |
| - ) |
188 |
| -
|
189 |
| - Object.keys(this.$data).forEach(key => { |
190 |
| - // renderxxx 不传给接口 |
191 |
| - if (key.indexOf('render') > -1) return |
192 |
| - data[key] = this[key] |
193 |
| - }) |
194 |
| -
|
195 |
| - // 参数判断 |
196 |
| - if (data.hasSelect && data.columns[0].type !== 'selection') |
197 |
| - data.columns.unshift({type: 'selection'}) |
198 |
| -
|
199 |
| - this.$axios.$post(api, data).then(resp => { |
200 |
| - console.log(resp) |
201 |
| -
|
202 |
| - let file = new File([resp], data.pageName + '.vue', { |
203 |
| - type: 'text/plain;charset=utf-8' |
204 |
| - }) |
205 |
| - fileSaver.saveAs(file) |
206 |
| - }) |
207 |
| - }) |
208 |
| - } |
209 |
| - } |
| 12 | + methods: {} |
210 | 13 | }
|
211 | 14 | </script>
|
212 | 15 | <style lang="stylus">
|
213 | 16 | .index {
|
214 | 17 | .home-img {
|
215 |
| - width 100% |
| 18 | + width: 100%; |
216 | 19 | }
|
217 | 20 | }
|
218 | 21 | </style>
|
0 commit comments