寫JS後端工具

by dpes5407

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css">
<br />
<div class="container">
  <h2>SQL Column to Sequelize Model</h2>
  <div class="row">
    <div class="col">
      <div class="form-floating">
        <textarea id="inputArea" class="form-control" placeholder="輸入 MySQL 表格的欄位(用'\t'分隔)" id="floatingTextarea2" style="height: 100px"></textarea>
        <label for="floatingTextarea2">input</label>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col d-flex p-2 justify-content-center align-items-center">
      <button type="button" class="btn btn-primary btn-lg m-2" onclick="translator()">
        轉換
      </button>
      <button type="button" class="btn btn-outline-primary btn-lg m-2" onclick="copy('outputArea')">
        複製
      </button>
    </div>
  </div>
  <div class="row">
    <div class="col">
      <div class="form-floating">
        <textarea id="outputArea" class="form-control" placeholder="output" id="floatingTextarea2" style="height: 200px"></textarea>
        <label for="floatingTextarea2">output</label>
      </div>
    </div>
  </div>
  <br />
  <h2>dbdiagramMySQL to MySQL createAt updateAt</h2>
  <div class="row">
    <div class="col">
      <div class="form-floating">
        <textarea id="inputTime" class="form-control" id="floatingTextarea2" style="height: 100px"></textarea>
        <label for="floatingTextarea2">input</label>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col d-flex p-2 justify-content-center align-items-center">
      <button type="button" class="btn btn-primary btn-lg m-2" onclick="transTimestamp()">
        轉換
      </button>
      <button type="button" class="btn btn-outline-primary btn-lg m-2" onclick="copy('outputTime')">
        複製
      </button>
    </div>
  </div>
  <div class="row">
    <div class="col">
      <div...

JavaScript

function copy(elId) {
  const text = document.getElementById(elId);
  text.select();
  text.setSelectionRange(0, 99999);
  document.execCommand("copy");
} 
  // example 1
  const copyMySQLTableColumn =
    "productID	productCode	imgURL	productClassID	name	t_name	goldPrice	diamondPrice	createdAt	updatedAt	";
inputArea.value = copyMySQLTableColumn;
outputArea.value = MySQLtoModel(copyMySQLTableColumn);
//

function MySQLtoModel(text) {
  const array = text.split("\t");
  const object = {};
  array.forEach((el) => {
    if (el && el !== "createdAt" && el !== "updatedAt" && el !== "\n") {
      object[el] = {
        type: `Sequelize.STRING`,
        allowNull: true,
        validate: null,
        unique: false,
      };
    }
  });
  return JSON.stringify(object).replaceAll(
    '"Sequelize.STRING"',
    "Sequelize.STRING"
  );
}

function translator() {
  const input = inputArea.value;
  outputArea.value = MySQLtoModel(input);
}

// exanple 2
inputTime.value = "`createdAt` timestamp,";
transTimestamp();

function transTimestamp() {
  const input = inputTime.value;
  outputTime.value = MySQLtoCreatedAtUpdatedAt(input);
}

function MySQLtoCreatedAtUpdatedAt(input) {
  return input
    .replaceAll(
      "`createdAt` timestamp",
      "`createdAt` timestamp DEFAULT CURRENT_TIMESTAMP"
    )
    .replaceAll(
      "`updatedAt` timestamp",
      "`updatedAt` timestamp DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP"
    );
}

// example 3
const example3 = ` Ref: "User"."userTypeId" > "User_Type"."id"

 Ref:   "User_Type"."id" < "User"."userTypeId"`;
inputBelongsTo.value = example3;
transBelongs();

function transBelongs() {
  const input = inputBelongsTo.value;
  const arr = input.split("\n");
  outputBelongsTo.value = ReftoBelonsTo(arr, arr.length);
}

function ReftoBelonsTo(inputArr, arrLen) {
  let output = "";
  for (let i = 0; i < arrLen; i++) {
    let ans = "";
    const arr = inputArr[i].split('"');
    if (arr.length <= 1) {
      output += "\n";
     ...