@hg2/dataview-core 2.0.0

package/dist/index-b58bfc89.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-b58bfc89.js","sources":["../src/views/chart/ContentLayers/components/LayersStatus/index.vue","../src/views/chart/ContentLayers/components/LayersListItem/index.vue","../src/views/chart/ContentLayers/components/LayersGroupListItem/index.vue","../src/views/chart/ContentLayers/index.vue"],"sourcesContent":["<template>\n  <div class=\"icon-item-box\" v-show=\"!isGroup\">\n    <el-icon\n      class=\"go-ml-1 icon-item\"\n      :class=\"{ active: status.lock }\"\n      :size=\"15\"\n      @click=\"lockHandle\"\n    >\n      <component :is=\"status.lock ? LockClosedOutlineIcon : LockOpenOutlineIcon\" />\n    </el-icon>\n    <el-icon\n      class=\"go-ml-1 icon-item\"\n      :class=\"{ active: status.hide }\"\n      :size=\"15\"\n      @click=\"showHandle\"\n    >\n      <component :is=\"status.hide ? EyeOffOutlineIcon : EyeOutlineIcon\" />\n    </el-icon>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, PropType } from 'vue'\nimport { useDesignStore } from '@core/store/modules/designStore/designStore'\nimport { StatusType } from '@core/packages/index.d'\nimport { useChartEditStore } from '@core/store/modules/chartEditStore/chartEditStore'\nimport { icon } from '@core/plugins'\n\nconst props = defineProps({\n  isGroup: {\n    type: Boolean,\n    default: false\n  },\n  hover: {\n    type: Boolean,\n    default: false\n  },\n  status: {\n    type: Object as PropType<StatusType>,\n    default: () => ({\n      lock: false,\n      hide: false\n    })\n  }\n})\n\nconst { LockClosedOutlineIcon, LockOpenOutlineIcon, EyeOutlineIcon, EyeOffOutlineIcon } = icon.ionicons5\nconst chartEditStore = useChartEditStore()\nconst designStore = useDesignStore()\n\n// 颜色\nconst themeColor = computed(() => {\n  return designStore.getAppTheme\n})\n\n// 隐藏 / 展示\nconst showHandle = (e: MouseEvent) => {\n  e.stopPropagation()\n  props.status.hide ? chartEditStore.setShow() : chartEditStore.setHide()\n}\n\n// 锁定 / 解锁\nconst lockHandle = (e: MouseEvent) => {\n  e.stopPropagation()\n  props.status.lock ? chartEditStore.setUnLock() : chartEditStore.setLock()\n}\n</script>\n\n<style lang=\"scss\" scoped>\n$activeColor: v-bind('themeColor');\n\n.icon-item-box {\n  white-space: nowrap;\n\n  .icon-item {\n    opacity: 0;\n    padding-top: 5px;\n    @extend.go-transition;\n    &.active,\n    &:hover {\n      color: $activeColor;\n    }\n    &.active {\n      opacity: 1 !important;\n    }\n  }\n}\n</style>\n","<template>\r\n  <div class=\"go-content-layers-list-item\" :class=\"{ hover, select, 'list-mini': selectText }\">\r\n    <div class=\"go-flex-center item-content\">\r\n      <el-image class=\"list-img\" fit=\"contain\" :src=\"imageInfo\" :fallback=\"requireErrorImg()\">\r\n        <template #error>\r\n          <img :src=\"requireErrorImg()\" style=\"width: 100%; height: 100%; object-fit: contain;\" />\r\n        </template>\r\n      </el-image>\r\n      <div class=\"go-ellipsis-1\" style=\"margin-right: auto\">\r\n        <span class=\"list-text\">\r\n          {{ props.componentData.chartConfig.title }}\r\n        </span>\r\n      </div>\r\n      <layers-status :isGroup=\"isGroup\" :hover=\"hover\" :status=\"status\"></layers-status>\r\n    </div>\r\n    <div :class=\"{ 'select-modal': select }\"></div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { computed, PropType, ref } from 'vue'\nimport { requireErrorImg } from '@core/utils'\nimport { useDesignStore } from '@core/store/modules/designStore/designStore'\nimport { useChartEditStore } from '@core/store/modules/chartEditStore/chartEditStore'\nimport { LayerModeEnum } from '@core/store/modules/chartLayoutStore/chartLayoutStore.d'\nimport { fetchImages } from '@core/packages/registry'\nimport { CreateComponentType, CreateComponentGroupType } from '@core/packages/index.d'\nimport { LayersStatus } from '../LayersStatus/index'\r\n\r\nconst props = defineProps({\r\n  componentData: {\r\n    type: Object as PropType<CreateComponentType | CreateComponentGroupType>,\r\n    required: true\r\n  },\r\n  isGroup: {\r\n    type: Boolean,\r\n    default: false\r\n  },\r\n  layerMode: {\r\n    type: String as PropType<LayerModeEnum>,\r\n    default: LayerModeEnum.THUMBNAIL\r\n  }\r\n})\r\n\r\n// 全局颜色\r\nconst designStore = useDesignStore()\r\nconst chartEditStore = useChartEditStore()\r\nconst imageInfo = ref('')\r\n\r\n// 获取图片\r\nconst fetchImageUrl = async () => {\r\n  imageInfo.value = await fetchImages(props.componentData.chartConfig)\r\n}\r\nfetchImageUrl()\r\n\r\n// 颜色\r\nconst themeColor = computed(() => {\r\n  return designStore.getAppTheme\r\n})\r\n\r\n// 计算当前选中目标\r\nconst select = computed(() => {\r\n  const id = props.componentData.id\r\n  return chartEditStore.getTargetChart.selectId.find((e: string) => e === id)\r\n})\r\n\r\n// 悬浮对象\r\nconst hover = computed(() => {\r\n  return props.componentData.id === chartEditStore.getTargetChart.hoverId\r\n})\r\n\r\n// 组件状态 隐藏/锁定\r\nconst status = computed(() => {\r\n  return props.componentData.status\r\n})\r\n\r\n// 是否选中文本\r\nconst selectText = computed(() => {\r\n  return props.layerMode === LayerModeEnum.TEXT\r\n})\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n$centerHeight: 52px;\r\n$centerMiniHeight: 28px;\r\n$textSize: 10px;\r\n\r\n@include go(content-layers-list-item) {\r\n  position: relative;\r\n  height: $centerHeight;\r\n  width: 90%;\r\n  margin: 5px 5%;\r\n  margin-bottom: 5px;\r\n  border-radius: 5px;\r\n  cursor: pointer;\r\n  border: 1px solid rgba(0, 0, 0, 0);\r\n  @extend .go-transition-quick;\r\n\r\n  &.hover,\r\n  &:hover {\r\n    @include fetch-bg-color('background-color4');\r\n  }\r\n\r\n  &:hover {\r\n    @include deep() {\r\n      .icon-item {\r\n        opacity: 1;\r\n      }\r\n    }\r\n  }\r\n\r\n  .select-modal,\r\n  .item-content {\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n  }\r\n\r\n  .item-content {\r\n    z-index: 1;\r\n    padding: 6px 5px;\r\n    justify-content: start !important;\r\n    width: calc(100% - 10px);\r\n    height: calc(100% - 10px);\r\n  }\r\n\r\n  .select-modal {\r\n    width: 100%;\r\n    height: 100%;\r\n    opacity: 0.3;\r\n    background-color: v-bind('themeColor');\r\n  }\r\n\r\n  .list-img {\r\n    flex-shrink: 0;\r\n    height: $centerHeight;\r\n    border-radius: 5px;\r\n    overflow: hidden;\r\n    border: none !important;\r\n    padding: 2px;\r\n    @include hover-border-color('hover-border-color');\r\n  }\r\n\r\n  .text-box {\r\n    margin-right: auto;\r\n    min-width: 0;\r\n    display: flex;\r\n    align-items: center;\r\n  }\r\n\r\n  .list-text {\r\n    padding-left: 6px;\r\n    font-size: $textSize;\r\n  }\r\n\r\n  /* 选中样式 */\r\n  &.select {\r\n    border: 1px solid v-bind('themeColor');\r\n    background-color: rgba(0, 0, 0, 0);\r\n  }\r\n\r\n  // mini样式\r\n  &.list-mini {\r\n    height: $centerMiniHeight;\r\n\r\n    .list-img {\r\n      height: 18px;\r\n      width: 32px;\r\n      padding: 0;\r\n      margin-right: 6px;\r\n      border-radius: 3px;\r\n    }\r\n\r\n    .item-content {\r\n      align-items: center !important;\r\n      padding: 4px 6px;\r\n      width: calc(100% - 12px);\r\n      height: calc(100% - 8px);\r\n    }\r\n\r\n    .text-box {\r\n      height: 100%;\r\n    }\r\n\r\n    .list-text {\r\n      padding-left: 0;\r\n      line-height: 1;\r\n      font-size: 10px;\r\n    }\r\n  }\r\n}\r\n</style>\r\n","<template>\n  <div class=\"go-content-layers-group-list-item\">\n    <div\n      class=\"root-item-content\"\n      :class=\"{ hover, select, 'list-mini': selectText }\"\n      @click=\"clickHandle($event)\"\n      @mousedown=\"groupMousedownHandle($event)\"\n      @mouseenter=\"mouseenterHandle(componentGroupData)\"\n      @mouseleave=\"mouseleaveHandle(componentGroupData)\"\n      @contextmenu=\"handleContextMenu($event, componentGroupData, optionsHandle)\"\n    >\n      <div class=\"go-flex-items-center item-content\">\n        <el-icon :size=\"20\" class=\"go-ml-1\">\n          <template v-if=\"expend\">\n            <folder-open-icon></folder-open-icon>\n          </template>\n          <template v-else>\n            <folder-icon></folder-icon>\n          </template>\n        </el-icon>\n        <div class=\"go-ellipsis-1\" style=\"margin-right: auto\">\n          <span class=\"go-ml-2 list-text\" style=\"color: var(--el-text-color-regular)\">\n            {{ componentGroupData.chartConfig.title }}\n          </span>\n        </div>\n        <layers-status :isGroup=\"false\" :hover=\"hover\" :status=\"status\"></layers-status>\n      </div>\n      <div :class=\"{ 'select-modal': select }\"></div>\n    </div>\n    <el-collapse-transition>\n      <div v-show=\"expend\">\n        <LayersListItem\n          v-for=\"element in componentGroupData.groupList\"\n          :key=\"element.id\"\n          :componentData=\"element\"\n          :layer-mode=\"layerMode\"\n          :isGroup=\"true\"\n          @mousedown=\"mousedownHandle($event, element, componentGroupData.id)\"\n          @mouseenter=\"mouseenterHandle(element)\"\n          @mouseleave=\"mouseleaveHandle(element)\"\n          @contextmenu=\"handleContextMenu($event, componentGroupData, optionsHandle)\"\n        ></LayersListItem>\n      </div>\n    </el-collapse-transition>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, PropType } from 'vue'\nimport { MouseEventButton, WinKeyboard, MacKeyboard } from '@core/enums/editPageEnum'\nimport { MenuEnum } from '@core/enums/editPageEnum'\nimport { useDesignStore } from '@core/store/modules/designStore/designStore'\nimport { useChartEditStore } from '@core/store/modules/chartEditStore/chartEditStore'\nimport { useContextMenu, divider } from '@core/views/chart/hooks/useContextMenu.hook'\nimport { MenuOptionsItemType } from '@core/views/chart/hooks/useContextMenu.hook.d'\nimport { LayerModeEnum } from '@core/store/modules/chartLayoutStore/chartLayoutStore.d'\nimport { CreateComponentType, CreateComponentGroupType } from '@core/packages/index.d'\nimport { LayersListItem } from '../LayersListItem'\nimport { LayersStatus } from '../LayersStatus/index'\nimport { icon } from '@core/plugins'\n\nconst props = defineProps({\n  componentGroupData: {\n    type: Object as PropType<CreateComponentGroupType>,\n    required: true\n  },\n  layerMode: {\n    type: String as PropType<LayerModeEnum>,\n    default: LayerModeEnum.THUMBNAIL\n  }\n})\n\n// 右键\nconst pickOptionsList = [MenuEnum.UN_GROUP]\n\n// 全局颜色\nconst designStore = useDesignStore()\nconst { FolderIcon, FolderOpenIcon } = icon.ionicons5\n\nconst chartEditStore = useChartEditStore()\nconst { handleContextMenu, onClickOutSide } = useContextMenu()\n\nconst expend = ref(false)\n\n// 颜色\nconst themeColor = computed(() => {\n  return designStore.getAppTheme\n})\n\n// 是否选中文本\nconst selectText = computed(() => {\n  return props.layerMode === LayerModeEnum.TEXT\n})\n\n// 计算当前选中目标\nconst select = computed(() => {\n  const id = props.componentGroupData.id\n  return chartEditStore.getTargetChart.selectId.find((e: string) => e === id)\n})\n\n// 悬浮\nconst hover = computed(() => {\n  return props.componentGroupData.id === chartEditStore.getTargetChart.hoverId\n})\n\n// 组件状态 隐藏/锁定\nconst status = computed(() => {\n  return props.componentGroupData.status\n})\n\n// 右键\nconst optionsHandle = (\n  targetList: MenuOptionsItemType[],\n  allList: MenuOptionsItemType[],\n  targetInstance: CreateComponentType\n) => {\n  const filter = (menulist: MenuEnum[]) => {\n    return allList.filter(i => menulist.includes(i.key as MenuEnum))\n  }\n\n  // 多选处理\n  if (chartEditStore.getTargetChart.selectId.length > 1) {\n    return filter([MenuEnum.GROUP])\n  } else {\n    const statusMenuEnums: MenuEnum[] = []\n    if (targetInstance.status.lock) {\n      statusMenuEnums.push(MenuEnum.LOCK)\n    } else {\n      statusMenuEnums.push(MenuEnum.UNLOCK)\n    }\n    if (targetInstance.status.hide) {\n      statusMenuEnums.push(MenuEnum.HIDE)\n    } else {\n      statusMenuEnums.push(MenuEnum.SHOW)\n    }\n    return [\n      ...filter([MenuEnum.UN_GROUP]),\n      divider(),\n      ...targetList.filter(i => !statusMenuEnums.includes(i.key as MenuEnum))\n    ]\n  }\n}\n\n// 点击\nconst clickHandle = (e: MouseEvent) => {\n  // 按下左键 + CTRL\n  if (window.$KeyboardActive?.ctrl) return\n  // 判断左右键\n  expend.value = !expend.value\n  mousedownHandle(e, props.componentGroupData)\n}\n\n// 组点击事件\nconst groupMousedownHandle = (e: MouseEvent) => {\n  onClickOutSide()\n  // 若此时按下了 CTRL, 表示多选\n  const id = props.componentGroupData.id\n  if (e.buttons === MouseEventButton.LEFT && window.$KeyboardActive?.ctrl) {\n    // 若已选中，则去除\n    if (chartEditStore.targetChart.selectId.includes(id)) {\n      const exList = chartEditStore.targetChart.selectId.filter(e => e !== id)\n      chartEditStore.setTargetSelectChart(exList)\n    } else {\n      chartEditStore.setTargetSelectChart(id, true)\n    }\n    return\n  }\n  chartEditStore.setTargetSelectChart(id)\n}\n\n// 公共点击事件\nconst mousedownHandle = (\n  e: MouseEvent,\n  componentInstance: CreateComponentType | CreateComponentGroupType,\n  id?: string\n) => {\n  e.preventDefault()\n  e.stopPropagation()\n\n  onClickOutSide()\n  chartEditStore.setTargetSelectChart(id || componentInstance.id)\n}\n\n// 公共进入事件\nconst mouseenterHandle = (componentInstance: CreateComponentType | CreateComponentGroupType) => {\n  chartEditStore.setTargetHoverChart(componentInstance.id)\n}\n\n// 公共移出事件\nconst mouseleaveHandle = (componentInstance: CreateComponentType | CreateComponentGroupType) => {\n  chartEditStore.setTargetHoverChart(undefined)\n}\n</script>\n\n<style lang=\"scss\" scoped>\n$centerHeight: 52px;\n$centerMiniHeight: 28px;\n$textSize: 10px;\n\n@include go(content-layers-group-list-item) {\n  position: relative;\n  width: 90%;\n  margin: 10px 5%;\n  margin-bottom: 5px;\n  @extend .go-transition-quick;\n  @include deep() {\n    .go-content-layers-list-item {\n      margin-right: 0 !important;\n      width: 95% !important;\n    }\n  }\n\n  &:hover {\n    @include deep() {\n      .icon-item {\n        opacity: 1;\n      }\n    }\n  }\n\n  .root-item-content {\n    height: $centerHeight;\n    cursor: pointer;\n    border-radius: 5px;\n    border: 1px solid rgba(0, 0, 0, 0);\n    &.hover,\n    &:hover {\n      @include fetch-bg-color('background-color4');\n    }\n    /* 选中 */\n    &.select {\n      border: 1px solid v-bind('themeColor');\n      /* 需要设置最高级，覆盖 hover 的颜色 */\n      background-color: rgba(0, 0, 0, 0);\n      .list-img {\n        border: 1px solid v-bind('themeColor') !important;\n      }\n    }\n\n    // mini样式\n    &.list-mini {\n      height: $centerMiniHeight;\n      .item-content {\n        height: calc(#{$centerMiniHeight} - 10px) !important;\n      }\n      .select-modal {\n        height: calc(#{$centerMiniHeight} + 2px) !important;\n      }\n    }\n  }\n  .select-modal,\n  .item-content {\n    position: absolute;\n    top: 0;\n    left: 0;\n  }\n  .item-content {\n    z-index: 1;\n    padding: 6px 5px;\n    justify-content: start !important;\n    width: calc(100% - 10px);\n    height: calc(#{$centerHeight} - 10px);\n  }\n  .select-modal {\n    width: 100%;\n    height: calc(#{$centerHeight} + 2px);\n    opacity: 0.3;\n    background-color: v-bind('themeColor');\n  }\n  .list-text {\n    padding-left: 6px;\n    font-size: $textSize;\n  }\n\n  .list-status-icon {\n    margin-left: 3px;\n  }\n}\n</style>\n","<template>\n  <content-box\n    class=\"go-content-layers\"\n    :class=\"{ scoped: !chartLayoutStore.getLayers }\"\n    title=\"图层\"\n    :depth=\"2\"\n    @back=\"backHandle\"\n    @mousedown=\"boxMousedownHandle($event)\"\n  >\n    <template #icon>\n      <el-icon :size=\"16\">\n        <component :is=\"LayersIcon\" />\n      </el-icon>\n    </template>\n\n    <template #top-right>\n      <el-button-group style=\"display: flex\">\n        <el-button\n          v-for=\"(item, index) in layerModeList\"\n          :key=\"index\"\n          size=\"small\"\n          :type=\"layerMode === item.value ? 'primary' : 'info'\"\n          :plain=\"layerMode !== item.value\"\n          @click=\"changeLayerType(item.value)\"\n        >\n          <el-tooltip :show-arrow=\"false\" :content=\"item.label\" placement=\"top\">\n            <el-icon :size=\"14\">\n              <component :is=\"item.icon\" />\n            </el-icon>\n          </el-tooltip>\n        </el-button>\n      </el-button-group>\n    </template>\n\n    <!-- 图层内容 -->\n    <div v-if=\"reverseList.length === 0\" class=\"empty-layer\">\n      <span class=\"not-layer-text\">暂无图层~</span>\n    </div>\n\n    <!-- https://github.com/SortableJS/vue.draggable.next -->\n    <draggable item-key=\"id\" v-model=\"layerList\" ghostClass=\"ghost\" @change=\"onMoveCallback\">\n      <template #item=\"{ element }\">\n        <div class=\"go-content-layer-box\">\n          <!-- 组合 -->\n          <layers-group-list-item\n            v-if=\"element.isGroup\"\n            :componentGroupData=\"element\"\n            :layer-mode=\"layerMode\"\n          ></layers-group-list-item>\n          <!-- 单组件 -->\n          <layers-list-item\n            v-else\n            :componentData=\"element\"\n            :layer-mode=\"layerMode\"\n            @mousedown=\"mousedownHandle($event, element)\"\n            @mouseenter=\"mouseenterHandle(element)\"\n            @mouseleave=\"mouseleaveHandle(element)\"\n            @contextmenu=\"handleContextMenu($event, element, optionsHandle)\"\n          ></layers-list-item>\n        </div>\n      </template>\n    </draggable>\n  </content-box>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport Draggable from 'vuedraggable'\nimport cloneDeep from 'lodash/cloneDeep'\nimport { ContentBox } from '../ContentBox/index'\nimport { useChartLayoutStore } from '@core/store/modules/chartLayoutStore/chartLayoutStore'\nimport { ChartLayoutStoreEnum, LayerModeEnum } from '@core/store/modules/chartLayoutStore/chartLayoutStore.d'\nimport { useChartEditStore } from '@core/store/modules/chartEditStore/chartEditStore'\nimport { CreateComponentType, CreateComponentGroupType } from '@core/packages/index.d'\nimport { MenuOptionsItemType } from '@core/views/chart/hooks/useContextMenu.hook.d'\nimport { useContextMenu } from '@core/views/chart/hooks/useContextMenu.hook'\nimport { MenuEnum, MouseEventButton, WinKeyboard, MacKeyboard } from '@core/enums/editPageEnum'\n\nimport { LayersListItem } from './components/LayersListItem/index'\nimport { LayersGroupListItem } from './components/LayersGroupListItem/index'\n\nimport { icon } from '@core/plugins'\n\nconst { LayersIcon, GridIcon, ListIcon } = icon.ionicons5\nconst { LaptopIcon } = icon.carbon\nconst chartLayoutStore = useChartLayoutStore()\nconst chartEditStore = useChartEditStore()\nconst { handleContextMenu, onClickOutSide } = useContextMenu()\n\nconst layerModeList = [\n  { label: '缩略图', icon: LaptopIcon, value: LayerModeEnum.THUMBNAIL },\n  { label: '文本列表', icon: ListIcon, value: LayerModeEnum.TEXT }\n]\n\nconst layerList = ref<any>([])\nconst layerMode = ref<LayerModeEnum>(chartLayoutStore.getLayerType)\n\n// 逆序展示\nconst reverseList = computed(() => {\n  const list: Array<CreateComponentType | CreateComponentGroupType> = cloneDeep(chartEditStore.getComponentList)\n  return list.reverse()\n})\n\nwatch(\n  () => reverseList.value,\n  newValue => {\n    layerList.value = newValue\n  }\n)\n\n// 右键事件\nconst optionsHandle = (\n  targetList: MenuOptionsItemType[],\n  allList: MenuOptionsItemType[],\n  targetInstance: CreateComponentType\n) => {\n  // 多选处理\n  if (chartEditStore.getTargetChart.selectId.length > 1) {\n    return targetList.filter(i => i.key === MenuEnum.GROUP)\n  }\n  const statusMenuEnums: MenuEnum[] = []\n  // 处理锁定与隐藏\n  if (targetInstance.status.lock) {\n    statusMenuEnums.push(MenuEnum.LOCK)\n  } else {\n    statusMenuEnums.push(MenuEnum.UNLOCK)\n  }\n  if (targetInstance.status.hide) {\n    statusMenuEnums.push(MenuEnum.HIDE)\n  } else {\n    statusMenuEnums.push(MenuEnum.SHOW)\n  }\n  return targetList.filter(item => !statusMenuEnums.includes(item.key as MenuEnum))\n}\n\n// 缩小\nconst backHandle = () => {\n  chartLayoutStore.setItem(ChartLayoutStoreEnum.LAYERS, false)\n}\n\n// 移动结束处理\nconst onMoveCallback = (val: any) => {\n  const { oldIndex, newIndex } = val.moved\n  if (newIndex - oldIndex > 0) {\n    // 从上往下\n    const moveTarget = chartEditStore.getComponentList.splice(-(oldIndex + 1), 1)[0]\n    chartEditStore.getComponentList.splice(-newIndex, 0, moveTarget)\n  } else {\n    // 从下往上\n    const moveTarget = chartEditStore.getComponentList.splice(-(oldIndex + 1), 1)[0]\n    if (newIndex === 0) {\n      chartEditStore.getComponentList.push(moveTarget)\n    } else {\n      chartEditStore.getComponentList.splice(-newIndex, 0, moveTarget)\n    }\n  }\n}\n\nconst boxMousedownHandle = (e: MouseEvent) => {\n  const box = document.querySelector('.go-content-layer-box')\n  if ((e.target as any).contains(box)) {\n    chartEditStore.setTargetSelectChart()\n  }\n}\n\n// 点击事件\nconst mousedownHandle = (e: MouseEvent, item: CreateComponentType) => {\n  onClickOutSide()\n  // 若此时按下了 CTRL, 表示多选\n  const id = item.id\n  if (e.buttons === MouseEventButton.LEFT && window.$KeyboardActive?.ctrl) {\n    // 若已选中，则去除\n    if (chartEditStore.targetChart.selectId.includes(id)) {\n      const exList = chartEditStore.targetChart.selectId.filter(e => e !== id)\n      chartEditStore.setTargetSelectChart(exList)\n    } else {\n      chartEditStore.setTargetSelectChart(id, true)\n    }\n    return\n  }\n  chartEditStore.setTargetSelectChart(id)\n}\n\n// 进入事件\nconst mouseenterHandle = (item: CreateComponentType) => {\n  chartEditStore.setTargetHoverChart(item.id)\n}\n\n// 移出事件\nconst mouseleaveHandle = (item: CreateComponentType) => {\n  chartEditStore.setTargetHoverChart(undefined)\n}\n\n// 修改图层展示方式\nconst changeLayerType = (value: LayerModeEnum) => {\n  layerMode.value = value\n  chartLayoutStore.setItem(ChartLayoutStoreEnum.LAYER_TYPE, value)\n}\n</script>\n\n<style lang=\"scss\" scoped>\n$wight: 200px;\n@include go('content-layers') {\n  width: $wight;\n  overflow: hidden;\n  @extend .go-transition;\n  .empty-layer {\n    display: flex;\n    justify-content: center;\n  }\n  .not-layer-text {\n    position: relative;\n    top: 10px;\n    white-space: nowrap;\n    opacity: 0.4;\n  }\n  &.scoped {\n    width: 0;\n  }\n  .ghost {\n    opacity: 0;\n  }\n  .go-layer-mode-active {\n    color: #51d6a9;\n  }\n}\n</style>\n"],"names":["props","__props","LockClosedOutlineIcon","LockOpenOutlineIcon","EyeOutlineIcon","EyeOffOutlineIcon","icon","chartEditStore","useChartEditStore","designStore","useDesignStore","themeColor","computed","showHandle","e","lockHandle","_withDirectives","_openBlock","_createElementBlock","_hoisted_1","_createVNode","_component_el_icon","_normalizeClass","_createBlock","_resolveDynamicComponent","_unref","imageInfo","ref","fetchImages","select","id","hover","status","selectText","LayerModeEnum","_createElementVNode","_component_el_image","requireErrorImg","_hoisted_3","_hoisted_4","_toDisplayString","LayersStatus","MenuEnum","FolderIcon","FolderOpenIcon","handleContextMenu","onClickOutSide","useContextMenu","expend","optionsHandle","targetList","allList","targetInstance","filter","menulist","i","statusMenuEnums","divider","clickHandle","_a","mousedownHandle","groupMousedownHandle","MouseEventButton","exList","componentInstance","mouseenterHandle","mouseleaveHandle","_cache","$event","_hoisted_2","_component_el_collapse_transition","_Fragment","_renderList","element","LayersListItem","LayersIcon","GridIcon","ListIcon","LaptopIcon","chartLayoutStore","useChartLayoutStore","layerModeList","layerList","layerMode","reverseList","cloneDeep","watch","newValue","item","backHandle","ChartLayoutStoreEnum","onMoveCallback","val","oldIndex","newIndex","moveTarget","boxMousedownHandle","box","changeLayerType","value","ContentBox","_component_el_button_group","index","_component_el_button","_component_el_tooltip","Draggable","_withCtx","LayersGroupListItem"],"mappings":"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"}

