epic-designer-gold 0.0.1 → 0.0.3

package/packages/ui/elementPlus/select/index.ts

@@ -1,291 +0,0 @@
-import { type ComponentConfigModel } from "@epic-designer/utils";
-export default {
-  component: () => import("./select"),
-  groupName: "表单",
-  icon: "icon--epic--select",
-  sort: 900,
-  defaultSchema: {
-    label: "选择框",
-    type: "select",
-    field: "select",
-
-    input: true,
-    componentProps: {
-      options: [
-        {
-          label: "选项1",
-          value: "选项1",
-        },
-        {
-          label: "选项2",
-          value: "选项2",
-        },
-      ],
-      dynamicId: "",
-      placeholder: "请选择",
-      size: "default",
-      effect: "light",
-      placement: "bottom-start",
-    },
-  },
-  config: {
-    attribute: [
-      {
-        label: "字段名",
-        type: "input",
-        field: "field",
-      },
-      {
-        label: "标题",
-        type: "input",
-        field: "label",
-      },
-      {
-        label: "默认值",
-        type: "select",
-        field: "componentProps.defaultValue",
-      },
-      {
-        label: "占位内容",
-        type: "input",
-        field: "componentProps.placeholder",
-      },
-      {
-        label: "尺寸",
-        type: "select",
-        componentProps: {
-          placeholder: "请选择",
-          clearable: true,
-          options: [
-            {
-              label: "大号",
-              value: "large",
-            },
-            {
-              label: "中等",
-              value: "default",
-            },
-            {
-              label: "小型",
-              value: "small",
-            },
-          ],
-        },
-        field: "componentProps.size",
-      },
-      {
-        label: "可多选",
-        type: "switch",
-        field: "componentProps.multiple",
-        onChange: ({ value, values }) => {
-          if (value) {
-            values.componentProps.defaultValue = [];
-          } else {
-            values.componentProps.defaultValue = null;
-          }
-        },
-      },
-      {
-        label: "多选隐藏",
-        type: "switch",
-        field: "componentProps.collapseTags",
-        show: ({ values }) => {
-          return values.componentProps.multiple;
-        },
-      },
-      {
-        label: "隐藏提示",
-        type: "switch",
-        field: "componentProps.collapseTagsTooltip",
-        show: ({ values }) => {
-          return values.componentProps.multiple && values.componentProps.collapseTags;
-        },
-      },
-      {
-        label: "保留搜索关键字",
-        type: "switch",
-        field: "componentProps.reserveKeyword",
-        show: ({ values }) => {
-          return values.componentProps.multiple;
-        },
-      },
-      {
-        label: "标签类型",
-        type: "select",
-        defaultValue: "info",
-        componentProps: {
-          options: [
-            {
-              label: "success",
-              value: "success",
-            },
-            {
-              label: "info",
-              value: "info",
-            },
-            {
-              label: "warning",
-              value: "warning",
-            },
-            {
-              label: "danger",
-              value: "danger",
-            },
-          ],
-        },
-        show: ({ values }) => {
-          return values.componentProps.multiple;
-        },
-        field: "componentProps.tagType",
-      },
-      {
-        label: "多选限制",
-        type: "number",
-        field: "componentProps.multipleLimit",
-        show: ({ values }) => {
-          return values.componentProps.multiple;
-        },
-      },
-      {
-        label: "提示主题",
-        type: "select",
-        componentProps: {
-          options: [
-            {
-              label: "light",
-              value: "light",
-            },
-            {
-              label: "dark",
-              value: "dark",
-            },
-          ],
-        },
-        field: "componentProps.effect",
-      },
-      {
-        label: "可筛选",
-        type: "switch",
-        field: "componentProps.filterable",
-      },
-      {
-        label: "允许创建条目",
-        type: "switch",
-        field: "componentProps.allowCreate",
-      },
-      {
-        label: "下拉框位置",
-        type: "select",
-        defaultValue: "bottom-start",
-        componentProps: {
-          options: [
-            {
-              label: "top",
-              value: "top",
-            },
-            {
-              label: "top-start",
-              value: "top-start",
-            },
-            {
-              label: "top-end",
-              value: "top-end",
-            },
-            {
-              label: "bottom",
-              value: "bottom",
-            },
-            {
-              label: "bottom-start",
-              value: "bottom-start",
-            },
-            {
-              label: "bottom-end",
-              value: "bottom-end",
-            },
-            {
-              label: "left",
-              value: "left",
-            },
-            {
-              label: "left-start",
-              value: "left-start",
-            },
-            {
-              label: "left-end",
-              value: "left-end",
-            },
-            {
-              label: "right",
-              value: "right",
-            },
-            {
-              label: "right-start",
-              value: "right-start",
-            },
-            {
-              label: "right-end",
-              value: "right-end",
-            },
-          ],
-        },
-        field: "componentProps.placement",
-      },
-      {
-        label: "下拉框宽度与输入框相同",
-        type: "switch",
-        field: "componentProps.fitInputWidth",
-      },
-      {
-        label: "无数据时文本",
-        type: "input",
-        field: "componentProps.noDataText",
-        componentProps: {
-          placeholder: "请输入",
-        },
-      },
-      {
-        label: "可清空",
-        type: "switch",
-        field: "componentProps.clearable",
-      },
-      {
-        label: "禁用",
-        type: "switch",
-        field: "componentProps.disabled",
-      },
-      {
-        label: "隐藏",
-        type: "switch",
-        field: "componentProps.hidden",
-      },
-      {
-        label: "选项管理",
-        type: "EOptionsEditor",
-        layout: "vertical",
-        field: "componentProps.options",
-        describe: "配置选项",
-      },
-      {
-        label: "表单校验",
-        type: "ERuleEditor",
-        layout: "vertical",
-        field: "rules",
-        describe: "校验规则需要配合表单使用",
-      },
-      {
-        label: "数据源",
-        type: "EDataSource",
-        layout: "vertical",
-        field: "componentProps.dataSource",
-        describe: "数据源配置",
-      },
-    ],
-    event: [
-      {
-        type: "change",
-        describe: "值变化时",
-      },
-    ],
-  },
-} as ComponentConfigModel;

