文本結構轉換爲菜單代碼、權限、建立文件結構

文本結構轉換爲菜單代碼信權限

如下代碼用於有菜單關係的文本結構轉換爲代碼對應的結構。

• 使用場景，產品丟給你一堆層級菜單，你得把他在代碼中表現出層級關係，以及路由，路由固然不能用中文，一大批數據可能得弄半天。
• 因而你想簡單寫個文本，而且翻譯一下，轉換爲代碼所需格式。
• 使用方法，路由寫在菜單名的 __ 兩個下劃線後面，二級菜單使用 - 表示，目前僅支持二級菜單，望好心人改改，支持多級菜單，例如三級菜單使用 -- 表示。
• 注：如下英文直接來自百度整段翻譯，不要介意~

const str = `
任務管理 __ task management
數據報表 __ Data Report
-動態報表 __ - Dynamic Report
系統配置 __ system configuration
-到期提醒管理 __ - Management of expiration reminders
-公告管理 __ - Announcement Management
系統管理 __ system management
-角色管理 __ - Role management
-日誌報表 __ - Log Report
`
function getMemuJson(str) {
  const arr = str.split('\n').map(item => item.trim()).filter(item => item) // 拆分每行
  let manMenuIndex = 0 // 主菜單索引
  let subMenuIndex = 0 // 子菜單索引
  let letterIndex = 65 // 從字母 A 編碼開始
  const menuRes = []
  arr.forEach(name => {
    if(!name.match(/^-/)) {
      subMenuIndex = 0
      menuRes.push({
        id: String.fromCharCode(letterIndex + manMenuIndex),
        name: getEnOrCh(name, 'ch'),
        route: `/${tf(getEnOrCh(name))}`,
      })
      manMenuIndex = manMenuIndex + 1
    } else { // 子菜單
      const parentId = String.fromCharCode(letterIndex + (manMenuIndex - 1))
      menuRes.push({
        id: String.fromCharCode(letterIndex + (manMenuIndex - 1)) + (subMenuIndex + 1),
        menuParentId: parentId,
        name: getEnOrCh(name, 'ch'),
        route: `/${menuRes.find(item => item.id === parentId).route.slice(1)}/${tf(getEnOrCh(name))}`,
      })
      subMenuIndex = subMenuIndex + 1
    }
  })

  return menuRes

  function getEnOrCh(str, isEn = 'en') { // 截取每行上的英文或中文
    return isEn === 'en' ? str.match(/__ (.*)/)[1].replace(/^-+/, '').trim() : str.match(/(.*)__/)[1].replace(/^-+/, '')
  }

  function tf(str){ // 轉換 `ab-c d_ef` 爲小駝峯
    let arr=str.split(' ').join('-').split('-').join('_').split('_');
    for(let i=1; i<arr.length; i++){
      arr[i]=arr[i].charAt(0).toUpperCase()+arr[i].substring(1);
    }
    arr[0] = arr[0].toLowerCase() // 此行爲小駝峯
    return arr.join('');
  };

}

function getShell(menuRes) {
  // 簡單生成腳本, 用於根據基準頁面建立各個路由的頁面。注意 window 下的腳本不是這樣的
  const basePage = `/Users/xw/Documents/git/boilerplate/clients/src/pages/basePage/` // 基準頁面, 我這裏是一個文件夾
  const outDir = `/Users/xw/Documents/git/boilerplate/clients/src/pages/` // 輸出的位置, 我這裏與基準頁面在同一目錄
  let bat = menuRes.map(item => {
    const out = `${outDir}${item.route}`
    return `
      if [ ! -d ${out} ]; then mkdir -p ${out} & cp -r ${basePage} ${out}; else echo '已經存在'; fi
    `.replace(/\/\//g, '/')
  }).join('\n\n')
  return bat
}

function getAuth(str) {
  let obj = {}
  getMemuJson(str).map(item => item.id).forEach(item => {
    if(!obj[item[0]]) {
      obj[item[0]] = [item]
    } else {
      obj[item[0]].push(item)
    }
  })
  const arr = Object.keys(obj).map(key => obj[key])
  return arr.map(item => item.join(','))
}

console.log('生成的菜單數據', getMemuJson(str)) // 配置在代碼裏
console.log('生成的管理員菜單配置', getAuth(str)) // 配置在數據庫
console.log('生成的腳本', getShell(getMemuJson(str))) // 建立與配置對應的文件結構

console.log(‘生成的菜單數據’, getMemuJson(str))

[
  {
    "id": "A",
    "name": "任務管理 ",
    "route": "/taskManagement"
  },
  {
    "id": "B",
    "name": "數據報表 ",
    "route": "/dataReport"
  },
  {
    "id": "B1",
    "menuParentId": "B",
    "name": "動態報表 ",
    "route": "/dataReport/dynamicReport"
  },
  {
    "id": "C",
    "name": "系統配置 ",
    "route": "/systemConfiguration"
  },
  {
    "id": "C1",
    "menuParentId": "C",
    "name": "到期提醒管理 ",
    "route": "/systemConfiguration/managementOfExpirationReminders"
  },
  {
    "id": "C2",
    "menuParentId": "C",
    "name": "公告管理 ",
    "route": "/systemConfiguration/announcementManagement"
  },
  {
    "id": "D",
    "name": "系統管理 ",
    "route": "/systemManagement"
  },
  {
    "id": "D1",
    "menuParentId": "D",
    "name": "角色管理 ",
    "route": "/systemManagement/roleManagement"
  },
  {
    "id": "D2",
    "menuParentId": "D",
    "name": "日誌報表 ",
    "route": "/systemManagement/logReport"
  }
]

console.log(‘生成的管理員菜單配置’, getAuth(str))

[ 'A', 'B,B1', 'C,C1,C2', 'D,D1,D2' ]

console.log(‘生成的腳本’, getShell(getMemuJson(str)))

if [ ! -d /Users/xw/Documents/git/boilerplate/clients/src/pages/taskManagement ]; then mkdir -p /Users/xw/Documents/git/boilerplate/clients/src/pages/taskManagement & cp -r /Users/xw/Documents/git/boilerplate/clients/src/pages/basePage/ /Users/xw/Documents/git/boilerplate/clients/src/pages/taskManagement; else echo '已經存在'; fi

if [ ! -d /Users/xw/Documents/git/boilerplate/clients/src/pages/dataReport ]; then mkdir -p /Users/xw/Documents/git/boilerplate/clients/src/pages/dataReport & cp -r /Users/xw/Documents/git/boilerplate/clients/src/pages/basePage/ /Users/xw/Documents/git/boilerplate/clients/src/pages/dataReport; else echo '已經存在'; fi

# 更多省略...

​