package/dist/index-b5b7a570.js

@@ -0,0 +1,103 @@
+import { defineComponent as N, useCssVars as V, ref as z, computed as p, resolveComponent as u, openBlock as t, createElementBlock as s, createVNode as r, withCtx as c, createElementVNode as l, unref as C, Fragment as h, renderList as g, createBlock as D, normalizeClass as H, createTextVNode as M, toDisplayString as $, normalizeStyle as f } from "vue";
+import L from "lodash/cloneDeep";
+import { G as O, m as R, w as q, a7 as F, p as G, v as U, _ as j } from "./index-237a6823.js";
+import "element-plus";
+import "screenfull";
+import "lodash/throttle";
+import "html2canvas";
+import "lodash/isObject";
+import "crypto-js";
+import "vue3-lazyload";
+import "vue3-sketch-ruler";
+import "pinia";
+import "vue-i18n";
+import "vue-demi";
+import "lodash/debounce";
+import "lodash/merge";
+import "lodash/pick";
+import "highlight.js/lib/core";
+import "highlight.js/lib/languages/json";
+import "highlight.js/lib/languages/typescript";
+import "axios";
+import "lodash";
+import "element-plus/es/locale/lang/zh-cn";
+import "element-plus/es/locale/lang/en";
+import "three";
+import "three/examples/jsm/controls/OrbitControls";
+import "gsap";
+import "vue3-sketch-ruler/lib/style.css";
+const J = { class: "go-chart-theme-color" }, K = { class: "go-flex-items-center" }, P = { class: "go-flex-items-center" }, Q = /* @__PURE__ */ N({
+  __name: "index",
+  setup(W) {
+    V((o) => ({
+      "7d2c6519": w.value
+    }));
+    const v = O(() => import("./index-66f7ab2a.js")), { SquareIcon: X, AddIcon: x } = G.ionicons5, a = R(), S = q(), i = z(!1), E = p(() => F(a.getEditCanvasConfig.chartCustomThemeColorInfo)), w = p(() => S.getAppTheme), k = p(() => a.getEditCanvasConfig.chartThemeColor), b = () => {
+      i.value = !0;
+    }, T = (o) => `linear-gradient(to right, ${o.color[0]} 0%, ${o.color[5]} 100%)`, y = (o) => L(o).splice(0, 6), I = (o) => {
+      a.setEditCanvasConfig(U.CHART_THEME_COLOR, o);
+    };
+    return (o, n) => {
+      const A = u("el-icon"), _ = u("el-card"), B = u("el-text");
+      return t(), s("div", J, [
+        r(_, {
+          class: "card-box",
+          shadow: "hover",
+          onClick: b
+        }, {
+          default: c(() => [
+            l("div", K, [
+              n[1] || (n[1] = l("span", null, "自定义颜色", -1)),
+              r(A, { size: 16 }, {
+                default: c(() => [
+                  r(C(x))
+                ]),
+                _: 1
+              })
+            ])
+          ]),
+          _: 1
+        }),
+        (t(!0), s(h, null, g(E.value, (e, m) => (t(), D(_, {
+          key: m,
+          class: H(["card-box", { selected: m === k.value }]),
+          shadow: "hover",
+          onClick: (d) => I(m)
+        }, {
+          default: c(() => [
+            l("div", P, [
+              r(B, {
+                class: "theme-name",
+                truncated: ""
+              }, {
+                default: c(() => [
+                  M($(e.name), 1)
+                ]),
+                _: 2
+              }, 1024),
+              (t(!0), s(h, null, g(y(e.color), (d) => (t(), s("span", {
+                class: "theme-color-item",
+                key: d,
+                style: f({ backgroundColor: d })
+              }, null, 4))), 128))
+            ]),
+            l("div", {
+              class: "theme-bottom",
+              style: f({ backgroundImage: T(e) })
+            }, null, 4)
+          ]),
+          _: 2
+        }, 1032, ["class", "onClick"]))), 128)),
+        r(C(v), {
+          modelShow: i.value,
+          "onUpdate:modelShow": n[0] || (n[0] = (e) => i.value = e)
+        }, null, 8, ["modelShow"])
+      ]);
+    };
+  }
+});
+const yo = /* @__PURE__ */ j(Q, [["__scopeId", "data-v-3b39c4ad"]]);
+export {
+  yo as default
+};
+//# sourceMappingURL=index-b5b7a570.js.map

