leisure-core 1.0.2 → 1.0.3

package/le-button-qr/src/main.vue

@@ -0,0 +1,96 @@
+<template>
+  <div class="le-button-qr">
+    <le-button text="显示二维码" @click="qrMake(btnAttr)"></le-button>
+    <le-dialog-container
+      title="二维码"
+      width="239px"
+      :showDialog="showQrMake"
+      :showFooter="true"
+      saveBtnText="下 载"
+      @close="closeQrMake"
+      @saveData="qrDownLoad"
+    >
+      <div id="qrcodemake" v-if="showQrMake"></div>
+    </le-dialog-container>
+  </div>
+</template>
+<script>
+import QRCode from "qrcodejs2";
+export default {
+  name: "le-button-qr",
+  props: {
+    qrCodeUrl: {
+      type: String,
+      default: "",
+    },
+    fileName: {
+      type: String,
+      default: "二维码",
+    },
+    btnAttr: {
+      type: Object,
+      default: () => {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      showQrMake: false,
+    };
+  },
+  methods: {
+    closeQrMake() {
+      this.showQrMake = false;
+    },
+    qrMake() {
+      let temp = JSON.stringify(this.btnAttr);
+      if (!this.btnAttr || temp == "{}") {
+        this.$emit("qrMake", this.qrMakeCallBack);
+      } else {
+        this.$emit("qrMake", this.btnAttr, this.qrMakeCallBack);
+      }
+    },
+    qrMakeCallBack(res) {
+      if (res && res == "ok") {
+        this.showQrMake = true;
+        setTimeout(() => {
+          this.qrcode("qrcodemake");
+        }, 100);
+      }
+    },
+    qrcode(id) {
+      return new Promise((resolve, reject) => {
+        try {
+          new QRCode(id, {
+            width: 200,
+            height: 200,
+            text: this.qrCodeUrl,
+            colorDark: "#000",
+            colorLight: "#fff",
+          });
+          resolve();
+        } catch (e) {
+          reject("二维码生成错误:" + e);
+        }
+      });
+    },
+    qrDownLoad() {
+      let myCanvas = document
+        .getElementById("qrcodemake")
+        .getElementsByTagName("canvas");
+      let a = document.createElement("a");
+      a.href = myCanvas[0].toDataURL("image/png");
+      a.download = this.fileName;
+      a.click();
+      this.$message.success("正在进行下载保存");
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.le-button-qr {
+  margin-right: 2px;
+  margin-left: 2px;
+}
+</style>

package/le-date-picker/index.js

@@ -0,0 +1,7 @@
+import LeDatePicker from "./src/main.vue";
+
+LeDatePicker.install = function (Vue) {
+  Vue.component(LeDatePicker.name, LeDatePicker);
+};
+
+export default LeDatePicker;

package/le-date-picker/src/main.vue

@@ -0,0 +1,67 @@
+<template>
+  <el-date-picker
+    v-model="internalValue"
+    v-bind="$attrs"
+    v-on="$listeners"
+    :class="['customClass', $attrs.class]"
+    :style="$attrs.style"
+    :type="type"
+  ></el-date-picker>
+</template>
+
+<script>
+export default {
+  name: "le-date-picker",
+  props: {
+    value: {
+      type: [Number, Date, String], // 可以接收时间戳、Date 对象或日期字符串
+      default: null,
+    },
+    type: {
+      type: String,
+      default: "date",
+    },
+    translateDate: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      internalValue: this.convertValueToInternal(this.value), // 初始化内部值
+    };
+  },
+  watch: {
+    // value(newVal) {
+    //   this.internalValue = this.convertValueToInternal(newVal);
+    // },
+    // internalValue(newVal) {
+    //   const outputValue = this.convertValueToOutput(newVal);
+    //   this.$emit("input", outputValue);
+    // },
+  },
+  methods: {
+    convertValueToInternal(value) {
+      if (this.translateDate && typeof value === "number") {
+        return new Date(value * 1000);
+      } else if (value instanceof Date) {
+        return value;
+      } else if (typeof value === "string" && !isNaN(Date.parse(value))) {
+        return new Date(value);
+      } else {
+        return null;
+      }
+    },
+    convertValueToOutput(value) {
+      if (this.translateDate && value instanceof Date) {
+        return Math.floor(value.getTime() / 1000);
+      } else {
+        return value;
+      }
+    },
+  },
+  mounted() {
+    // 如果需要在组件挂载后执行某些操作，可以在这里添加代码。
+  },
+};
+</script>

package/le-date-picker-auto/index.js

@@ -0,0 +1,6 @@
+import LeDatePickerAuto from "./src/main.vue";
+
+LeDatePickerAuto.install = function (Vue) {
+  Vue.component(LeDatePickerAuto.name, LeDatePickerAuto);
+};
+export default LeDatePickerAuto;

package/le-date-picker-auto/src/main.vue

@@ -0,0 +1,131 @@
+<template>
+  <el-date-picker
+    v-model="internalValue"
+    v-bind="$attrs"
+    v-on="$listeners"
+    :class="['customClass', $attrs.class]"
+    :style="$attrs.style"
+    :type="type"
+  ></el-date-picker>
+</template>
+
+<script>
+export default {
+  name: "le-date-picker-auto",
+  props: {
+    value: {
+      type: [Number, Date, String],
+      default: null,
+    },
+    type: {
+      type: String,
+      default: "date",
+    },
+  },
+  data() {
+    return {
+      internalValue: this.convertValueToInternal(this.value),
+    };
+  },
+  watch: {
+    value(newVal) {
+      this.internalValue = this.convertValueToInternal(newVal);
+    },
+    internalValue(newVal) {
+      const outputValue = this.convertValueToOutput(newVal);
+      this.$emit("input", outputValue);
+    },
+  },
+  methods: {
+    isTimestampInSeconds(value) {
+      if (typeof value !== "number") return false;
+
+      // 秒级时间戳通常是10位数字（当前时间戳约16-17亿）
+      // 但为了更准确，我们检查时间戳是否在合理范围内
+      const currentSeconds = Math.floor(Date.now() / 1000);
+      const minReasonable = 0; // 1970-01-01
+      const maxReasonable = currentSeconds + 100 * 365 * 24 * 60 * 60; // 当前时间 + 100年
+
+      return value >= minReasonable && value <= maxReasonable;
+    },
+
+    isTimestampInMilliseconds(value) {
+      if (typeof value !== "number") return false;
+
+      // 毫秒级时间戳通常是13位数字
+      // 检查是否在合理的时间范围内
+      const currentMs = Date.now();
+      const minReasonable = 0; // 1970-01-01
+      const maxReasonable = currentMs + 100 * 365 * 24 * 60 * 60 * 1000; // 当前时间 + 100年
+
+      return value >= minReasonable && value <= maxReasonable;
+    },
+
+    convertValueToInternal(value) {
+      if (value === null || value === undefined || value === "") {
+        return null;
+      }
+
+      // 如果是数字时间戳
+      if (typeof value === "number") {
+        if (this.isTimestampInSeconds(value)) {
+          // 确认是秒级时间戳，转换为毫秒
+          return new Date(value * 1000);
+        } else if (this.isTimestampInMilliseconds(value)) {
+          // 如果是毫秒级时间戳，也转换为秒再处理，确保一致性
+          const seconds = Math.floor(value / 1000);
+          return new Date(seconds * 1000);
+        } else {
+          // 无法识别的数字，尝试直接作为毫秒处理
+          console.warn("无法识别的时间戳格式，将尝试作为毫秒处理:", value);
+          return new Date(value);
+        }
+      }
+      // 如果是 Date 对象
+      else if (value instanceof Date) {
+        return value;
+      }
+      // 如果是字符串日期
+      else if (typeof value === "string") {
+        const parsedDate = new Date(value);
+        return isNaN(parsedDate.getTime()) ? null : parsedDate;
+      }
+      // 其他情况返回 null
+      else {
+        console.warn("无法处理的值类型:", typeof value, value);
+        return null;
+      }
+    },
+
+    convertValueToOutput(value) {
+      if (value === null || value === undefined || value === "") {
+        return null;
+      }
+
+      // 如果是 Date 对象，转换为时间戳（秒）
+      if (value instanceof Date) {
+        return Math.floor(value.getTime() / 1000);
+      }
+      // 如果是数字，根据位数判断是否需要转换
+      else if (typeof value === "number") {
+        if (this.isTimestampInSeconds(value)) {
+          return value; // 已经是秒，直接返回
+        } else if (this.isTimestampInMilliseconds(value)) {
+          return Math.floor(value / 1000); // 毫秒转秒
+        } else {
+          console.warn("无法识别的时间戳格式，将尝试作为秒处理:", value);
+          return value;
+        }
+      }
+      // 其他情况返回 null
+      else {
+        console.warn("无法输出的值类型:", typeof value, value);
+        return null;
+      }
+    },
+  },
+  mounted() {
+    // 如果需要在组件挂载后执行某些操作，可以在这里添加代码。
+  },
+};
+</script>

package/le-dialog-container/index.js

@@ -0,0 +1,7 @@
+import LeDialogContainer from "./src/main.vue";
+
+LeDialogContainer.install = function (Vue) {
+  Vue.component(LeDialogContainer.name, LeDialogContainer);
+};
+
+export default LeDialogContainer;

package/le-dialog-container/src/main.vue

@@ -0,0 +1,80 @@
+<template>
+  <el-dialog :width="width" :title="title" :visible.sync="dialogShow" :close-on-click-modal="closeMode"
+    :show-close="showCloseBtnTop" append-to-body @close="closeDialog" v-el-drag-dialog>
+    <slot v-if="dialogShow" />
+    <div slot="footer" v-if="showFooter" class="dialog-footer">
+      <template>
+        <slot name="le-footer"></slot>
+        <le-button type="primary" v-if="showSaveBtn" @click="saveData">{{
+          saveBtnText
+        }}</le-button>
+        <le-button type="info" v-if="showCloseBtn" @click="closeDialog">关闭</le-button>
+      </template>
+    </div>
+  </el-dialog>
+</template>
+<script>
+export default {
+  name: "le-dialog-container",
+  props: {
+    showDialog: {
+      type: Boolean,
+      default: false,
+    },
+    width: {
+      type: String,
+      default: "60%",
+    },
+    title: {
+      type: String,
+      default: "商品详情",
+    },
+    closeMode: {
+      type: Boolean,
+      default: false,
+    },
+    showFooter: {
+      type: Boolean,
+      default: false,
+    },
+    showSaveBtn: {
+      type: Boolean,
+      default: true,
+    },
+    showCloseBtn: {
+      type: Boolean,
+      default: true,
+    },
+    showCloseBtnTop: {
+      type: Boolean,
+      default: false,
+    },
+    saveBtnText: {
+      type: String,
+      default: "确 定",
+    },
+  },
+  data() {
+    return {};
+  },
+  computed: {
+    dialogShow: {
+      get() {
+        return this.showDialog;
+      },
+      set(newValue) {
+        // this.$emit("close", newValue);
+      },
+    },
+  },
+  mounted() { },
+  methods: {
+    closeDialog(param) {
+      this.$emit("close", param);
+    },
+    saveData() {
+      this.$emit("saveData");
+    },
+  },
+};
+</script>

package/le-form/index.js

@@ -0,0 +1,7 @@
+import LeForm from "./src/main.vue";
+
+LeForm.install = function (Vue) {
+  Vue.component(LeForm.name, LeForm);
+};
+
+export default LeForm;

package/le-form/src/main.vue

@@ -0,0 +1,13 @@
+<template>
+  <le-form v-bind="$attrs" v-on="$listeners" :style="$attrs.style">
+    <slot></slot>
+  </le-form>
+</template>
+<script>
+export default {
+  name: "le-form",
+  inheritAttrs: false,
+  props: {},
+  methods: {},
+};
+</script>

package/le-form-item/index.js

@@ -0,0 +1,7 @@
+import LeFormItem from "./src/main.vue";
+
+LeFormItem.install = function (Vue) {
+  Vue.component(LeFormItem.name, LeFormItem);
+};
+
+export default LeFormItem;

package/le-form-item/src/main.vue

@@ -0,0 +1,13 @@
+<template>
+  <le-form-item v-bind="$attrs" v-on="$listeners" :style="$attrs.style">
+    <slot></slot>
+  </le-form-item>
+</template>
+<script>
+export default {
+  name: "le-form-item",
+  inheritAttrs: false,
+  props: {},
+  methods: {},
+};
+</script>

package/le-home/index.js

@@ -0,0 +1,7 @@
+import LeHome from "./src/main.vue";
+
+LeHome.install = function (Vue) {
+  Vue.component(LeHome.name, LeHome);
+};
+
+export default LeHome;

package/le-home/src/LeHeaderMenu.vue

@@ -0,0 +1,60 @@
+<template>
+  <!-- 有子项:渲染为 submenu(一级横向 / 下级下拉均支持) -->
+  <el-submenu
+    v-if="hasChildren"
+    :index="item.name"
+    popper-class="le-header-menu-popper"
+  >
+    <template slot="title">
+      <i v-if="item.icon" :class="item.icon"></i>
+      <span>{{ item.title }}</span>
+    </template>
+    <!-- 递归渲染子节点 -->
+    <le-header-menu
+      v-for="child in visibleChildren"
+      :key="child.id || child.name"
+      :item="child"
+      :level="level + 1"
+      :on-select="onSelect"
+    ></le-header-menu>
+  </el-submenu>
+  <!-- 叶子节点:渲染为 menu-item -->
+  <el-menu-item v-else :index="item.name" @click="handleClick">
+    <i v-if="item.icon" :class="item.icon"></i>
+    <span>{{ item.title }}</span>
+  </el-menu-item>
+</template>
+
+<script>
+export default {
+  name: "LeHeaderMenu",
+  props: {
+    item: {
+      type: Object,
+      required: true,
+    },
+    level: {
+      type: Number,
+      default: 0,
+    },
+    onSelect: {
+      type: Function,
+      default: () => {},
+    },
+  },
+  computed: {
+    hasChildren() {
+      return Array.isArray(this.item.children) && this.item.children.length > 0;
+    },
+    visibleChildren() {
+      if (!this.item.children) return [];
+      return this.item.children.filter((child) => child.ishide !== 1);
+    },
+  },
+  methods: {
+    handleClick() {
+      this.onSelect(this.item);
+    },
+  },
+};
+</script>