package/packages/ui/elementPlus/select/select.ts

@@ -1,29 +0,0 @@
-import { defineComponent, h, watch } from "vue";
-import "element-plus/es/components/select/style/css";
-import { ElSelect, ElOption } from "element-plus";
-
-// 二次封装组件
-export default defineComponent({
-  emits: ["update:modelValue"],
-  setup(_, { emit, attrs }) {
-    function handleUpdate(e = null): void {
-      emit("update:modelValue", e);
-    }
-
-    return () => {
-      const props: Record<string, any> = {
-        ...attrs,
-        key: String(attrs.multiple),
-        "onUpdate:modelValue": handleUpdate,
-      };
-
-      // watch
-
-      return h(ElSelect, props, {
-        default: () => [
-          props?.options?.map((option: any) => h(ElOption, { label: option.label, value: option.value })),
-        ],
-      });
-    };
-  },
-});

package/packages/ui/elementPlus/sign/index.ts

@@ -1,97 +0,0 @@
-import { type ComponentConfigModel } from "@epic-designer/utils";
-export default {
-  // component: async () => await import("../../../../packages/core/components/designer/src"),
-  component: async () => await import("./sign.vue"),
-  icon: "icon--epic--insert-text-outline-rounded",
-  groupName: "表单",
-  sort: 705,
-  defaultSchema: {
-    label: "签名板",
-    type: "sign",
-    field: "sign",
-    input: true,
-    componentProps: {
-      placeholder: "请输入",
-      lineWidth: 4,
-      type: "sign",
-      style: {
-        height: "300px",
-      },
-    },
-  },
-  config: {
-    attribute: [
-      {
-        label: "字段名",
-        type: "input",
-        field: "field",
-      },
-      {
-        label: "标题",
-        type: "input",
-        field: "label",
-      },
-
-      // {
-      //   label: "占位内容",
-      //   type: "input",
-      //   field: "componentProps.placeholder",
-      // },
-      {
-        label: "线条宽度(px)",
-        type: "input",
-        componentProps: {
-          placeholder: "请选择",
-          clearable: true,
-        },
-        field: "componentProps.lineWidth",
-      },
-      // {
-      //   label: "禁用",
-      //   type: "switch",
-      //   field: "componentProps.disabled",
-      // },
-      {
-        label: "隐藏",
-        type: "switch",
-        field: "componentProps.hidden",
-      },
-    ],
-    // event: [
-    //   {
-    //     type: "input",
-    //     describe: "输入值",
-    //   },
-    //   {
-    //     type: "change",
-    //     describe: "值修改",
-    //   },
-    //   {
-    //     type: "focus",
-    //     describe: "获取焦点",
-    //   },
-    //   {
-    //     type: "blur",
-    //     describe: "失去焦点",
-    //   },
-    // ],
-    // action: [
-    //   {
-    //     type: "focus",
-    //     describe: "使 input 获取焦点",
-    //   },
-    //   {
-    //     type: "blur",
-    //     describe: "使 input 失去焦点",
-    //   },
-    //   {
-    //     type: "clear",
-    //     describe: "清除 input 值",
-    //   },
-    //   {
-    //     type: "select",
-    //     describe: "选中 input 中的文字",
-    //   },
-    // ],
-  },
-} as ComponentConfigModel;

