oxy-uni-ui 2.1.1 → 2.1.2

package/devTools/page/components/dialog/textFileEditDialog.vue

@@ -0,0 +1,391 @@
+<template>
+  <view>
+    <view
+      class="dialogMask"
+      v-if="isShow"
+      :style="{
+        height: height + 'px',
+      }"
+    >
+      <view
+        class="dialogContent"
+        @click.stop
+      >
+        <view
+          class="dialogHead"
+        >
+          <view>
+            <text class="title">{{ title }}</text>
+          </view>
+          <view
+            class="closeBtn"
+            @click.stop="hide"
+          >
+            <text class="closeText">关闭</text>
+            <text class="closeIcon">×</text>
+          </view>
+        </view>
+        <scroll-view
+          scroll-y
+          class="scrollList"
+          :style="{
+            height: dialogHeight + 'px',
+          }"
+        >
+          <textarea
+            :style="{
+              height: dialogHeight - (canSave ? 90 : 40) + 'px',
+            }"
+            v-model="value"
+            type="text"
+            placeholder="请输入..."
+            class="fileEditInput"
+            maxlength="-1"
+          />
+          <view
+            class="saveBtn"
+            v-if="canSave"
+            @click="saveFile"
+          >
+            <text class="saveBtnText">保存</text>
+          </view>
+        </scroll-view>
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+import devUi from "../../../core/libs/devUi.js";
+let success, error;
+export default {
+  data() {
+    return {
+      /**
+       * 是否展示
+       */
+      isShow: false,
+      /**
+       * 屏幕高度
+       */
+      height: uni.getSystemInfoSync().windowHeight,
+      dialogHeight: uni.getSystemInfoSync().windowHeight * 0.8,
+      /**
+       * 弹窗标题
+       */
+      title: "",
+      /**
+       * 文本内容
+       */
+      value: "",
+      /**
+       * 是否为文件编辑模式
+       */
+      isFileEdit: true,
+      /**
+       * 文件路径
+       */
+      path: "",
+      /**
+       * 是否允许保存
+       */
+      canSave: false,
+      /**
+       * 是否为新建文件
+       */
+      isNewFile: false,
+    };
+  },
+  mounted() {
+    let that = this;
+    uni.$on("devTools_showTextEditDialog", (options) => {
+      that
+        .show(options)
+        .then((val) => {
+          uni.$emit("devTools_showTextEditDialogSave", val);
+        })
+        .catch(() => {
+          uni.$emit("devTools_showTextEditDialogHide");
+        });
+    });
+  },
+  unmounted() {
+    uni.$off("devTools_showTextEditDialog");
+  },
+  methods: {
+    /**
+     * 展示弹窗
+     */
+    show(options) {
+      let that = this;
+      return new Promise((yes, err) => {
+        success = yes;
+        error = err;
+        that.title = options.title;
+        that.canSave = Boolean(options.canSave);
+        that.isShow = true;
+
+        if (options.isFileEdit === false) {
+          // 仅为文件编辑模式
+          that.isFileEdit = false;
+          try {
+            that.value = JSON.stringify(JSON.parse(options.value), null, 2);
+          } catch (error) {
+            that.value = options.value;
+          }
+          return;
+        }
+        that.isFileEdit = true;
+        that.value = "文件读取中...";
+        that.path = options.path;
+        that.isNewFile = Boolean(options.isNewFile);
+
+        // #ifdef APP-PLUS
+        if (that.isNewFile) {
+          that.value = "";
+        } else {
+          plus.io.resolveLocalFileSystemURL(
+            that.path,
+            (entry) => {
+              // 可通过entry对象操作test.html文件
+              entry.file((file) => {
+                var fileReader = new plus.io.FileReader();
+                fileReader.readAsText(file, "utf-8");
+                fileReader.onloadend = function (evt) {
+                  let res = "";
+                  try {
+                    res = JSON.stringify(JSON.parse(evt.target.result), null, 2);
+                  } catch (error) {
+                    res = evt.target.result;
+                  }
+                  that.value = res;
+                };
+                fileReader.onerror = function () {
+                  that.value = `[${that.path}]文件读取失败！_code_2`;
+                };
+              });
+            },
+            function (e) {
+              that.value = `[${that.path}]文件读取失败！` + e.message;
+            }
+          );
+        }
+        // #endif
+
+        // #ifdef MP-WEIXIN
+        let fs = wx.getFileSystemManager();
+        if (options.size != 0) {
+          fs.readFile({
+            filePath: that.path,
+            encoding: "utf8",
+            position: 0,
+            length: options.size,
+            success({ data }) {
+              try {
+                that.value = JSON.stringify(JSON.parse(data), null, 2);
+              } catch (error) {
+                that.value = data;
+              }
+            },
+            fail(e) {
+              console.log(e);
+              that.value = `[${that.path}]文件读取失败！` + e;
+            },
+          });
+        } else {
+          that.value = "";
+        }
+        // #endif
+      });
+    },
+    /**
+     * 关闭弹窗
+     */
+    hide() {
+      this.isShow = false;
+      error();
+    },
+    /**
+     * 保存
+     */
+    save() {
+      this.isShow = false;
+      success(this.value);
+    },
+    /**
+     * 保存文件
+     */
+    saveFile() {
+      let that = this;
+
+      if (!that.isFileEdit) {
+        // 非文件编辑模式
+
+        that.isShow = false;
+        success(that.value);
+
+        return;
+      }
+
+      devUi.showLoading({
+        title: "保存中",
+      });
+
+      // #ifdef APP-PLUS
+
+      let fileName = that.path.split("/").pop();
+      let path = that.path.substring(0, that.path.length - fileName.length);
+
+      plus.io.resolveLocalFileSystemURL(
+        path,
+        (entry) => {
+          entry.getFile(
+            fileName,
+            {
+              create: true,
+            },
+            (fileEntry) => {
+              fileEntry.createWriter((writer) => {
+                writer.onwrite = (e) => {
+                  devUi.hideLoading();
+                  devUi.showToast({
+                    title: "文件保存成功！",
+                    icon: "success",
+                  });
+                  that.isShow = false;
+                  that.$emit("getPage");
+                };
+                writer.onerror = () => {
+                  devUi.hideLoading();
+                  devUi.showToast({
+                    title: "文件保存失败！_写入文件失败",
+                    icon: "none",
+                  });
+                };
+                writer.write(that.value);
+              });
+            }
+          );
+        },
+        () => {
+          devUi.hideLoading();
+          devUi.showToast({
+            title: "文件保存失败！_打开目录失败",
+            icon: "none",
+          });
+        }
+      );
+      // #endif
+
+      // #ifdef MP-WEIXIN
+
+      let fs = wx.getFileSystemManager();
+      fs.writeFile({
+        filePath: that.path,
+        encoding: "utf-8",
+        data: that.value,
+        success() {
+          devUi.hideLoading();
+          devUi.showToast({
+            title: "文件保存成功！",
+            icon: "success",
+          });
+          that.isShow = false;
+          that.$emit("getPage");
+        },
+        fail() {
+          devUi.hideLoading();
+          devUi.showToast({
+            title: "文件保存失败！_打开目录失败",
+            icon: "none",
+          });
+        },
+      });
+
+      // #endif
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.dialogMask {
+  display: flex;
+  flex-direction: column-reverse;
+  background-color: rgba(0, 0, 0, 0.3);
+  width: 750rpx;
+  flex: 1;
+  /* #ifndef APP-PLUS */
+  height: 100vh;
+  backdrop-filter: blur(1px);
+  /* #endif */
+  position: fixed;
+  left: 0;
+  top: 0;
+  z-index: 999;
+  .dialogContent {
+    display: flex;
+    flex-direction: column;
+    width: 750rpx;
+    background-color: #fff;
+    border-radius: 20rpx 20rpx 0 0;
+    .dialogHead {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: space-between;
+      height: 80rpx;
+      border-bottom: 1px solid rgba(0, 0, 0, 0.05);
+      width: 750rpx;
+      .title {
+        margin-left: 20rpx;
+        font-size: 24rpx;
+        line-height: 24rpx;
+        color: #333;
+      }
+      .closeBtn {
+        margin-right: 20rpx;
+        padding: 8rpx 14rpx;
+        border-radius: 999rpx;
+        border: 1px solid rgba(100, 116, 139, 0.28);
+        background-color: #f8fafc;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+      }
+      .closeText {
+        font-size: 22rpx;
+        color: #64748b;
+        line-height: 22rpx;
+      }
+      .closeIcon {
+        margin-left: 8rpx;
+        font-size: 24rpx;
+        line-height: 24rpx;
+        color: #334155;
+      }
+    }
+    .scrollList {
+      width: 750rpx;
+      padding: 20rpx;
+      .fileEditInput {
+        font-size: 20rpx;
+      }
+      .saveBtn {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: center;
+        margin-top: 20rpx;
+        height: 35px;
+        width: 710rpx;
+        border-radius: 10rpx;
+        background-color: #3b82f6;
+        .saveBtnText {
+          color: #fff;
+          font-size: 24rpx;
+          line-height: 24rpx;
+        }
+      }
+    }
+  }
+}
+</style>

package/devTools/page/components/libs/appDelDir.js

@@ -0,0 +1,86 @@
+import dirReader from "./dirReader"
+
+/**
+ * 遍历删除整个文件夹，以“/”结尾
+ */
+export default function appDelDir(path, needDelSelf = true) {
+  return new Promise(async (yes, err) => {
+    let dirList = await dirReader.getDirFileList(path)
+    for (let i = 0; i < dirList.length; i++) {
+      let item = dirList[i];
+      try {
+        if (item.type == "dir") {
+          let info = await getMeteInfo(path + item.name + "/")
+          if (
+            info.directoryCount > 0
+            || info.fileCount > 0
+          ) {
+            await appDelDir(path + item.name + "/")
+          } else {
+            await delDir(path + item.name + "/")
+          }
+        } else {
+          await delFile(path + item.name)
+        }
+      } catch (error) { }
+    }
+    try {
+      if (needDelSelf) {
+        await delDir(path)
+      }
+    } catch (error) { }
+    yes()
+  })
+}
+
+function delFile(path) {
+  return new Promise((yes, err) => {
+    plus.io.resolveLocalFileSystemURL(
+      path,
+      (entry) => {
+        entry.remove(
+          yes,
+          err
+        )
+      },
+      err
+    );
+  })
+}
+
+function delDir(path) {
+  return new Promise((yes, err) => {
+    plus.io.resolveLocalFileSystemURL(
+      path,
+      (entry) => {
+        entry.remove(
+          yes,
+          err
+        )
+      },
+      err
+    );
+  })
+}
+
+/**
+ * 获取文件夹内信息
+ * @returns {Promise<PlusIoMetadata>}
+ */
+function getMeteInfo(path) {
+  return new Promise((yes, err) => {
+    plus.io.resolveLocalFileSystemURL(
+      path,
+      (entry) => {
+        if (entry.isDirectory) {
+          entry.getMetadata((metadata) => {
+            yes(metadata)
+          }, err)
+        } else {
+          err()
+        }
+      },
+      err
+    );
+  })
+}

package/devTools/page/components/libs/dirReader.js

@@ -0,0 +1,248 @@
+import devUi from "../../../core/libs/devUi.js";
+import iconUnknown from "../../static/fileSys/weizhiwenjian.png";
+import iconDwg from "../../static/fileSys/DWG.png";
+import iconExcel from "../../static/fileSys/excel.png";
+import iconExe from "../../static/fileSys/EXE.png";
+import iconGif from "../../static/fileSys/GIF.png";
+import iconHtml from "../../static/fileSys/HTML.png";
+import iconPdf from "../../static/fileSys/pdf.png";
+import iconPpt from "../../static/fileSys/pptl.png";
+import iconPsd from "../../static/fileSys/PSD.png";
+import iconRvt from "../../static/fileSys/RVT.png";
+import iconVideo from "../../static/fileSys/shipin.png";
+import iconSkp from "../../static/fileSys/SKP.png";
+import iconSvg from "../../static/fileSys/SVG.png";
+import iconImage from "../../static/fileSys/tupian.png";
+import iconTxt from "../../static/fileSys/txt.png";
+import iconWord from "../../static/fileSys/word.png";
+import iconZip from "../../static/fileSys/yasuo.png";
+import iconAudio from "../../static/fileSys/yinpin.png";
+import iconDir from "../../static/fileSys/wenjianjia.png";
+const iconConfig = [
+  {
+    type: ["", undefined, null],
+    mime: "",
+    icon: iconUnknown,
+  },
+  {
+    type: ["dwg"],
+    mime: "dwg",
+    icon: iconDwg,
+  },
+  {
+    type: ["xls", "xlsx", "csv"],
+    mime: "xls",
+    icon: iconExcel,
+  },
+  {
+    type: ["exe"],
+    mime: "exe",
+    icon: iconExe,
+  },
+  {
+    type: ["gif"],
+    mime: "gif",
+    icon: iconGif,
+  },
+  {
+    type: ["html"],
+    mime: "html",
+    icon: iconHtml,
+  },
+  {
+    type: ["pdf"],
+    mime: "pdf",
+    icon: iconPdf,
+  },
+  {
+    type: ["ppt"],
+    mime: "ppt",
+    icon: iconPpt,
+  },
+  {
+    type: ["psd"],
+    mime: "psd",
+    icon: iconPsd,
+  },
+  {
+    type: ["rvt"],
+    mime: "rvt",
+    icon: iconRvt,
+  },
+  {
+    type: [
+      "mp4",
+      "avi",
+      "wmv",
+      "mpg",
+      "mpeg",
+      "mov",
+      "flv",
+      "3gp",
+      "mp3gp",
+      "mkv",
+      "rmvb",
+    ],
+    mime: "mp4",
+    icon: iconVideo,
+  },
+  {
+    type: ["skp"],
+    mime: "skp",
+    icon: iconSkp,
+  },
+  {
+    type: ["svg"],
+    mime: "svg",
+    icon: iconSvg,
+  },
+  {
+    type: ["png", "jpeg", "jpg", "webp", "bmp"],
+    mime: "img",
+    icon: iconImage,
+  },
+  {
+    type: ["txt", "sql", "js", "css", "log", "json"],
+    mime: "txt",
+    icon: iconTxt,
+  },
+  {
+    type: ["word"],
+    mime: "word",
+    icon: iconWord,
+  },
+  {
+    type: ["zip", "rar", "gz", "7z"],
+    mime: "zip",
+    icon: iconZip,
+  },
+  {
+    type: ["mp3", "wma", "wav", "aac", "flac"],
+    mime: "",
+    icon: iconAudio,
+  },
+];
+
+
+export default {
+  /**
+   * 获取文件和目录列表
+   */
+  getDirFileList(path) {
+    return new Promise((yes) => {
+      // #ifdef APP-PLUS
+      plus.io.resolveLocalFileSystemURL(path, function (entry) {
+        if (entry.isDirectory) {
+          let reader = entry.createReader();
+          reader.readEntries(
+            async (entries) => {
+              let dirList = [];
+              let fileList = [];
+              for (let i = 0; i < entries.length; i++) {
+                /**
+                 * @type {PlusIoDirectoryEntry}
+                 */
+                const item = entries[i];
+                let meta = await getMetaData(item)
+                let row = {
+                  type: item.isDirectory ? 'dir' : 'file',
+                  name: item.name,
+                  fileType: getFileType(item.name),
+                  ...meta,
+                }
+                if (item.isDirectory) {
+                  dirList.push(row)
+                } else {
+                  fileList.push(row)
+                }
+              }
+
+              dirList = dirList.sort((a, b) => (b.time || 0) - (a.time || 0))
+              fileList = fileList.sort((a, b) => (b.time || 0) - (a.time || 0))
+
+              yes([
+                ...dirList,
+                ...fileList,
+              ])
+            },
+            (e) => {
+              console.log("readEntries error", e);
+              devUi.showToast({
+                title: "文件读取失败: " + e.message,
+                icon: "none",
+              });
+              yes([])
+            }
+          );
+        } else {
+          devUi.showToast({
+            title: "路径读取失败_b",
+            icon: "none",
+          });
+          yes([])
+        }
+      }, () => {
+        devUi.showToast({
+          title: "路径读取失败_a",
+          icon: "none",
+        });
+        yes([])
+      });
+      // #endif
+    })
+  },
+  /**
+   * 获取文件图片
+   */
+  getFileIcon(type) {
+    for (let i = 0; i < iconConfig.length; i++) {
+      const item = iconConfig[i];
+      for (let _i = 0; _i < item.type.length; _i++) {
+        const typeName = item.type[_i];
+        if (type == typeName) {
+          return item.icon;
+        }
+      }
+    }
+    return iconUnknown;
+  },
+  getDirIcon() {
+    return iconDir;
+  }
+}
+
+/**
+ * @param {PlusIoDirectoryEntry} entry 
+ */
+function getMetaData(entry) {
+  return new Promise((yes) => {
+    entry.getMetadata(function (metadata) {
+      yes({
+        size: metadata.size,
+        time: metadata.modificationTime.getTime(),
+        fileCount: metadata.fileCount,
+        directoryCount: metadata.directoryCount,
+      })
+    }, function () {
+      yes({
+        size: 0,
+        time: 0,
+        fileCount: 0,
+        directoryCount: 0,
+      })
+    });
+  })
+}
+
+function getFileType(name) {
+  if (typeof name == "string") {
+    let tList = name.split(".");
+    if (tList.length > 1) {
+      return tList.pop().toLocaleLowerCase()
+    } else {
+      return ""
+    }
+  } else {
+    return ""
+  }
+}