:bug:移除无用依赖，移除网页版代码生成机

mock/controller/router.js

@@ -167,16 +167,6 @@ const data = [
         component: "@/views/vab/card/index",
         meta: { title: "卡片", permissions: ["admin"] },
       },
-
-      {
-        path: "betterScroll",
-        name: "BetterScroll",
-        component: "@/views/vab/betterScroll/index",
-        meta: {
-          title: "滚动侦测",
-          permissions: ["admin"],
-        },
-      },
       {
         path: "verify",
         name: "Verify",
@@ -273,12 +263,6 @@ const data = [
         meta: { title: "图像拖拽比对", permissions: ["admin"] },
       },
       {
-        path: "codeGenerator",
-        name: "CodeGenerator",
-        component: "@/views/vab/codeGenerator/index",
-        meta: { title: "代码生成机", permissions: ["admin"] },
-      },
-      {
         path: "markdown",
         name: "Markdown",
         component: "@/views/vab/markdown/index",

package.json

@@ -41,18 +41,14 @@
   },
   "dependencies": {
     "axios": "^0.20.0",
-    "better-scroll": "^2.0.4",
     "clipboard": "^2.0.6",
-    "codemirror": "^5.58.1",
     "core-js": "^3.6.5",
     "dayjs": "^1.9.1",
     "echarts": "^4.9.0",
     "echarts-wordcloud": "^1.1.3",
     "element-ui": "^2.13.2",
-    "file-saver": "^2.0.2",
     "js-cookie": "^2.2.1",
     "jsencrypt": "^3.0.0-rc.1",
-    "jsonlint": "^1.6.3",
     "lodash": "^4.17.20",
     "maptalks": "^0.49.1",
     "mapv": "^2.0.57",
@@ -60,11 +56,9 @@
     "qs": "^6.9.4",
     "screenfull": "^5.0.2",
     "vue": "^2.6.12",
-    "vue-amap": "^0.5.10",
     "vue-echarts": "^5.0.0-beta.0",
     "vue-qart": "^2.2.0",
     "vue-router": "^3.4.5",
-    "vuedraggable": "^2.24.1",
     "vuex": "^3.5.1",
     "zx-comparison": "^1.0.3",
     "zx-count": "^0.3.7",

src/components/JsonEditor/index.vue

@@ -1,111 +0,0 @@
-<template>
-  <div class="json-editor">
-    <label>
-      <textarea ref="textarea" />
-    </label>
-  </div>
-</template>
-
-<script>
-  import CodeMirror from "codemirror";
-  import "codemirror/addon/lint/lint.css";
-  import "codemirror/lib/codemirror.css";
-  import "codemirror/theme/rubyblue.css";
-  import "codemirror/mode/javascript/javascript";
-  import "codemirror/addon/lint/lint";
-  import "codemirror/addon/lint/json-lint";
-
-  require("script-loader!jsonlint");
-
-  export default {
-    name: "JsonEditor",
-    props: {
-      value: {
-        type: [Array, Object],
-        default: () => {
-          return null;
-        },
-      },
-    },
-    data() {
-      return {
-        jsonEditor: false,
-      };
-    },
-    watch: {
-      value(value) {
-        const editorValue = this.jsonEditor.getValue();
-
-        if (editorValue) {
-          this.$emit("change", editorValue);
-        } else {
-          this.$baseMessage("JSON不能为空,否则无法生成表格", "error");
-        }
-        if (value !== editorValue) {
-          this.jsonEditor.setValue(JSON.stringify(this.value, null, 2));
-        }
-      },
-    },
-    mounted() {
-      this.jsonEditor = CodeMirror.fromTextArea(this.$refs.textarea, {
-        lineNumbers: true,
-        mode: "application/json",
-        gutters: ["CodeMirror-lint-markers"],
-        theme: "rubyblue",
-        lint: true,
-      });
-
-      this.jsonEditor.setValue(JSON.stringify(this.value, null, 2));
-      this.jsonEditor.on("change", (cm) => {
-        if (this.isJsonString(cm.getValue())) {
-          this.$emit("change", cm.getValue());
-        }
-      });
-    },
-    methods: {
-      getValue() {
-        return this.jsonEditor.getValue();
-      },
-      isJsonString(str) {
-        try {
-          if (typeof JSON.parse(str) == "object") {
-            return true;
-          }
-        } catch (e) {}
-        return false;
-      },
-    },
-  };
-</script>
-
-<style scoped>
-  .json-editor {
-    position: relative;
-    height: 100%;
-  }
-
-  .json-editor >>> .CodeMirror {
-    height: auto;
-    min-height: calc(100vh - 220px);
-  }
-
-  .json-editor >>> .CodeMirror-scroll {
-    min-height: calc(100vh - 220px);
-  }
-
-  .json-editor >>> .cm-s-rubyblue span.cm-string {
-    color: #f08047;
-  }
-
-  .json-editor >>> .cm-s-rubyblue .CodeMirror-gutters {
-    padding-right: 10px;
-
-    /* background: transparent; */
-    border-right: 1px solid #fff;
-  }
-
-  .json-editor >>> .cm-s-rubyblue.CodeMirror {
-    /* background: #08233e; */
-    color: white;
-  }
-</style>

src/router/index.js

@@ -238,16 +238,6 @@ export const asyncRoutes = [
         component: () => import("@/views/vab/card/index"),
         meta: { title: "卡片", permissions: ["admin"] },
       },
-
-      {
-        path: "betterScroll",
-        name: "BetterScroll",
-        component: () => import("@/views/vab/betterScroll/index"),
-        meta: {
-          title: "滚动侦测",
-          permissions: ["admin"],
-        },
-      },
       {
         path: "verify",
         name: "Verify",
@@ -349,12 +339,6 @@ export const asyncRoutes = [
         meta: { title: "图像拖拽比对", permissions: ["admin"] },
       },
       {
-        path: "codeGenerator",
-        name: "CodeGenerator",
-        component: () => import("@/views/vab/codeGenerator/index"),
-        meta: { title: "代码生成机", permissions: ["admin"] },
-      },
-      {
         path: "markdown",
         name: "Markdown",
         component: () => import("@/views/vab/markdown/index"),

src/views/vab/codeGenerator/components/TableEditor.vue

@@ -1,37 +0,0 @@
-<template>
-  <div>
-    <div slot="header" class="clearfix" style="margin-bottom: 15px">
-      <el-button type="primary" @click="prettierJSON">生成表格</el-button>
-    </div>
-    <json-editor v-model="value" @change="prettierNewJSON" />
-  </div>
-</template>
-
-<script>
-  import JsonEditor from "@/components/JsonEditor/index";
-
-  const jsonData =
-    '{"code": 200, "msg": "操作成功", "pageNo": 1, "pageSize": 10, "totalPages": 4, "totalCount": 238, "data": [{"id": "", "title": "", "status": "", "author": "", "datetime": "", "pageViews": "", "img": "", "switch": ""}]}';
-
-  export default {
-    components: { JsonEditor },
-    data() {
-      return {
-        value: JSON.parse(jsonData),
-      };
-    },
-    computed: {},
-    created() {
-      this.prettierJSON();
-    },
-
-    methods: {
-      prettierJSON() {
-        this.$emit("change", jsonData);
-      },
-      prettierNewJSON(jsonData) {
-        this.$emit("change", jsonData);
-      },
-    },
-  };
-</script>

src/views/vab/codeGenerator/components/TableExhibition.vue

@@ -1,81 +0,0 @@
-<template>
-  <div class="app-container">
-    <TableExhibitionQuery :headers="headers" />
-    <el-row>
-      <el-col :xs="24" :sm="24" :md="6" :lg="6" :xl="6">
-        <TableExhibitionHeader :headers.sync="headers" />
-      </el-col>
-      <el-col :xs="24" :sm="24" :md="18" :lg="18" :xl="18">
-        <TableExhibitionBody :headers="headers" :list="list" />
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-  import TableExhibitionBody from "./TableExhibitionBody";
-  import TableExhibitionQuery from "./TableExhibitionQuery";
-  import TableExhibitionHeader from "./TableExhibitionHeader";
-  import { genTableSnippet } from "./snippetTable.js";
-
-  export default {
-    components: {
-      TableExhibitionBody,
-      TableExhibitionHeader,
-      TableExhibitionQuery,
-    },
-    props: {
-      tableData: {
-        type: Object,
-        default: () => {
-          return {};
-        },
-      },
-    },
-    data() {
-      return {
-        list: [],
-        code: "",
-        headers: [],
-        query: {
-          limit: 20,
-          cursor: 1,
-        },
-        total: 0,
-      };
-    },
-    watch: {
-      tableData: {
-        handler(val) {
-          this.list = val.data && val.data.slice(0, 3);
-          if (this.list) {
-            this.headers = Object.keys(this.list[0]).map((item) => {
-              // opt 为需要对 字段的操作，''空就不操作，'time' 处理时间，'template' 将字段放在template 里面，方便后续操作
-              return {
-                value: this.list[0][item],
-                key: item,
-                label: item,
-                show: true,
-                opt: "",
-                query: false,
-              };
-            });
-          }
-        },
-        immediate: true,
-      },
-      headers: {
-        handler(val) {
-          this.code = genTableSnippet(val, this.getTableAPI);
-          this.$store.dispatch("table/setTableCode", this.code);
-        },
-        deep: true,
-      },
-    },
-    created() {},
-    methods: {
-      editdata() {},
-      test(val) {},
-    },
-  };
-</script>

src/views/vab/codeGenerator/components/TableExhibitionBody.vue

@@ -1,59 +0,0 @@
-<template>
-  <div>
-    <el-table :key="table_key" :data="list" @header-click="test">
-      <template v-for="header in headers">
-        <el-table-column
-          v-if="header.show"
-          :key="header.key"
-          show-overflow-tooltip
-          :label="header.label"
-          align="center"
-        >
-          <template #default="{ row }">
-            {{ row[header.key] }}
-          </template>
-        </el-table-column>
-      </template>
-    </el-table>
-    <el-pagination
-      background
-      layout="total, sizes, prev, pager, next, jumper"
-      :total="1000"
-    ></el-pagination>
-  </div>
-</template>
-
-<script>
-  export default {
-    props: {
-      list: {
-        type: null,
-        required: true,
-      },
-      headers: {
-        type: Array,
-        required: true,
-      },
-    },
-    data() {
-      return {
-        query: {
-          limit: 20,
-          cursor: 1,
-        },
-        table_key: 0,
-        total: 0,
-      };
-    },
-    watch: {
-      headers() {
-        this.table_key++;
-      },
-    },
-    created() {},
-    methods: {
-      editdata() {},
-      test(val) {},
-    },
-  };
-</script>

src/views/vab/codeGenerator/components/TableExhibitionHeader.vue

@@ -1,119 +0,0 @@
-<template>
-  <div class="table-header">
-    <draggable
-      v-model="tableHeaders"
-      group="people"
-      @change="set"
-      @end="drag = false"
-      @start="drag = true"
-    >
-      <div v-for="header in tableHeaders" :key="header.key">
-        <el-popover placement="right" trigger="focus">
-          <el-tooltip
-            :content="`该字段${
-              header.opt === '' ? '未' : ''
-            }置于template标签内，置于template方便自定义`"
-            class="item"
-            effect="dark"
-            placement="top-start"
-          >
-            <el-button
-              v-if="header.opt === ''"
-              @click="opt(header, 'template')"
-            >
-              {{ header.opt ? "点击关闭自定义" : "点击开启自定义" }}
-            </el-button>
-            <el-button v-else @click="opt(header, '')">
-              {{ header.opt ? "点击关闭自定义" : "点击开启自定义" }}
-            </el-button>
-          </el-tooltip>
-          <el-tooltip
-            :content="`该字段在表格中${header.show ? '显示' : '隐藏'}`"
-            class="item"
-            effect="dark"
-            placement="top-start"
-          >
-            <el-button @click="hide(header)">
-              {{ header.show ? "点击隐藏字段" : "点击显示字段" }}
-            </el-button>
-          </el-tooltip>
-          <div slot="reference" class="table-header-card">
-            <el-tag>{{ header.key }}对应的标题名称</el-tag>
-            <div>
-              <el-input
-                v-model="header.label"
-                :placeholder="header.label + '对应的字段名称'"
-              />
-            </div>
-          </div>
-        </el-popover>
-      </div>
-    </draggable>
-  </div>
-</template>
-
-<script>
-  import draggable from "vuedraggable";
-
-  export default {
-    components: {
-      draggable,
-    },
-    props: {
-      headers: {
-        type: Array,
-        required: true,
-      },
-    },
-    data() {
-      return {
-        tableHeaders: this.headers,
-      };
-    },
-    watch: {
-      headers(val) {
-        this.tableHeaders = val;
-      },
-    },
-    methods: {
-      set() {
-        this.$emit("update:headers", this.tableHeaders);
-      },
-      show(header) {
-        header.show = true;
-      },
-      hide(header) {
-        header.show = !header.show;
-      },
-      opt(header, opt) {
-        header.opt = opt;
-      },
-      query(header, query) {
-        header.query = query;
-      },
-    },
-  };
-</script>
-<style scoped>
-  .table-header-card {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 10px;
-    margin-right: 10px;
-    margin-bottom: 10px;
-    margin-left: 0;
-    border: 1px solid #dcdfe6;
-    border-radius: 4px;
-  }
-
-  .table-header >>> .el-input__inner {
-    border: none;
-    border-bottom: 1px solid #9e9e9e;
-    border-radius: 0;
-  }
-
-  .el-popover {
-    min-width: 100px !important;
-  }
-</style>

src/views/vab/codeGenerator/components/TableExhibitionQuery.vue

@@ -1,82 +0,0 @@
-<template>
-  <div class="table-query">
-    <div>
-      <el-button type="primary" @click="openCodeDialog">查看代码</el-button>
-      <el-button type="primary" @click="handleClipboard(srcTableCode, $event)">
-        复制代码
-      </el-button>
-    </div>
-    <el-dialog destroy-on-close title="查看代码" :visible.sync="dialogVisible">
-      <textarea v-show="false" ref="code" v-model="srcTableCode"></textarea>
-
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="dialogVisible = false">取 消</el-button>
-        <el-button
-          type="primary"
-          @click="closeCodeDialog(srcTableCode, $event)"
-        >
-          复制代码
-        </el-button>
-      </span>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-  import { mapGetters } from "vuex";
-  import clipboard from "@/utils/clipboard";
-  import CodeMirror from "codemirror";
-
-  export default {
-    props: {
-      headers: {
-        type: Array,
-        required: true,
-      },
-    },
-    data() {
-      return {
-        dialogVisible: false,
-      };
-    },
-    computed: {
-      ...mapGetters({ srcTableCode: "table/srcTableCode" }),
-    },
-    methods: {
-      handleClipboard(text, event) {
-        clipboard(text, event);
-      },
-      openCodeDialog() {
-        this.dialogVisible = true;
-        setTimeout(() => {
-          CodeMirror.fromTextArea(this.$refs.code, {
-            lineNumbers: true,
-            gutters: ["CodeMirror-lint-markers"],
-            theme: "rubyblue",
-            autoRefresh: true,
-            lint: true,
-          });
-        }, 0);
-      },
-      closeCodeDialog(text, event) {
-        this.handleClipboard(text, event);
-        this.dialogVisible = false;
-      },
-    },
-  };
-</script>
-
-<style lang="scss" scoped>
-  .table-query {
-    display: flex;
-    justify-content: flex-end;
-    height: 45px;
-
-    ::v-deep {
-      .CodeMirror {
-        height: auto;
-        min-height: calc(100vh - 420px);
-      }
-    }
-  }
-</style>

src/views/vab/codeGenerator/components/snippetTable.js

@@ -1,154 +0,0 @@
-import { genTableColumnSnippet } from "./snippetTableColumn";
-
-export const genTableSnippet = (headers = "getList") => {
-  return `<template>
-  <div class="改成你的组件名-container">
-    <vab-query-form>
-      <vab-query-form-left-panel :span="12">
-        <el-button icon="el-icon-plus" type="primary">添加</el-button>
-        <el-button icon="el-icon-edit" type="warning">修改</el-button>
-        <el-button
-          icon="el-icon-delete"
-          type="danger"
-          @click="handleDelete"
-        >批量删除
-        </el-button
-        >
-      </vab-query-form-left-panel>
-      <vab-query-form-right-panel :span="12">
-        <el-form :inline="true" :model="queryForm" @submit.native.prevent>
-          <el-form-item>
-            <el-input
-              v-model.trim="queryForm.${headers[0].key}"
-              placeholder="请输入查询条件"
-              clearable
-            />
-          </el-form-item>
-          <el-form-item>
-            <el-button
-              icon="el-icon-search"
-              type="primary"
-              @click="queryData"
-            >查询
-            </el-button
-            >
-          </el-form-item>
-        </el-form>
-      </vab-query-form-right-panel>
-    </vab-query-form>
-
-    <el-table
-      v-loading="listLoading"
-      :height="height"
-      :data="list"
-      :element-loading-text="elementLoadingText"
-      @selection-change="setSelectRows"
-    >
-      <el-table-column show-overflow-tooltip type="selection"></el-table-column>
-      ${genTableColumnSnippet(headers)}
-      <el-table-column show-overflow-tooltip label="操作" width="200">
-        <template #default="{row}">
-          <el-button type="text" @click="editList(row)"
-          >编辑
-          </el-button
-          >
-          <el-button type="text" @click="tableDelete(row)"
-          >删除
-          </el-button
-          >
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-pagination
-      :background="background"
-      :current-page="queryForm.pageNo"
-      :page-size="queryForm.pageSize"
-      :layout="layout"
-      :total="total"
-      @size-change="handleSizeChange"
-      @current-change="handleCurrentChange"
-    ></el-pagination>
-  </div>
-</template>
-
-<script>
-
-  import { getList } from "@/api/table";
-
-  export default {
-    name: "这里会报错,记住,你的view名称与文件夹名称相同不要忘了首字母大写,且唯一",
-    data() {
-      return {
-        list: null,
-        listLoading: true,
-        layout: "total, sizes, prev, pager, next, jumper",
-        total: 0,
-        background: true,
-        height: 0,
-        selectRows: "",
-        elementLoadingText: "正在加载...",
-        queryForm: {
-          pageNo: 1,
-          pageSize: 10,
-          ${headers[0].key} : "",
-    }
-    };
-    },
-    created() {
-      this.fetchData();
-      this.height = this.$baseTableHeight(1);
-    },
-    methods: {
-      setSelectRows(val) {
-        this.selectRows = val;
-      },
-      editList(row) {
-      },
-      handleDelete() {
-        if (this.selectRows.length > 0) {
-          const ids = this.selectRows.map(item => item.id).join();
-          this.$baseConfirm(
-            "你确定要删除选中项吗",
-            null,
-            () => {
-              alert(ids);
-            },
-            () => {
-              alert("点击了取消");
-            },
-          );
-        } else {
-          this.$baseMessage("未选中任何行", "error");
-          return false;
-        }
-      },
-      tableDelete(row) {
-        alert(row.id);
-      },
-      handleSizeChange(val) {
-        this.queryForm.pageSize = val;
-        this.fetchData();
-      },
-      handleCurrentChange(val) {
-        this.queryForm.pageNo = val;
-        this.fetchData();
-      },
-      queryData() {
-        this.queryForm.pageNo = 1;
-        this.fetchData();
-      },
-    async  fetchData() {
-        this.listLoading = true;
-        const { data, totalCount }= await getList(this.queryForm);
-        this.list = data;
-        this.total = totalCount;
-        setTimeout(() => {
-          this.listLoading = false;
-        }, 300);
-      },
-    },
-  };
-</script>
-<style lang="scss" scoped></style>
-`;
-};

src/views/vab/codeGenerator/components/snippetTableColumn.js

@@ -1,40 +0,0 @@
-const timeFieldNeedHandle = {
-  created_at: true,
-  create_time: true,
-  updated_at: true,
-  update_time: true,
-  start_time: true,
-  end_time: true,
-};
-const genTableColumnSnippetSimple = (key, label) => {
-  return `<el-table-column show-overflow-tooltip prop="${key}" label="${label}"/>`;
-};
-
-const genTabeleColumnSinppetTemplate = (key, label) => {
-  let val = "";
-  if (timeFieldNeedHandle[key]) {
-    val = `parseTime(row.${key})`;
-  } else {
-    val = `row.${key}`;
-  }
-  return `<el-table-column show-overflow-tooltip label="${label}">
-          <template #default={row}>
-            {{ ${val} }}
-          </template>
-        </el-table-column>`;
-};
-
-export const genTableColumnSnippet = (headers) => {
-  return headers
-    .filter((header) => {
-      return header.show;
-    })
-    .map((header) => {
-      if (timeFieldNeedHandle[header.key] || header.opt === "template") {
-        return genTabeleColumnSinppetTemplate(header.key, header.label);
-      } else {
-        return genTableColumnSnippetSimple(header.key, header.label);
-      }
-    })
-    .join("\n      ");
-};

src/views/vab/codeGenerator/index.vue

@@ -1,36 +0,0 @@
-<template>
-  <div class="code-generator-container">
-    <el-row :gutter="20">
-      <el-col :xs="24" :sm="24" :md="4" :lg="6" :xl="6">
-        <TableEditor @change="setTableData" />
-      </el-col>
-      <el-col :xs="24" :sm="24" :md="20" :lg="18" :xl="18">
-        <TableExhibition :table-data="tableData" />
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-  import TableEditor from "./components/TableEditor";
-  import TableExhibition from "./components/TableExhibition";
-
-  export default {
-    name: "Index",
-    components: {
-      TableEditor,
-      TableExhibition,
-    },
-    data() {
-      return {
-        tableData: {},
-        getTableAPI: "",
-      };
-    },
-    methods: {
-      setTableData(val) {
-        this.tableData = JSON.parse(val);
-      },
-    },
-  };
-</script>

src/views/vab/permissions/index.vue

@@ -109,9 +109,6 @@
           </el-table-column>
         </el-table>
       </el-col>
-      <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
-        <json-editor :value="res"></json-editor>
-      </el-col>
     </el-row>
   </div>
 </template>
@@ -120,13 +117,9 @@
   import { mapGetters } from "vuex";
   import { tokenTableName } from "@/config/settings";
   import { getRouterList } from "@/api/router";
-  import JsonEditor from "@/components/JsonEditor";
 
   export default {
     name: "Permissions",
-    components: {
-      JsonEditor,
-    },
     data() {
       return {
         form: {