iT邦幫忙

2022 iThome 鐵人賽

DAY 26
0
Modern Web

自己工具,自己 React - React學習系列 第 26

【D26】 小工具:身分證製造機(part 6)-製作身分證製造功能

  • 分享至 

  • xImage
  •  

已經在 Day25中設計了製作身分證的樣式,接下來要製作點擊按鈕後進行的程式邏輯。

製作邏輯的 js 檔案

建立一個 idnoCreater.js 的檔案,裡面有製作身分證的功能,當完成後在 index.js 中進行呼叫。在本篇中尚不會合併兩者。

製作功能

在主要功能中,有個 createID 的 function,其中引入參數:placeCode genderCode,分別代表地方碼和性別碼。然後中間再由亂數產生,最後再加上檢查碼。

在這邊的地方碼轉換,以及計算手字和中間計算驗證碼的功能沿用:checkPlacecalHeadcalBody,這邊不多詳述,詳情請看 Day21

export function createID(placeCode, genderCode) {
  let randomStr = getRandomInt(9999999).toString().padStart(7, "0");
  let r = `${placeStrCode}${genderCode}${randomStr}`;
  let result = r + getCksum(checkPlace(placeStrCode), genderCode, randomStr);
  console.log(`ID=${result}`);
  return result
}

function getRandomInt(max) {
  return Math.floor(Math.random() * max);
}

function getCksum(data) {
  const idSum = calHead(placeCode) + calBody(genderCode.toString() + randomStr);
  const modResult = idSum % 10;
  const r = modResult == 0 ? modResult : 10 - modResult;

  return r;
}


function checkPlace(code) {
...(省略)...
}

function calBody(code) {
 ...(省略)...
}

function calHead(code) {
  ...(省略)...
}

當前面 9 碼都取得後,就是要計算第十碼檢驗碼的部分,這部分由 getCksum 進行計算。由於全部 10 字(11 碼數字)的計算總和需要能被 10 整除,因此套入公式計算前面 9 碼後的合後需要「10減去該數」,加上這個數值後,就可以讓整個數字整除 10。因此最後再加上這個數值,就可以隨機產生身分證囉!


後記

建立好身分證後,就可以再套回原本的畫面中,就能製造出自己的身分證製造機。


上一篇
【D25】 小工具:身分證製造機(part 5)-製作身分證製造機產生頁面
下一篇
【D27】 小工具:身分證製造機(part 7)-畫面與功能結合
系列文
自己工具,自己 React - React學習30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言