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