添付ファイルをリネームしたい

[takuyahara]

添付ファイルの名前を変更したいのですが GUI 上、または API 経由の操作でどうすれば実現できますでしょうか？

[pomo]

コード記述せずに申し訳ないですが、javascriptで組むとすると、
例えばkintone-ui-componentのdialogやtText、Buttonを使い、

Dialogの表示ボタンを設置、Dialog開いた際にファイルをダウンロードするでファイルを取得し、
現状のファイル数分Dialogに一覧として現状ファイル名のText + 更新用のButton をファイル数分表示させる。ユーザーは変更対象のTextを変更したら同じ行の更新Buttonを押下。
更新Button押下時にはファイルをアップロードするfileKeyを作成取得し、そのfileKeyを使ってレコードの更新してあげる流れで実現できると思います。

[lenzras (lras)]

私も知りたいので、当投稿をフォローします。

私なら、以下をやります。

1. (質問の回答に集中して、ユーザのファイル名変更の操作を省略)

2. ユーザがファイル名変更を確定したら、ダウンロードAPIを利用し、該当のファイルキー(A)でファイルを取得。

3. アップロードAPIを利用し、ファイルのデータと指定されたファイル名でアップロードし、ファイルキー(B)を取得。

4. 添付フィールドにファイルキー(B)を追加して、ファイルキー(A)を削除。

5. ユーザに操作の成功・失敗を知らせる。

[pomo]

ざっくり作成しました。構造や処理不足な点は多々あります・・・(行ごとに更新でなく一括にするや、拡張しは変更させないなど）

kintone-ui-componentは1.14で作成してますので予めCDN等でアプリ入れてあげてください。

コード表示見切れてると思うのでコピーボタンか、コード右上の拡大ボタン?押してください。

const domain = "ドメインを書いてください"
const tempFieldName = "添付ファイルのフィールドを書いてください"

const main = () => {
  kintone.events.on("app.record.detail.show", (event) => {
    const headerMenu = kintone.app.record.getHeaderMenuSpaceElement()
    const div = document.createElement("div")
    headerMenu?.appendChild(div)
    // ダイアログ開くボタン
    const openButton = createOpenButton()
    // ダイアログ
    const dialog = new Kuc.Dialog({
      title: 'Title',
      footer: '<div>※対象の名前を変更しボタンで更新してください</div>',
      icon: 'info',
      container: document.body,
    });
    div.appendChild(openButton)


    // ダイアログ開いた時
    openButton.addEventListener("click", () => {
      dialog?.open()
      const record = kintone.app.record.get().record
      if (!record) return
      dialog.content = createContent(record)
    })

    // ダイアログ閉じたときにcontent空へ
    dialog?.addEventListener("close", () => {
      dialog.content = "ファイルがありません。"
    })
    return event;
  });
}

// 開くボタン作成
const createOpenButton = () => {
  const button = new Kuc.Button({
    text: 'Submit',
    type: 'submit',
    className: 'options-class',
    id: 'options-id',
  })
  return button
}
// ダイアログのコンテンツ作成
const createContent = (record) => {
  const files = record[tempFieldName].value
  if (files.length === 0) return "ファイルがありません"
  const content = document.createElement("div")

  // ファイルの数分行データ追加
  files.map(file => {
    const item = document.createElement("div")
    const text = new Kuc.Text({
      value: file.name,
      textAlign: 'left',
      visible: true,
      disabled: false,
    })

    const button = new Kuc.Button({
      text: '更新',
      type: 'submit',
    })

    button.addEventListener("click", async () => {
      if (!window.confirm(`${file.name} を ${text.value} へ変更してよろしいですか？`)) {
        alert("キャンセルします")
        return
      }
      // fileのblobを取得
      const _file = await getFile(file.fileKey)
      if (!_file) return
      // 新しい名前でファイルを登録し、そのfileKeyを取得
      const newFileKey = await getFileKey(_file, text.value)
      // 新しいfileKeyへ書きかえ
      file.fileKey = newFileKey
      file.name = text.value

      const body = {
        app: kintone.app.getId(),
        id: record.$id.value,
        record: {
          [tempFieldName]: {
            value: [...record[tempFieldName].value]
          }
        }
      };
      console.log(body)
      await kintone.api(kintone.api.url('/k/v1/record.json', true), 'PUT', body).then(() => {
        alert("変更しました。ウインドウを更新します。")
        window.location.reload()
      });

    })

    // 行のデータ風に追加
    item.appendChild(text)
    item.appendChild(button)
    content.appendChild(item)

  })
  return content
}

// 対象のファイルをダウンロード
const getFile = async (fileKey) => {
  return await new Promise((resolve) => {
    const domain = process.env.KINTONE_DOMAIN;
    var url = `https://${domain}.cybozu.com/k/v1/file.json?fileKey=${fileKey}`
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url);
    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    xhr.responseType = 'blob';
    xhr.onload = function () {
      if (xhr.status === 200) {
        var blob = new Blob([xhr.response]);
        resolve(blob);
      } else {
        // console.log(xhr.responseText);
      }
    };
    xhr.send();
  });
};

// アップロード用のfileKeyを取得
const getFileKey = async (blob, fileName) => {

  return await new Promise((resolve, reject) => {
    const fileFullName = `${fileName}`
    const formData = new FormData();
    formData.append('__REQUEST_TOKEN__', kintone.getRequestToken());
    formData.append('file', blob, fileFullName);

    const url = `https://${domain}.cybozu.com/k/v1/file.json`;
    const xhr = new XMLHttpRequest();
    xhr.open('POST', url);
    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    xhr.onload = () => {
      if (xhr.status === 200) {
        // success
        resolve(JSON.parse(xhr.responseText).fileKey);
      } else {
        // error
        console.log(JSON.parse(xhr.responseText));
        reject(Error('Network Error'));
      }
    };
    xhr.send(formData);
  });
}


// 本題の関数実行
main()