dictionary/pages/list/index.ux

<template>
  <div class="wrapper">
    <list class="list" bounces="false">
      <list-item type="ceiling">
        <input
          type="button"
          class="button"
          value="下载数据{{fileList.length}}"
          onclick="downloadFile(jsonDataList)"
        />
      </list-item>
      <list-item type="item" for="{{ fileList }}">
        <text class="text">{{ $item.uri.split('/').pop() }}</text>
      </list-item>
    </list>
  </div>
</template>

<script>
import fetch from '@blueos.network.fetch'
import prompt from '@blueos.window.prompt'
import file from '@blueos.storage.file'
import storage from '@blueos.storage.storage'
export default {
  data: {
    fileList: null,
    jsonDataList: ['output_part_1.json', 'output_part_10.json', 'output_part_2.json', 'output_part_3.json', 'output_part_4.json', 'output_part_5.json', 'output_part_6.json', 'output_part_7.json', 'output_part_8.json', 'output_part_9.json', 'a.json', 'b.json', 'c.json', 'd.json', 'e.json', 'f.json', 'g.json', 'h.json', 'i.json', 'j.json', 'k.json', 'l.json', 'm.json', 'n.json', 'o.json', 'p.json', 'q.json', 'r.json', 's.json', 't.json', 'u.json', 'v.json', 'w.json', 'x.json', 'y.json', 'z.json'],
  },
  onInit() {
    file.list({
      uri: 'internal://files/',
      success: (data) => {
        this.fileList = data.fileList;
      }
    })
  },
  async fetchPromise(options) {
    return new Promise((resolve, reject) => {
      fetch.fetch({
        ...options,
        success: resolve,
        fail: reject,
      });
    });
  },
  async writeTextPromise(options) {
    return new Promise((resolve, reject) => {
      file.writeText({
        ...options,
        success: resolve,
        fail: (data, code) => reject({ data, code }),
      });
    });
  },
  async writeArrayBufferPromise(options) {
    return new Promise((resolve, reject) => {
      file.writeArrayBuffer({
        ...options,
        success: resolve,
        fail: (data, code) => reject({ data, code }),
      });
    });
  },
  async getFile(fileName) {
    return new Promise((resolve, reject) => {
      file.get({
        uri: `internal://files/${fileName}`,
        success: () => {
          resolve(true);
        },
        fail: (_, code) => {
          reject(`handling fail, code = ${code}`);
        },
      });
    });
  },
  async downloadFile(data) {
    prompt.showToast({ message: "开始下载" });
    let totalNum = data.length;
    let hasDownload = 0;
    for (let i = 0; i < totalNum; i++) {
      const fileName = data[i];
      let isInFile = false;
      try {
        isInFile = await this.getFile(fileName);
      } catch (error) {
        console.log(error);
      }
      if (isInFile) hasDownload++;
      if (!isInFile) {
        try {
          let fileUri = `internal://files/${fileName}`;
          let baseUrl = 'http://download.chorblack.top'
          const chunkResponse = await this.fetchPromise({
            url: `${baseUrl}/pd/local/dictionary/${fileName}`,
            responseType: "arraybuffer",
          });
          const textData = chunkResponse.data;
          /*
          await this.writeTextPromise({
            uri: fileUri,
            text: textData,
          });
          */
          
          await this.writeArrayBufferPromise({
            uri: fileUri,
            buffer: new Uint8Array(textData),
          });
          
          prompt.showToast({
            message: `还剩${data.length - i - 1}`
          })
          hasDownload++;
        } catch (error) {
          //prompt.showToast({message:`下载失败: ${error}`});
          console.error(`下载失败: ${fileName}`, error);
        }
        file.list({
          uri: 'internal://files/',
          success: (data) => {
            this.fileList = data.fileList;
          }
        })
      }
    }
    if (hasDownload == totalNum) {
      prompt.showToast({ message: "下载完成" });
      storage.set({
        key: 'isFinish',
        value: '1',
      })
    }
  },
}
</script>
<style>
.wrapper {
  flex-direction: column;
}
.text {
  height: 180px;
  width: 466px;
  text-align: center;
  font-size: 40px;
  background-color: #203a43;
  color: #ffffff;
  border-bottom: 1px solid #2c5364;
}
.title {
  background-color: #0f2027;
}
.ceiling {
  position: fixed;
  top: 0;
  left: 0;
}
.button {
  width: 466px;
  height: 80px;
  align-items: center;
  color: #ffffff;
  background-color: #1890ff;
}
</style>