admin
2024-04-24 363457b34e0e4f26ffe51aa80ecb227bf7873308
提交 | 用户 | 时间
363457 1 <template>
A 2   <div class="app-container">
3     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
4       <el-form-item label="表名称" prop="tableName">
5         <el-input
6           v-model="queryParams.tableName"
7           placeholder="请输入表名称"
8           clearable
9           @keyup.enter.native="handleQuery"
10         />
11       </el-form-item>
12       <el-form-item label="表描述" prop="tableComment">
13         <el-input
14           v-model="queryParams.tableComment"
15           placeholder="请输入表描述"
16           clearable
17           @keyup.enter.native="handleQuery"
18         />
19       </el-form-item>
20       <el-form-item label="创建时间">
21         <el-date-picker
22           v-model="dateRange"
23           style="width: 240px"
24           value-format="yyyy-MM-dd"
25           type="daterange"
26           range-separator="-"
27           start-placeholder="开始日期"
28           end-placeholder="结束日期"
29         ></el-date-picker>
30       </el-form-item>
31       <el-form-item>
32         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
33         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
34       </el-form-item>
35     </el-form>
36
37     <el-row :gutter="10" class="mb8">
38       <el-col :span="1.5">
39         <el-button
40           type="primary"
41           plain
42           icon="el-icon-download"
43           size="mini"
44           @click="handleGenTable"
45           v-hasPermi="['tool:gen:code']"
46         >生成</el-button>
47       </el-col>
48       <el-col :span="1.5">
49         <el-button
50           type="info"
51           plain
52           icon="el-icon-upload"
53           size="mini"
54           @click="openImportTable"
55           v-hasPermi="['tool:gen:import']"
56         >导入</el-button>
57       </el-col>
58       <el-col :span="1.5">
59         <el-button
60           type="success"
61           plain
62           icon="el-icon-edit"
63           size="mini"
64           :disabled="single"
65           @click="handleEditTable"
66           v-hasPermi="['tool:gen:edit']"
67         >修改</el-button>
68       </el-col>
69       <el-col :span="1.5">
70         <el-button
71           type="danger"
72           plain
73           icon="el-icon-delete"
74           size="mini"
75           :disabled="multiple"
76           @click="handleDelete"
77           v-hasPermi="['tool:gen:remove']"
78         >删除</el-button>
79       </el-col>
80       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
81     </el-row>
82
83     <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange">
84       <el-table-column type="selection" align="center" width="55"></el-table-column>
85       <el-table-column label="序号" type="index" width="50" align="center">
86         <template slot-scope="scope">
87           <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
88         </template>
89       </el-table-column>
90       <el-table-column
91         label="表名称"
92         align="center"
93         prop="tableName"
94         :show-overflow-tooltip="true"
95         width="120"
96       />
97       <el-table-column
98         label="表描述"
99         align="center"
100         prop="tableComment"
101         :show-overflow-tooltip="true"
102         width="120"
103       />
104       <el-table-column
105         label="实体"
106         align="center"
107         prop="className"
108         :show-overflow-tooltip="true"
109         width="120"
110       />
111       <el-table-column label="创建时间" align="center" prop="createTime" width="160" />
112       <el-table-column label="更新时间" align="center" prop="updateTime" width="160" />
113       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
114         <template slot-scope="scope">
115           <el-button
116             type="text"
117             size="small"
118             icon="el-icon-view"
119             @click="handlePreview(scope.row)"
120             v-hasPermi="['tool:gen:preview']"
121           >预览</el-button>
122           <el-button
123             type="text"
124             size="small"
125             icon="el-icon-edit"
126             @click="handleEditTable(scope.row)"
127             v-hasPermi="['tool:gen:edit']"
128           >编辑</el-button>
129           <el-button
130             type="text"
131             size="small"
132             icon="el-icon-delete"
133             @click="handleDelete(scope.row)"
134             v-hasPermi="['tool:gen:remove']"
135           >删除</el-button>
136           <el-button
137             type="text"
138             size="small"
139             icon="el-icon-refresh"
140             @click="handleSynchDb(scope.row)"
141             v-hasPermi="['tool:gen:edit']"
142           >同步</el-button>
143           <el-button
144             type="text"
145             size="small"
146             icon="el-icon-download"
147             @click="handleGenTable(scope.row)"
148             v-hasPermi="['tool:gen:code']"
149           >生成代码</el-button>
150         </template>
151       </el-table-column>
152     </el-table>
153     <pagination
154       v-show="total>0"
155       :total="total"
156       :page.sync="queryParams.pageNum"
157       :limit.sync="queryParams.pageSize"
158       @pagination="getList"
159     />
160     <!-- 预览界面 -->
161     <el-dialog :title="preview.title" :visible.sync="preview.open" width="80%" top="5vh" append-to-body class="scrollbar">
162       <el-tabs v-model="preview.activeName">
163         <el-tab-pane
164           v-for="(value, key) in preview.data"
165           :label="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))"
166           :name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))"
167           :key="key"
168         >
169           <el-link :underline="false" icon="el-icon-document-copy" v-clipboard:copy="value" v-clipboard:success="clipboardSuccess" style="float:right">复制</el-link>
170           <pre><code class="hljs" v-html="highlightedCode(value, key)"></code></pre>
171         </el-tab-pane>
172       </el-tabs>
173     </el-dialog>
174     <import-table ref="import" @ok="handleQuery" />
175   </div>
176 </template>
177
178 <script>
179 import { listTable, previewTable, delTable, genCode, synchDb } from "@/api/tool/gen";
180 import importTable from "./importTable";
181 import hljs from "highlight.js/lib/highlight";
182 import "highlight.js/styles/github-gist.css";
183 hljs.registerLanguage("java", require("highlight.js/lib/languages/java"));
184 hljs.registerLanguage("xml", require("highlight.js/lib/languages/xml"));
185 hljs.registerLanguage("html", require("highlight.js/lib/languages/xml"));
186 hljs.registerLanguage("vue", require("highlight.js/lib/languages/xml"));
187 hljs.registerLanguage("javascript", require("highlight.js/lib/languages/javascript"));
188 hljs.registerLanguage("sql", require("highlight.js/lib/languages/sql"));
189
190 export default {
191   name: "Gen",
192   components: { importTable },
193   data() {
194     return {
195       // 遮罩层
196       loading: true,
197       // 唯一标识符
198       uniqueId: "",
199       // 选中数组
200       ids: [],
201       // 选中表数组
202       tableNames: [],
203       // 非单个禁用
204       single: true,
205       // 非多个禁用
206       multiple: true,
207       // 显示搜索条件
208       showSearch: true,
209       // 总条数
210       total: 0,
211       // 表数据
212       tableList: [],
213       // 日期范围
214       dateRange: "",
215       // 查询参数
216       queryParams: {
217         pageNum: 1,
218         pageSize: 10,
219         tableName: undefined,
220         tableComment: undefined
221       },
222       // 预览参数
223       preview: {
224         open: false,
225         title: "代码预览",
226         data: {},
227         activeName: "domain.java"
228       }
229     };
230   },
231   created() {
232     this.getList();
233   },
234   activated() {
235     const time = this.$route.query.t;
236     if (time != null && time != this.uniqueId) {
237       this.uniqueId = time;
238       this.queryParams.pageNum = Number(this.$route.query.pageNum);
239       this.getList();
240     }
241   },
242   methods: {
243     /** 查询表集合 */
244     getList() {
245       this.loading = true;
246       listTable(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
247           this.tableList = response.rows;
248           this.total = response.total;
249           this.loading = false;
250         }
251       );
252     },
253     /** 搜索按钮操作 */
254     handleQuery() {
255       this.queryParams.pageNum = 1;
256       this.getList();
257     },
258     /** 生成代码操作 */
259     handleGenTable(row) {
260       const tableNames = row.tableName || this.tableNames;
261       if (tableNames == "") {
262         this.$modal.msgError("请选择要生成的数据");
263         return;
264       }
265       if(row.genType === "1") {
266         genCode(row.tableName).then(response => {
267           this.$modal.msgSuccess("成功生成到自定义路径:" + row.genPath);
268         });
269       } else {
270         this.$download.zip("/tool/gen/batchGenCode?tables=" + tableNames, "JCDM.zip");
271       }
272     },
273     /** 同步数据库操作 */
274     handleSynchDb(row) {
275       const tableName = row.tableName;
276       this.$modal.confirm('确认要强制同步"' + tableName + '"表结构吗?').then(function() {
277         return synchDb(tableName);
278       }).then(() => {
279         this.$modal.msgSuccess("同步成功");
280       }).catch(() => {});
281     },
282     /** 打开导入表弹窗 */
283     openImportTable() {
284       this.$refs.import.show();
285     },
286     /** 重置按钮操作 */
287     resetQuery() {
288       this.dateRange = [];
289       this.resetForm("queryForm");
290       this.handleQuery();
291     },
292     /** 预览按钮 */
293     handlePreview(row) {
294       previewTable(row.tableId).then(response => {
295         this.preview.data = response.data;
296         this.preview.open = true;
297         this.preview.activeName = "domain.java";
298       });
299     },
300     /** 高亮显示 */
301     highlightedCode(code, key) {
302       const vmName = key.substring(key.lastIndexOf("/") + 1, key.indexOf(".vm"));
303       var language = vmName.substring(vmName.indexOf(".") + 1, vmName.length);
304       const result = hljs.highlight(language, code || "", true);
305       return result.value || '&nbsp;';
306     },
307     /** 复制代码成功 */
308     clipboardSuccess() {
309       this.$modal.msgSuccess("复制成功");
310     },
311     // 多选框选中数据
312     handleSelectionChange(selection) {
313       this.ids = selection.map(item => item.tableId);
314       this.tableNames = selection.map(item => item.tableName);
315       this.single = selection.length != 1;
316       this.multiple = !selection.length;
317     },
318     /** 修改按钮操作 */
319     handleEditTable(row) {
320       const tableId = row.tableId || this.ids[0];
321       const tableName = row.tableName || this.tableNames[0];
322       const params = { pageNum: this.queryParams.pageNum };
323       this.$tab.openPage("修改[" + tableName + "]生成配置", '/tool/gen-edit/index/' + tableId, params);
324     },
325     /** 删除按钮操作 */
326     handleDelete(row) {
327       const tableIds = row.tableId || this.ids;
328       this.$modal.confirm('是否确认删除表编号为"' + tableIds + '"的数据项?').then(function() {
329         return delTable(tableIds);
330       }).then(() => {
331         this.getList();
332         this.$modal.msgSuccess("删除成功");
333       }).catch(() => {});
334     }
335   }
336 };
337 </script>