<template> 
 | 
  <div class="app-container"> 
 | 
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> 
 | 
      <el-form-item label="表名称" prop="tableName"> 
 | 
        <el-input 
 | 
          v-model="queryParams.tableName" 
 | 
          placeholder="请输入表名称" 
 | 
          clearable 
 | 
          @keyup.enter.native="handleQuery" 
 | 
        /> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="表描述" prop="tableComment"> 
 | 
        <el-input 
 | 
          v-model="queryParams.tableComment" 
 | 
          placeholder="请输入表描述" 
 | 
          clearable 
 | 
          @keyup.enter.native="handleQuery" 
 | 
        /> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="创建时间"> 
 | 
        <el-date-picker 
 | 
          v-model="dateRange" 
 | 
          style="width: 240px" 
 | 
          value-format="yyyy-MM-dd" 
 | 
          type="daterange" 
 | 
          range-separator="-" 
 | 
          start-placeholder="开始日期" 
 | 
          end-placeholder="结束日期" 
 | 
        ></el-date-picker> 
 | 
      </el-form-item> 
 | 
      <el-form-item> 
 | 
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> 
 | 
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> 
 | 
      </el-form-item> 
 | 
    </el-form> 
 | 
  
 | 
    <el-row :gutter="10" class="mb8"> 
 | 
      <el-col :span="1.5"> 
 | 
        <el-button 
 | 
          type="primary" 
 | 
          plain 
 | 
          icon="el-icon-download" 
 | 
          size="mini" 
 | 
          @click="handleGenTable" 
 | 
          v-hasPermi="['tool:gen:code']" 
 | 
        >生成</el-button> 
 | 
      </el-col> 
 | 
      <el-col :span="1.5"> 
 | 
        <el-button 
 | 
          type="info" 
 | 
          plain 
 | 
          icon="el-icon-upload" 
 | 
          size="mini" 
 | 
          @click="openImportTable" 
 | 
          v-hasPermi="['tool:gen:import']" 
 | 
        >导入</el-button> 
 | 
      </el-col> 
 | 
      <el-col :span="1.5"> 
 | 
        <el-button 
 | 
          type="success" 
 | 
          plain 
 | 
          icon="el-icon-edit" 
 | 
          size="mini" 
 | 
          :disabled="single" 
 | 
          @click="handleEditTable" 
 | 
          v-hasPermi="['tool:gen:edit']" 
 | 
        >修改</el-button> 
 | 
      </el-col> 
 | 
      <el-col :span="1.5"> 
 | 
        <el-button 
 | 
          type="danger" 
 | 
          plain 
 | 
          icon="el-icon-delete" 
 | 
          size="mini" 
 | 
          :disabled="multiple" 
 | 
          @click="handleDelete" 
 | 
          v-hasPermi="['tool:gen:remove']" 
 | 
        >删除</el-button> 
 | 
      </el-col> 
 | 
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> 
 | 
    </el-row> 
 | 
  
 | 
    <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange"> 
 | 
      <el-table-column type="selection" align="center" width="55"></el-table-column> 
 | 
      <el-table-column label="序号" type="index" width="50" align="center"> 
 | 
        <template slot-scope="scope"> 
 | 
          <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span> 
 | 
        </template> 
 | 
      </el-table-column> 
 | 
      <el-table-column 
 | 
        label="表名称" 
 | 
        align="center" 
 | 
        prop="tableName" 
 | 
        :show-overflow-tooltip="true" 
 | 
        width="120" 
 | 
      /> 
 | 
      <el-table-column 
 | 
        label="表描述" 
 | 
        align="center" 
 | 
        prop="tableComment" 
 | 
        :show-overflow-tooltip="true" 
 | 
        width="120" 
 | 
      /> 
 | 
      <el-table-column 
 | 
        label="实体" 
 | 
        align="center" 
 | 
        prop="className" 
 | 
        :show-overflow-tooltip="true" 
 | 
        width="120" 
 | 
      /> 
 | 
      <el-table-column label="创建时间" align="center" prop="createTime" width="160" /> 
 | 
      <el-table-column label="更新时间" align="center" prop="updateTime" width="160" /> 
 | 
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> 
 | 
        <template slot-scope="scope"> 
 | 
          <el-button 
 | 
            type="text" 
 | 
            size="small" 
 | 
            icon="el-icon-view" 
 | 
            @click="handlePreview(scope.row)" 
 | 
            v-hasPermi="['tool:gen:preview']" 
 | 
          >预览</el-button> 
 | 
          <el-button 
 | 
            type="text" 
 | 
            size="small" 
 | 
            icon="el-icon-edit" 
 | 
            @click="handleEditTable(scope.row)" 
 | 
            v-hasPermi="['tool:gen:edit']" 
 | 
          >编辑</el-button> 
 | 
          <el-button 
 | 
            type="text" 
 | 
            size="small" 
 | 
            icon="el-icon-delete" 
 | 
            @click="handleDelete(scope.row)" 
 | 
            v-hasPermi="['tool:gen:remove']" 
 | 
          >删除</el-button> 
 | 
          <el-button 
 | 
            type="text" 
 | 
            size="small" 
 | 
            icon="el-icon-refresh" 
 | 
            @click="handleSynchDb(scope.row)" 
 | 
            v-hasPermi="['tool:gen:edit']" 
 | 
          >同步</el-button> 
 | 
          <el-button 
 | 
            type="text" 
 | 
            size="small" 
 | 
            icon="el-icon-download" 
 | 
            @click="handleGenTable(scope.row)" 
 | 
            v-hasPermi="['tool:gen:code']" 
 | 
          >生成代码</el-button> 
 | 
        </template> 
 | 
      </el-table-column> 
 | 
    </el-table> 
 | 
    <pagination 
 | 
      v-show="total>0" 
 | 
      :total="total" 
 | 
      :page.sync="queryParams.pageNum" 
 | 
      :limit.sync="queryParams.pageSize" 
 | 
      @pagination="getList" 
 | 
    /> 
 | 
    <!-- 预览界面 --> 
 | 
    <el-dialog :title="preview.title" :visible.sync="preview.open" width="80%" top="5vh" append-to-body class="scrollbar"> 
 | 
      <el-tabs v-model="preview.activeName"> 
 | 
        <el-tab-pane 
 | 
          v-for="(value, key) in preview.data" 
 | 
          :label="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))" 
 | 
          :name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))" 
 | 
          :key="key" 
 | 
        > 
 | 
          <el-link :underline="false" icon="el-icon-document-copy" v-clipboard:copy="value" v-clipboard:success="clipboardSuccess" style="float:right">复制</el-link> 
 | 
          <pre><code class="hljs" v-html="highlightedCode(value, key)"></code></pre> 
 | 
        </el-tab-pane> 
 | 
      </el-tabs> 
 | 
    </el-dialog> 
 | 
    <import-table ref="import" @ok="handleQuery" /> 
 | 
  </div> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import { listTable, previewTable, delTable, genCode, synchDb } from "@/api/tool/gen"; 
 | 
