7d51013f8daad07a3a3a8b1d544ad9d3.json 45 KB

1
  1. {"remainingRequest":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\src\\pages\\setting\\systemOutInterface\\index.vue?vue&type=style&index=0&id=370e8140&lang=scss&scoped=true","dependencies":[{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\src\\pages\\setting\\systemOutInterface\\index.vue","mtime":1761185180190},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\css-loader\\index.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\sass-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQoucmVzZXQgew0KICBtYXJnaW4tbGVmdDogMTBweDsNCn0NCi5jYXJkLXRyZWUgew0KICBoZWlnaHQ6IDcycHg7DQogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7DQogIG92ZXJmbG93LXg6IHNjcm9sbDsgLyog6K6+572u5rqi5Ye65rua5YqoICovDQogIHdoaXRlLXNwYWNlOiBub3dyYXA7DQogIG92ZXJmbG93LXk6IGhpZGRlbjsNCiAgLyog6ZqQ6JeP5rua5Yqo5p2hICovDQogIHNjcm9sbGJhci13aWR0aDogbm9uZTsgLyogZmlyZWZveCAqLw0KICAtbXMtb3ZlcmZsb3ctc3R5bGU6IG5vbmU7IC8qIElFIDEwKyAqLw0KfQ0KLmNhcmQtdHJlZTo6LXdlYmtpdC1zY3JvbGxiYXIgew0KICBkaXNwbGF5OiBub25lOyAvKiBDaHJvbWUgU2FmYXJpICovDQp9DQoubWFpbiB7DQogIHdpZHRoOiAxMDAlOw0KICBkaXNwbGF5OiBmbGV4Ow0KICAubWFpbi1idG4gew0KICB9DQogIC5jYXJkLXRyZWUgew0KICAgIHdpZHRoOiAyNzBweDsNCiAgICBoZWlnaHQ6IGNhbGMoMTAwdmggLSAxMTVweCk7DQogICAgb3ZlcmZsb3cteTogc2Nyb2xsOw0KICB9DQogIDo6di1kZWVwIC50cmVlIHsNCiAgICAudHJlZS1saXN0IHsNCiAgICAgIG1hcmdpbi1sZWZ0OiAxMHB4Ow0KICAgIH0NCiAgICAudnRsLWNhcmV0IHsNCiAgICAgIHBhZGRpbmctcmlnaHQ6IDJweDsNCiAgICB9DQogICAgLnJlcS1tZXRob2Qgew0KICAgICAgZGlzcGxheTogYmxvY2s7DQogICAgICBwYWRkaW5nOiAwcHggMnB4Ow0KICAgICAgZm9udC1zaXplOiAxMnB4Ow0KICAgICAgbWFyZ2luLXJpZ2h0OiA1cHg7DQogICAgICBib3JkZXItcmFkaXVzOiA0cHg7DQoNCiAgICAgIHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7DQogICAgfQ0KICAgIC50cmVlLW5vZGUgew0KICAgICAgZGlzcGxheTogZmxleDsNCiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47DQogICAgICBjdXJzb3I6IHBvaW50ZXI7DQoNCiAgICAgIHBhZGRpbmc6IDNweCA3cHggM3B4IDA7DQogICAgfQ0KICAgIC5ub2RlIHsNCiAgICAgIHBhZGRpbmc6IDdweCAycHggN3B4IDBweDsNCiAgICB9DQogICAgLm9wZW4gew0KICAgICAgZm9udC13ZWlnaHQ6IDUwMDsNCiAgICAgIGNvbG9yOiAjMzMzOw0KICAgIH0NCiAgfQ0KICA6OnYtZGVlcCAudnRsLW5vZGUtbWFpbiAudnRsLW9wZXJhdGlvbiB7DQogICAgcG9zaXRpb246IGFic29sdXRlOw0KICAgIHJpZ2h0OiAyMHB4Ow0KICB9DQogIDo6di1kZWVwIC52dGwtbm9kZS1jb250ZW50IHsNCiAgICB3aWR0aDogMTAwJTsNCiAgfQ0KICAucG9wLW1lbnUgew0KICAgIGRpc3BsYXk6IGZsZXg7DQogICAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuOw0KICB9DQogIDo6di1kZWVwIC52dGwtbm9kZS1jb250ZW50IC5hZGQgew0KICAgIGRpc3BsYXk6IG5vbmU7DQogICAgbWFyZ2luLXJpZ2h0OiAxMHB4Ow0KICB9DQogIDo6di1kZWVwIC52dGwtbm9kZS1jb250ZW50OmhvdmVyIC5hZGQgew0KICAgIGRpc3BsYXk6IGZsZXg7DQogICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7DQogICAgYWxpZ24taXRlbXM6IGNlbnRlcjsNCiAgICBib3JkZXItcmFkaXVzOiA1MCU7DQogICAgd2lkdGg6IDIwcHg7DQogICAgaGVpZ2h0OiAyMHB4Ow0KICB9DQogIDo6di1kZWVwIC52dGwtbm9kZS1jb250ZW50OmhvdmVyIC5hZGQ6aG92ZXIgew0KICAgIGJhY2tncm91bmQtY29sb3I6ICNmZmY7DQogICAgLnBvcC1tZW51IHsNCiAgICAgIGZvbnQtc2l6ZTogMTZweDsNCiAgICB9DQogIH0NCiAgOjp2LWRlZXAgLnZ0bC1ub2RlLW1haW4gew0KICAgIHBhZGRpbmc6IDA7DQogIH0NCiAgOjp2LWRlZXAgLmxpbmUxIHsNCiAgICBkaXNwbGF5OiB0YWJsZS1jYXB0aW9uOw0KICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7DQogICAgd2lkdGg6IDEyMHB4Ow0KICAgIG92ZXJmbG93OiBoaWRkZW47DQogICAgdGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7DQogIH0NCiAgOjp2LWRlZXAgLml2dS1mb3JtLWl0ZW0gew0KICAgIG1hcmdpbi1ib3R0b206IDEwcHg7DQogIH0NCiAgLnJpZ2h0LWNhcmQgew0KICAgIGZsZXg6IDE7DQogICAgbWF4LWhlaWdodDogY2FsYygxMDB2aCAtIDExNXB4KTsNCiAgICBvdmVyZmxvdy15OiBzY3JvbGw7DQogIH0NCiAgLmRhdGEgew0KICAgIGZsZXg6IDE7DQogICAgLnJlcS1tZXRob2Qgew0KICAgICAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTsNCiAgICAgIGJvcmRlci1yYWRpdXM6IDRweDsNCiAgICAgIGNvbG9yOiAjZmZmOw0KICAgICAgcGFkZGluZzogM3B4IDdweDsNCiAgICB9DQogICAgLmVpZHQtc3ViIHsNCiAgICAgIGRpc3BsYXk6IGZsZXg7DQogICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47DQogICAgICAubmFtZSB7DQogICAgICAgIGZvbnQtc2l6ZTogMjBweDsNCiAgICAgICAgZm9udC13ZWlnaHQ6IDUwMDsNCiAgICAgIH0NCiAgICB9DQogICAgLnRpdGxlIHsNCiAgICAgIGZvbnQtc2l6ZTogMTZweDsNCiAgICAgIGZvbnQtd2VpZ2h0OiA1MDA7DQogICAgICBtYXJnaW4tYm90dG9tOiAxNXB4Ow0KICAgIH0NCiAgICAucGVyVzIwIHsNCiAgICAgIHdpZHRoOiA1MDBweDsNCiAgICB9DQogICAgLnRleHQtYXJlYSB7DQogICAgICB3aGl0ZS1zcGFjZTogcHJlLXdyYXA7DQogICAgICB3b3JkLWJyZWFrOiBicmVhay13b3JkOw0KICAgIH0NCiAgfQ0KICA6OnYtZGVlcCAuaXZ1LXRyZWUtdGl0bGUgew0KICAgIHdpZHRoOiAxMDAlICFpbXBvcnRhbnQ7DQogIH0NCiAgOjp2LWRlZXAgLnZ0bC10cmVlLW1hcmdpbiB7DQogICAgbWFyZ2luLWxlZnQ6IDVweDsNCiAgfQ0KICA6OnYtZGVlcCAuaXZ1LWJ0bi1pY29uLW9ubHkuaXZ1LWJ0bi1zbWFsbCB7DQogICAgd2lkdGg6IDI4cHg7DQogIH0NCiAgLm5vdGhpbmcgew0KICAgIGRpc3BsYXk6IGZsZXg7DQogICAgYWxpZ24taXRlbXM6IGNlbnRlcjsNCiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsNCiAgICBtaW4taGVpZ2h0OiA4MDBweDsNCiAgICAuYm94OmhvdmVyIHsNCiAgICAgIGJvcmRlcjogMXB4IHNvbGlkIHBpbms7DQogICAgfQ0KICAgIC5ib3ggew0KICAgICAgZGlzcGxheTogZmxleDsNCiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsNCiAgICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47DQogICAgICB3aWR0aDogMTUwcHg7DQogICAgICBoZWlnaHQ6IDIwMHB4Ow0KICAgICAgbWFyZ2luOiAwIDIwcHg7DQogICAgICBib3JkZXItcmFkaXVzOiAxMHB4Ow0KICAgICAgY3Vyc29yOiBwb2ludGVyOw0KICAgICAgb3ZlcmZsb3c6IGhpZGRlbjsNCiAgICAgIGJvcmRlcjogMXB4IHNvbGlkICNmZmY7DQogICAgICAuaWNvbiB7DQogICAgICAgIGRpc3BsYXk6IGZsZXg7DQogICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyOw0KICAgICAgICB3aWR0aDogMTAwJTsNCiAgICAgICAgaGVpZ2h0OiAxNTBweDsNCiAgICAgICAgZm9udC1zaXplOiA0MHB4Ow0KICAgICAgICBjb2xvcjogIzJkOGNmMDsNCiAgICAgICAgYmFja2dyb3VuZDogI2YxZjFmMTsNCiAgICAgIH0NCiAgICAgIC50ZXh0IHsNCiAgICAgICAgd2lkdGg6IDEwMCU7DQogICAgICAgIGhlaWdodDogNTBweDsNCiAgICAgICAgYmFja2dyb3VuZDogI2RkZDsNCiAgICAgICAgdGV4dC1hbGlnbjogY2VudGVyOw0KICAgICAgICBsaW5lLWhlaWdodDogNTBweDsNCiAgICAgICAgZm9udC1zaXplOiAxNHB4Ow0KICAgICAgICBmb250LXdlaWdodDogNTAwOw0KICAgICAgfQ0KICAgIH0NCiAgfQ0KfQ0K"},{"version":3,"sources":["index.vue"],"names":[],"mappings":";AAw3BA;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","file":"index.vue","sourceRoot":"src/pages/setting/systemOutInterface","sourcesContent":["<template>\r\n <div>\r\n <div class=\"main\">\r\n <el-card :bordered=\"false\" shadow=\"never\" class=\"ivu-mt mr20 card-tree\">\r\n <div class=\"tree\">\r\n <div class=\"main-btn\">\r\n <el-button class=\"mb10\" type=\"primary\" v-db-click @click=\"clickMenu(4)\" long>新增分类</el-button>\r\n </div>\r\n\r\n <vue-tree-list\r\n class=\"tree-list\"\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=\"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=\"{ node: slotProps.model.method, open: formValidate.id == slotProps.model.id }\"\r\n v-db-click\r\n @click.stop=\"onClick(slotProps.model)\"\r\n >\r\n <span class=\"\" :class=\"{ open: formValidate.id == slotProps.model.id }\">{{\r\n slotProps.model.name\r\n }}</span>\r\n <el-dropdown\r\n size=\"small\"\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-arrow-down el-icon--right\"></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 <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.id == formValidate.id ? '500' : '500',\r\n }\"\r\n >{{ slotProps.model.method == 'delete' ? 'DEL' : 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 </el-card>\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 type=\"primary\" class=\"submission mr20\" 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 mr20\"\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=\"100px\"\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-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=\"url\">\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.url\"\r\n placeholder=\"请输入\"\r\n />\r\n <span v-else>{{ formValidate.url || '' }}</span>\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=\"xTable\"\r\n row-id=\"id\"\r\n :print-config=\"{}\"\r\n :export-config=\"{}\"\r\n v-loading=\"loading\"\r\n :tree-config=\"{ transform: true, rowField: 'id', parentField: 'parentId' }\"\r\n :data=\"formValidate.request_params\"\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'\"\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\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=\"返回参数:\">\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.return_params\"\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'\"\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 label=\"返回数据示例:\" prop=\"return_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.return_example\"\r\n placeholder=\"请输入\"\r\n />\r\n <span v-else class=\"text-area\">{{ formValidate.return_example || '' }}</span>\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 :print-config=\"{}\"\r\n :export-config=\"{}\"\r\n :loading=\"loading\"\r\n :tree-config=\"{ transform: true, 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=\"分组名称\" @on-ok=\"asyncOK\">\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-dialog :visible.sync=\"debuggingModal\" :title=\"formValidate.name\" width=\"1000px\">\r\n <debugging\r\n v-if=\"debuggingModal\"\r\n :formValidate=\"formValidate\"\r\n :typeList=\"typeList\"\r\n :requestTypeList=\"requestTypeList\"\r\n />\r\n </el-dialog>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport { interfaceList, interfaceDet, interfaceSave, interfaceEditName, interfaceDel } from '@/api/systemOutAccount';\r\nimport { VueTreeList, Tree, TreeNode } from 'vue-tree-list';\r\nimport debugging from './debugging.vue';\r\nimport { mapState } from 'vuex';\r\nimport { storageStatusApi } from '@api/setting';\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\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: '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 value: 'options',\r\n label: 'options',\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 };\r\n },\r\n watch: {\r\n ['formValidate.method']: {\r\n deep: true,\r\n handler(newVal, oldVal) {\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 == 'DELETE') {\r\n this.methodColor = '#f93e3e';\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 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 == '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 interfaceList()\r\n .then((res) => {\r\n res.data[0].expand = false;\r\n this.treeData = new Tree(res.data);\r\n\r\n if (res.data.length) {\r\n if (res.data[0].children.length) {\r\n this.onClick(res.data[0].children[0]);\r\n }\r\n }\r\n })\r\n .catch((err) => {\r\n this.$message.error(err);\r\n });\r\n },\r\n onClick(params) {\r\n if (params.method) {\r\n this.isEdit = false;\r\n interfaceDet(params.id)\r\n .then((res) => {\r\n this.formValidate = res.data;\r\n })\r\n .catch((err) => {\r\n this.$message.error(err);\r\n });\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.url) {\r\n return this.$message.warning('请输入调用方式');\r\n }\r\n this.formValidate.request_params = await this.$refs.xTable.getTableData().tableData;\r\n this.formValidate.return_params = await this.$refs.resTable.getTableData().tableData;\r\n this.formValidate.error_code = await this.$refs.codeTable.getTableData().tableData;\r\n await interfaceSave(this.formValidate)\r\n .then((res) => {\r\n this.isEdit = false;\r\n this.$message.success(res.msg);\r\n this.getInterfaceList();\r\n })\r\n .catch((err) => {\r\n this.$message.error(err);\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.pid = 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.id = params ? params.id : 0;\r\n this.nameModal = true;\r\n } else if (name == 3) {\r\n this.onDel(params);\r\n } else if (name == 4) {\r\n this.add();\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 interfaceSave(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);\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 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 interfaceDel(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);\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);\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.card-tree {\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 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.main {\r\n width: 100%;\r\n display: flex;\r\n .main-btn {\r\n }\r\n .card-tree {\r\n width: 270px;\r\n height: calc(100vh - 115px);\r\n overflow-y: scroll;\r\n }\r\n ::v-deep .tree {\r\n .tree-list {\r\n margin-left: 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: 12px;\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 padding: 7px 2px 7px 0px;\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: 20px;\r\n height: 20px;\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: 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 max-height: calc(100vh - 115px);\r\n overflow-y: scroll;\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: 5px;\r\n }\r\n ::v-deep .ivu-btn-icon-only.ivu-btn-small {\r\n width: 28px;\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"]}]}