@qxs-bns/components 0.0.20 → 0.0.22

package/es/src/data-chart/src/utils/config.js

@@ -0,0 +1,380 @@
+import { merge } from 'lodash-es';
+
+const iconList = {
+  data: [{
+    showTypeName: "table",
+    label: "\u8868\u683C",
+    coverImg: "table.png",
+    disabled: () => false,
+    subTypeList: [],
+    showType: 0,
+    baseConfig: {}
+  }, {
+    showTypeName: "line",
+    label: "\u6298\u7EBF\u56FE",
+    coverImg: "line-stack.png",
+    showType: 1,
+    subTypeList: [{
+      value: "line-simple",
+      icon: "line-smooth",
+      tooltipContent: "\u6298\u7EBF\u56FE"
+    }, {
+      value: "area-basic",
+      icon: "chart-line-area",
+      tooltipContent: "\u6298\u7EBF\u9762\u79EF\u56FE"
+    }],
+    baseConfig: {
+      tooltip: {
+        confine: false,
+        trigger: "axis",
+        axisPointer: {
+          type: "line"
+        }
+      },
+      toolbox: {
+        show: false,
+        showTitle: false,
+        feature: {
+          // dataView: { readOnly: true },
+          // restore: {},
+          saveAsImage: {}
+        }
+      },
+      legend: {
+        type: "scroll",
+        top: "25px"
+      },
+      grid: {
+        left: "0",
+        bottom: "10px",
+        containLabel: true
+      },
+      xAxis: {
+        type: "category",
+        boundaryGap: false
+      },
+      yAxis: {
+        type: "value"
+      },
+      dataZoom: [{
+        type: "inside"
+      }]
+    },
+    disabled: (_, groupByInfos) => {
+      const groupByInfosLenght = groupByInfos?.length;
+      if (groupByInfosLenght >= 1 && groupByInfosLenght < 2) {
+        return false;
+      }
+      return true;
+    }
+  }, {
+    showTypeName: "bar",
+    label: "\u67F1\u72B6\u56FE",
+    coverImg: "bar-tick-align.png",
+    showType: 2,
+    baseConfig: {
+      legend: {
+        type: "scroll",
+        top: "25px"
+      },
+      tooltip: {
+        confine: false,
+        trigger: "axis",
+        axisPointer: {
+          type: "shadow"
+        }
+      },
+      toolbox: {
+        show: false,
+        showTitle: false,
+        feature: {
+          // dataView: { readOnly: true },
+          // restore: {},
+          saveAsImage: {}
+          // myFull: { // 全屏
+          //   show: true,
+          //   title: '全屏',
+          //   icon: 'path://...',
+          // }
+        }
+      },
+      grid: {
+        left: "0",
+        bottom: "20px",
+        containLabel: true
+      },
+      xAxis: {
+        axisLabel: {
+          showMaxLabel: true
+        },
+        axisTick: {
+          alignWithLabel: true
+        }
+      },
+      yAxis: {},
+      dataZoom: [{
+        type: "inside"
+      }]
+    },
+    subTypeList: [{
+      value: "bar-simple",
+      icon: "bar-simple",
+      tooltipContent: "\u5782\u76F4\u6761\u5F62\u56FE"
+    }, {
+      value: "bar-y-category",
+      icon: "bar-y-category",
+      tooltipContent: "\u6C34\u5E73\u6761\u5F62\u56FE"
+    }],
+    disabled: (_, groupByInfos) => {
+      const groupByInfosLenght = groupByInfos?.length;
+      if (groupByInfosLenght >= 1) {
+        return false;
+      }
+      return true;
+    }
+  }, {
+    showTypeName: "pie",
+    label: "\u997C\u56FE",
+    coverImg: "pie-simple.png",
+    showType: 4,
+    subTypeList: [{
+      value: "pie-simple",
+      icon: "pie-simple",
+      tooltipContent: "\u997C\u56FE"
+    }, {
+      value: "pie-borderRadius",
+      icon: "pie-borderRadius",
+      tooltipContent: "\u73AF\u5F62\u56FE"
+    }],
+    baseConfig: {
+      tooltip: {
+        confine: true,
+        formatter: "{a}<br>{b}: {c}({d}%)",
+        trigger: "item"
+      },
+      toolbox: {
+        show: false,
+        showTitle: false,
+        feature: {
+          // dataView: { readOnly: true },
+          // restore: {},
+          saveAsImage: {}
+        }
+      },
+      legend: {
+        type: "scroll",
+        top: "25px"
+      }
+    },
+    disabled: (selectInfos, groupByInfos) => {
+      const groupByInfosLenght = groupByInfos?.length;
+      const selectInfosLength = selectInfos?.length;
+      if (selectInfosLength <= 4 && groupByInfosLenght > 0 && groupByInfosLenght <= 1) {
+        return false;
+      }
+      return true;
+    }
+  }, {
+    showTypeName: "area",
+    label: "\u5730\u56FE",
+    coverImg: "area.png",
+    showType: 5,
+    subTypeList: [],
+    baseConfig: {
+      tooltip: {
+        confine: true,
+        trigger: "item"
+      },
+      toolbox: {
+        show: false,
+        showTitle: false,
+        feature: {
+          // dataView: { readOnly: true },
+          // restore: {},
+          saveAsImage: {}
+        }
+      },
+      visualMap: {
+        text: ["\u9AD8", "\u4F4E"],
+        realtime: false,
+        calculable: true,
+        inRange: {
+          color: ["lightskyblue", "yellow", "orangered"]
+        }
+      }
+    },
+    disabled: (_, groupByInfos) => {
+      const groupByInfosLenght = groupByInfos?.length;
+      const flag = groupByInfos?.some(_ref => {
+        let {
+          colDesc
+        } = _ref;
+        return colDesc.includes("\u7701") || colDesc.includes("\u5E02");
+      });
+      if (flag && groupByInfosLenght > 0) {
+        return false;
+      }
+      return true;
+    }
+  }, {
+    showTypeName: "funnel",
+    label: "\u6F0F\u6597\u56FE",
+    coverImg: "funnel.png",
+    showType: 6,
+    subTypeList: [],
+    baseConfig: {
+      tooltip: {
+        confine: true,
+        trigger: "item",
+        formatter: "{a} <br/>{b} : {c}"
+      },
+      toolbox: {
+        show: false,
+        showTitle: false,
+        feature: {
+          // dataView: { readOnly: true },
+          // restore: {},
+          saveAsImage: {}
+        }
+      },
+      legend: {
+        type: "scroll",
+        top: 20
+      }
+    },
+    disabled: (selectInfos, groupByInfos) => {
+      const groupByInfosLenght = groupByInfos?.length;
+      const selectInfosLength = selectInfos?.length;
+      if (selectInfosLength <= 5 && groupByInfosLenght > 0 && groupByInfosLenght <= 1) {
+        return false;
+      }
+      return true;
+    }
+  },
+  // { label: 'scatter', value: 7 },
+  {
+    showTypeName: "card",
+    label: "\u5361\u7247",
+    coverImg: "card.png",
+    showType: 9,
+    subTypeList: [],
+    baseConfig: {},
+    disabled: (selectInfos, groupByInfos) => {
+      const groupByInfosLenght = groupByInfos?.length;
+      const selectInfosLength = selectInfos?.length;
+      if (selectInfosLength > 0 && groupByInfosLenght <= 1) {
+        return false;
+      }
+      return true;
+    }
+  }, {
+    showTypeName: "radar",
+    label: "\u96F7\u8FBE\u56FE",
+    coverImg: "radar.png",
+    showType: 10,
+    subTypeList: [],
+    baseConfig: {
+      legend: {
+        type: "scroll",
+        orient: "vertical",
+        left: "left",
+        top: "25px"
+      },
+      tooltip: {
+        confine: true,
+        trigger: "item"
+      },
+      toolbox: {
+        show: false,
+        showTitle: false,
+        feature: {
+          // dataView: { readOnly: true },
+          // restore: {},
+          saveAsImage: {}
+        }
+      },
+      radar: {
+        // shape: 'circle',
+        center: ["50%", "55%"]
+      }
+    },
+    disabled: (selectInfos, groupByInfos) => {
+      const groupByInfosLenght = groupByInfos?.length;
+      if (groupByInfosLenght === 1 && selectInfos.length === 1) {
+        return false;
+      }
+      return true;
+    }
+  }, {
+    showTypeName: "scatter-simple",
+    label: "\u6563\u70B9\u56FE",
+    coverImg: "",
+    showType: 11,
+    subTypeList: [],
+    disabled: () => false,
+    baseConfig: {
+      grid: {
+        left: "0",
+        bottom: "10px",
+        containLabel: true
+      },
+      tooltip: {
+        showDelay: 0,
+        axisPointer: {
+          show: true,
+          type: "cross",
+          lineStyle: {
+            type: "dashed",
+            width: 1
+          }
+        }
+      },
+      toolbox: {
+        show: false,
+        showTitle: false,
+        feature: {
+          // dataView: { readOnly: true },
+          // restore: {},
+          saveAsImage: {}
+        }
+      },
+      legend: {
+        type: "scroll",
+        top: "25px"
+      },
+      xAxis: {
+        splitLine: {
+          lineStyle: {
+            type: "dashed"
+          }
+        }
+      },
+      yAxis: {
+        splitLine: {
+          lineStyle: {
+            type: "dashed"
+          }
+        }
+      }
+    }
+  }]
+};
+function setDefaultChartOption(option, changeConfig) {
+  const obj = {};
+  option.forEach(item => {
+    obj[item.showTypeName] = merge(item.baseConfig, changeConfig);
+  });
+  return obj;
+}
+const defaultChartOption = setDefaultChartOption(iconList.data, {
+  backgroundColor: "transparent",
+  title: {
+    textStyle: {
+      fontSize: 14,
+      lineHeight: 16
+    }
+  }
+});
+
+export { defaultChartOption, iconList, setDefaultChartOption };
+//# sourceMappingURL=config.js.map

