var CloudAdmin = CloudAdmin || {}; CloudAdmin.router = function () { this.currentUrl = ''; this.printer = { pageNotFound: function () { let body = document.querySelector('body'); mdui.JQ(body).empty(); mdui.JQ(body).append(`

404 Page Not Found :(

返回首页 `); }, /** * 内联样式初始化 * * @param {any} next 初始化完成后执行的回调函数 * @param {any} arg 回调函数参数 */ indexInit: function (next, arg) { this.permissionCheck.signStatus.call(this, function () { let body = document.querySelector('body'); body.className = 'mdui-appbar-with-toolbar mdui-theme-primary-blue mdui-theme-accent-light-blue mdui-drawer-body-left mdui-loaded'; mdui.JQ(body).empty(); mdui.JQ(body).append(`
menu CloudSQL Admin Panel
exit_to_app
  • view_list
    数据库列表
  • person
    用户列表
  • info
    关于
  • `); //左侧菜单栏 let leftMenuButton = document.querySelector('span:nth-child(1).mdui-btn.mdui-btn-icon.mdui-ripple.mdui-ripple-white'), mainDrawer = new mdui.Drawer('#main-drawer'); /* leftMenuButton.addEventListener('click', function () { mainDrawer.toggle(); }, false); */ this.handleEvent('click', { onElement: leftMenuButton, withCallback: function () { mainDrawer.toggle(); } }) let databaseListButton = document.querySelector('#main-drawer li:nth-child(1)'); /* databaseListButton.addEventListener('click', function () { window.location.hash = '/index/databaseList'; }, false); */ this.handleEvent('click', { onElement: databaseListButton, withCallback: function () { window.location.hash = '/index/databaseList'; } }) let userListButton = document.querySelector('#main-drawer li:nth-child(2)'); /* userListButton.addEventListener('click', function () { window.location.hash = '/index/userList'; }, false); */ this.handleEvent('click', { onElement: userListButton, withCallback: function () { window.location.hash = '/index/userList'; } }) //退出登录按钮 let signoutButton = document.querySelector('span:nth-child(4).mdui-btn.mdui-btn-icon.mdui-ripple.mdui-ripple-white i.mdui-icon.material-icons'); /* signoutButton.addEventListener('click', function () { this.ajax.get('http://admin.cloudsql.1473.cn/v1/signout', function (response) { if (response.status == 'successed') { mdui.snackbar({ message: response.info }); window.location.hash = response.url; } else { console.log(response.info); console.log(response.error); mdui.snackbar({ message: response.info }); } }) }.bind(this), false); */ this.handleEvent('click', { onElement: signoutButton, withCallback: function () { this.ajax.get('http://admin.cloudsql.1473.cn/v1/signout', function (response) { if (response.status == 'successed') { mdui.snackbar({ message: response.info }); window.location.hash = response.url; } else { console.log(response.info); console.log(response.error); mdui.snackbar({ message: response.info }); } }); } }, this) next.call(this, arg); }); }, /** * 表格生成 * * @param {any} data 表格数据 * @returns DOM */ tableGenerator: function (data) { //Generate tag tr let tr = document.createElement('tr'); data.forEach(function (item, index, array) { let td = document.createElement('td'); if (index + 1 === array.length) { item.forEach(function (_item, _index, _array) { td.appendChild(_item); tr.appendChild(td); }, this); } else { td.innerHTML = item; tr.appendChild(td); } }, this); return tr; }, signin: function () { let html = document.querySelector('html'), body = document.querySelector('body'); html.className = 'index'; body.className = 'mdui-theme-primary-blue mdui-theme-accent-light-blue index'; mdui.JQ(body).empty(); mdui.JQ(body).append(`
    CloudSQL Admin Panel
    登陆 注册

    用户登录

    person
    lock
    `) //验证码刷新逻辑 let captchaImg = document.querySelector('.captcha-row img'); captchaImg.addEventListener('click', function () { this.src = 'http://admin.cloudsql.1473.cn/v1/captcha?' + new Date().getTime(); //加入当前时间以避免缓存 }, false); //登陆逻辑 let submitButton = document.querySelector('.main-button-row button'); submitButton.addEventListener('click', function () { let signInUrl = 'http://admin.cloudsql.1473.cn/v1/signin', userId = document.querySelector('input[name=userid]').value, password = document.querySelector('input[name=password]').value, captchaCode = document.querySelector('input[name=captcha]').value, postData = 'userId=' + userId + '&password=' + password + '&captcha=' + captchaCode; this.ajax.post(signInUrl, postData, function (response) { if (response.status == 'signedin') { window.location.hash = response.url; } else { mdui.snackbar({ message: response.info }); } }) }.bind(this), false) }, signup: function () { let html = document.querySelector('html'), body = document.querySelector('body'); html.className = 'index'; body.className = 'mdui-theme-primary-blue mdui-theme-accent-light-blue index'; mdui.JQ(body).empty(); mdui.JQ(body).append(`
    CloudSQL Admin Panel
    登陆 注册

    用户注册

    person
    lock
    code
    `) //验证码刷新逻辑 let captchaImg = document.querySelector('.captcha-row img'); captchaImg.addEventListener('click', function () { this.src = 'http://admin.cloudsql.1473.cn/v1/captcha' + '?' + new Date().getTime(); //加入当前时间以避免缓存 }, false); let submitButton = document.querySelector('.main-button-row button'); submitButton.addEventListener('click', function () { let signupUrl = 'http://admin.cloudsql.1473.cn/v1/signup', userId = document.querySelector('input[name=userid]').value, password = document.querySelector('input[name=password]').value, captchaCode = document.querySelector('input[name=captcha]').value, postData = 'userId=' + userId + '&password=' + password + '&captcha=' + captchaCode; this.ajax.post(signupUrl, postData, function (response) { if (response.status == 'successed') { mdui.snackbar({ message: response.info }); window.location.hash = response.url; } else { mdui.snackbar({ message: response.info }); } }) }.bind(this), false) }, index: function () { let contentAera = document.querySelector('.mdui-container.main-container'), getUserCountUrl = 'http://admin.cloudsql.1473.cn/v1/index/userList/getUserCount', getDatabaseCountUrl = 'http://admin.cloudsql.1473.cn/v1/index/databaseList/getDatabaseCount', content = `
    person
    用户数量
    1024
    view_list
    数据库数量
    1024
    cloud
    服务状态
    正常
    `; mdui.JQ(contentAera).append(content); this.ajax.get(getUserCountUrl, function (response) { document.querySelector('#numberOfUser').innerText = response.data.results; }); this.ajax.get(getDatabaseCountUrl, function (response) { document.querySelector('#numberOfDatabse').innerText = response.data.results; }); }, databaseList: function (arg) { let contentAera = document.querySelector('.mdui-container.main-container'), getDatabaseListUrl = 'http://admin.cloudsql.1473.cn/v1/index/databaseList'; if (!this.arguments.arg.argStr) { this.arguments.arg = { argStr: 'pageIndex=1&orderBy=databaseName', argObj: { 'pageIndex': 1, 'orderBy': 'databaseName', 'search': '' } } } getDatabaseListUrl += '?' + this.arguments.arg.argStr; mdui.JQ(contentAera).empty(); mdui.JQ(contentAera).append(`

    用户数据库列表

    menu 工具栏
    refresh
    数据库名 用户ID 用户名称 创建时间 操作
    页,当前为
    `); let table = document.querySelector('table'), searchInner = document.querySelector('#search-inner'), searchDoneButton = document.querySelector('#serach-done'), refreshButton = document.querySelector('#refresh'), orderByUserIdButton = document.querySelector('#tools-bar-attr > li:nth-child(2)'), orderByDbNameButton = document.querySelector('#tools-bar-attr > li:nth-child(3)'), orderByCreateDateButton = document.querySelector('#tools-bar-attr > li:nth-child(4)'), dropActionButton = document.querySelector('#tools-bar-attr > li:nth-child(7)'), emptyActionButton = document.querySelector('#tools-bar-attr > li:nth-child(8)'), menuOrderBut = [orderByUserIdButton, orderByDbNameButton, orderByCreateDateButton]; searchDoneButton.addEventListener('click', (function () { this.arguments.arg.argObj.search = searchInner.value; let argStr = this.arguments.computed(); window.location.hash = '/index/databaseList?' + argStr; }).bind(this), false); refreshButton.addEventListener('click', function () { window.location.reload(); }, false); menuOrderBut.forEach(function (item, index) { item.addEventListener('click', (function () { this.arguments.arg.argObj.orderBy = item.id; let argStr = this.arguments.computed(); window.location.hash = '/index/databaseList?' + argStr; }).bind(this), false); }, this); dropActionButton.addEventListener('click', function () { let selectedRow = document.querySelectorAll('tbody tr.mdui-table-row-selected'); if (selectedRow.length <= 0) { mdui.dialog({ title: '错误', content: '您未选择操作对象,无法删除数据库。', history: false, buttons: [{ text: '关闭' }] }); } else { mdui.dialog({ title: '警告', content: '请确保您清楚您当前正在执行一个危险操作操作', history: false, buttons: [{ text: '确定', onClick: function (inst) { let dropDatabaseUrl = 'http://admin.cloudsql.1473.cn/v1/index/databaseList/dropDatabase', successAry = [], faildAry = []; selectedRow.forEach(function (item, index, array) { let data = 'dbName=' + item.children[1].innerText; this.ajax.post(dropDatabaseUrl, data, function (response) { if (response.status == 'success') { successAry.push(item.children[1].innerText); } else { faildAry.push(item.children[1].innerText); } if (successAry.length + faildAry.length == array.length) { let dialogContent = ` `; mdui.dialog({ title: '完成', content: dialogContent, history: false, buttons: [{ text: '关闭', onClick: function (inst) { window.location.reload(); } }] }); } }); }, this); } }, { text: '取消' } ] }); } }, false) emptyActionButton.addEventListener('click', function () { let selectedRow = document.querySelectorAll('tbody tr.mdui-table-row-selected'); if (selectedRow.length <= 0) { mdui.dialog({ title: '错误', content: '您未选择操作对象,无法删除数据库。', history: false, buttons: [{ text: '关闭' }] }); } else { mdui.dialog({ title: '警告', content: '请确保您清楚您当前正在执行一个危险操作操作', history: false, buttons: [{ text: '确定', onClick: function (inst) { let dropDatabaseUrl = 'http://admin.cloudsql.1473.cn/v1/index/databaseList/emptyDatabase', successAry = [], faildAry = []; selectedRow.forEach(function (item, index, array) { let data = 'dbName=' + item.children[1].innerText; this.ajax.post(dropDatabaseUrl, data, function (response) { if (response.status == 'success') { successAry.push(item.children[1].innerText); } else { faildAry.push(item.children[1].innerText); } if (successAry.length + faildAry.length == array.length) { let dialogContent = ` `; mdui.dialog({ title: '完成', content: dialogContent, history: false, buttons: [{ text: '关闭', onClick: function (inst) { window.location.reload(); } }] }); } }); }, this); } }, { text: '取消' } ] }); } }, false) //AJAX向后台数据接口获取数据后执行回调函数 this.ajax.get(getDatabaseListUrl, function (response) { if (response.status == 'success') { let tableBody = document.createElement('tbody'), results = response.data.results, resultsCount = response.data.count; if (resultsCount === 0) { let subContentAera = document.querySelector('.mdui-col-xs-12.mdui-table-fluid'), pageButRow = document.querySelector('.mdui-col-xs-12.mdui-clearfix.page-button-row'); mdui.JQ(table).remove(); mdui.JQ(pageButRow).remove(); mdui.JQ(subContentAera).append(`

    暂无数据

    `); } else { results.forEach(function (item, index, array) { let resultsAry = [], detailBut = document.createElement('button'), removeBut = document.createElement('button'); detailBut.className = 'mdui-btn'; removeBut.className = 'mdui-btn mdui-color-theme-accent'; detailBut.innerText = '查看详情'; removeBut.innerText = '删除'; detailBut.addEventListener('click', function () { let getDatabaseTablesUrl = 'http://admin.cloudsql.1473.cn/v1/index/databaseList/getDatabaseAllTables?dbName=' + item.dbName; this.ajax.get(getDatabaseTablesUrl, function (response) { let tablesAry = []; response.data.results.forEach(function (_item) { tablesAry.push(_item.TABLE_NAME); }); if (tablesAry.length === 0) { tablesAry.push('该数据库无数据表信息'); } let content = ` `; mdui.dialog({ title: '数据库详情', content: content, history: false, buttons: [{ text: '清空数据库', onClick: function (inst) { mdui.dialog({ title: '警告', content: '请确保您清楚您当前正在执行一个危险操作操作', history: false, buttons: [{ text: '确定', onClick: function (inst) { let emptyDatabaseUrl = 'http://admin.cloudsql.1473.cn/v1/index/databaseList/emptyDatabase', data = 'dbName=' + item.dbName; this.ajax.post(emptyDatabaseUrl, data, function (response) { if (response.status == 'success') { mdui.dialog({ content: '执行成功', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } else { mdui.dialog({ content: '执行失败', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } }); } }, { text: '取消' } ] }); } }, { text: '删除数据库', onClick: function (inst) { mdui.dialog({ title: '警告', content: '请确保您清楚您当前正在执行一个危险操作操作', history: false, buttons: [{ text: '确定', onClick: function (inst) { let dropDatabaseUrl = 'http://admin.cloudsql.1473.cn/v1/index/databaseList/dropDatabase', data = 'dbName=' + item.dbName; this.ajax.post(dropDatabaseUrl, data, function (response) { if (response.status == 'success') { mdui.dialog({ content: '执行成功', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } else { mdui.dialog({ content: '执行失败', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } }); } }, { text: '取消' } ] }); } }, { text: '关闭' } ] }); }); }.bind(this), false); removeBut.addEventListener('click', function () { mdui.dialog({ title: '警告', content: `

    请确保您清楚您当前正在执行一个危险操作操作

    您确定要删除DB: ` + item.dbName + ` 吗?

    `, history: false, buttons: [{ text: '确定', onClick: function (inst) { let dropDatabaseUrl = 'http://admin.cloudsql.1473.cn/v1/index/databaseList/dropDatabase', data = 'dbName=' + item.dbName; this.ajax.post(dropDatabaseUrl, data, function (response) { if (response.status == 'success') { mdui.dialog({ content: '执行成功', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } else { mdui.dialog({ content: '执行失败', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } }); } }, { text: '取消' } ] }); }, false); let actionColContent = [detailBut, removeBut]; resultsAry.push(item.dbName, item.dbOwnUuid, item.account, item.createDate, actionColContent); let tr = this.printer.tableGenerator(resultsAry); tableBody.appendChild(tr); }, this); table.appendChild(tableBody); mdui.updateTables(table); let pageShowCol = document.querySelector('.mdui-col-xs-12.page-button-row b'), pageNumOfNow = document.querySelector('.mdui-col-xs-12.page-button-row input'), jumpButton = document.querySelector('.mdui-col-xs-12.page-button-row button'), pageNum = Math.ceil(resultsCount / 20); pageShowCol.innerHTML = pageNum; pageNumOfNow.value = this.arguments.arg.argObj.pageIndex; jumpButton.addEventListener('click', (function () { this.arguments.arg.argObj.pageIndex = pageNumOfNow.value; let argStr = this.arguments.computed(); window.location.hash = '/index/databaseList?' + argStr; }).bind(this), false); } } else { mdui.snackbar({ message: response.info }); } }.bind(this)); }, userList: function () { let contentAera = document.querySelector('.mdui-container.main-container'), getUserListUrl = 'http://admin.cloudsql.1473.cn/v1/index/userList'; if (!this.arguments.arg.argStr) { this.arguments.arg = { argStr: 'pageIndex=1&orderBy=userName', argObj: { 'pageIndex': 1, 'orderBy': 'userName', 'search': '' } } } getUserListUrl += '?' + this.arguments.arg.argStr; mdui.JQ(contentAera).empty(); mdui.JQ(contentAera).append(`

    用户数据库列表

    menu 工具栏
    refresh
    用户昵称 用户ID 数据库密码 用户注册时间 操作
    页,当前为
    `); //生成表格 let table = document.querySelector('table'), searchInner = document.querySelector('#search-inner'), searchDoneButton = document.querySelector('#serach-done'), refreshButton = document.querySelector('#refresh'), orderByUserIdButton = document.querySelector('#tools-bar-attr > li:nth-child(2)'), orderByUserNameButton = document.querySelector('#tools-bar-attr > li:nth-child(3)'), orderByUserCreateButton = document.querySelector('#tools-bar-attr > li:nth-child(4)') removeActionButton = document.querySelector('#tools-bar-attr > li:nth-child(7)'), menuOrderBut = [orderByUserIdButton, orderByUserNameButton, orderByUserCreateButton]; searchDoneButton.addEventListener('click', (function () { this.arguments.arg.argObj.search = searchInner.value; let argStr = this.arguments.computed(); window.location.hash = '/index/userList?' + argStr; }).bind(this), false); refreshButton.addEventListener('click', function () { window.location.reload(); }, false); removeActionButton.addEventListener('click', function () { let selectedRow = document.querySelectorAll('tbody tr.mdui-table-row-selected'); if (selectedRow.length <= 0) { mdui.dialog({ title: '错误', content: '您未选择操作对象,无法删除数据库。', history: false, buttons: [{ text: '关闭' }] }); } else { mdui.dialog({ title: '警告', content: '请确保您清楚您当前正在执行一个危险操作操作', history: false, buttons: [{ text: '确定', onClick: function (inst) { let dropDatabaseUrl = 'http://admin.cloudsql.1473.cn/v1/index/userList/removeUser', successAry = [], faildAry = []; selectedRow.forEach(function (item, index, array) { let data = 'userId=' + item.children[2].innerText + '&userNickName=' + item.children[1].innerText; this.ajax.post(dropDatabaseUrl, data, function (response) { if (response.status == 'success') { successAry.push(item.children[1].innerText); } else { faildAry.push(item.children[1].innerText); } if (successAry.length + faildAry.length == array.length) { let dialogContent = ` `; mdui.dialog({ title: '完成', content: dialogContent, history: false, buttons: [{ text: '关闭', onClick: function (inst) { window.location.reload(); } }] }); } }); }, this); } }, { text: '取消' } ] }); } }, false) menuOrderBut.forEach(function (item, index) { item.addEventListener('click', (function () { this.arguments.arg.argObj.orderBy = item.id; let argStr = this.arguments.computed(); window.location.hash = '/index/userList?' + argStr; }).bind(this), false); }, this); //AJAX向后台数据接口获取数据后执行回调函数 this.ajax.get(getUserListUrl, function (response) { if (response.status == 'success') { let tableBody = document.createElement('tbody'), results = response.data.results, resultsCount = response.data.count; if (resultsCount === 0) { let subContentAera = document.querySelector('.mdui-col-xs-12.mdui-table-fluid'), pageButRow = document.querySelector('.mdui-col-xs-12.mdui-clearfix.page-button-row'); mdui.JQ(table).remove(); mdui.JQ(pageButRow).remove(); mdui.JQ(subContentAera).append(`

    暂无数据

    `); } else { } results.forEach(function (item, index) { let resultsAry = [], detailBut = document.createElement('button'), removeBut = document.createElement('button'); detailBut.className = 'mdui-btn'; removeBut.className = 'mdui-btn mdui-color-theme-accent'; detailBut.innerText = '查看详情'; removeBut.innerText = '删除'; detailBut.addEventListener('click', function () { let getUserOwnDbUrl = 'http://admin.cloudsql.1473.cn/v1/index/userList/getUserOwnDb?userId=' + item.uuid; this.ajax.get(getUserOwnDbUrl, function (response) { let dbAry = []; response.data.results.forEach(function (_item) { dbAry.push(_item.dbName); }); if (dbAry.length === 0) { dbAry.push('无'); } let content = ` `; mdui.dialog({ title: '用户详情', content: content, history: false, buttons: [{ text: '查看数据库', onClick: function (inst) { window.location.hash = '/index/databaseList?search=' + item.uuid; } }, { text: '删除用户', onClick: function (inst) { mdui.dialog({ title: '警告', content: '请确保您清楚您当前正在执行一个危险操作操作', history: false, buttons: [{ text: '确定', onClick: function (inst) { let removeUserUrl = 'http://admin.cloudsql.1473.cn/v1/index/userList/removeUser', data = 'userId=' + item.uuid + '&userNickName=' + item.account; this.ajax.post(removeUserUrl, data, function (response) { if (response.status == 'success') { mdui.dialog({ content: '执行成功', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } else { mdui.dialog({ content: '执行失败', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } }); } }, { text: '取消' } ] }); } }, { text: '关闭' } ] }); }); }.bind(this), false); removeBut.addEventListener('click', function () { mdui.dialog({ title: '警告', content: `

    请确保您清楚您当前正在执行一个危险操作操作

    您确定要删除用户: ` + item.account + ` 吗?

    `, history: false, buttons: [{ text: '确定', onClick: function (inst) { let removeUserUrl = 'http://admin.cloudsql.1473.cn/v1/index/userList/removeUser', data = 'userId=' + item.uuid + '&userNickName=' + item.account; this.ajax.post(removeUserUrl, data, function (response) { if (response.status == 'success') { mdui.dialog({ content: '执行成功', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } else { mdui.dialog({ content: '执行失败', history: false, buttons: [{ text: '确定', onClick: function (inst) { window.location.reload(); } }] }); } }); } }, { text: '取消' } ] }); }.bind(this), false); let actionColContent = [detailBut, removeBut]; resultsAry.push(item.account, item.uuid, item.dbpassword, item.createDate, actionColContent); let tr = this.printer.tableGenerator(resultsAry); tableBody.appendChild(tr); }, this); table.appendChild(tableBody); mdui.updateTables(table); let pageShowCol = document.querySelector('.mdui-col-xs-12.page-button-row b'), pageNumOfNow = document.querySelector('.mdui-col-xs-12.page-button-row input'), jumpButton = document.querySelector('.mdui-col-xs-12.page-button-row button'), pageNum = Math.ceil(resultsCount / 20); pageShowCol.innerHTML = pageNum; pageNumOfNow.value = this.arguments.arg.argObj.pageIndex; jumpButton.addEventListener('click', (function () { this.arguments.arg.argObj.pageIndex = pageNumOfNow.value; let argStr = this.arguments.computed(); window.location.hash = '/index/userList?' + argStr; }).bind(this), false); } else { mdui.snackbar({ message: response.info }); } }.bind(this)); } } this.permissionCheck = { /** * 检测账户登录状态 * * @param {any} next 回调函数 */ signStatus: function (next) { this.ajax.get('http://admin.cloudsql.1473.cn/v1/index/signStatus', function (response) { if (response.status == 'signedin') { next.call(this); } else { window.location.hash = '/signin'; } }.bind(this)); } } this.routes = { '/': function () { window.location.hash = '#/signin'; }, '/404': this.printer.pageNotFound, '/signin': this.printer.signin.bind(this), '/signup': this.printer.signup.bind(this), '/index': this.printer.indexInit.bind(this, this.printer.index), '/index/databaseList': this.printer.indexInit.bind(this, this.printer.databaseList), '/index/userList': this.printer.indexInit.bind(this, this.printer.userList) }; this.arguments = { arg: {}, computed: function () { this.arg.argStr = ''; Object.keys(this.arg.argObj).forEach(function (item, index, array) { if (index + 1 === array.length) { this.arg.argStr += item + '=' + this.arg.argObj[item]; } else { this.arg.argStr += item + '=' + this.arg.argObj[item] + '&'; } }, this); return this.arg.argStr; } }; this.route = function (path, callback) { this.routes[path] = callback || function () {} } this.refresh = function () { this.currentUrl = location.hash.slice(1) || '/'; this.currentUrl = this.currentUrl.split("?"); //路由内无对应路径则跳转至404页面 if (this.currentUrl.length === 1 && this.routes[this.currentUrl[0]]) { this.routes[this.currentUrl[0]](); this.arguments.arg = {}; } else if (this.currentUrl.length === 2 && this.routes[this.currentUrl[0]]) { this.routes[this.currentUrl[0]](); let argStr = this.currentUrl[1]; this.arguments.arg = { argStr: argStr, argObj: {} } argStr.split("&").forEach(function (item, index) { let ary = item.split("="); this.arguments.arg.argObj[ary[0]] = ary[1]; }, this); } else { this.routes['/404'](); } } this.init = function () { const windowLoad = this.handleEvent('load', { onElement: window, withCallback: this.refresh.bind(this) }); const hashChange = this.handleEvent('hashchange', { onElement: window, withCallback: this.refresh.bind(this) }); } } CloudAdmin.router.prototype.ajax = { /** * 发送Get请求 * * @param {!string} url 请求地址 * @param {?function} next 回调函数 */ get: function (url, next) { let xhr = new XMLHttpRequest(); if (url.includes('?')) { // 在URL有其他参数时,添加一个date参数加入当前时间以避免缓存 xhr.open('GET', url + '&date=' + new Date().getTime(), true); } else { // 添加一个date参数加入当前时间以避免缓存 xhr.open('GET', url + '?' + new Date().getTime(), true); } xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); // 更改XMLHttpRequest对象withCredentials属性以支持跨域Cookies xhr.withCredentials = true; xhr.responseType = 'json'; xhr.onload = function (res) { // 获取请求接口返回值 let response = res.target.response; next.call(this, response); }; xhr.send(); }, /** * 发送Post请求 * * @param {!string} url 请求地址 * @param {?string} data post请求参数 * @param {?function} next 回调函数 */ post: function (url, data, next) { let xhr = new XMLHttpRequest(); if (url.includes('?')) { // 在URL有其他参数时,添加一个date参数加入当前时间以避免缓存 xhr.open("POST", url + '&' + new Date().getTime(), true); } else { // 添加一个date参数加入当前时间以避免缓存 xhr.open("POST", url + '?' + new Date().getTime(), true); } xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); // 更改XMLHttpRequest对象withCredentials属性以支持跨域Cookies xhr.withCredentials = true; xhr.responseType = 'json'; xhr.onload = function (res) { // 获取请求接口返回值 let response = res.target.response; next.call(this, response); }; xhr.send(data); } } /** * 监听事件处理函数 * * @param {string} eventName 表示监听事件类型的字符串 * @param {object} [{ onElement, withCallback, useCapture = false }={}] 监听对象 回调函数 useCapture * @param {function} thisArg * @returns function */ CloudAdmin.router.prototype.handleEvent = function (eventName, { onElement, withCallback, useCapture = false } = {}, thisArg) { const element = onElement || document.documentElement; function handler(event) { if (typeof withCallback === 'function') { withCallback.call(thisArg, event); } } handler.destroy = function () { return element.removeEventListener(eventName, handler, useCapture); } element.addEventListener(eventName, handler, useCapture); return handler } CloudAdmin.router.prototype.event = { dom: [], /** * 调用 CloudAdmin.router.prototype.handleEvent.handler.destroy 移除DOM的监听事件 * * @param {any} ary 存放DOM的数组 */ removeEventListener: function (ary) { } } //创建并初始化前端路由 let r = new CloudAdmin.router(); r.init();