package/packages/ui/elementPlus/sign/sign.vue

@@ -1,207 +0,0 @@
-<script setup>
-import { computed, nextTick, onMounted, onUnmounted, ref, watch } from "vue";
-import { pluginManager } from "@epic-designer/utils";
-import axios from "axios";
-const Button = pluginManager.getComponent("button");
-const emits = defineEmits(["update:modelValue"]);
-const props = defineProps({
-  componentSchema: {
-    type: Object,
-    require: true,
-    default: () => ({}),
-  },
-});
-watch(
-  () => props.componentSchema,
-  () => {
-    nextTick(() => {
-      init();
-    });
-  },
-  { deep: true, immediate: true }
-);
-
-const resizeObserver = new ResizeObserver((entries) => {
-  // 处理大小变化的回调函数
-  for (const entry of entries) {
-    // console.log("元素大小已变化", entry.target.clientWidth);
-    if (entry.target && entry.target.clientWidth && entry.target.clientHeight) {
-      init();
-    }
-    // 在这里执行你想要的操作，比如更新数据或触发其他事件
-  }
-});
-const canvas = ref(null);
-const canvasWrap = ref(null);
-const context = ref();
-const stageInfo = ref("");
-
-function init() {
-  if (canvasWrap.value && canvasWrap.value?.clientHeight && canvasWrap.value?.clientWidth) {
-    canvas.value.height = canvasWrap.value.clientHeight;
-    canvas.value.width = canvasWrap.value.clientWidth;
-    context.value = canvas.value.getContext("2d");
-    context.value.lineWidth = props.componentSchema.componentProps.lineWidth || 4;
-    if (
-      props.componentSchema &&
-      props.componentSchema.componentProps &&
-      props.componentSchema.componentProps.style &&
-      props.componentSchema.componentProps.style.color
-    ) {
-      context.value.strokeStyle = props.componentSchema.componentProps.style.color;
-    }
-
-    stageInfo.value = canvas.value.getBoundingClientRect();
-  }
-}
-const startX = ref("");
-const startY = ref("");
-const moveX = ref("");
-const moveY = ref("");
-const points = ref([]);
-const isDown = ref(false);
-function mouseDown(ev) {
-  ev = ev || event;
-  ev.preventDefault();
-  let obj = {
-    x: ev.offsetX,
-    y: ev.offsetY,
-  };
-  startX.value = obj.x;
-  startY.value = obj.y;
-  // 起始一条线
-  context.value.beginPath();
-  // 把路径移动到画布中的指定点，不创建线条
-  context.value.moveTo(obj.x, obj.y);
-  // 添加一个新点，然后在画布中创建从该点到最后指定点的线条
-  context.value.lineTo(obj.x, obj.y);
-  // 绘制已定义的路径
-  context.value.stroke();
-  // 创建从当前点回到起始点的路径
-  context.value.closePath();
-  points.value.push(obj);
-  isDown.value = true;
-}
-function mouseMove(ev) {
-  ev = ev || event;
-  ev.preventDefault();
-  if (isDown.value) {
-    let obj = {
-      x: ev.offsetX,
-      y: ev.offsetY,
-    };
-    moveX.value = obj.x;
-    moveY.value = obj.y;
-    context.value.beginPath();
-    context.value.moveTo(startX.value, startY.value);
-    context.value.lineTo(obj.x, obj.y);
-    context.value.stroke();
-    context.value.closePath();
-    startX.value = obj.x;
-    startY.value = obj.y;
-    points.value.push(obj);
-  }
-}
-
-function mouseUp(ev) {
-  ev = ev || event;
-  ev.preventDefault();
-  let obj = {
-    x: ev.offsetX,
-    y: ev.offsetY,
-  };
-  context.value.beginPath();
-  context.value.moveTo(startX.value, startY.value);
-  context.value.lineTo(obj.x, obj.y);
-  context.value.stroke();
-  context.value.closePath();
-  points.value.push(obj);
-  points.value.push({ x: -1, y: -1 });
-  isDown.value = false;
-}
-
-// 清空画板
-function overwrite() {
-  context.value.clearRect(0, 0, canvas.value.width, canvas.value.height);
-  points.value = [];
-}
-async function surewrite() {
-  let url = await uploadFile(canvas.value.toDataURL(`image/png`));
-  emits("update:modelValue", url);
-  //   return canvas.value.toDataURL(`image/png`);
-}
-async function uploadFile(base64String) {
-  let bytes = atob(base64String.split(",")[1]);
-  let ab = new ArrayBuffer(bytes.length);
-  let ia = new Uint8Array(ab);
-  for (let i = 0; i < bytes.length; i++) {
-    ia[i] = bytes.charCodeAt(i);
-  }
-  let blob = new Blob([ab], { type: "image/png" });
-  let fd = new FormData();
-  fd.append("file", blob, Date.now() + "png");
-  let res = await axios({
-    method: "post",
-    url: "https://ess-ds.com/prod-api/center-file/file/upload",
-    data: fd,
-    headers: {
-      "Content-Type": "multipart/form-data",
-    },
-  });
-  return res.data.data.url;
-}
-onMounted(() => {
-  init();
-  resizeObserver.observe(canvasWrap.value);
-});
-onUnmounted(() => {
-  // resizeObserver.unobserve(canvasWrap.value);
-});
-defineExpose({
-  surewrite,
-});
-</script>
-
-<template>
-  <div
-    class="sign"
-    :style="{
-      height: props.componentSchema.componentProps.style.height,
-      width: props.componentSchema.componentProps.style.width || '100%',
-    }"
-  >
-    <div class="canvas" ref="canvasWrap">
-      <canvas ref="canvas" @mousedown="mouseDown" @mousemove="mouseMove" @mouseup="mouseUp"></canvas>
-    </div>
-    <div class="btn">
-      <div class="remark">
-        <!-- <span>提示：</span>
-        <span>1. 请在画板上签名</span>
-        <span>2. 签名完成后请点击确认</span>-->
-      </div>
-      <div class="btns">
-        <Button type="info" size="mini" @click="overwrite" @touch="overwrite">重写</Button>
-        <Button type="primary" size="mini" @click="surewrite" @touch="surewrite">确定</Button>
-      </div>
-    </div>
-  </div>
-</template>
-
-<style lang="less" scoped>
-.sign {
-  width: 100%;
-  .canvas {
-    width: 100%;
-    height: calc(100% - 40px);
-    border: 1.5px solid #dcdfe6;
-    // box-shadow: 0 0 0 1px #dcdfe6;
-    border-radius: 4px;
-  }
-  .btn {
-    height: 40px;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-  }
-}
-</style>