package/dist/index-b5b7a570.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-b5b7a570.js","sources":["../src/views/chart/ContentConfigurations/components/CanvasPage/components/ChartThemeColor/index.vue"],"sourcesContent":["<template>\n  <div class=\"go-chart-theme-color\">\n    <el-card class=\"card-box\" shadow=\"hover\" @click=\"createColorHandle\">\n      <div class=\"go-flex-items-center\">\n        <span>自定义颜色</span>\n        <el-icon :size=\"16\">\n          <add-icon></add-icon>\n        </el-icon>\n      </div>\n    </el-card>\n\n    <el-card v-for=\"(value, key) in comChartColors\" :key=\"key\" class=\"card-box\"\n      :class=\"{ selected: key === selectName }\" shadow=\"hover\" @click=\"selectTheme(key)\">\n      <div class=\"go-flex-items-center\">\n        <el-text class=\"theme-name\" truncated>{{ value.name }} </el-text>\n        <span class=\"theme-color-item\" v-for=\"colorItem in fetchShowColors(value.color)\" :key=\"colorItem\"\n          :style=\"{ backgroundColor: colorItem }\"></span>\n      </div>\n      <div class=\"theme-bottom\" :style=\"{ backgroundImage: colorBackgroundImage(value) }\"></div>\n    </el-card>\n    <!-- 自定义颜色 modal -->\n    <create-color v-model:modelShow=\"createColorModelShow\"></create-color>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed } from 'vue'\nimport cloneDeep from 'lodash/cloneDeep'\nimport { useChartEditStore } from '@core/store/modules/chartEditStore/chartEditStore'\nimport { EditCanvasConfigEnum } from '@core/store/modules/chartEditStore/chartEditStore.d'\nimport { chartColors, ChartColorsNameType } from '@core/settings/chartThemes/index'\nimport { useDesignStore } from '@core/store/modules/designStore/designStore'\nimport { loadAsyncComponent, colorCustomMerge } from '@core/utils'\nimport { icon } from '@core/plugins'\n\ntype FormateCustomColorType = {\n  [T: string]: {\n    color: string[]\n    name: string\n  }\n}\n\nconst CreateColor = loadAsyncComponent(() => import('../CreateColor/index.vue'))\n\nconst { SquareIcon, AddIcon } = icon.ionicons5\nconst chartEditStore = useChartEditStore()\n\n// 全局颜色\nconst designStore = useDesignStore()\nconst createColorModelShow = ref(false)\n\n// 合并默认颜色和自定义颜色\nconst comChartColors = computed(() => {\n  return colorCustomMerge(chartEditStore.getEditCanvasConfig.chartCustomThemeColorInfo)\n})\n\n// 颜色\nconst themeColor = computed(() => {\n  return designStore.getAppTheme\n})\n\n// 选中名称\nconst selectName = computed(() => {\n  return chartEditStore.getEditCanvasConfig.chartThemeColor\n})\n\n// 创建颜色\nconst createColorHandle = () => {\n  createColorModelShow.value = true\n}\n\n// 底色\nconst colorBackgroundImage = (item: { color: string[] }) => {\n  return `linear-gradient(to right, ${item.color[0]} 0%, ${item.color[5]} 100%)`\n}\n\n// 获取用来展示的色号\nconst fetchShowColors = (colors: Array<string>) => {\n  return cloneDeep(colors).splice(0, 6)\n}\n\n// 设置主体色（在 ContentEdit > List 中进行注入）\nconst selectTheme = (theme: ChartColorsNameType) => {\n  chartEditStore.setEditCanvasConfig(EditCanvasConfigEnum.CHART_THEME_COLOR, theme)\n}\n</script>\n\n<style lang=\"scss\" scoped>\n$radius: 10px;\n$itemRadius: 6px;\n\n@include go('chart-theme-color') {\n  .card-box {\n    cursor: pointer;\n    margin-top: 15px;\n    padding: 0;\n    @include fetch-bg-color('background-color4-shallow');\n    border-radius: $radius;\n    overflow: hidden;\n    position: relative;\n    box-sizing: border-box;\n\n    :deep(.el-card__body) {\n      padding: 10px;\n    }\n\n    &.selected {\n      border: 2px solid v-bind('themeColor');\n    }\n\n    &:first-child {\n      margin-top: 5px;\n    }\n\n    .go-flex-items-center {\n      justify-content: space-between;\n      margin-top: -4px;\n    }\n\n    .theme-name {\n      text-align: left;\n      width: 60px;\n    }\n\n    .theme-color-item {\n      display: inline-block;\n      width: 20px;\n      height: 20px;\n      border-radius: $itemRadius;\n    }\n\n    .theme-bottom {\n      position: absolute;\n      left: 0;\n      bottom: 0;\n      width: 100%;\n      height: 3px;\n    }\n  }\n}\n</style>\n"],"names":["CreateColor","loadAsyncComponent","SquareIcon","AddIcon","icon","chartEditStore","useChartEditStore","designStore","useDesignStore","createColorModelShow","ref","comChartColors","computed","colorCustomMerge","themeColor","selectName","createColorHandle","colorBackgroundImage","item","fetchShowColors","colors","cloneDeep","selectTheme","theme","EditCanvasConfigEnum","_openBlock","_createElementBlock","_hoisted_1","_createVNode","_component_el_card","_createElementVNode","_hoisted_2","_cache","_component_el_icon","_unref","_Fragment","_renderList","value","key","_createBlock","_normalizeClass","$event","_hoisted_3","_component_el_text","_createTextVNode","_toDisplayString","colorItem","_normalizeStyle"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,UAAMA,IAAcC,EAAmB,MAAM,OAAO,qBAA0B,CAAC,GAEzE,EAAE,YAAAC,GAAY,SAAAC,MAAYC,EAAK,WAC/BC,IAAiBC,KAGjBC,IAAcC,KACdC,IAAuBC,EAAI,EAAK,GAGhCC,IAAiBC,EAAS,MACvBC,EAAiBR,EAAe,oBAAoB,yBAAyB,CACrF,GAGKS,IAAaF,EAAS,MACnBL,EAAY,WACpB,GAGKQ,IAAaH,EAAS,MACnBP,EAAe,oBAAoB,eAC3C,GAGKW,IAAoB,MAAM;AAC9B,MAAAP,EAAqB,QAAQ;AAAA,IAAA,GAIzBQ,IAAuB,CAACC,MACrB,6BAA6BA,EAAK,MAAM,CAAC,SAASA,EAAK,MAAM,CAAC,WAIjEC,IAAkB,CAACC,MAChBC,EAAUD,CAAM,EAAE,OAAO,GAAG,CAAC,GAIhCE,IAAc,CAACC,MAA+B;AACnC,MAAAlB,EAAA,oBAAoBmB,EAAqB,mBAAmBD,CAAK;AAAA,IAAA;;;AAlFhF,aAAAE,EAAA,GAAAC,EAqBM,OArBNC,GAqBM;AAAA,QApBJC,EAOUC,GAAA;AAAA,UAPD,OAAM;AAAA,UAAW,QAAO;AAAA,UAAS,SAAOb;AAAA,QAAA;qBAC/C,MAKM;AAAA,YALNc,EAKM,OALNC,GAKM;AAAA,cAJJC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAF,EAAkB,cAAZ,SAAK,EAAA;AAAA,cACXF,EAEUK,GAAA,EAFA,MAAM,MAAE;AAAA,2BAChB,MAAqB;AAAA,kBAArBL,EAAqBM,EAAA/B,CAAA,CAAA;AAAA,gBAAA;;;;;;;SAK3BsB,EAAA,EAAA,GAAAC,EAQUS,GARsB,MAAAC,EAAAzB,EAAA,OAAf,CAAA0B,GAAOC,YAAxBC,EAQUV,GAAA;AAAA,UARuC,KAAAS;AAAA,UAAU,OAAME,EAAA,CAAA,YAC3C,EAAA,UAAAF,MAAQvB,EAAU,MAAA,CAAA,CAAA;AAAA,UAAI,QAAO;AAAA,UAAS,SAAK,CAAA0B,MAAEnB,EAAYgB,CAAG;AAAA,QAAA;qBAChF,MAIM;AAAA,YAJNR,EAIM,OAJNY,GAIM;AAAA,cAHJd,EAAiEe,GAAA;AAAA,gBAAxD,OAAM;AAAA,gBAAa,WAAA;AAAA,cAAA;2BAAU,MAAgB;AAAA,kBAAbC,EAAAC,EAAAR,EAAM,IAAI,GAAA,CAAA;AAAA,gBAAA;;;eACnDZ,EAAA,EAAA,GAAAC,EACiDS,WADEhB,EAAgBkB,EAAM,KAAK,IAAxCS,YAAtCpB,EACiD,QAAA;AAAA,gBAD3C,OAAM;AAAA,gBAAsE,KAAKoB;AAAA,gBACpF,4BAA0BA,GAAS;AAAA,cAAA;;YAExChB,EAA0F,OAAA;AAAA,cAArF,OAAM;AAAA,cAAgB,OAAKiB,EAAA,EAAA,iBAAqB9B,EAAqBoB,CAAK,GAAA;AAAA,YAAA;;;;QAGjFT,EAAsEM,EAAAlC,CAAA,GAAA;AAAA,UAAhD,WAAWS,EAAoB;AAAA,uDAApBA,EAAoB,QAAAgC;AAAA;;;;;;"}