package/es/src/data-chart/src/utils/config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"config.js","sources":["../../../../../../../packages/components/src/data-chart/src/utils/config.ts"],"sourcesContent":["import type { GeoJson, IconRow, IGroupByInfos, ISelectInfos } from '../types'\nimport { merge } from 'lodash-es'\n\n/**\n * 禁用功能函数\n * 判断当前图表类型是否被禁用\n * 调用时机：渲染页面\n * @param {object} selectInfos 选择信息\n * @param {object} groupByInfos 分组信息\n * @param {Message[]|Message} data 数据\n * @returns Boolean 布尔值\n */\nexport const iconList: {\n  data: IconRow[]\n  get: (type: keyof IconRow, value: any) => IconRow\n} = {\n  get(type: keyof IconRow = 'showTypeName', value: any = 'table') {\n    return iconList.data.find(item => item[type].toString() === value || item[type] === value)!\n  },\n  data: [\n    {\n      showTypeName: 'table',\n      label: '表格',\n      coverImg: 'table.png',\n      disabled: () => false,\n      subTypeList: [],\n      showType: 0,\n      baseConfig: {},\n    },\n    {\n      showTypeName: 'line',\n      label: '折线图',\n      coverImg: 'line-stack.png',\n      showType: 1,\n      subTypeList: [\n        {\n          value: 'line-simple',\n          icon: 'line-smooth',\n          tooltipContent: '折线图',\n        },\n        {\n          value: 'area-basic',\n          icon: 'chart-line-area',\n          tooltipContent: '折线面积图',\n        },\n      ],\n      baseConfig: {\n        tooltip: {\n          confine: false,\n          trigger: 'axis',\n          axisPointer: {\n            type: 'line',\n          },\n        },\n        toolbox: {\n          show: false,\n          showTitle: false,\n          feature: {\n            // dataView: { readOnly: true },\n            // restore: {},\n            saveAsImage: {},\n          },\n        },\n        legend: {\n          type: 'scroll',\n          top: '25px',\n        },\n        grid: {\n          left: '0',\n          bottom: '10px',\n          containLabel: true,\n        },\n        xAxis: {\n          type: 'category',\n          boundaryGap: false,\n        },\n        yAxis: {\n          type: 'value',\n        },\n        dataZoom: [\n          {\n            type: 'inside',\n          },\n        ],\n      },\n      disabled: (_: ISelectInfos[], groupByInfos: IGroupByInfos[]) => {\n        const groupByInfosLenght = groupByInfos?.length\n        if (groupByInfosLenght >= 1 && groupByInfosLenght < 2) {\n          return false\n        }\n        return true\n      },\n    },\n    {\n      showTypeName: 'bar',\n      label: '柱状图',\n      coverImg: 'bar-tick-align.png',\n      showType: 2,\n      baseConfig: {\n        legend: {\n          type: 'scroll',\n          top: '25px',\n        },\n        tooltip: {\n          confine: false,\n          trigger: 'axis',\n          axisPointer: {\n            type: 'shadow',\n          },\n        },\n        toolbox: {\n          show: false,\n          showTitle: false,\n          feature: {\n            // dataView: { readOnly: true },\n            // restore: {},\n            saveAsImage: {},\n            // myFull: { // 全屏\n            //   show: true,\n            //   title: '全屏',\n            //   icon: 'path://...',\n            // }\n          },\n        },\n        grid: {\n          left: '0',\n          bottom: '20px',\n          containLabel: true,\n        },\n        xAxis: {\n          axisLabel: {\n            showMaxLabel: true,\n          },\n          axisTick: {\n            alignWithLabel: true,\n          },\n        },\n        yAxis: {},\n        dataZoom: [\n          {\n            type: 'inside',\n          },\n        ],\n      },\n      subTypeList: [\n        {\n          value: 'bar-simple',\n          icon: 'bar-simple',\n          tooltipContent: '垂直条形图',\n        },\n        {\n          value: 'bar-y-category',\n          icon: 'bar-y-category',\n          tooltipContent: '水平条形图',\n        },\n      ],\n      disabled: (_: ISelectInfos[], groupByInfos: IGroupByInfos[]) => {\n        const groupByInfosLenght = groupByInfos?.length\n        if (groupByInfosLenght >= 1) {\n          return false\n        }\n        return true\n      },\n    },\n    {\n      showTypeName: 'pie',\n      label: '饼图',\n      coverImg: 'pie-simple.png',\n      showType: 4,\n      subTypeList: [\n        {\n          value: 'pie-simple',\n          icon: 'pie-simple',\n          tooltipContent: '饼图',\n        },\n        {\n          value: 'pie-borderRadius',\n          icon: 'pie-borderRadius',\n          tooltipContent: '环形图',\n        },\n      ],\n      baseConfig: {\n        tooltip: {\n          confine: true,\n          formatter: '{a}<br>{b}: {c}({d}%)',\n          trigger: 'item',\n        },\n        toolbox: {\n          show: false,\n          showTitle: false,\n          feature: {\n            // dataView: { readOnly: true },\n            // restore: {},\n            saveAsImage: {},\n          },\n        },\n        legend: {\n          type: 'scroll',\n          top: '25px',\n        },\n      },\n      disabled: (selectInfos: ISelectInfos[], groupByInfos: IGroupByInfos[]) => {\n        const groupByInfosLenght = groupByInfos?.length\n        const selectInfosLength = selectInfos?.length\n        if (selectInfosLength <= 4 && groupByInfosLenght > 0 && groupByInfosLenght <= 1) {\n          return false\n        }\n        return true\n      },\n    },\n    {\n      showTypeName: 'area',\n      label: '地图',\n      coverImg: 'area.png',\n      showType: 5,\n      subTypeList: [],\n      baseConfig: {\n        tooltip: {\n          confine: true,\n          trigger: 'item',\n        },\n        toolbox: {\n          show: false,\n          showTitle: false,\n          feature: {\n            // dataView: { readOnly: true },\n            // restore: {},\n            saveAsImage: {},\n          },\n        },\n        visualMap: {\n          text: ['高', '低'],\n          realtime: false,\n          calculable: true,\n          inRange: {\n            color: ['lightskyblue', 'yellow', 'orangered'],\n          },\n        },\n      },\n      disabled: (_: ISelectInfos[], groupByInfos: IGroupByInfos[]) => {\n        const groupByInfosLenght = groupByInfos?.length\n        const flag = groupByInfos?.some(({ colDesc }) => (colDesc.includes('省') || colDesc.includes('市')))\n        if (flag && groupByInfosLenght > 0) {\n          return false\n        }\n        return true\n      },\n    },\n    {\n      showTypeName: 'funnel',\n      label: '漏斗图',\n      coverImg: 'funnel.png',\n      showType: 6,\n      subTypeList: [],\n      baseConfig: {\n        tooltip: {\n          confine: true,\n          trigger: 'item',\n          formatter: '{a} <br/>{b} : {c}',\n        },\n        toolbox: {\n          show: false,\n          showTitle: false,\n          feature: {\n            // dataView: { readOnly: true },\n            // restore: {},\n            saveAsImage: {},\n          },\n        },\n        legend: {\n          type: 'scroll',\n          top: 20,\n        },\n      },\n      disabled: (selectInfos: ISelectInfos[], groupByInfos: IGroupByInfos[]) => {\n        const groupByInfosLenght = groupByInfos?.length\n        const selectInfosLength = selectInfos?.length\n        if (selectInfosLength <= 5 && groupByInfosLenght > 0 && groupByInfosLenght <= 1) {\n          return false\n        }\n        return true\n      },\n    },\n\n    // { label: 'scatter', value: 7 },\n    {\n      showTypeName: 'card',\n      label: '卡片',\n      coverImg: 'card.png',\n      showType: 9,\n      subTypeList: [],\n      baseConfig: {},\n      disabled: (selectInfos: ISelectInfos[], groupByInfos: IGroupByInfos[]) => {\n        const groupByInfosLenght = groupByInfos?.length\n        const selectInfosLength = selectInfos?.length\n        if (selectInfosLength > 0 && groupByInfosLenght <= 1) {\n          return false\n        }\n        return true\n      },\n    },\n    {\n      showTypeName: 'radar',\n      label: '雷达图',\n      coverImg: 'radar.png',\n      showType: 10,\n      subTypeList: [],\n      baseConfig: {\n        legend: {\n          type: 'scroll',\n          orient: 'vertical',\n          left: 'left',\n          top: '25px',\n        },\n        tooltip: {\n          confine: true,\n          trigger: 'item',\n        },\n        toolbox: {\n          show: false,\n          showTitle: false,\n          feature: {\n            // dataView: { readOnly: true },\n            // restore: {},\n            saveAsImage: {},\n          },\n        },\n        radar: {\n          // shape: 'circle',\n          center: ['50%', '55%'],\n        },\n      },\n      disabled: (selectInfos: ISelectInfos[], groupByInfos: IGroupByInfos[]) => {\n        const groupByInfosLenght = groupByInfos?.length\n        if (groupByInfosLenght === 1 && selectInfos.length === 1) {\n          return false\n        }\n        return true\n      },\n    },\n    {\n      showTypeName: 'scatter-simple',\n      label: '散点图',\n      coverImg: '',\n      showType: 11,\n      subTypeList: [],\n      disabled: () => false,\n      baseConfig: {\n        grid: {\n          left: '0',\n          bottom: '10px',\n          containLabel: true,\n        },\n        tooltip: {\n          showDelay: 0,\n          axisPointer: {\n            show: true,\n            type: 'cross',\n            lineStyle: {\n              type: 'dashed',\n              width: 1,\n            },\n          },\n        },\n        toolbox: {\n          show: false,\n          showTitle: false,\n          feature: {\n            // dataView: { readOnly: true },\n            // restore: {},\n            saveAsImage: {},\n          },\n        },\n        legend: {\n          type: 'scroll',\n          top: '25px',\n        },\n        xAxis: {\n          splitLine: {\n            lineStyle: {\n              type: 'dashed',\n            },\n          },\n        },\n        yAxis: {\n          splitLine: {\n            lineStyle: {\n              type: 'dashed',\n            },\n          },\n        },\n      },\n    },\n  ],\n}\n\nexport function showTypeText(showType = 0): IconRow {\n  const row = iconList.get('showType', showType)\n  return row\n}\n\n// 修改默认配置\nexport function setDefaultChartOption(option: IconRow[], changeConfig: any) {\n  const obj: {\n    [key in IconRow['showTypeName']]: any\n  } = {} as { [key in IconRow['showTypeName']]: any }\n  option.forEach((item) => {\n    obj[item.showTypeName] = merge(item.baseConfig, changeConfig)\n  })\n  return obj\n}\nexport const defaultChartOption = setDefaultChartOption(iconList.data, {\n  backgroundColor: 'transparent',\n  title: {\n    textStyle: {\n      fontSize: 14,\n      lineHeight: 16,\n    },\n  },\n})\n// 获取地图数据（GeoJson)\nexport function getGeoJsonData(options: any): Promise<GeoJson> {\n  return new Promise((resolve) => {\n    const opt = {\n      showbiz: false,\n      extensions: 'all',\n      ...options,\n    }\n\n    import('@amap/amap-jsapi-loader')\n      .then(({ default: AMapLoader }) => AMapLoader.load({\n        key: '2e820fac2a528b016a4cb95bb463e69e',\n        version: '1.4.15',\n        plugins: ['AMap.DistrictSearch'],\n        AMapUI: {\n          version: '1.1',\n          plugins: ['geo/DistrictExplorer'],\n        },\n      }))\n      .then((AMap) => {\n        const district = new AMap.DistrictSearch(opt)\n        // 行政区查询\n        district.search(options.adcode, (_: any, result: any) => {\n          // eslint-disable-next-line\n          // @ts-expect-error\n          AMapUI.loadUI(['geo/DistrictExplorer'], (DistrictExplorer: any) => {\n            // 创建一个实例\n            const districtExplorer = new DistrictExplorer()\n            districtExplorer.loadAreaNode(result.districtList[0].adcode, (error: any, areaNode: any) => {\n              if (error) {\n                console.error(error)\n                return\n              }\n              const mapJson: GeoJson = {\n                features: [],\n                type: 'FeatureCollection',\n              }\n              // geoJson必须这种格式\n              mapJson.features = areaNode.getSubFeatures()\n              resolve(mapJson)\n            })\n          })\n        })\n      })\n      .catch((error) => {\n        console.error('Failed to load map:', error)\n        resolve({\n          features: [],\n          type: 'FeatureCollection',\n        })\n      })\n  })\n}\n"],"names":["iconList","get","data","showTypeName","label","coverImg","disabled","subTypeList","showType","baseConfig","value","icon","tooltipContent","tooltip","confine","trigger","axisPointer","type","toolbox","show","showTitle","feature","saveAsImage","legend","top","grid","left","bottom","containLabel","xAxis","boundaryGap","yAxis","dataZoom","_","groupByInfos","groupByInfosLenght","length","axisLabel","showMaxLabel","axisTick","alignWithLabel","formatter","selectInfos","selectInfosLength","visualMap","text","realtime","calculable","inRange","color","flag","some","_ref","colDesc","includes","orient","radar","center","showDelay","lineStyle","width","splitLine","setDefaultChartOption","option","changeConfig","obj","forEach","item","merge","defaultChartOption","backgroundColor","title","textStyle","fontSize","lineHeight"],"mappings":"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"}

