| 1 |
- {"remainingRequest":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\front\\item\\zyAdmin\\src\\pages\\system\\backendRouting\\index.vue?vue&type=style&index=0&id=c20c42be&lang=scss&scoped=true","dependencies":[{"path":"D:\\front\\item\\zyAdmin\\src\\pages\\system\\backendRouting\\index.vue","mtime":1761614939067},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\css-loader\\index.js","mtime":1761614929364},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1761614937403},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\postcss-loader\\src\\index.js","mtime":1761614935133},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\sass-loader\\dist\\cjs.js","mtime":1761614936391},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1761614927801},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js","mtime":1761614937402}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQoucmVzZXQgew0KICBtYXJnaW4tbGVmdDogMTBweDsNCn0NCi5iLXItMSB7DQogIGJvcmRlci1yaWdodDogMXB4IHNvbGlkICNmMmYyZjI7DQp9DQouY2FyZC10cmVlIHsNCiAgYmFja2dyb3VuZDogI2ZmZjsNCiAgaGVpZ2h0OiA3MnB4Ow0KICBib3gtc2l6aW5nOiBib3JkZXItYm94Ow0KICBvdmVyZmxvdy14OiBzY3JvbGw7IC8qIOiuvue9rua6ouWHuua7muWKqCAqLw0KICB3aGl0ZS1zcGFjZTogbm93cmFwOw0KICBvdmVyZmxvdy15OiBoaWRkZW47DQogIC8qIOmakOiXj+a7muWKqOadoSAqLw0KICBib3JkZXItcmFkaXVzOiA0cHg7DQogIHNjcm9sbGJhci13aWR0aDogbm9uZTsgLyogZmlyZWZveCAqLw0KICAtbXMtb3ZlcmZsb3ctc3R5bGU6IG5vbmU7IC8qIElFIDEwKyAqLw0KfQ0KLmNhcmQtdHJlZTo6LXdlYmtpdC1zY3JvbGxiYXIgew0KICBkaXNwbGF5OiBub25lOyAvKiBDaHJvbWUgU2FmYXJpICovDQp9DQo6OnYtZGVlcCAuZWwtdGFic19faXRlbSB7DQogIGhlaWdodDogNTRweCAhaW1wb3J0YW50Ow0KICBsaW5lLWhlaWdodDogNTRweCAhaW1wb3J0YW50Ow0KfQ0KLnRhYnMgew0KICBiYWNrZ3JvdW5kOiAjZmZmOw0KICBwYWRkaW5nLWxlZnQ6IDIwcHg7DQogIGJvcmRlci1yYWRpdXM6IDVweCA1cHggMCAwOw0KfQ0KLm1haW4gew0KICB3aWR0aDogMTAwJTsNCiAgZGlzcGxheTogZmxleDsNCiAgcGFkZGluZy1ib3R0b206IDE2cHg7DQogIGJhY2tncm91bmQ6ICNmZmY7DQogIGJvcmRlci1yYWRpdXM6IDZweDsNCiAgLm1haW4tYnRuIHsNCiAgICBkaXNwbGF5OiBmbGV4Ow0KICAgIHBvc2l0aW9uOiBzdGlja3k7DQogICAgcGFkZGluZzogMHB4IDVweCAwIDE1cHg7DQogICAgd2lkdGg6IDEwMCU7DQogICAgYmFja2dyb3VuZDogI2ZmZjsNCiAgICB0b3A6IDBweDsNCiAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDI1NSwgMjU1LCAyNTUsIDAuNik7DQogICAgYmFja2Ryb3AtZmlsdGVyOiBibHVyKDRweCk7DQogICAgei1pbmRleDogOTk7DQogIH0NCiAgLmNhcmQtdHJlZSB7DQogICAgd2lkdGg6IDI5MHB4Ow0KICAgIGhlaWdodDogY2FsYygxMDB2aCAtIDIwNXB4KTsNCiAgICBvdmVyZmxvdy15OiBzY3JvbGw7DQogIH0NCiAgOjp2LWRlZXAgLnRyZWUgew0KICAgIC50cmVlLWxpc3Qgew0KICAgICAgbWFyZ2luLWxlZnQ6IDEwcHg7DQogICAgICBwYWRkaW5nOiAwIDE1cHg7DQogICAgICBtYXJnaW4tdG9wOiAxMHB4Ow0KICAgIH0NCiAgICAudnRsLWNhcmV0IHsNCiAgICAgIHBhZGRpbmctcmlnaHQ6IDJweDsNCiAgICB9DQogICAgLnJlcS1tZXRob2Qgew0KICAgICAgZGlzcGxheTogYmxvY2s7DQogICAgICBwYWRkaW5nOiAwcHggMnB4Ow0KICAgICAgZm9udC1zaXplOiAxM3B4Ow0KICAgICAgbGluZS1oZWlnaHQ6IDEzcHg7DQogICAgICBtYXJnaW4tcmlnaHQ6IDVweDsNCiAgICAgIGJvcmRlci1yYWRpdXM6IDRweDsNCg0KICAgICAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTsNCiAgICB9DQogICAgLnRyZWUtbm9kZSB7DQogICAgICBkaXNwbGF5OiBmbGV4Ow0KICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjsNCiAgICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjsNCiAgICAgIGN1cnNvcjogcG9pbnRlcjsNCg0KICAgICAgcGFkZGluZzogM3B4IDdweCAzcHggMDsNCiAgICB9DQogICAgLm5vZGUgew0KICAgIH0NCiAgICAub3BlbiB7DQogICAgICBmb250LXdlaWdodDogNTAwOw0KICAgICAgY29sb3I6ICMzMzM7DQogICAgfQ0KICB9DQogIDo6di1kZWVwIC52dGwtbm9kZS1tYWluIC52dGwtb3BlcmF0aW9uIHsNCiAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgcmlnaHQ6IDIwcHg7DQogIH0NCiAgOjp2LWRlZXAgLnZ0bC1ub2RlLWNvbnRlbnQgew0KICAgIHdpZHRoOiAxMDAlOw0KICB9DQogIC5wb3AtbWVudSB7DQogICAgZGlzcGxheTogZmxleDsNCiAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47DQogIH0NCiAgOjp2LWRlZXAgLnZ0bC1ub2RlLWNvbnRlbnQgLmFkZCB7DQogICAgZGlzcGxheTogbm9uZTsNCiAgICBtYXJnaW4tcmlnaHQ6IDEwcHg7DQogIH0NCiAgOjp2LWRlZXAgLnZ0bC1ub2RlLWNvbnRlbnQ6aG92ZXIgLmFkZCB7DQogICAgZGlzcGxheTogZmxleDsNCiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsNCiAgICBhbGlnbi1pdGVtczogY2VudGVyOw0KICAgIGJvcmRlci1yYWRpdXM6IDUwJTsNCiAgICB3aWR0aDogMThweDsNCiAgICBoZWlnaHQ6IDE4cHg7DQogIH0NCiAgOjp2LWRlZXAgLnZ0bC1ub2RlLWNvbnRlbnQ6aG92ZXIgLmFkZDpob3ZlciB7DQogICAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjsNCiAgICAucG9wLW1lbnUgew0KICAgICAgZm9udC1zaXplOiAxNnB4Ow0KICAgIH0NCiAgfQ0KICA6OnYtZGVlcCAudnRsLW5vZGUtbWFpbiB7DQogICAgcGFkZGluZzogM3B4IDA7DQogIH0NCiAgOjp2LWRlZXAgLmxpbmUxIHsNCiAgICBkaXNwbGF5OiB0YWJsZS1jYXB0aW9uOw0KICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7DQogICAgd2lkdGg6IDEyMHB4Ow0KICAgIG92ZXJmbG93OiBoaWRkZW47DQogICAgdGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7DQogIH0NCiAgOjp2LWRlZXAgLml2dS1mb3JtLWl0ZW0gew0KICAgIG1hcmdpbi1ib3R0b206IDEwcHg7DQogIH0NCiAgLnJpZ2h0LWNhcmQgew0KICAgIGZsZXg6IDE7DQogICAgOjp2LWRlZXAgLmVsLWNhcmRfX2JvZHkgew0KICAgICAgbWF4LWhlaWdodDogY2FsYygxMDB2aCAtIDIwNXB4KTsNCiAgICAgIG92ZXJmbG93LXk6IHNjcm9sbDsNCiAgICAgIHBhZGRpbmctYm90dG9tOiAxNnB4Ow0KICAgIH0NCiAgICA6OnYtZGVlcCAuZWwtZm9ybS1pdGVtLS1zbWFsbC5lbC1mb3JtLWl0ZW0gew0KICAgICAgbWFyZ2luLWJvdHRvbTogNnB4Ow0KICAgIH0NCiAgfQ0KICAuZGF0YSB7DQogICAgZmxleDogMTsNCiAgICAucmVxLW1ldGhvZCB7DQogICAgICB0ZXh0LXRyYW5zZm9ybTogdXBwZXJjYXNlOw0KICAgICAgYm9yZGVyLXJhZGl1czogNHB4Ow0KICAgICAgY29sb3I6ICNmZmY7DQogICAgICBwYWRkaW5nOiAzcHggN3B4Ow0KICAgIH0NCiAgICAuZWlkdC1zdWIgew0KICAgICAgZGlzcGxheTogZmxleDsNCiAgICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjsNCiAgICAgIC5uYW1lIHsNCiAgICAgICAgZm9udC1zaXplOiAyMHB4Ow0KICAgICAgICBmb250LXdlaWdodDogNTAwOw0KICAgICAgfQ0KICAgIH0NCiAgICAudGl0bGUgew0KICAgICAgZm9udC1zaXplOiAxNnB4Ow0KICAgICAgZm9udC13ZWlnaHQ6IDUwMDsNCiAgICAgIG1hcmdpbi1ib3R0b206IDE1cHg7DQogICAgfQ0KICAgIC5wZXJXMjAgew0KICAgICAgd2lkdGg6IDUwMHB4Ow0KICAgIH0NCiAgICAudGV4dC1hcmVhIHsNCiAgICAgIHdoaXRlLXNwYWNlOiBwcmUtd3JhcDsNCiAgICAgIHdvcmQtYnJlYWs6IGJyZWFrLXdvcmQ7DQogICAgfQ0KICB9DQogIDo6di1kZWVwIC5pdnUtdHJlZS10aXRsZSB7DQogICAgd2lkdGg6IDEwMCUgIWltcG9ydGFudDsNCiAgfQ0KICA6OnYtZGVlcCAudnRsLXRyZWUtbWFyZ2luIHsNCiAgICBtYXJnaW4tbGVmdDogMTVweDsNCiAgfQ0KICA6OnYtZGVlcCAuaXZ1LWJ0bi1pY29uLW9ubHkuaXZ1LWJ0bi1zbWFsbCB7DQogICAgd2lkdGg6IDI4cHg7DQogIH0NCiAgOjp2LWRlZXAgLnRyZWUtbm9kZSA+IHNwYW4gew0KICAgIGZvbnQtc2l6ZTogMTRweDsNCiAgfQ0KICA6OnYtZGVlcCAudHJlZS1ub2RlLm5vZGUgPiBzcGFuIHsNCiAgICBmb250LXNpemU6IDEzcHg7DQogIH0NCiAgLm5vdGhpbmcgew0KICAgIGRpc3BsYXk6IGZsZXg7DQogICAgYWxpZ24taXRlbXM6IGNlbnRlcjsNCiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsNCiAgICBtaW4taGVpZ2h0OiA4MDBweDsNCiAgICAuYm94OmhvdmVyIHsNCiAgICAgIGJvcmRlcjogMXB4IHNvbGlkIHBpbms7DQogICAgfQ0KICAgIC5ib3ggew0KICAgICAgZGlzcGxheTogZmxleDsNCiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsNCiAgICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47DQogICAgICB3aWR0aDogMTUwcHg7DQogICAgICBoZWlnaHQ6IDIwMHB4Ow0KICAgICAgbWFyZ2luOiAwIDIwcHg7DQogICAgICBib3JkZXItcmFkaXVzOiAxMHB4Ow0KICAgICAgY3Vyc29yOiBwb2ludGVyOw0KICAgICAgb3ZlcmZsb3c6IGhpZGRlbjsNCiAgICAgIGJvcmRlcjogMXB4IHNvbGlkICNmZmY7DQogICAgICAuaWNvbiB7DQogICAgICAgIGRpc3BsYXk6IGZsZXg7DQogICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyOw0KICAgICAgICB3aWR0aDogMTAwJTsNCiAgICAgICAgaGVpZ2h0OiAxNTBweDsNCiAgICAgICAgZm9udC1zaXplOiA0MHB4Ow0KICAgICAgICBjb2xvcjogIzJkOGNmMDsNCiAgICAgICAgYmFja2dyb3VuZDogI2YxZjFmMTsNCiAgICAgIH0NCiAgICAgIC50ZXh0IHsNCiAgICAgICAgd2lkdGg6IDEwMCU7DQogICAgICAgIGhlaWdodDogNTBweDsNCiAgICAgICAgYmFja2dyb3VuZDogI2RkZDsNCiAgICAgICAgdGV4dC1hbGlnbjogY2VudGVyOw0KICAgICAgICBsaW5lLWhlaWdodDogNTBweDsNCiAgICAgICAgZm9udC1zaXplOiAxNHB4Ow0KICAgICAgICBmb250LXdlaWdodDogNTAwOw0KICAgICAgfQ0KICAgIH0NCiAgfQ0KfQ0K"},{"version":3,"sources":["index.vue"],"names":[],"mappings":";AAirCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/pages/system/backendRouting","sourcesContent":["<template>\r\n <div>\r\n <div class=\"tabs\">\r\n <el-tabs v-model=\"apiType\">\r\n <el-tab-pane label=\"管理端接口\" name=\"adminapi\"></el-tab-pane>\r\n <el-tab-pane label=\"用户端接口\" name=\"api\"></el-tab-pane>\r\n <el-tab-pane label=\"客服端接口\" name=\"kefuapi\"></el-tab-pane>\r\n <el-tab-pane label=\"对外接口\" name=\"outapi\"></el-tab-pane>\r\n </el-tabs>\r\n </div>\r\n <div class=\"main\" v-loading=\"winLoading\">\r\n <div class=\"ivu-mt card-tree b-r-1\">\r\n <div class=\"tree\">\r\n <div class=\"main-btn\">\r\n <el-button class=\"mb5\" style=\"flex: 1\" type=\"primary\" v-db-click @click=\"clickMenu(4)\" long\r\n >新增分类</el-button\r\n >\r\n <el-button class=\"mb5 mr10\" type=\"success\" v-db-click @click=\"syncRoute()\">同步</el-button>\r\n </div>\r\n\r\n <vue-tree-list\r\n class=\"tree-list\"\r\n ref=\"treeList\"\r\n @change-name=\"onChangeName\"\r\n @delete-node=\"onDel\"\r\n :model=\"treeData\"\r\n default-tree-node-name=\"默认文件夹\"\r\n default-leaf-node-name=\"默认接口名\"\r\n v-bind:default-expanded=\"false\"\r\n :expand-only-one=\"true\"\r\n >\r\n <template v-slot:leafNameDisplay=\"slotProps\">\r\n <div></div>\r\n <div\r\n class=\"tree-node\"\r\n :class=\"{\r\n node: slotProps.model.method,\r\n open: formValidate.path == slotProps.model.path && formValidate.method == slotProps.model.method,\r\n }\"\r\n v-db-click\r\n @click.stop=\"onClick(slotProps.model)\"\r\n >\r\n <span\r\n class=\"\"\r\n :class=\"{\r\n open: formValidate.path == slotProps.model.path && formValidate.method == slotProps.model.method,\r\n }\"\r\n >{{ slotProps.model.name }}</span\r\n >\r\n <el-dropdown\r\n size=\"small\"\r\n transfer\r\n @command=\"\r\n (name) => {\r\n clickMenu(name, slotProps.model);\r\n }\r\n \"\r\n >\r\n <span class=\"el-dropdown-link\">\r\n <i class=\"el-icon-more\"></i>\r\n </span>\r\n <template slot=\"dropdown\">\r\n <el-dropdown-menu>\r\n <el-dropdown-item command=\"1\" v-if=\"!slotProps.model.method\">新增接口</el-dropdown-item>\r\n <el-dropdown-item command=\"2\" v-if=\"!slotProps.model.method\">编辑分类名</el-dropdown-item>\r\n <el-dropdown-item command=\"3\">删除</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n </div>\r\n </template>\r\n <!-- 新建文件夹 -->\r\n\r\n <span class=\"icon\" slot=\"addTreeNodeIcon\"></span>\r\n <span class=\"icon\" slot=\"addLeafNodeIcon\"></span>\r\n <span class=\"icon\" slot=\"editNodeIcon\"></span>\r\n <span class=\"icon\" slot=\"delNodeIcon\"></span>\r\n <template v-slot:treeNodeIcon=\"slotProps\">\r\n <span\r\n v-if=\"slotProps.model.method\"\r\n class=\"req-method\"\r\n :style=\"{\r\n color: methodsColor(slotProps.model.method),\r\n 'font-weight': slotProps.model.pid == formValidate.pid ? '500' : '500',\r\n }\"\r\n >{{ slotProps.model.method }}</span\r\n >\r\n\r\n <!-- <span v-if=\"slotProps.model.method\"></span> -->\r\n </template>\r\n </vue-tree-list>\r\n </div>\r\n </div>\r\n <el-card :bordered=\"false\" shadow=\"never\" class=\"ivu-mt right-card\">\r\n <div class=\"data\">\r\n <div class=\"eidt-sub\">\r\n <div class=\"name\">\r\n {{ formValidate.name }}\r\n </div>\r\n <div>\r\n <el-button class=\"submission\" v-db-click @click=\"debugging()\">调试</el-button>\r\n <el-button\r\n v-if=\"formValidate.id\"\r\n type=\"primary\"\r\n class=\"submission\"\r\n v-db-click\r\n @click=\"isEdit = !isEdit\"\r\n >{{ isEdit ? '取消' : '编辑' }}</el-button\r\n >\r\n <el-button\r\n v-if=\"isEdit\"\r\n type=\"primary\"\r\n class=\"submission\"\r\n v-db-click\r\n @click=\"handleSubmit('formValidate')\"\r\n >保存</el-button\r\n >\r\n </div>\r\n </div>\r\n <el-form\r\n class=\"formValidate mt20\"\r\n ref=\"formValidate\"\r\n :rules=\"ruleValidate\"\r\n :model=\"formValidate\"\r\n label-width=\"120px\"\r\n :label-position=\"labelPosition\"\r\n @submit.native.prevent\r\n >\r\n <el-row :gutter=\"24\">\r\n <el-col :span=\"24\">\r\n <div class=\"title\">接口信息</div>\r\n <el-form-item label=\"接口名称：\" prop=\"name\">\r\n <el-input\r\n v-if=\"isEdit\"\r\n class=\"perW20\"\r\n type=\"text\"\r\n :rows=\"4\"\r\n v-model.trim=\"formValidate.name\"\r\n placeholder=\"请输入\"\r\n />\r\n <span v-else>{{ formValidate.name || '' }}</span>\r\n </el-form-item>\r\n <el-form-item label=\"请求类型：\" prop=\"name\">\r\n <el-select v-if=\"isEdit\" v-model=\"formValidate.method\" style=\"width: 120px\">\r\n <el-option\r\n v-for=\"(item, index) in requestTypeList\"\r\n :key=\"index\"\r\n :value=\"item.value\"\r\n :label=\"item.label\"\r\n ></el-option>\r\n </el-select>\r\n <span v-else class=\"req-method\" :style=\"'background-color:' + methodColor\">{{\r\n formValidate.method || ''\r\n }}</span>\r\n </el-form-item>\r\n <el-form-item label=\"功能描述：\" prop=\"name\">\r\n <el-input\r\n v-if=\"isEdit\"\r\n class=\"perW20\"\r\n type=\"textarea\"\r\n :rows=\"4\"\r\n v-model.trim=\"formValidate.describe\"\r\n placeholder=\"请输入\"\r\n />\r\n <span v-else class=\"text-area\">{{ formValidate.describe || '--' }}</span>\r\n </el-form-item>\r\n <el-form-item label=\"所属分类：\" prop=\"name\" v-if=\"isEdit\">\r\n <el-cascader\r\n v-model=\"formValidate.cate_id\"\r\n size=\"small\"\r\n :options=\"formValidate.cate_tree\"\r\n :props=\"{ checkStrictly: true, multiple: false, emitPath: false, value: 'id', label: 'name' }\"\r\n clearable\r\n ></el-cascader>\r\n </el-form-item>\r\n <el-form-item label=\"是否公共：\" prop=\"name\">\r\n <el-switch v-if=\"isEdit\" v-model=\"formValidate.type\" :active-value=\"1\" :inactive-value=\"0\">\r\n </el-switch>\r\n <span v-else class=\"text-area\">{{ formValidate.type ? '是' : '否' }}</span>\r\n </el-form-item>\r\n </el-col>\r\n </el-row>\r\n <el-row :gutter=\"24\">\r\n <el-col :span=\"24\">\r\n <div class=\"title\">调用方式</div>\r\n <el-form-item label=\"路由地址：\" prop=\"path\">\r\n <span>{{ formValidate.path || '' }}</span>\r\n </el-form-item>\r\n <el-form-item label=\"文件地址：\" prop=\"path\">\r\n <span>{{ formValidate.file_path || '' }}</span>\r\n </el-form-item>\r\n <el-form-item label=\"方法名：\" prop=\"path\">\r\n <span>{{ formValidate.action || '' }}</span>\r\n </el-form-item>\r\n <el-form-item label=\"header参数：\">\r\n <vxe-table\r\n resizable\r\n show-overflow\r\n keep-source\r\n ref=\"headTable\"\r\n row-id=\"id\"\r\n :print-config=\"{}\"\r\n :export-config=\"{}\"\r\n :loading=\"loading\"\r\n :tree-config=\"{ transform: true, rowField: 'id', parentField: 'parentId' }\"\r\n :data=\"formValidate.header\"\r\n >\r\n <!-- <vxe-column type=\"checkbox\" width=\"60\"></vxe-column> -->\r\n <vxe-column field=\"attribute\" width=\"300\" title=\"属性\" tree-node :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.attribute\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.attribute || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"type\" title=\"类型\" width=\"200\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <!-- <vxe-select v-if=\"isEdit\" v-model=\"row.type\" type=\"text\" :optionGroups=\"typeList\"></vxe-select> -->\r\n <vxe-select v-if=\"isEdit\" v-model=\"row.type\" transfer>\r\n <vxe-option\r\n v-for=\"item in typeList\"\r\n :key=\"item.value\"\r\n :value=\"item.value\"\r\n :label=\"item.label\"\r\n ></vxe-option>\r\n </vxe-select>\r\n <span v-else>{{ row.type || '' }}</span>\r\n\r\n <!-- <vxe-select v-model=\"row.type\">\r\n\t\t\t\t\t\t\t\t\t <vxe-option v-for=\"num in 12\" :key=\"num\" :value=\"num\" :label=\"num\"></vxe-option>\r\n\t\t\t\t\t\t\t\t\t </vxe-select> -->\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"must\" title=\"必填\" width=\"100\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-checkbox\r\n v-if=\"isEdit\"\r\n v-model=\"row.must\"\r\n :unchecked-value=\"'0'\"\r\n :checked-value=\"'1'\"\r\n ></vxe-checkbox>\r\n <span v-else>{{ row.must == '1' ? '是' : '否' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"trip\" title=\"说明\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.trip\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.trip || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column title=\"操作\" width=\"200\" v-if=\"isEdit\">\r\n <template #default=\"{ row }\">\r\n <vxe-button\r\n type=\"text\"\r\n v-if=\"row.type === 'array' || row.type === 'object'\"\r\n status=\"primary\"\r\n v-db-click\r\n @click=\"insertRow(row, 'headTable')\"\r\n >插入</vxe-button\r\n >\r\n <vxe-button type=\"text\" status=\"primary\" v-db-click @click=\"removeRow(row, 'headTable')\"\r\n >删除</vxe-button\r\n >\r\n </template>\r\n </vxe-column>\r\n </vxe-table>\r\n\r\n <el-button class=\"mt10\" v-if=\"isEdit\" type=\"primary\" v-db-click @click=\"insertEvent('headTable')\"\r\n >添加参数</el-button\r\n >\r\n </el-form-item>\r\n <el-form-item label=\"query参数：\">\r\n <vxe-table\r\n resizable\r\n show-overflow\r\n keep-source\r\n ref=\"xTable\"\r\n row-id=\"id\"\r\n :print-config=\"{}\"\r\n :export-config=\"{}\"\r\n :loading=\"loading\"\r\n :tree-config=\"{ transform: true, rowField: 'id', parentField: 'parentId' }\"\r\n :data=\"formValidate.query\"\r\n >\r\n <vxe-column field=\"attribute\" width=\"300\" title=\"属性\" tree-node :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.attribute\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.attribute || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"type\" title=\"类型\" width=\"200\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-select v-if=\"isEdit\" v-model=\"row.type\" transfer>\r\n <vxe-option\r\n v-for=\"item in typeList\"\r\n :key=\"item.value\"\r\n :value=\"item.value\"\r\n :label=\"item.label\"\r\n ></vxe-option>\r\n </vxe-select>\r\n <span v-else>{{ row.type || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"must\" title=\"必填\" width=\"100\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-checkbox\r\n v-if=\"isEdit\"\r\n v-model=\"row.must\"\r\n :unchecked-value=\"'0'\"\r\n :checked-value=\"'1'\"\r\n ></vxe-checkbox>\r\n <span v-else>{{ row.must == '1' ? '是' : '否' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"trip\" title=\"说明\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.trip\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.trip || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column title=\"操作\" width=\"200\" v-if=\"isEdit\">\r\n <template #default=\"{ row }\">\r\n <vxe-button\r\n type=\"text\"\r\n v-if=\"row.type === 'array' || row.type === 'object'\"\r\n status=\"primary\"\r\n v-db-click\r\n @click=\"insertRow(row, 'xTable')\"\r\n >插入</vxe-button\r\n >\r\n <vxe-button type=\"text\" status=\"primary\" v-db-click @click=\"removeRow(row, 'xTable')\"\r\n >删除</vxe-button\r\n >\r\n </template>\r\n </vxe-column>\r\n </vxe-table>\r\n <el-button class=\"mt10\" v-if=\"isEdit\" type=\"primary\" v-db-click @click=\"insertEvent('xTable')\"\r\n >添加参数</el-button\r\n >\r\n </el-form-item>\r\n <el-form-item label=\"body参数：\">\r\n <vxe-table\r\n resizable\r\n show-overflow\r\n keep-source\r\n ref=\"bodyTable\"\r\n row-id=\"id\"\r\n :print-config=\"{}\"\r\n :export-config=\"{}\"\r\n :loading=\"loading\"\r\n :tree-config=\"{ transform: true, rowField: 'id', parentField: 'parentId' }\"\r\n :data=\"formValidate.request\"\r\n >\r\n <!-- <vxe-column type=\"checkbox\" width=\"60\"></vxe-column> -->\r\n <vxe-column field=\"attribute\" width=\"300\" title=\"属性\" tree-node :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.attribute\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.attribute || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"type\" title=\"类型\" width=\"200\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <!-- <vxe-select v-if=\"isEdit\" v-model=\"row.type\" type=\"text\" :optionGroups=\"typeList\"></vxe-select> -->\r\n <vxe-select v-if=\"isEdit\" v-model=\"row.type\" transfer>\r\n <vxe-option\r\n v-for=\"item in typeList\"\r\n :key=\"item.value\"\r\n :value=\"item.value\"\r\n :label=\"item.label\"\r\n ></vxe-option>\r\n </vxe-select>\r\n <span v-else>{{ row.type || '' }}</span>\r\n\r\n <!-- <vxe-select v-model=\"row.type\">\r\n <vxe-option v-for=\"num in 12\" :key=\"num\" :value=\"num\" :label=\"num\"></vxe-option>\r\n </vxe-select> -->\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"must\" title=\"必填\" width=\"100\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-checkbox\r\n v-if=\"isEdit\"\r\n v-model=\"row.must\"\r\n :unchecked-value=\"'0'\"\r\n :checked-value=\"'1'\"\r\n ></vxe-checkbox>\r\n <span v-else>{{ row.must == '1' ? '是' : '否' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"trip\" title=\"说明\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.trip\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.trip || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column title=\"操作\" width=\"200\" v-if=\"isEdit\">\r\n <template #default=\"{ row }\">\r\n <vxe-button\r\n type=\"text\"\r\n v-if=\"row.type === 'array' || row.type === 'object'\"\r\n status=\"primary\"\r\n v-db-click\r\n @click=\"insertRow(row, 'bodyTable')\"\r\n >插入</vxe-button\r\n >\r\n <vxe-button type=\"text\" status=\"primary\" v-db-click @click=\"removeRow(row, 'bodyTable')\"\r\n >删除</vxe-button\r\n >\r\n </template>\r\n </vxe-column>\r\n </vxe-table>\r\n\r\n <el-button class=\"mt10\" v-if=\"isEdit\" type=\"primary\" v-db-click @click=\"insertEvent('bodyTable')\"\r\n >添加参数</el-button\r\n >\r\n </el-form-item>\r\n <el-form-item label=\"返回参数：\">\r\n <vxe-table\r\n resizable\r\n show-overflow\r\n keep-source\r\n ref=\"resTable\"\r\n row-id=\"id\"\r\n :print-config=\"{}\"\r\n :export-config=\"{}\"\r\n :loading=\"loading\"\r\n :tree-config=\"{ transform: true, rowField: 'id', parentField: 'parentId' }\"\r\n :data=\"formValidate.response\"\r\n >\r\n <!-- <vxe-column type=\"checkbox\" width=\"60\"></vxe-column> -->\r\n <vxe-column field=\"attribute\" title=\"属性\" width=\"300\" tree-node :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.attribute\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.attribute || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"type\" title=\"类型\" width=\"200\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-select v-if=\"isEdit\" v-model=\"row.type\" transfer>\r\n <vxe-option\r\n v-for=\"item in typeList\"\r\n :key=\"item.value\"\r\n :value=\"item.value\"\r\n :label=\"item.label\"\r\n ></vxe-option>\r\n </vxe-select>\r\n <span v-else>{{ row.type || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <!-- <vxe-column field=\"type\" title=\"必填\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-checkbox v-model=\"row.must\" :unchecked-value=\"0\" :checked-value=\"1\"></vxe-checkbox\r\n >{{ row.must }}\r\n </template>\r\n </vxe-column> -->\r\n <vxe-column field=\"trip\" title=\"说明\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.trip\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.trip || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column title=\"操作\" width=\"200\" v-if=\"isEdit\">\r\n <template #default=\"{ row }\">\r\n <vxe-button\r\n type=\"text\"\r\n v-if=\"row.type === 'array' || row.type === 'object'\"\r\n status=\"primary\"\r\n v-db-click\r\n @click=\"insertRow(row, 'resTable')\"\r\n >插入</vxe-button\r\n >\r\n <vxe-button type=\"text\" status=\"primary\" v-db-click @click=\"removeRow(row, 'resTable')\"\r\n >删除</vxe-button\r\n >\r\n </template>\r\n </vxe-column>\r\n </vxe-table>\r\n <el-button class=\"mt10\" v-if=\"isEdit\" type=\"primary\" v-db-click @click=\"insertEvent('resTable')\"\r\n >添加参数</el-button\r\n >\r\n </el-form-item>\r\n </el-col>\r\n </el-row>\r\n <el-row :gutter=\"24\">\r\n <el-col :span=\"24\">\r\n <div class=\"title\">调用示例</div>\r\n <!-- <el-form-item label=\"请求数据示例：\" prop=\"request_example\">\r\n <el-input\r\n v-if=\"isEdit\"\r\n class=\"perW20\"\r\n type=\"textarea\"\r\n :rows=\"4\"\r\n v-model.trim=\"formValidate.request_example\"\r\n placeholder=\"请输入\"\r\n />\r\n <span v-else class=\"text-area\">{{ formValidate.request_example || '' }}</span>\r\n </el-form-item> -->\r\n <el-form-item v-if=\"formValidate.response_example\" label=\"返回数据示例：\" prop=\"response_example\">\r\n <el-collapse v-for=\"(item, index) in formValidate.response_example\" accordion :key=\"index\">\r\n <el-collapse-item>\r\n <template slot=\"title\">\r\n {{ item.name || '' }}\r\n </template>\r\n <el-input\r\n v-if=\"isEdit\"\r\n class=\"perW20\"\r\n type=\"textarea\"\r\n :rows=\"4\"\r\n v-model.trim=\"item.data\"\r\n placeholder=\"请输入\"\r\n />\r\n <span v-else class=\"text-area\">{{ item.data || '' }}</span>\r\n </el-collapse-item>\r\n </el-collapse>\r\n </el-form-item>\r\n <el-form-item label=\"错误码：\">\r\n <vxe-table\r\n resizable\r\n show-overflow\r\n keep-source\r\n ref=\"codeTable\"\r\n row-id=\"id\"\r\n is-tree-view\r\n :print-config=\"{}\"\r\n :export-config=\"{}\"\r\n :loading=\"loading\"\r\n :tree-config=\"{ rowField: 'id', parentField: 'parentId' }\"\r\n :data=\"formValidate.error_code\"\r\n >\r\n <!-- <vxe-column type=\"checkbox\" width=\"60\"></vxe-column> -->\r\n <vxe-column field=\"code\" title=\"错误码\" tree-node :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.code\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.code || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"value\" title=\"错误码取值\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.value\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.value || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column field=\"solution\" title=\"解决方案\" :edit-render=\"{}\">\r\n <template #default=\"{ row }\">\r\n <vxe-input v-if=\"isEdit\" v-model=\"row.solution\" type=\"text\"></vxe-input>\r\n <span v-else>{{ row.solution || '' }}</span>\r\n </template>\r\n </vxe-column>\r\n <vxe-column title=\"操作\" v-if=\"isEdit\">\r\n <template #default=\"{ row }\">\r\n <vxe-button type=\"text\" status=\"primary\" v-db-click @click=\"removeRow(row, 'codeTable')\"\r\n >删除</vxe-button\r\n >\r\n </template>\r\n </vxe-column>\r\n </vxe-table>\r\n <el-button class=\"mt10\" v-if=\"isEdit\" type=\"primary\" v-db-click @click=\"insertEvent('codeTable')\"\r\n >添加参数</el-button\r\n >\r\n </el-form-item>\r\n </el-col>\r\n </el-row>\r\n <!-- <el-row :gutter=\"24\" >\r\n <el-col :span=\"24\">\r\n <el-form-item>\r\n <el-button type=\"primary\" class=\"submission\" v-db-click @click=\"handleSubmit('formValidate')\">保存</el-button>\r\n </el-form-item>\r\n </el-col>\r\n </el-row> -->\r\n </el-form>\r\n </div>\r\n <!-- <div v-else class=\"nothing\">\r\n <div class=\"box\" v-db-click @click=\"clickMenu(4)\">\r\n <div class=\"icon\">\r\n <Icon type=\"ios-folder\" />\r\n </div>\r\n <div class=\"text\">新建文件</div>\r\n </div>\r\n <div class=\"box\" v-db-click @click=\"clickMenu(1)\">\r\n <div class=\"icon\">\r\n <Icon type=\"logo-linkedin\" />\r\n </div>\r\n <div class=\"text\">新建接口</div>\r\n </div>\r\n </div> -->\r\n </el-card>\r\n </div>\r\n <el-dialog :visible.sync=\"nameModal\" width=\"470px\" title=\"分组名称\">\r\n <label>分组名称：</label>\r\n <el-input v-model=\"value\" placeholder=\"请输入分组名称\" style=\"width: 85%\" />\r\n <span slot=\"footer\" class=\"dialog-footer\">\r\n <el-button v-db-click @click=\"nameModal = false\">取 消</el-button>\r\n <el-button type=\"primary\" v-db-click @click=\"asyncOK\">确 定</el-button>\r\n </span>\r\n </el-dialog>\r\n <el-drawer\r\n :visible.sync=\"debuggingModal\"\r\n :title=\"formValidate.name\"\r\n size=\"70%\"\r\n :wrapperClosable=\"false\"\r\n :loading=\"loading\"\r\n >\r\n <debugging\r\n v-if=\"debuggingModal\"\r\n :formValidate=\"formValidate\"\r\n :typeList=\"intTypeList\"\r\n :requestTypeList=\"requestTypeList\"\r\n :apiType=\"apiType\"\r\n />\r\n </el-drawer>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport {\r\n routeCate,\r\n syncRoute,\r\n routeList,\r\n routeDet,\r\n routeSave,\r\n interfaceEditName,\r\n routeDel,\r\n routeEdit,\r\n routeCateDel,\r\n} from '@/api/systemBackendRouting';\r\nimport { VueTreeList, Tree, TreeNode } from 'vue-tree-list';\r\nimport debugging from './debugging.vue';\r\n\r\nimport { mapState } from 'vuex';\r\nexport default {\r\n name: 'systemOutInterface',\r\n components: {\r\n VueTreeList,\r\n debugging,\r\n },\r\n data() {\r\n return {\r\n value: '',\r\n isEdit: false,\r\n nameModal: false,\r\n debuggingModal: false,\r\n formValidate: {},\r\n grid: {\r\n xl: 7,\r\n lg: 7,\r\n md: 12,\r\n sm: 24,\r\n xs: 24,\r\n },\r\n ruleValidate: {\r\n title: [{ message: '请输入正确的描述 (不能多于200位数)', trigger: 'blur', max: 200 }],\r\n },\r\n loading: false,\r\n intTypeList: [\r\n {\r\n value: 'string',\r\n label: 'String',\r\n },\r\n // {\r\n // value: 'array',\r\n // label: 'Array',\r\n // },\r\n // {\r\n // value: 'object',\r\n // label: 'Object',\r\n // },\r\n {\r\n value: 'number',\r\n label: 'Number',\r\n },\r\n {\r\n value: 'boolean',\r\n label: 'Boolean',\r\n },\r\n {\r\n value: 'null',\r\n label: 'Null',\r\n },\r\n {\r\n value: 'any',\r\n label: 'Any',\r\n },\r\n ],\r\n typeList: [\r\n {\r\n value: 'string',\r\n label: 'String',\r\n },\r\n {\r\n value: 'array',\r\n label: 'Array',\r\n },\r\n {\r\n value: 'object',\r\n label: 'Object',\r\n },\r\n {\r\n value: 'number',\r\n label: 'Number',\r\n },\r\n {\r\n value: 'boolean',\r\n label: 'Boolean',\r\n },\r\n {\r\n value: 'null',\r\n label: 'Null',\r\n },\r\n {\r\n value: 'any',\r\n label: 'Any',\r\n },\r\n ],\r\n requestTypeList: [\r\n {\r\n value: 'GET',\r\n label: 'GET',\r\n },\r\n {\r\n value: 'POST',\r\n label: 'POST',\r\n },\r\n {\r\n value: 'DELETE',\r\n label: 'DELETE',\r\n },\r\n {\r\n value: 'PUT',\r\n label: 'PUT',\r\n },\r\n ],\r\n contextData: null, //左侧导航右键点击是产生的数据对象\r\n treeData: undefined,\r\n buttonProps: {\r\n type: 'default',\r\n size: 'small',\r\n },\r\n methodColor: '#fff',\r\n apiType: 'adminapi',\r\n paramsId: 0,\r\n winLoading: false,\r\n };\r\n },\r\n watch: {\r\n ['formValidate.method']: {\r\n deep: true,\r\n handler(newVal, oldVal) {\r\n if (newVal) {\r\n let method = newVal.toUpperCase();\r\n if (method == 'GET') {\r\n this.methodColor = '#61affe';\r\n } else if (method == 'POST') {\r\n this.methodColor = '#49cc90';\r\n } else if (method == 'PUT') {\r\n this.methodColor = '#fca130';\r\n } else if (method == 'DEL' || method == 'DELETE') {\r\n this.methodColor = '#f93e3e';\r\n }\r\n }\r\n },\r\n },\r\n apiType(newVal) {\r\n if (newVal) {\r\n this.winLoading = true;\r\n this.getInterfaceList('one');\r\n }\r\n },\r\n isEdit(newVal) {\r\n if (newVal) {\r\n this.formValidate.response_example.map((e) => {\r\n e.data = JSON.stringify(e.data);\r\n });\r\n } else {\r\n this.formValidate.response_example.map((e) => {\r\n e.data = JSON.parse(e.data);\r\n });\r\n }\r\n },\r\n },\r\n computed: {\r\n ...mapState('media', ['isMobile']),\r\n labelWidth() {\r\n return this.isMobile ? undefined : '50px';\r\n },\r\n labelPosition() {\r\n return this.isMobile ? 'top' : 'right';\r\n },\r\n },\r\n created() {\r\n this.getInterfaceList('one');\r\n },\r\n methods: {\r\n syncRoute() {\r\n this.$msgbox({\r\n title: '立即同步',\r\n message: '同步之后，路由文件中新增的接口添加到接口列表中，路由文件中删除的路由会同步的在接口列表中删除',\r\n showCancelButton: true,\r\n cancelButtonText: '取消',\r\n confirmButtonText: '确定',\r\n iconClass: 'el-icon-warning',\r\n confirmButtonClass: 'btn-custom-cancel',\r\n })\r\n .then(() => {\r\n syncRoute(this.apiType).then((res) => {\r\n this.getInterfaceList('one');\r\n this.$message.success(res.msg);\r\n });\r\n })\r\n .catch(() => {});\r\n },\r\n debugging() {\r\n this.debuggingModal = true;\r\n },\r\n onClicksss(e) {},\r\n methodsColor(newVal) {\r\n let method = newVal.toUpperCase();\r\n if (method == 'GET') {\r\n return '#61affe';\r\n } else if (method == 'POST') {\r\n return '#49cc90';\r\n } else if (method == 'PUT') {\r\n return '#fca130';\r\n } else if (method == 'DEL' || method == 'DELETE') {\r\n return '#f93e3e';\r\n }\r\n },\r\n insertBefore(params) {},\r\n insertAfter(params) {},\r\n moveInto(params) {},\r\n async addTableData() {\r\n const { row: data } = await $table.insertAt(newRow, -1);\r\n await $table.setActiveCell(data, 'name');\r\n },\r\n getInterfaceList(disk_type) {\r\n try {\r\n routeList(this.apiType)\r\n .then((res) => {\r\n if (res.data.length) {\r\n res.data[0].expand = false;\r\n this.treeData = new Tree(res.data);\r\n let i;\r\n this.$nextTick((e) => {\r\n if (disk_type) {\r\n if (\r\n res.data[0].children &&\r\n res.data[0].children[0].children &&\r\n res.data[0].children[0].children.length\r\n ) {\r\n document.querySelectorAll('.vtl-icon-caret-right')[0].click();\r\n document.querySelectorAll('.vtl-icon-caret-right')[1].click();\r\n i = res.data[0].children[0].children[0];\r\n } else {\r\n document.querySelectorAll('.vtl-icon-caret-right')[0].click();\r\n i = res.data[0].children[0];\r\n }\r\n this.onClick(i);\r\n }\r\n });\r\n } else {\r\n // this.$refs.treeList.clear();\r\n this.treeData = new Tree({});\r\n this.formValidate = {};\r\n }\r\n this.winLoading = false;\r\n })\r\n .catch((err) => {\r\n this.winLoading = false;\r\n this.$message.error(err.msg);\r\n });\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n },\r\n onClick(params) {\r\n try {\r\n if (params.method) {\r\n this.isEdit = false;\r\n this.paramsId = params.id;\r\n this.getRoteData(params.id);\r\n }\r\n } catch (error) {}\r\n },\r\n getRoteData(id) {\r\n routeDet(id)\r\n .then((res) => {\r\n this.formValidate = res.data;\r\n })\r\n .catch((err) => {\r\n this.$message.error(err.msg);\r\n });\r\n },\r\n async handleSubmit() {\r\n if (!this.formValidate.name) {\r\n return this.$message.warning('请输入接口名称');\r\n } else if (!this.formValidate.method) {\r\n return this.$message.warning('请选择请求类型');\r\n } else if (!this.formValidate.path) {\r\n return this.$message.warning('请输入路由地址');\r\n }\r\n this.formValidate.request = await this.$refs.bodyTable.getTableData().tableData;\r\n this.formValidate.response = await this.$refs.resTable.getTableData().tableData;\r\n this.formValidate.error_code = await this.$refs.codeTable.getTableData().tableData;\r\n this.formValidate.header = await this.$refs.headTable.getTableData().tableData;\r\n this.formValidate.query = await this.$refs.xTable.getTableData().tableData;\r\n this.formValidate.apiType = this.apiType;\r\n this.formValidate.response_example.map((e) => {\r\n e.data = JSON.parse(e.data);\r\n });\r\n await routeSave(this.formValidate)\r\n .then((res) => {\r\n this.$message.success(res.msg);\r\n this.getRoteData(this.paramsId);\r\n this.isEdit = false;\r\n })\r\n .catch((err) => {\r\n this.$message.error(err.msg);\r\n });\r\n },\r\n async insertEvent(type) {\r\n const $table = this.$refs[type];\r\n let newRow;\r\n if (type == 'xTable') {\r\n newRow = {\r\n attribute: '',\r\n type: '',\r\n must: 0,\r\n trip: '',\r\n };\r\n } else if (type == 'resTable') {\r\n newRow = {\r\n attribute: '',\r\n type: '',\r\n trip: '',\r\n };\r\n } else {\r\n newRow = {\r\n code: '',\r\n value: '',\r\n solution: '',\r\n };\r\n }\r\n // $table.insert(newRow).then(({ row }) => $table.setEditRow(row, -1));\r\n const { row: data } = await $table.insertAt(newRow, -1);\r\n await $table.setActiveCell(data, 'name');\r\n },\r\n async insertRow(currRow, type) {\r\n const $table = this.$refs[type];\r\n // 如果 null 则插入到目标节点顶部\r\n // 如果 -1 则插入到目标节点底部\r\n // 如果 row 则有插入到效的目标节点该行的位置\r\n let record;\r\n if (type == 'xTable') {\r\n record = {\r\n attribute: '',\r\n type: '',\r\n must: 0,\r\n trip: '',\r\n id: Date.now(),\r\n parentId: currRow.id, // 需要指定父节点，自动插入该节点中\r\n };\r\n } else if (type == 'resTable') {\r\n record = {\r\n attribute: '',\r\n type: '',\r\n trip: '',\r\n id: Date.now(),\r\n parentId: currRow.id, // 需要指定父节点，自动插入该节点中\r\n };\r\n } else {\r\n record = {\r\n code: '',\r\n value: '',\r\n solution: '',\r\n id: Date.now(),\r\n parentId: currRow.id, // 需要指定父节点，自动插入该节点中\r\n };\r\n }\r\n const { row: newRow } = await $table.insertAt(record, -1);\r\n await $table.setTreeExpand(currRow, true); // 将父节点展开\r\n await $table.setActiveRow(newRow); // 插入子节点\r\n },\r\n async removeRow(row, type) {\r\n const $table = this.$refs[type];\r\n await $table.remove(row);\r\n },\r\n // 修改名字\r\n add() {\r\n this.value = '';\r\n this.formValidate.id = 0;\r\n this.nameModal = true;\r\n },\r\n // 点击菜单\r\n clickMenu(name, params) {\r\n if (name == 1) {\r\n this.formValidate = {};\r\n this.formValidate.cate_id = params ? params.id : 0;\r\n this.formValidate.id = 0;\r\n this.isEdit = true;\r\n } else if (name == 2) {\r\n // this.value = params.name || '';\r\n // this.formValidate.cate_id = params ? params.id : 0;\r\n // this.nameModal = true;\r\n // this.onEdit(params);\r\n this.$modalForm(routeEdit(params.id, this.apiType)).then(() => this.getInterfaceList());\r\n } else if (name == 3) {\r\n this.onDel(params);\r\n } else if (name == 4) {\r\n // this.add();\r\n this.$modalForm(routeCate(this.apiType)).then(() => this.getInterfaceList());\r\n }\r\n },\r\n\r\n addFac(params) {\r\n this.formValidate = {\r\n id: params ? params.id : 0,\r\n };\r\n this.isEdit = true;\r\n },\r\n asyncOK() {\r\n let data = {\r\n id: this.formValidate.id || 0,\r\n type: 0,\r\n name: this.value,\r\n };\r\n routeSave(data)\r\n .then((res) => {\r\n this.$message.success(res.msg);\r\n this.getInterfaceList();\r\n })\r\n .catch((err) => {\r\n this.$message.error(err.msg);\r\n });\r\n },\r\n //侧边栏右键点击事件\r\n handleContextMenu(data, event, position) {\r\n position.left = Number(position.left.slice(0, -2)) + 75 + 'px';\r\n this.contextData = data;\r\n },\r\n handleContextCreateFolder() {},\r\n handleContextCreateFile() {},\r\n // 自定义显示\r\n renderContent(h, { root, node, data }) {\r\n let that = this;\r\n return h(\r\n 'span',\r\n {\r\n style: {\r\n display: 'inline-block',\r\n width: '100%',\r\n },\r\n },\r\n [\r\n h('span', [\r\n h(resolveComponent('Icon'), {\r\n type: 'ios-paper-outline',\r\n style: {\r\n marginRight: '8px',\r\n },\r\n }),\r\n h('span', data.title),\r\n ]),\r\n h(\r\n 'span',\r\n {\r\n style: {\r\n display: 'inline-block',\r\n float: 'right',\r\n marginRight: '32px',\r\n },\r\n },\r\n [\r\n h(resolveComponent('Button'), {\r\n ...this.buttonProps,\r\n icon: 'ios-add',\r\n style: {\r\n marginRight: '8px',\r\n },\r\n onClick: () => {\r\n this.append(data);\r\n },\r\n }),\r\n h(resolveComponent('Button'), {\r\n ...this.buttonProps,\r\n icon: 'ios-remove',\r\n onClick: () => {\r\n this.remove(root, node, data);\r\n },\r\n }),\r\n ],\r\n ),\r\n ],\r\n );\r\n },\r\n /**\r\n * 侧边栏点击事件\r\n * @param {Object} data\r\n */\r\n clickDir(data, root, node) {\r\n let that = this;\r\n that.navItem = data;\r\n that.pathname = data.pathname;\r\n },\r\n append(data) {\r\n const children = data.children || [];\r\n children.push({\r\n title: 'appended node',\r\n expand: true,\r\n });\r\n this.$set(data, 'children', children);\r\n },\r\n remove(root, node, data) {\r\n const parentKey = root.find((el) => el === node).parent;\r\n const parent = root.find((el) => el.nodeKey === parentKey).node;\r\n const index = parent.children.indexOf(data);\r\n parent.children.splice(index, 1);\r\n },\r\n onMouseOver(root, node, data, e, d) {\r\n console.log(root, node, data);\r\n },\r\n //\r\n onDel(node) {\r\n let method = node.cate_id ? routeDel : routeCateDel;\r\n this.$msgbox({\r\n title: '提示',\r\n message: '删除后无法恢复，请确认后删除！',\r\n showCancelButton: true,\r\n cancelButtonText: '取消',\r\n confirmButtonText: '确定',\r\n iconClass: 'el-icon-warning',\r\n confirmButtonClass: 'btn-custom-cancel',\r\n })\r\n .then(() => {\r\n method(node.id)\r\n .then((res) => {\r\n this.$message.success(res.msg);\r\n node.remove();\r\n })\r\n .catch((err) => {\r\n this.$message.error(err.msg);\r\n });\r\n })\r\n .catch(() => {});\r\n },\r\n\r\n onChangeName(params) {\r\n if (params.eventType == 'blur') {\r\n let data = {\r\n name: params.newName,\r\n id: params.id,\r\n };\r\n interfaceEditName(data)\r\n .then((res) => {\r\n this.$message.success(res.msg);\r\n })\r\n .catch((err) => {\r\n this.$message.error(err.msg);\r\n });\r\n }\r\n },\r\n\r\n onAddNode(params) {\r\n // this.$router.push({\r\n // path: '/admin/setting/system_out_interface/add',\r\n // query: {\r\n // pid: params.pid,\r\n // },\r\n // });\r\n },\r\n\r\n addNode() {\r\n var node = new TreeNode({ name: 'new node', isLeaf: false });\r\n if (!this.data.children) this.data.children = [];\r\n this.data.addChildren(node);\r\n },\r\n\r\n getNewTree() {\r\n var vm = this;\r\n function _dfs(oldNode) {\r\n var newNode = {};\r\n\r\n for (var k in oldNode) {\r\n if (k !== 'children' && k !== 'parent') {\r\n newNode[k] = oldNode[k];\r\n }\r\n }\r\n\r\n if (oldNode.children && oldNode.children.length > 0) {\r\n newNode.children = [];\r\n for (var i = 0, len = oldNode.children.length; i < len; i++) {\r\n newNode.children.push(_dfs(oldNode.children[i]));\r\n }\r\n }\r\n return newNode;\r\n }\r\n\r\n vm.newTree = _dfs(vm.data);\r\n },\r\n },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.reset {\r\n margin-left: 10px;\r\n}\r\n.b-r-1 {\r\n border-right: 1px solid #f2f2f2;\r\n}\r\n.card-tree {\r\n background: #fff;\r\n height: 72px;\r\n box-sizing: border-box;\r\n overflow-x: scroll; /* 设置溢出滚动 */\r\n white-space: nowrap;\r\n overflow-y: hidden;\r\n /* 隐藏滚动条 */\r\n border-radius: 4px;\r\n scrollbar-width: none; /* firefox */\r\n -ms-overflow-style: none; /* IE 10+ */\r\n}\r\n.card-tree::-webkit-scrollbar {\r\n display: none; /* Chrome Safari */\r\n}\r\n::v-deep .el-tabs__item {\r\n height: 54px !important;\r\n line-height: 54px !important;\r\n}\r\n.tabs {\r\n background: #fff;\r\n padding-left: 20px;\r\n border-radius: 5px 5px 0 0;\r\n}\r\n.main {\r\n width: 100%;\r\n display: flex;\r\n padding-bottom: 16px;\r\n background: #fff;\r\n border-radius: 6px;\r\n .main-btn {\r\n display: flex;\r\n position: sticky;\r\n padding: 0px 5px 0 15px;\r\n width: 100%;\r\n background: #fff;\r\n top: 0px;\r\n background-color: rgba(255, 255, 255, 0.6);\r\n backdrop-filter: blur(4px);\r\n z-index: 99;\r\n }\r\n .card-tree {\r\n width: 290px;\r\n height: calc(100vh - 205px);\r\n overflow-y: scroll;\r\n }\r\n ::v-deep .tree {\r\n .tree-list {\r\n margin-left: 10px;\r\n padding: 0 15px;\r\n margin-top: 10px;\r\n }\r\n .vtl-caret {\r\n padding-right: 2px;\r\n }\r\n .req-method {\r\n display: block;\r\n padding: 0px 2px;\r\n font-size: 13px;\r\n line-height: 13px;\r\n margin-right: 5px;\r\n border-radius: 4px;\r\n\r\n text-transform: uppercase;\r\n }\r\n .tree-node {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n cursor: pointer;\r\n\r\n padding: 3px 7px 3px 0;\r\n }\r\n .node {\r\n }\r\n .open {\r\n font-weight: 500;\r\n color: #333;\r\n }\r\n }\r\n ::v-deep .vtl-node-main .vtl-operation {\r\n position: absolute;\r\n right: 20px;\r\n }\r\n ::v-deep .vtl-node-content {\r\n width: 100%;\r\n }\r\n .pop-menu {\r\n display: flex;\r\n justify-content: space-between;\r\n }\r\n ::v-deep .vtl-node-content .add {\r\n display: none;\r\n margin-right: 10px;\r\n }\r\n ::v-deep .vtl-node-content:hover .add {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n border-radius: 50%;\r\n width: 18px;\r\n height: 18px;\r\n }\r\n ::v-deep .vtl-node-content:hover .add:hover {\r\n background-color: #fff;\r\n .pop-menu {\r\n font-size: 16px;\r\n }\r\n }\r\n ::v-deep .vtl-node-main {\r\n padding: 3px 0;\r\n }\r\n ::v-deep .line1 {\r\n display: table-caption;\r\n white-space: nowrap;\r\n width: 120px;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n }\r\n ::v-deep .ivu-form-item {\r\n margin-bottom: 10px;\r\n }\r\n .right-card {\r\n flex: 1;\r\n ::v-deep .el-card__body {\r\n max-height: calc(100vh - 205px);\r\n overflow-y: scroll;\r\n padding-bottom: 16px;\r\n }\r\n ::v-deep .el-form-item--small.el-form-item {\r\n margin-bottom: 6px;\r\n }\r\n }\r\n .data {\r\n flex: 1;\r\n .req-method {\r\n text-transform: uppercase;\r\n border-radius: 4px;\r\n color: #fff;\r\n padding: 3px 7px;\r\n }\r\n .eidt-sub {\r\n display: flex;\r\n justify-content: space-between;\r\n .name {\r\n font-size: 20px;\r\n font-weight: 500;\r\n }\r\n }\r\n .title {\r\n font-size: 16px;\r\n font-weight: 500;\r\n margin-bottom: 15px;\r\n }\r\n .perW20 {\r\n width: 500px;\r\n }\r\n .text-area {\r\n white-space: pre-wrap;\r\n word-break: break-word;\r\n }\r\n }\r\n ::v-deep .ivu-tree-title {\r\n width: 100% !important;\r\n }\r\n ::v-deep .vtl-tree-margin {\r\n margin-left: 15px;\r\n }\r\n ::v-deep .ivu-btn-icon-only.ivu-btn-small {\r\n width: 28px;\r\n }\r\n ::v-deep .tree-node > span {\r\n font-size: 14px;\r\n }\r\n ::v-deep .tree-node.node > span {\r\n font-size: 13px;\r\n }\r\n .nothing {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n min-height: 800px;\r\n .box:hover {\r\n border: 1px solid pink;\r\n }\r\n .box {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-direction: column;\r\n width: 150px;\r\n height: 200px;\r\n margin: 0 20px;\r\n border-radius: 10px;\r\n cursor: pointer;\r\n overflow: hidden;\r\n border: 1px solid #fff;\r\n .icon {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 100%;\r\n height: 150px;\r\n font-size: 40px;\r\n color: #2d8cf0;\r\n background: #f1f1f1;\r\n }\r\n .text {\r\n width: 100%;\r\n height: 50px;\r\n background: #ddd;\r\n text-align: center;\r\n line-height: 50px;\r\n font-size: 14px;\r\n font-weight: 500;\r\n }\r\n }\r\n }\r\n}\r\n</style>\r\n"]}]}
|