import importTable from "./importTable"; 
 | 
import hljs from "highlight.js/lib/highlight"; 
 | 
import "highlight.js/styles/github-gist.css"; 
 | 
hljs.registerLanguage("java", require("highlight.js/lib/languages/java")); 
 | 
hljs.registerLanguage("xml", require("highlight.js/lib/languages/xml")); 
 | 
hljs.registerLanguage("html", require("highlight.js/lib/languages/xml")); 
 | 
hljs.registerLanguage("vue", require("highlight.js/lib/languages/xml")); 
 | 
hljs.registerLanguage("javascript", require("highlight.js/lib/languages/javascript")); 
 | 
hljs.registerLanguage("sql", require("highlight.js/lib/languages/sql")); 
 | 
  
 | 
export default { 
 | 
  name: "Gen", 
 | 
  components: { importTable }, 
 | 
  data() { 
 | 
    return { 
 | 
      // 遮罩层 
 | 
      loading: true, 
 | 
      // 唯一标识符 
 | 
      uniqueId: "", 
 | 
      // 选中数组 
 | 
      ids: [], 
 | 
      // 选中表数组 
 | 
      tableNames: [], 
 | 
      // 非单个禁用 
 | 
      single: true, 
 | 
      // 非多个禁用 
 | 
      multiple: true, 
 | 
      // 显示搜索条件 
 | 
      showSearch: true, 
 | 
      // 总条数 
 | 
      total: 0, 
 | 
      // 表数据 
 | 
      tableList: [], 
 | 
      // 日期范围 
 | 
      dateRange: "", 
 | 
      // 查询参数 
 | 
      queryParams: { 
 | 
        pageNum: 1, 
 | 
        pageSize: 10, 
 | 
        tableName: undefined, 
 | 
        tableComment: undefined 
 | 
      }, 
 | 
      // 预览参数 
 | 
      preview: { 
 | 
        open: false, 
 | 
        title: "代码预览", 
 | 
        data: {}, 
 | 
        activeName: "domain.java" 
 | 
      } 
 | 
    }; 
 | 
  }, 
 | 
  created() { 
 | 
    this.getList(); 
 | 
  }, 
 | 
  activated() { 
 | 
    const time = this.$route.query.t; 
 | 
    if (time != null && time != this.uniqueId) { 
 | 
      this.uniqueId = time; 
 | 
      this.queryParams.pageNum = Number(this.$route.query.pageNum); 
 | 
      this.getList(); 
 | 
    } 
 | 
  }, 
 | 
  methods: { 
 | 
    /** 查询表集合 */ 
 | 
    getList() { 
 | 
      this.loading = true; 
 | 
      listTable(this.addDateRange(this.queryParams, this.dateRange)).then(response => { 
 | 
          this.tableList = response.rows; 
 | 
          this.total = response.total; 
 | 
          this.loading = false; 
 | 
        } 
 | 
      ); 
 | 
    }, 
 | 
    /** 搜索按钮操作 */ 
 | 
    handleQuery() { 
 | 
      this.queryParams.pageNum = 1; 
 | 
      this.getList(); 
 | 
    }, 
 | 
    /** 生成代码操作 */ 
 | 
    handleGenTable(row) { 
 | 
      const tableNames = row.tableName || this.tableNames; 
 | 
      if (tableNames == "") { 
 | 
        this.$modal.msgError("请选择要生成的数据"); 
 | 
        return; 
 | 
      } 
 | 
      if(row.genType === "1") { 
 | 
        genCode(row.tableName).then(response => { 
 | 
          this.$modal.msgSuccess("成功生成到自定义路径:" + row.genPath); 
 | 
        }); 
 | 
      } else { 
 | 
        this.$download.zip("/tool/gen/batchGenCode?tables=" + tableNames, "ruoyi.zip"); 
 | 
      } 
 | 
    }, 
 | 
    /** 同步数据库操作 */ 
 | 
    handleSynchDb(row) { 
 | 
      const tableName = row.tableName; 
 | 
      this.$modal.confirm('确认要强制同步"' + tableName + '"表结构吗?').then(function() { 
 | 
        return synchDb(tableName); 
 | 
      }).then(() => { 
 | 
        this.$modal.msgSuccess("同步成功"); 
 | 
      }).catch(() => {}); 
 | 
    }, 
 | 
    /** 打开导入表弹窗 */ 
 | 
    openImportTable() { 
 | 
      this.$refs.import.show(); 
 | 
    }, 
 | 
    /** 重置按钮操作 */ 
 | 
    resetQuery() { 
 | 
      this.dateRange = []; 
 | 
      this.resetForm("queryForm"); 
 | 
      this.handleQuery(); 
 | 
    }, 
 | 
    /** 预览按钮 */ 
 | 
    handlePreview(row) { 
 | 
      previewTable(row.tableId).then(response => { 
 | 
        this.preview.data = response.data; 
 | 
        this.preview.open = true; 
 | 
        this.preview.activeName = "domain.java"; 
 | 
      }); 
 | 
    }, 
 | 
    /** 高亮显示 */ 
 | 
    highlightedCode(code, key) { 
 | 
      const vmName = key.substring(key.lastIndexOf("/") + 1, key.indexOf(".vm")); 
 | 
      var language = vmName.substring(vmName.indexOf(".") + 1, vmName.length); 
 | 
      const result = hljs.highlight(language, code || "", true); 
 | 
      return result.value || ' '; 
 | 
    }, 
 | 
    /** 复制代码成功 */ 
 | 
    clipboardSuccess() { 
 | 
      this.$modal.msgSuccess("复制成功"); 
 | 
    }, 
 | 
    // 多选框选中数据 
 | 
    handleSelectionChange(selection) { 
 | 
      this.ids = selection.map(item => item.tableId); 
 | 
      this.tableNames = selection.map(item => item.tableName); 
 | 
      this.single = selection.length != 1; 
 | 
      this.multiple = !selection.length; 
 | 
    }, 
 | 
    /** 修改按钮操作 */ 
 | 
    handleEditTable(row) { 
 | 
      const tableId = row.tableId || this.ids[0]; 
 | 
      const tableName = row.tableName || this.tableNames[0]; 
 | 
      const params = { pageNum: this.queryParams.pageNum }; 
 | 
      this.$tab.openPage("修改[" + tableName + "]生成配置", '/tool/gen-edit/index/' + tableId, params); 
 | 
    }, 
 | 
    /** 删除按钮操作 */ 
 | 
    handleDelete(row) { 
 | 
      const tableIds = row.tableId || this.ids; 
 | 
      this.$modal.confirm('是否确认删除表编号为"' + tableIds + '"的数据项?').then(function() { 
 | 
        return delTable(tableIds); 
 | 
      }).then(() => { 
 | 
        this.getList(); 
 | 
        this.$modal.msgSuccess("删除成功"); 
 | 
      }).catch(() => {}); 
 | 
    } 
 | 
  } 
 | 
}; 
 | 
</script> 
 |