package/es/src/data-chart/src/utils/injectionKeys.js

@@ -0,0 +1,4 @@
+const InjectionChartMerge = Symbol("merge");
+
+export { InjectionChartMerge };
+//# sourceMappingURL=injectionKeys.js.map

package/es/src/data-chart/src/utils/injectionKeys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"injectionKeys.js","sources":["../../../../../../../packages/components/src/data-chart/src/utils/injectionKeys.ts"],"sourcesContent":["import type { InjectionKey } from 'vue'\n\nexport const InjectionChartMerge: InjectionKey<(target: any, source: any) => any> = Symbol('merge')\n"],"names":["InjectionChartMerge","Symbol"],"mappings":"MAEaA,mBAAA,GAAuEC,OAAO,OAAO;;;;"}

package/es/src/data-chart/src/utils/useCharts.js

@@ -0,0 +1,23 @@
+import '@vueuse/core';
+import 'echarts';
+import 'vue';
+
+function useDataToExcelJson(dataSource) {
+  const {
+    desc: {
+      colDesc = [],
+      groupByDesc = []
+    } = {},
+    data = []
+  } = dataSource;
+  const header = [...groupByDesc.map(item => item.colDesc), ...colDesc].filter(v => v);
+  const json = data.map(item => {
+    return header.map(headerItem => {
+      return item[headerItem] || "";
+    });
+  });
+  return [header, ...json];
+}
+
+export { useDataToExcelJson };
+//# sourceMappingURL=useCharts.js.map

package/es/src/data-chart/src/utils/useCharts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCharts.js","sources":["../../../../../../../packages/components/src/data-chart/src/utils/useCharts.ts"],"sourcesContent":["import type { ECharts, SetOptionOpts } from 'echarts'\nimport type { ComputedRef, Ref } from 'vue'\nimport type { EChartData, EChartsOption, IFormatPublicData } from '../types'\nimport { useElementSize, useMouseInElement, watchDebounced } from '@vueuse/core'\nimport * as echarts from 'echarts'\nimport { onMounted, onUnmounted, ref } from 'vue'\n\n// 使用别名路径导入 SVG\nimport emptyImg from '../components/empty.svg'\n\nexport function useCharts({ chartDOM, chartData, chartOptions, mountedBefore, initAfter, callback }: {\n  chartDOM: Ref<HTMLElement | null>\n  chartData: ComputedRef<IFormatPublicData>\n  chartOptions: ComputedRef<EChartsOption>\n  mountedBefore?: () => void\n  initAfter?: () => void\n  callback?: (e: ECharts) => void\n}) {\n  let myChart: ECharts | null = null\n  const initChartSuccess = ref(false)\n\n  // 获取设备像素比\n  const dpr = window.devicePixelRatio || 1\n\n  function disposeChart() {\n    if (myChart && !myChart.isDisposed()) {\n      myChart.dispose()\n      myChart = null\n    }\n  }\n\n  function initChart(...opt: [EChartsOption, SetOptionOpts]) {\n    if (!myChart || !initChartSuccess.value || !chartDOM.value) {\n      return\n    }\n\n    myChart.showLoading()\n    try {\n      if (myChart.isDisposed()) {\n        // 如果实例已被销毁，重新创建\n        myChart = echarts.init(chartDOM.value, null, {\n          devicePixelRatio: dpr,\n          renderer: 'svg',\n        })\n      }\n      myChart.setOption(...opt)\n    }\n    catch (error) {\n      console.log('error: ', error)\n      disposeChart()\n      if (chartDOM.value) {\n        myChart = echarts.init(chartDOM.value, null, {\n          devicePixelRatio: dpr,\n          renderer: 'svg',\n        })\n        setEmpty('配置项错误')\n      }\n    }\n    finally {\n      myChart?.hideLoading()\n    }\n  }\n\n  const { isOutside: mouseInChart } = useMouseInElement(chartDOM)\n  watchDebounced(mouseInChart, (newVal) => {\n    if (typeof newVal !== 'boolean') {\n      return\n    }\n    toggleToolbox(!newVal)\n  }, { debounce: 200 })\n\n  function setEmpty(subtext = '暂无数据') {\n    const obj: EChartsOption = {\n      title: [{\n        text: chartData.value?.modelName,\n        ...chartOptions.value.title,\n      }, {\n        subtext,\n        top: 'center',\n        left: 'center',\n        text: ' {a|}',\n        itemGap: -20,\n        textStyle: {\n          align: 'center',\n          rich: {\n            a: {\n              color: '#000',\n              fontSize: '16',\n              height: 80,\n              width: 160,\n              backgroundColor: {\n                image: emptyImg,\n              },\n            },\n          },\n        },\n        subtextStyle: {\n          fontSize: 16,\n        },\n      }],\n    }\n    initChart(obj, {\n      notMerge: true,\n      replaceMerge: ['xAxis', 'yAxis', 'series'],\n      lazyUpdate: false,\n    })\n  }\n\n  function toggleToolbox(show: boolean) {\n    if (!myChart?.isDisposed()) {\n      myChart?.setOption({\n        toolbox: {\n          show,\n        },\n      })\n    }\n  }\n\n  onMounted(async () => {\n    if (mountedBefore) {\n      await mountedBefore()\n    }\n    if (!chartDOM.value) {\n      return\n    }\n    disposeChart() // 确保旧实例被清理\n    myChart = echarts.init(chartDOM.value, null, {\n      devicePixelRatio: dpr,\n      renderer: 'svg',\n    })\n    if (callback) {\n      callback(myChart)\n    }\n    if (initAfter) {\n      await initAfter()\n    }\n\n    useResize(myChart, chartDOM)\n\n    initChartSuccess.value = true\n\n    if (chartData.value?.data?.length) {\n      initChart(chartOptions.value, {})\n    }\n    else {\n      setEmpty()\n    }\n  })\n\n  onUnmounted(() => {\n    if (myChart) {\n      myChart.getZr()?.off('mousemove')\n      myChart.getZr()?.off('mouseout')\n      disposeChart()\n    }\n  })\n\n  return {\n    myChart,\n  }\n}\n\nexport function useResize(myChart: ECharts, chartDOM: Ref<HTMLElement | null>) {\n  const { width, height } = useElementSize(chartDOM)\n  watchDebounced([width, height], () => {\n    if (myChart) {\n      myChart.resize()\n    }\n  })\n}\n\nexport function useDataToExcelJson(dataSource: EChartData) {\n  const { desc: { colDesc = [], groupByDesc = [] } = {}, data = [] } = dataSource\n  const header = [...groupByDesc.map(item => item.colDesc), ...colDesc].filter(v => v) as string[]\n  const json = data.map((item) => {\n    return header.map((headerItem) => {\n      return item[headerItem as keyof typeof item] || ''\n    })\n  })\n  return [header, ...json]\n}\n"],"names":["useDataToExcelJson","dataSource","desc","colDesc","groupByDesc","data","header","map","item","filter","v","json","headerItem"],"mappings":";;;;AA2KO,SAASA,mBAAmBC,UAAwB,EAAA;EACzD,MAAM;AAAEC,IAAAA,IAAA,EAAM;AAAEC,MAAAA,OAAA,GAAU,EAAI;AAAAC,MAAAA,WAAA,GAAc;QAAO,EAAC;AAAGC,IAAAA,IAAO,GAAA;AAAG,GAAI,GAAAJ,UAAA;EACrE,MAAMK,MAAS,GAAA,CAAC,GAAGF,WAAA,CAAYG,IAAYC,IAAA,IAAAA,IAAA,CAAKL,OAAO,CAAA,EAAG,GAAGA,OAAO,CAAE,CAAAM,MAAA,MAAYC,CAAC,CAAA;AACnF,EAAA,MAAMC,IAAO,GAAAN,IAAA,CAAKE,GAAI,CAACC,IAAS,IAAA;AACvB,IAAA,OAAAF,MAAA,CAAOC,GAAI,CAACK,UAAe,IAAA;AACzB,MAAA,OAAAJ,IAAA,CAAKI,UAA+B,CAAK,IAAA,EAAA;AAClD,KAAC,CAAA;AACH,GAAC,CAAA;AACM,EAAA,OAAA,CAACN,MAAQ,EAAA,GAAGK,IAAI,CAAA;AACzB;;;;"}

package/es/src/file-upload/src/file-upload.vue.js

@@ -1,6 +1,10 @@
-import { defineComponent, resolveComponent, createBlock, openBlock, normalizeClass, unref, withCtx, createElementVNode, createVNode, createTextVNode, createElementBlock, createCommentVNode } from 'vue';
+import { defineComponent, computed, createBlock, openBlock, normalizeClass, unref, withCtx, createElementVNode, createVNode, createTextVNode, createElementBlock, createCommentVNode } from 'vue';
 import { UploadFilled } from '@element-plus/icons-vue';
 import { useNamespace } from '@qxs-bns/hooks';
+import { ElUpload } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/upload/index.js';
+import { ElIcon } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/icon/index.js';
+import { ElAlert } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/alert/index.js';
+import { ElMessage } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/message/index.js';
 
 const _hoisted_1 = { class: "slot" };
 const _hoisted_2 = {
@@ -53,9 +57,9 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       emit("onSuccess", res, file, fileList);
     };
     return (_ctx, _cache) => {
-      const _component_el_icon = resolveComponent("el-icon");
-      const _component_el_alert = resolveComponent("el-alert");
-      const _component_el_upload = resolveComponent("el-upload");
+      const _component_el_icon = ElIcon;
+      const _component_el_alert = ElAlert;
+      const _component_el_upload = ElUpload;
       return openBlock(), createBlock(_component_el_upload, {
         headers: _ctx.headers,
         action: _ctx.action,

package/es/src/file-upload/src/file-upload.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"file-upload.vue.js","sources":["../../../../../../packages/components/src/file-upload/src/file-upload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { UploadProps, UploadUserFile } from 'element-plus'\nimport { UploadFilled } from '@element-plus/icons-vue'\nimport { useNamespace } from '@qxs-bns/hooks'\n\ndefineOptions({\n  name: 'QxsFileUpload',\n})\n\nconst props = withDefaults(\n  defineProps<{\n    action: UploadProps['action']\n    headers?: UploadProps['headers']\n    data?: UploadProps['data']\n    name?: UploadProps['name']\n    size?: number\n    max?: number\n    accept?: string\n    files?: UploadUserFile[]\n    notip?: boolean\n    ext?: string[]\n  }>(),\n  {\n    name: 'file',\n    size: 20,\n    max: 3,\n    files: () => [],\n    notip: false,\n    accept: 'zip,rar',\n  },\n)\n\nconst emit = defineEmits(['onSuccess'])\n\nconst ns = useNamespace('file-upload')\n\nconst exts = computed(() => {\n  return props.accept.split(',').map(ext => ext.split('/').pop())\n})\nconst beforeUpload: UploadProps['beforeUpload'] = (file) => {\n  const fileName = file.name.split('.')\n  const fileExt = fileName.at(-1) ?? ''\n  const isTypeOk = exts.value.includes(fileExt)\n  const isSizeOk = file.size / 1024 / 1024 < props.size\n  if (!isTypeOk) {\n    ElMessage.error(`上传文件只支持 ${exts.value.join(' / ')} 格式！`)\n  }\n  if (!isSizeOk) {\n    ElMessage.error(`上传文件大小不能超过 ${props.size}MB！`)\n  }\n  return isTypeOk && isSizeOk\n}\n\nconst onExceed: UploadProps['onExceed'] = () => {\n  ElMessage.warning('文件上传超过限制')\n}\n\nconst onSuccess: UploadProps['onSuccess'] = (res, file, fileList) => {\n  emit('onSuccess', res, file, fileList)\n}\n</script>\n\n<template>\n  <el-upload\n    :headers=\"headers\"\n    :action=\"action\"\n    :data=\"data\"\n    :name=\"name\"\n    :before-upload=\"beforeUpload\"\n    :on-exceed=\"onExceed\"\n    :on-success=\"onSuccess\"\n    :file-list=\"files\"\n    :limit=\"max\"\n    drag\n    :class=\"ns.e('control')\"\n  >\n    <div class=\"slot\">\n      <el-icon class=\"el-icon--upload\">\n        <UploadFilled />\n      </el-icon>\n      <div class=\"el-upload__text\">\n        将文件拖到此处，或<em>点击上传</em>\n      </div>\n    </div>\n    <template #tip>\n      <div v-if=\"!notip\" class=\"el-upload__tip\">\n        <div style=\"display: inline-block;\">\n          <el-alert\n            :title=\"`上传文件支持 ${exts.join(' / ')} 格式，单个文件大小不超过 ${size}MB，且文件数量不超过 ${max} 个`\"\n            type=\"info\"\n            show-icon\n            :closable=\"false\"\n          />\n        </div>\n      </div>\n    </template>\n  </el-upload>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAuBd,IAAA,MAAM,IAAO,GAAA,MAAA;AAEb,IAAM,MAAA,EAAA,GAAK,aAAa,aAAa,CAAA;AAErC,IAAM,MAAA,IAAA,GAAO,SAAS,MAAM;AAC1B,MAAA,OAAO,KAAM,CAAA,MAAA,CAAO,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,CAAI,CAAO,GAAA,KAAA,GAAA,CAAI,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,EAAK,CAAA;AAAA,KAC/D,CAAA;AACD,IAAM,MAAA,YAAA,GAA4C,CAAC,IAAS,KAAA;AAC1D,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,IAAK,CAAA,KAAA,CAAM,GAAG,CAAA;AACpC,MAAA,MAAM,OAAU,GAAA,QAAA,CAAS,EAAG,CAAA,EAAE,CAAK,IAAA,EAAA;AACnC,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,KAAM,CAAA,QAAA,CAAS,OAAO,CAAA;AAC5C,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,IAAO,GAAA,IAAA,GAAO,OAAO,KAAM,CAAA,IAAA;AACjD,MAAA,IAAI,CAAC,QAAU,EAAA;AACb,QAAA,SAAA,CAAU,MAAM,CAAW,2CAAA,EAAA,IAAA,CAAK,MAAM,IAAK,CAAA,KAAK,CAAC,CAAM,mBAAA,CAAA,CAAA;AAAA;AAEzD,MAAA,IAAI,CAAC,QAAU,EAAA;AACb,QAAA,SAAA,CAAU,KAAM,CAAA,CAAA,6DAAA,EAAc,KAAM,CAAA,IAAI,CAAK,QAAA,CAAA,CAAA;AAAA;AAE/C,MAAA,OAAO,QAAY,IAAA,QAAA;AAAA,KACrB;AAEA,IAAA,MAAM,WAAoC,MAAM;AAC9C,MAAA,SAAA,CAAU,QAAQ,kDAAU,CAAA;AAAA,KAC9B;AAEA,IAAA,MAAM,SAAsC,GAAA,CAAC,GAAK,EAAA,IAAA,EAAM,QAAa,KAAA;AACnE,MAAK,IAAA,CAAA,WAAA,EAAa,GAAK,EAAA,IAAA,EAAM,QAAQ,CAAA;AAAA,KACvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"file-upload.vue.js","sources":["../../../../../../packages/components/src/file-upload/src/file-upload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { UploadProps, UploadUserFile } from 'element-plus'\nimport { UploadFilled } from '@element-plus/icons-vue'\nimport { useNamespace } from '@qxs-bns/hooks'\n\ndefineOptions({\n  name: 'QxsFileUpload',\n})\n\nconst props = withDefaults(\n  defineProps<{\n    action: UploadProps['action']\n    headers?: UploadProps['headers']\n    data?: UploadProps['data']\n    name?: UploadProps['name']\n    size?: number\n    max?: number\n    accept?: string\n    files?: UploadUserFile[]\n    notip?: boolean\n    ext?: string[]\n  }>(),\n  {\n    name: 'file',\n    size: 20,\n    max: 3,\n    files: () => [],\n    notip: false,\n    accept: 'zip,rar',\n  },\n)\n\nconst emit = defineEmits(['onSuccess'])\n\nconst ns = useNamespace('file-upload')\n\nconst exts = computed(() => {\n  return props.accept.split(',').map(ext => ext.split('/').pop())\n})\nconst beforeUpload: UploadProps['beforeUpload'] = (file) => {\n  const fileName = file.name.split('.')\n  const fileExt = fileName.at(-1) ?? ''\n  const isTypeOk = exts.value.includes(fileExt)\n  const isSizeOk = file.size / 1024 / 1024 < props.size\n  if (!isTypeOk) {\n    ElMessage.error(`上传文件只支持 ${exts.value.join(' / ')} 格式！`)\n  }\n  if (!isSizeOk) {\n    ElMessage.error(`上传文件大小不能超过 ${props.size}MB！`)\n  }\n  return isTypeOk && isSizeOk\n}\n\nconst onExceed: UploadProps['onExceed'] = () => {\n  ElMessage.warning('文件上传超过限制')\n}\n\nconst onSuccess: UploadProps['onSuccess'] = (res, file, fileList) => {\n  emit('onSuccess', res, file, fileList)\n}\n</script>\n\n<template>\n  <el-upload\n    :headers=\"headers\"\n    :action=\"action\"\n    :data=\"data\"\n    :name=\"name\"\n    :before-upload=\"beforeUpload\"\n    :on-exceed=\"onExceed\"\n    :on-success=\"onSuccess\"\n    :file-list=\"files\"\n    :limit=\"max\"\n    drag\n    :class=\"ns.e('control')\"\n  >\n    <div class=\"slot\">\n      <el-icon class=\"el-icon--upload\">\n        <UploadFilled />\n      </el-icon>\n      <div class=\"el-upload__text\">\n        将文件拖到此处，或<em>点击上传</em>\n      </div>\n    </div>\n    <template #tip>\n      <div v-if=\"!notip\" class=\"el-upload__tip\">\n        <div style=\"display: inline-block;\">\n          <el-alert\n            :title=\"`上传文件支持 ${exts.join(' / ')} 格式，单个文件大小不超过 ${size}MB，且文件数量不超过 ${max} 个`\"\n            type=\"info\"\n            show-icon\n            :closable=\"false\"\n          />\n        </div>\n      </div>\n    </template>\n  </el-upload>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAuBd,IAAA,MAAM,IAAO,GAAA,MAAA;AAEb,IAAM,MAAA,EAAA,GAAK,aAAa,aAAa,CAAA;AAErC,IAAM,MAAA,IAAA,GAAO,SAAS,MAAM;AAC1B,MAAA,OAAO,KAAM,CAAA,MAAA,CAAO,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,CAAI,CAAO,GAAA,KAAA,GAAA,CAAI,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,EAAK,CAAA;AAAA,KAC/D,CAAA;AACD,IAAM,MAAA,YAAA,GAA4C,CAAC,IAAS,KAAA;AAC1D,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,IAAK,CAAA,KAAA,CAAM,GAAG,CAAA;AACpC,MAAA,MAAM,OAAU,GAAA,QAAA,CAAS,EAAG,CAAA,EAAE,CAAK,IAAA,EAAA;AACnC,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,KAAM,CAAA,QAAA,CAAS,OAAO,CAAA;AAC5C,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,IAAO,GAAA,IAAA,GAAO,OAAO,KAAM,CAAA,IAAA;AACjD,MAAA,IAAI,CAAC,QAAU,EAAA;AACb,QAAA,SAAA,CAAU,MAAM,CAAW,2CAAA,EAAA,IAAA,CAAK,MAAM,IAAK,CAAA,KAAK,CAAC,CAAM,mBAAA,CAAA,CAAA;AAAA;AAEzD,MAAA,IAAI,CAAC,QAAU,EAAA;AACb,QAAA,SAAA,CAAU,KAAM,CAAA,CAAA,6DAAA,EAAc,KAAM,CAAA,IAAI,CAAK,QAAA,CAAA,CAAA;AAAA;AAE/C,MAAA,OAAO,QAAY,IAAA,QAAA;AAAA,KACrB;AAEA,IAAA,MAAM,WAAoC,MAAM;AAC9C,MAAA,SAAA,CAAU,QAAQ,kDAAU,CAAA;AAAA,KAC9B;AAEA,IAAA,MAAM,SAAsC,GAAA,CAAC,GAAK,EAAA,IAAA,EAAM,QAAa,KAAA;AACnE,MAAK,IAAA,CAAA,WAAA,EAAa,GAAK,EAAA,IAAA,EAAM,QAAQ,CAAA;AAAA,KACvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/src/fixed-action-bar/src/fixed-action-bar.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"fixed-action-bar.vue.js","sources":["../../../../../../packages/components/src/fixed-action-bar/src/fixed-action-bar.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n  name: 'QxsFixedActionBar',\n}\n</script>\n<script setup lang=\"ts\">\nimport { useNamespace } from \"@qxs-bns/hooks\";\nimport { getDeviceType } from \"@qxs-bns/utils\";\nimport {\n  useElementBounding,\n  useElementSize,\n  useParentElement,\n} from \"@vueuse/core\";\nimport { computed, onMounted, onUnmounted, ref, useAttrs } from \"vue\";\n\nconst props = defineProps({\n  padding: {\n    type: Number,\n    default: 8,\n  },\n});\n\nconst ns = useNamespace(\"fixed-action-bar\");\nconst attr = useAttrs();\nconst isBottom = ref(false);\nconst actionbar = ref<HTMLElement | null>(null);\nconst placeholderRef = ref<HTMLElement | null>(null);\n\nconst { height } = useElementSize(actionbar, undefined, { box: \"border-box\" });\nconst parentEl = useParentElement(placeholderRef);\nconst { left: placeholderLeft } = useElementBounding(parentEl);\nconst { width: placeholderParentWidth } = useElementSize(parentEl, undefined, {\n  box: \"border-box\",\n});\nfunction calculateScrollDetails() {\n  const scrollTop = window.scrollY || document.documentElement.scrollTop;\n  const windowHeight =\n    window.innerHeight || document.documentElement.clientHeight;\n  const scrollHeight = document.documentElement.scrollHeight;\n\n  isBottom.value = Math.ceil(scrollTop + windowHeight) >= scrollHeight;\n}\n\nonMounted(() => {\n  calculateScrollDetails();\n  window.addEventListener(\"scroll\", calculateScrollDetails);\n});\n\nonUnmounted(() => {\n  window.removeEventListener(\"scroll\", calculateScrollDetails);\n});\n\n// 计算属性用于动态计算actionbar的样式\nconst actionbarStyle = computed(() => ({\n  width: `${placeholderParentWidth || 0}px`,\n  left: `${placeholderLeft}px`,\n  class: `${!isBottom.value ? ns.is(\"shadow\") : \"\"} ${attr.class || \"\"}`,\n  ...ns.cssVarBlock({\n    \"actionbar-padding\": `${props.padding}px`,\n    \"actionbar-padding-bottom\": `${\n      getDeviceType() === \"Android\"\n        ? `${Math.max(props.padding, 20)}px`\n        : `${props.padding}px`\n    }`,\n  }),\n}));\n</script>\n\n<template>\n  <div ref=\"placeholderRef\" :style=\"`width: 100%; height: ${height}px`\">\n    <div\n      ref=\"actionbar\"\n      :style=\"actionbarStyle\"\n      :class=\"[actionbarStyle.class, ns.e('actionbar')]\"\n      data-fixed-calc-width\n    >\n      <slot />\n    </div>\n  </div>\n</template>\n"],"names":[],"mappings":";;;;;AACA,MAAe,WAAA,GAAA;AAAA,EACb,IAAM,EAAA;AACR,CAAA;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAOd,IAAM,MAAA,EAAA,GAAK,aAAa,kBAAkB,CAAA;AAC1C,IAAA,MAAM,OAAO,QAAS,EAAA;AACtB,IAAM,MAAA,QAAA,GAAW,IAAI,KAAK,CAAA;AAC1B,IAAM,MAAA,SAAA,GAAY,IAAwB,IAAI,CAAA;AAC9C,IAAM,MAAA,cAAA,GAAiB,IAAwB,IAAI,CAAA;AAEnD,IAAM,MAAA,EAAE,QAAW,GAAA,cAAA,CAAe,WAAW,MAAW,EAAA,EAAE,GAAK,EAAA,YAAA,EAAc,CAAA;AAC7E,IAAM,MAAA,QAAA,GAAW,iBAAiB,cAAc,CAAA;AAChD,IAAA,MAAM,EAAE,IAAA,EAAM,eAAgB,EAAA,GAAI,mBAAmB,QAAQ,CAAA;AAC7D,IAAA,MAAM,EAAE,KAAO,EAAA,sBAAA,EAA2B,GAAA,cAAA,CAAe,UAAU,MAAW,EAAA;AAAA,MAC5E,GAAK,EAAA;AAAA,KACN,CAAA;AACD,IAAA,SAAS,sBAAyB,GAAA;AAChC,MAAA,MAAM,SAAY,GAAA,MAAA,CAAO,OAAW,IAAA,QAAA,CAAS,eAAgB,CAAA,SAAA;AAC7D,MAAA,MAAM,YACJ,GAAA,MAAA,CAAO,WAAe,IAAA,QAAA,CAAS,eAAgB,CAAA,YAAA;AACjD,MAAM,MAAA,YAAA,GAAe,SAAS,eAAgB,CAAA,YAAA;AAE9C,MAAA,QAAA,CAAS,KAAQ,GAAA,IAAA,CAAK,IAAK,CAAA,SAAA,GAAY,YAAY,CAAK,IAAA,YAAA;AAAA;AAG1D,IAAA,SAAA,CAAU,MAAM;AACd,MAAuB,sBAAA,EAAA;AACvB,MAAO,MAAA,CAAA,gBAAA,CAAiB,UAAU,sBAAsB,CAAA;AAAA,KACzD,CAAA;AAED,IAAA,WAAA,CAAY,MAAM;AAChB,MAAO,MAAA,CAAA,mBAAA,CAAoB,UAAU,sBAAsB,CAAA;AAAA,KAC5D,CAAA;AAGD,IAAM,MAAA,cAAA,GAAiB,SAAS,OAAO;AAAA,MACrC,KAAA,EAAO,CAAG,EAAA,sBAAA,IAA0B,CAAC,CAAA,EAAA,CAAA;AAAA,MACrC,IAAA,EAAM,GAAG,eAAe,CAAA,EAAA,CAAA;AAAA,MACxB,KAAO,EAAA,CAAA,EAAG,CAAC,QAAA,CAAS,KAAQ,GAAA,EAAA,CAAG,EAAG,CAAA,QAAQ,CAAI,GAAA,EAAE,CAAI,CAAA,EAAA,IAAA,CAAK,SAAS,EAAE,CAAA,CAAA;AAAA,MACpE,GAAG,GAAG,WAAY,CAAA;AAAA,QAChB,mBAAA,EAAqB,CAAG,EAAA,KAAA,CAAM,OAAO,CAAA,EAAA,CAAA;AAAA,QACrC,4BAA4B,CAC1B,EAAA,aAAA,EAAoB,KAAA,SAAA,GAChB,GAAG,IAAK,CAAA,GAAA,CAAI,KAAM,CAAA,OAAA,EAAS,EAAE,CAAC,CAAA,EAAA,CAAA,GAC9B,CAAG,EAAA,KAAA,CAAM,OAAO,CACtB,EAAA,CAAA,CAAA;AAAA,OACD;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"fixed-action-bar.vue.js","sources":["../../../../../../packages/components/src/fixed-action-bar/src/fixed-action-bar.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n  name: \"QxsFixedActionBar\",\n};\n</script>\n<script setup lang=\"ts\">\nimport { useNamespace } from \"@qxs-bns/hooks\";\nimport { getDeviceType } from \"@qxs-bns/utils\";\nimport {\n  useElementBounding,\n  useElementSize,\n  useParentElement,\n} from \"@vueuse/core\";\nimport { computed, onMounted, onUnmounted, ref, useAttrs } from \"vue\";\n\nconst props = defineProps({\n  padding: {\n    type: Number,\n    default: 8,\n  },\n});\n\nconst ns = useNamespace(\"fixed-action-bar\");\nconst attr = useAttrs();\nconst isBottom = ref(false);\nconst actionbar = ref<HTMLElement | null>(null);\nconst placeholderRef = ref<HTMLElement | null>(null);\n\nconst { height } = useElementSize(actionbar, undefined, { box: \"border-box\" });\nconst parentEl = useParentElement(placeholderRef);\nconst { left: placeholderLeft } = useElementBounding(parentEl);\nconst { width: placeholderParentWidth } = useElementSize(parentEl, undefined, {\n  box: \"border-box\",\n});\nfunction calculateScrollDetails() {\n  const scrollTop = window.scrollY || document.documentElement.scrollTop;\n  const windowHeight =\n    window.innerHeight || document.documentElement.clientHeight;\n  const scrollHeight = document.documentElement.scrollHeight;\n\n  isBottom.value = Math.ceil(scrollTop + windowHeight) >= scrollHeight;\n}\n\nonMounted(() => {\n  calculateScrollDetails();\n  window.addEventListener(\"scroll\", calculateScrollDetails);\n});\n\nonUnmounted(() => {\n  window.removeEventListener(\"scroll\", calculateScrollDetails);\n});\n\n// 计算属性用于动态计算actionbar的样式\nconst actionbarStyle = computed(() => ({\n  width: `${placeholderParentWidth || 0}px`,\n  left: `${placeholderLeft}px`,\n  class: `${!isBottom.value ? ns.is(\"shadow\") : \"\"} ${attr.class || \"\"}`,\n  ...ns.cssVarBlock({\n    \"actionbar-padding\": `${props.padding}px`,\n    \"actionbar-padding-bottom\": `${\n      getDeviceType() === \"Android\"\n        ? `${Math.max(props.padding, 20)}px`\n        : `${props.padding}px`\n    }`,\n  }),\n}));\n</script>\n\n<template>\n  <div ref=\"placeholderRef\" :style=\"`width: 100%; height: ${height}px`\">\n    <div\n      ref=\"actionbar\"\n      :style=\"actionbarStyle\"\n      :class=\"[actionbarStyle.class, ns.e('actionbar')]\"\n      data-fixed-calc-width\n    >\n      <slot />\n    </div>\n  </div>\n</template>\n"],"names":[],"mappings":";;;;;AACA,MAAe,WAAA,GAAA;AAAA,EACb,IAAM,EAAA;AACR,CAAA;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAOd,IAAM,MAAA,EAAA,GAAK,aAAa,kBAAkB,CAAA;AAC1C,IAAA,MAAM,OAAO,QAAS,EAAA;AACtB,IAAM,MAAA,QAAA,GAAW,IAAI,KAAK,CAAA;AAC1B,IAAM,MAAA,SAAA,GAAY,IAAwB,IAAI,CAAA;AAC9C,IAAM,MAAA,cAAA,GAAiB,IAAwB,IAAI,CAAA;AAEnD,IAAM,MAAA,EAAE,QAAW,GAAA,cAAA,CAAe,WAAW,MAAW,EAAA,EAAE,GAAK,EAAA,YAAA,EAAc,CAAA;AAC7E,IAAM,MAAA,QAAA,GAAW,iBAAiB,cAAc,CAAA;AAChD,IAAA,MAAM,EAAE,IAAA,EAAM,eAAgB,EAAA,GAAI,mBAAmB,QAAQ,CAAA;AAC7D,IAAA,MAAM,EAAE,KAAO,EAAA,sBAAA,EAA2B,GAAA,cAAA,CAAe,UAAU,MAAW,EAAA;AAAA,MAC5E,GAAK,EAAA;AAAA,KACN,CAAA;AACD,IAAA,SAAS,sBAAyB,GAAA;AAChC,MAAA,MAAM,SAAY,GAAA,MAAA,CAAO,OAAW,IAAA,QAAA,CAAS,eAAgB,CAAA,SAAA;AAC7D,MAAA,MAAM,YACJ,GAAA,MAAA,CAAO,WAAe,IAAA,QAAA,CAAS,eAAgB,CAAA,YAAA;AACjD,MAAM,MAAA,YAAA,GAAe,SAAS,eAAgB,CAAA,YAAA;AAE9C,MAAA,QAAA,CAAS,KAAQ,GAAA,IAAA,CAAK,IAAK,CAAA,SAAA,GAAY,YAAY,CAAK,IAAA,YAAA;AAAA;AAG1D,IAAA,SAAA,CAAU,MAAM;AACd,MAAuB,sBAAA,EAAA;AACvB,MAAO,MAAA,CAAA,gBAAA,CAAiB,UAAU,sBAAsB,CAAA;AAAA,KACzD,CAAA;AAED,IAAA,WAAA,CAAY,MAAM;AAChB,MAAO,MAAA,CAAA,mBAAA,CAAoB,UAAU,sBAAsB,CAAA;AAAA,KAC5D,CAAA;AAGD,IAAM,MAAA,cAAA,GAAiB,SAAS,OAAO;AAAA,MACrC,KAAA,EAAO,CAAG,EAAA,sBAAA,IAA0B,CAAC,CAAA,EAAA,CAAA;AAAA,MACrC,IAAA,EAAM,GAAG,eAAe,CAAA,EAAA,CAAA;AAAA,MACxB,KAAO,EAAA,CAAA,EAAG,CAAC,QAAA,CAAS,KAAQ,GAAA,EAAA,CAAG,EAAG,CAAA,QAAQ,CAAI,GAAA,EAAE,CAAI,CAAA,EAAA,IAAA,CAAK,SAAS,EAAE,CAAA,CAAA;AAAA,MACpE,GAAG,GAAG,WAAY,CAAA;AAAA,QAChB,mBAAA,EAAqB,CAAG,EAAA,KAAA,CAAM,OAAO,CAAA,EAAA,CAAA;AAAA,QACrC,4BAA4B,CAC1B,EAAA,aAAA,EAAoB,KAAA,SAAA,GAChB,GAAG,IAAK,CAAA,GAAA,CAAI,KAAM,CAAA,OAAA,EAAS,EAAE,CAAC,CAAA,EAAA,CAAA,GAC9B,CAAG,EAAA,KAAA,CAAM,OAAO,CACtB,EAAA,CAAA,CAAA;AAAA,OACD;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/src/image-upload/src/image-upload.vue.js

@@ -1,6 +1,12 @@
-import { defineComponent, resolveComponent, createElementBlock, openBlock, normalizeClass, unref, createVNode, createCommentVNode, createBlock, withCtx, withDirectives, normalizeStyle, createElementVNode, toDisplayString, withModifiers, vShow } from 'vue';
+import { defineComponent, ref, computed, createElementBlock, openBlock, normalizeClass, unref, createVNode, createCommentVNode, createBlock, withCtx, withDirectives, normalizeStyle, createElementVNode, toDisplayString, withModifiers, vShow } from 'vue';
 import { Plus, ZoomIn, Delete } from '@element-plus/icons-vue';
 import { useNamespace } from '@qxs-bns/hooks';
+import { ElUpload } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/upload/index.js';
+import { ElImage } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/image/index.js';
+import { ElIcon } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/icon/index.js';
+import { ElProgress } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/progress/index.js';
+import { ElImageViewer } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/image-viewer/index.js';
+import { ElMessage } from '../../../node_modules/.pnpm/element-plus@2.9.6_vue@3.5.13_typescript@5.8.2_/node_modules/element-plus/es/components/message/index.js';
 
 const _hoisted_1 = {
   key: 1,
@@ -80,11 +86,11 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       emits("onSuccess", ...res);
     };
     return (_ctx, _cache) => {
-      const _component_el_icon = resolveComponent("el-icon");
-      const _component_el_image = resolveComponent("el-image");
-      const _component_el_progress = resolveComponent("el-progress");
-      const _component_el_upload = resolveComponent("el-upload");
-      const _component_el_image_viewer = resolveComponent("el-image-viewer");
+      const _component_el_icon = ElIcon;
+      const _component_el_image = ElImage;
+      const _component_el_progress = ElProgress;
+      const _component_el_upload = ElUpload;
+      const _component_el_image_viewer = ElImageViewer;
       return openBlock(), createElementBlock(
         "div",
         {

package/es/src/image-upload/src/image-upload.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"image-upload.vue.js","sources":["../../../../../../packages/components/src/image-upload/src/image-upload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { UploadFile, UploadFiles, UploadProps } from 'element-plus'\nimport { Delete, Plus, ZoomIn } from '@element-plus/icons-vue'\nimport { useNamespace } from '@qxs-bns/hooks'\n\ndefineOptions({\n  name: 'QxsImageUpload',\n})\nconst props = withDefaults(\n  defineProps<{\n    action: UploadProps['action']\n    headers?: UploadProps['headers']\n    data?: UploadProps['data']\n    name?: UploadProps['name']\n    url?: string\n    size?: number\n    width?: number\n    accept?: string\n    height?: number\n    placeholder?: string\n    notip?: boolean\n    tipText?: string\n    beforeUpload?: UploadProps['beforeUpload']\n  }>(),\n  {\n    name: 'file',\n    url: '',\n    size: 20,\n    width: 160,\n    height: 90,\n    placeholder: '点击上传图片',\n    notip: false,\n    accept: 'image/jpeg,image/jpg,image/png,image/gif',\n  },\n)\nconst emits = defineEmits<{\n  'update:url': [\n    url: string,\n  ]\n  'onSuccess': [\n    res: any,\n    uploadFile: UploadFile,\n    uploadFiles: UploadFiles,\n  ]\n}>()\n\nconst ns = useNamespace('image-upload')\n\nconst uploadData = ref({\n  imageViewerVisible: false,\n  progress: {\n    preview: '',\n    percent: 0,\n  },\n})\n\nconst exts = computed(() => {\n  return props.accept.split(',').map(ext => ext.split('/').pop())\n})\n\n// 预览\nfunction preview() {\n  uploadData.value.imageViewerVisible = true\n}\n// 关闭预览\nfunction previewClose() {\n  uploadData.value.imageViewerVisible = false\n}\n// 移除\nfunction remove() {\n  emits('update:url', '')\n}\nconst handleBeforeUpload: UploadProps['beforeUpload'] = (file) => {\n  const fileName = file.name.split('.')\n  const fileExt = fileName.at(-1) ?? ''\n  const isTypeOk = exts.value.includes(fileExt)\n  const isSizeOk = file.size / 1024 / 1024 < props.size\n\n  if (!isTypeOk) {\n    ElMessage.error(`上传图片只支持${exts.value.join(' / ')}格式！`)\n  }\n\n  else if (!isSizeOk) {\n    ElMessage.error(`上传图片大小不能超过 ${props.size}MB！`)\n  }\n  else {\n    uploadData.value.progress.preview = URL.createObjectURL(file)\n  }\n\n  return isTypeOk && isSizeOk && (!props.beforeUpload || props.beforeUpload(file))\n}\nconst onProgress: UploadProps['onProgress'] = (file) => {\n  uploadData.value.progress.percent = ~~file.percent\n}\nconst onSuccess: UploadProps['onSuccess'] = (...res) => {\n  uploadData.value.progress.preview = ''\n  uploadData.value.progress.percent = 0\n  emits('onSuccess', ...res)\n}\n</script>\n\n<template>\n  <div :class=\"ns.e('upload-container')\">\n    <el-upload\n      :show-file-list=\"false\"\n      :headers=\"headers\"\n      :action=\"action\"\n      :data=\"data\"\n      :name=\"name\"\n      :before-upload=\"handleBeforeUpload\"\n      :on-progress=\"onProgress\"\n      :on-success=\"onSuccess\"\n      drag\n      :accept=\"accept\"\n      :class=\"ns.e('image-upload')\"\n    >\n      <el-image\n        v-if=\"url === ''\"\n        :src=\"url === '' ? placeholder : url\"\n        :style=\"`width:${width}px;height:${height}px;`\"\n        fit=\"fill\"\n      >\n        <template #error>\n          <div class=\"image-slot\" :style=\"`width:${width}px;height:${height}px;`\">\n            <el-icon>\n              <Plus />\n            </el-icon>\n            <p>\n              {{ placeholder }}\n            </p>\n          </div>\n        </template>\n      </el-image>\n      <div v-else class=\"image\">\n        <el-image\n          :src=\"url\"\n          :style=\"`width:${width}px;height:${height}px;`\"\n          fit=\"fill\"\n        />\n        <div class=\"mask\">\n          <div class=\"actions\">\n            <span title=\"预览\" @click.stop=\"preview\">\n              <el-icon><ZoomIn /></el-icon>\n            </span>\n            <span title=\"移除\" @click.stop=\"remove\">\n              <el-icon>\n                <Delete />\n              </el-icon>\n            </span>\n          </div>\n        </div>\n      </div>\n      <div\n        v-show=\"url === '' && uploadData.progress.percent\"\n        class=\"progress\"\n        :style=\"`width:${width}px;height:${height}px;`\"\n      >\n        <el-image\n          :src=\"uploadData.progress.preview\"\n          :style=\"`width:${width}px;height:${height}px;`\"\n          fit=\"fill\"\n        />\n        <el-progress\n          type=\"circle\"\n          :width=\"Math.min(width, height) * 0.8\"\n          :percentage=\"uploadData.progress.percent\"\n        />\n      </div>\n    </el-upload>\n    <div v-if=\"!notip\" class=\"el-upload__tip-text\">\n      <div style=\"display: inline-block;\">\n        {{ tipText || `上传图片支持 ${exts.join(' / ')} 格式，且图片大小不超过 ${size}MB，建议图片尺寸为 ${width}*${height}` }}\n      </div>\n    </div>\n    <el-image-viewer\n      v-if=\"uploadData.imageViewerVisible\"\n      :url-list=\"[url]\"\n      teleported\n      @close=\"previewClose\"\n    />\n  </div>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,IAAA,MAAM,KAAQ,GAAA,OAAA;AA2Bd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAWd,IAAM,MAAA,EAAA,GAAK,aAAa,cAAc,CAAA;AAEtC,IAAA,MAAM,aAAa,GAAI,CAAA;AAAA,MACrB,kBAAoB,EAAA,KAAA;AAAA,MACpB,QAAU,EAAA;AAAA,QACR,OAAS,EAAA,EAAA;AAAA,QACT,OAAS,EAAA;AAAA;AACX,KACD,CAAA;AAED,IAAM,MAAA,IAAA,GAAO,SAAS,MAAM;AAC1B,MAAA,OAAO,KAAM,CAAA,MAAA,CAAO,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,CAAI,CAAO,GAAA,KAAA,GAAA,CAAI,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,EAAK,CAAA;AAAA,KAC/D,CAAA;AAGD,IAAA,SAAS,OAAU,GAAA;AACjB,MAAA,UAAA,CAAW,MAAM,kBAAqB,GAAA,IAAA;AAAA;AAGxC,IAAA,SAAS,YAAe,GAAA;AACtB,MAAA,UAAA,CAAW,MAAM,kBAAqB,GAAA,KAAA;AAAA;AAGxC,IAAA,SAAS,MAAS,GAAA;AAChB,MAAA,KAAA,CAAM,cAAc,EAAE,CAAA;AAAA;AAExB,IAAM,MAAA,kBAAA,GAAkD,CAAC,IAAS,KAAA;AAChE,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,IAAK,CAAA,KAAA,CAAM,GAAG,CAAA;AACpC,MAAA,MAAM,OAAU,GAAA,QAAA,CAAS,EAAG,CAAA,EAAE,CAAK,IAAA,EAAA;AACnC,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,KAAM,CAAA,QAAA,CAAS,OAAO,CAAA;AAC5C,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,IAAO,GAAA,IAAA,GAAO,OAAO,KAAM,CAAA,IAAA;AAEjD,MAAA,IAAI,CAAC,QAAU,EAAA;AACb,QAAA,SAAA,CAAU,MAAM,CAAU,0CAAA,EAAA,IAAA,CAAK,MAAM,IAAK,CAAA,KAAK,CAAC,CAAK,kBAAA,CAAA,CAAA;AAAA,OACvD,MAAA,IAES,CAAC,QAAU,EAAA;AAClB,QAAA,SAAA,CAAU,KAAM,CAAA,CAAA,6DAAA,EAAc,KAAM,CAAA,IAAI,CAAK,QAAA,CAAA,CAAA;AAAA,OAE1C,MAAA;AACH,QAAA,UAAA,CAAW,KAAM,CAAA,QAAA,CAAS,OAAU,GAAA,GAAA,CAAI,gBAAgB,IAAI,CAAA;AAAA;AAG9D,MAAA,OAAO,YAAY,QAAa,KAAA,CAAC,MAAM,YAAgB,IAAA,KAAA,CAAM,aAAa,IAAI,CAAA,CAAA;AAAA,KAChF;AACA,IAAM,MAAA,UAAA,GAAwC,CAAC,IAAS,KAAA;AACtD,MAAA,UAAA,CAAW,KAAM,CAAA,QAAA,CAAS,OAAU,GAAA,CAAC,CAAC,IAAK,CAAA,OAAA;AAAA,KAC7C;AACA,IAAM,MAAA,SAAA,GAAsC,IAAI,GAAQ,KAAA;AACtD,MAAW,UAAA,CAAA,KAAA,CAAM,SAAS,OAAU,GAAA,EAAA;AACpC,MAAW,UAAA,CAAA,KAAA,CAAM,SAAS,OAAU,GAAA,CAAA;AACpC,MAAM,KAAA,CAAA,WAAA,EAAa,GAAG,GAAG,CAAA;AAAA,KAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"image-upload.vue.js","sources":["../../../../../../packages/components/src/image-upload/src/image-upload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { UploadFile, UploadFiles, UploadProps } from 'element-plus'\nimport { Delete, Plus, ZoomIn } from '@element-plus/icons-vue'\nimport { useNamespace } from '@qxs-bns/hooks'\n\ndefineOptions({\n  name: 'QxsImageUpload',\n})\nconst props = withDefaults(\n  defineProps<{\n    action: UploadProps['action']\n    headers?: UploadProps['headers']\n    data?: UploadProps['data']\n    name?: UploadProps['name']\n    url?: string\n    size?: number\n    width?: number\n    accept?: string\n    height?: number\n    placeholder?: string\n    notip?: boolean\n    tipText?: string\n    beforeUpload?: UploadProps['beforeUpload']\n  }>(),\n  {\n    name: 'file',\n    url: '',\n    size: 20,\n    width: 160,\n    height: 90,\n    placeholder: '点击上传图片',\n    notip: false,\n    accept: 'image/jpeg,image/jpg,image/png,image/gif',\n  },\n)\nconst emits = defineEmits<{\n  'update:url': [\n    url: string,\n  ]\n  'onSuccess': [\n    res: any,\n    uploadFile: UploadFile,\n    uploadFiles: UploadFiles,\n  ]\n}>()\n\nconst ns = useNamespace('image-upload')\n\nconst uploadData = ref({\n  imageViewerVisible: false,\n  progress: {\n    preview: '',\n    percent: 0,\n  },\n})\n\nconst exts = computed(() => {\n  return props.accept.split(',').map(ext => ext.split('/').pop())\n})\n\n// 预览\nfunction preview() {\n  uploadData.value.imageViewerVisible = true\n}\n// 关闭预览\nfunction previewClose() {\n  uploadData.value.imageViewerVisible = false\n}\n// 移除\nfunction remove() {\n  emits('update:url', '')\n}\nconst handleBeforeUpload: UploadProps['beforeUpload'] = (file) => {\n  const fileName = file.name.split('.')\n  const fileExt = fileName.at(-1) ?? ''\n  const isTypeOk = exts.value.includes(fileExt)\n  const isSizeOk = file.size / 1024 / 1024 < props.size\n\n  if (!isTypeOk) {\n    ElMessage.error(`上传图片只支持${exts.value.join(' / ')}格式！`)\n  }\n\n  else if (!isSizeOk) {\n    ElMessage.error(`上传图片大小不能超过 ${props.size}MB！`)\n  }\n  else {\n    uploadData.value.progress.preview = URL.createObjectURL(file)\n  }\n\n  return isTypeOk && isSizeOk && (!props.beforeUpload || props.beforeUpload(file))\n}\nconst onProgress: UploadProps['onProgress'] = (file) => {\n  uploadData.value.progress.percent = ~~file.percent\n}\nconst onSuccess: UploadProps['onSuccess'] = (...res) => {\n  uploadData.value.progress.preview = ''\n  uploadData.value.progress.percent = 0\n  emits('onSuccess', ...res)\n}\n</script>\n\n<template>\n  <div :class=\"ns.e('upload-container')\">\n    <el-upload\n      :show-file-list=\"false\"\n      :headers=\"headers\"\n      :action=\"action\"\n      :data=\"data\"\n      :name=\"name\"\n      :before-upload=\"handleBeforeUpload\"\n      :on-progress=\"onProgress\"\n      :on-success=\"onSuccess\"\n      drag\n      :accept=\"accept\"\n      :class=\"ns.e('image-upload')\"\n    >\n      <el-image\n        v-if=\"url === ''\"\n        :src=\"url === '' ? placeholder : url\"\n        :style=\"`width:${width}px;height:${height}px;`\"\n        fit=\"fill\"\n      >\n        <template #error>\n          <div class=\"image-slot\" :style=\"`width:${width}px;height:${height}px;`\">\n            <el-icon>\n              <Plus />\n            </el-icon>\n            <p>\n              {{ placeholder }}\n            </p>\n          </div>\n        </template>\n      </el-image>\n      <div v-else class=\"image\">\n        <el-image\n          :src=\"url\"\n          :style=\"`width:${width}px;height:${height}px;`\"\n          fit=\"fill\"\n        />\n        <div class=\"mask\">\n          <div class=\"actions\">\n            <span title=\"预览\" @click.stop=\"preview\">\n              <el-icon><ZoomIn /></el-icon>\n            </span>\n            <span title=\"移除\" @click.stop=\"remove\">\n              <el-icon>\n                <Delete />\n              </el-icon>\n            </span>\n          </div>\n        </div>\n      </div>\n      <div\n        v-show=\"url === '' && uploadData.progress.percent\"\n        class=\"progress\"\n        :style=\"`width:${width}px;height:${height}px;`\"\n      >\n        <el-image\n          :src=\"uploadData.progress.preview\"\n          :style=\"`width:${width}px;height:${height}px;`\"\n          fit=\"fill\"\n        />\n        <el-progress\n          type=\"circle\"\n          :width=\"Math.min(width, height) * 0.8\"\n          :percentage=\"uploadData.progress.percent\"\n        />\n      </div>\n    </el-upload>\n    <div v-if=\"!notip\" class=\"el-upload__tip-text\">\n      <div style=\"display: inline-block;\">\n        {{ tipText || `上传图片支持 ${exts.join(' / ')} 格式，且图片大小不超过 ${size}MB，建议图片尺寸为 ${width}*${height}` }}\n      </div>\n    </div>\n    <el-image-viewer\n      v-if=\"uploadData.imageViewerVisible\"\n      :url-list=\"[url]\"\n      teleported\n      @close=\"previewClose\"\n    />\n  </div>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,IAAA,MAAM,KAAQ,GAAA,OAAA;AA2Bd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAWd,IAAM,MAAA,EAAA,GAAK,aAAa,cAAc,CAAA;AAEtC,IAAA,MAAM,aAAa,GAAI,CAAA;AAAA,MACrB,kBAAoB,EAAA,KAAA;AAAA,MACpB,QAAU,EAAA;AAAA,QACR,OAAS,EAAA,EAAA;AAAA,QACT,OAAS,EAAA;AAAA;AACX,KACD,CAAA;AAED,IAAM,MAAA,IAAA,GAAO,SAAS,MAAM;AAC1B,MAAA,OAAO,KAAM,CAAA,MAAA,CAAO,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,CAAI,CAAO,GAAA,KAAA,GAAA,CAAI,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,EAAK,CAAA;AAAA,KAC/D,CAAA;AAGD,IAAA,SAAS,OAAU,GAAA;AACjB,MAAA,UAAA,CAAW,MAAM,kBAAqB,GAAA,IAAA;AAAA;AAGxC,IAAA,SAAS,YAAe,GAAA;AACtB,MAAA,UAAA,CAAW,MAAM,kBAAqB,GAAA,KAAA;AAAA;AAGxC,IAAA,SAAS,MAAS,GAAA;AAChB,MAAA,KAAA,CAAM,cAAc,EAAE,CAAA;AAAA;AAExB,IAAM,MAAA,kBAAA,GAAkD,CAAC,IAAS,KAAA;AAChE,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,IAAK,CAAA,KAAA,CAAM,GAAG,CAAA;AACpC,MAAA,MAAM,OAAU,GAAA,QAAA,CAAS,EAAG,CAAA,EAAE,CAAK,IAAA,EAAA;AACnC,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,KAAM,CAAA,QAAA,CAAS,OAAO,CAAA;AAC5C,MAAA,MAAM,QAAW,GAAA,IAAA,CAAK,IAAO,GAAA,IAAA,GAAO,OAAO,KAAM,CAAA,IAAA;AAEjD,MAAA,IAAI,CAAC,QAAU,EAAA;AACb,QAAA,SAAA,CAAU,MAAM,CAAU,0CAAA,EAAA,IAAA,CAAK,MAAM,IAAK,CAAA,KAAK,CAAC,CAAK,kBAAA,CAAA,CAAA;AAAA,OACvD,MAAA,IAES,CAAC,QAAU,EAAA;AAClB,QAAA,SAAA,CAAU,KAAM,CAAA,CAAA,6DAAA,EAAc,KAAM,CAAA,IAAI,CAAK,QAAA,CAAA,CAAA;AAAA,OAE1C,MAAA;AACH,QAAA,UAAA,CAAW,KAAM,CAAA,QAAA,CAAS,OAAU,GAAA,GAAA,CAAI,gBAAgB,IAAI,CAAA;AAAA;AAG9D,MAAA,OAAO,YAAY,QAAa,KAAA,CAAC,MAAM,YAAgB,IAAA,KAAA,CAAM,aAAa,IAAI,CAAA,CAAA;AAAA,KAChF;AACA,IAAM,MAAA,UAAA,GAAwC,CAAC,IAAS,KAAA;AACtD,MAAA,UAAA,CAAW,KAAM,CAAA,QAAA,CAAS,OAAU,GAAA,CAAC,CAAC,IAAK,CAAA,OAAA;AAAA,KAC7C;AACA,IAAM,MAAA,SAAA,GAAsC,IAAI,GAAQ,KAAA;AACtD,MAAW,UAAA,CAAA,KAAA,CAAM,SAAS,OAAU,GAAA,EAAA;AACpC,MAAW,UAAA,CAAA,KAAA,CAAM,SAAS,OAAU,GAAA,CAAA;AACpC,MAAM,KAAA,CAAA,WAAA,EAAa,GAAG,GAAG,CAAA;AAAA,KAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/src/photo-crop-tool/src/composables.js

@@ -1,3 +1,5 @@
+import { ref } from 'vue';
+
 function useCanvas(canvasElement) {
   const context = ref(null);
   if (canvasElement) {