Skip to content

V
vipSupplier
Commit 4014b65a by chuzhixin
Options

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

parent bf1f2053
Showing with 0 additions and 764 deletions
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 deleted 100644 → 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 deleted 100644 → 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 deleted 100644 → 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 deleted 100644 → 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 deleted 100644 → 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 deleted 100644 → 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 deleted 100644 → 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 deleted 100644 → 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 deleted 100644 → 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: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment