@qxs-bns/components 0.0.69 → 0.0.71

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

@@ -1 +1 @@
-{"version":3,"file":"image-upload.vue.mjs","sources":["../../../../../../packages/components/src/image-upload/src/image-upload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { UploadFile, UploadFiles, UploadProps } from 'element-plus'\nimport { ZoomIn, Delete, Image as ImageIcon } from '@qxs-bns/icons'\nimport { useNamespace } from 'element-plus'\n\n// 组件名称\ndefineOptions({\n  name: 'QxsImageUpload',\n})\n\n// Props 定义\nconst {\n  name = 'file',\n  size = 20,\n  width = 160,\n  height = 90,\n  limit = 1,\n  placeholder = '上传图片',\n  notip = false,\n  accept = 'image/jpeg,image/jpg,image/png,image/gif',\n  beforeUpload,\n  tipText = '',\n  disabled = false,\n} = defineProps<ImageUploadProps>()\n\n// Emits 定义\nconst emits = defineEmits<{\n  onSuccess: [res: any, uploadFile: UploadFile, uploadFiles: UploadFiles]\n  remove: [file: UploadFile]\n}>()\n\n// 类型定义\nexport interface ImageUploadProps {\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  disabled?: boolean\n  limit?: number\n}\n\ninterface UploadProgress {\n  preview: string\n  percent: number\n}\n\nconst attrs = useAttrs()\n\nconst fileList = defineModel('fileList', {\n  type: Array as () => UploadFile[],\n  default: () => [],\n})\n\n// 命名空间\nconst nsEl = useNamespace('image-upload')\n\nconst initialIndex = ref(0)\n// 响应式数据\nconst uploadData = ref<{\n  imageViewerVisible: boolean\n  progress: UploadProgress\n}>({\n  imageViewerVisible: false,\n  progress: {\n    preview: '',\n    percent: 0,\n  },\n})\n\nconst cssVar = computed(() => {\n  return nsEl.cssVarBlock({\n    ns: nsEl.namespace.value,\n    width: `${width || 160}px`,\n    height: `${height || 90}px`,\n  })\n})\n\n// 计算属性\nconst exts = computed(() =>\n  accept.split(',').map(ext => ext.split('/').pop()),\n)\n\nconst tipMessage = computed(\n  () =>\n    tipText\n    || `上传图片支持 ${exts.value.join(\n      ' / ',\n    )} 格式，且图片大小不超过 ${size}MB${width && height ? `，建议图片尺寸为 ${width}*${height}` : ''}`,\n)\n\n// 方法\nfunction onPreview(file: UploadFile) {\n  initialIndex.value = fileList.value.indexOf(file)\n  uploadData.value.imageViewerVisible = true\n}\nfunction onRemove(file: UploadFile) {\n  fileList.value.splice(fileList.value.indexOf(file), 1)\n}\n\nfunction previewClose() {\n  uploadData.value.imageViewerVisible = false\n}\n\nconst handleBeforeUpload: UploadProps['beforeUpload'] = (file) => {\n  const fileExt = file.name.split('.').pop() ?? ''\n  const isTypeOk = exts.value.includes(fileExt)\n  const isSizeOk = file.size / 1024 / 1024 < size\n\n  if (!isTypeOk) {\n    ElMessage.error(`上传图片只支持${exts.value.join(' / ')}格式！`)\n    return false\n  }\n\n  if (!isSizeOk) {\n    ElMessage.error(`上传图片大小不能超过 ${size}MB！`)\n    return false\n  }\n\n  uploadData.value.progress.preview = URL.createObjectURL(file)\n\n  return beforeUpload ? beforeUpload(file) : true\n}\n\nconst onProgress: UploadProps['onProgress'] = (evt) => {\n  uploadData.value.progress.percent = Math.floor(evt.percent)\n}\n\nconst onSuccess: UploadProps['onSuccess'] = (...args) => {\n  uploadData.value.progress = {\n    preview: '',\n    percent: 0,\n  }\n  emits('onSuccess', ...args)\n}\n</script>\n\n<template>\n  <div\n    :class=\"nsEl.e('container')\"\n    :style=\"cssVar\"\n  >\n    <el-upload\n      v-bind=\"attrs\"\n      v-model:file-list=\"fileList\"\n      drag\n      :limit=\"limit\"\n      list-type=\"picture-card\"\n      :headers=\"headers\"\n      :action=\"action\"\n      :data=\"data\"\n      :name=\"name\"\n      :accept=\"accept\"\n      :before-upload=\"handleBeforeUpload\"\n      :on-progress=\"onProgress\"\n      :on-preview=\"onPreview\"\n      :on-success=\"onSuccess\"\n      :class=\"[nsEl.e('control'), limit <= fileList.length ? nsEl.e('more-than-limit') : '']\"\n      :on-remove=\"onRemove\"\n    >\n      <slot>\n        <div class=\"image-slot\">\n          <QxsIcon size=\"32px\" :icon=\"ImageIcon\"></QxsIcon>\n          <p>{{ placeholder }}</p>\n        </div>\n      </slot>\n      <template #file=\"{ file }\">\n        <img\n          :class=\"`${nsEl.namespace.value}-upload-list__item-thumbnail`\"\n          :src=\"file.url\"\n        >\n        <span :class=\"`${nsEl.namespace.value}-upload-list__item-actions`\">\n          <span\n            :class=\"`${nsEl.namespace.value}-upload-list__item-preview`\"\n            @click=\"onPreview(file)\"\n          >\n            <ZoomIn size=\"14px\"/>\n          </span>\n          <span style=\"width: 1px; height: 14px; background-color: rgba(255, 255, 255, 0.5);\"></span>\n          <span\n            v-if=\"!disabled\"\n            :class=\"`${nsEl.namespace.value}-upload-list__item-delete`\"\n            @click=\"onRemove(file)\"\n          >\n            <Delete size=\"14px\"/>\n          </span>\n        </span>\n      </template>\n      <template #tip>\n        <slot name=\"tip\">\n          <div\n            v-if=\"!notip\"\n            :class=\"`${nsEl.namespace.value}-upload__tip-text`\"\n          >\n            <div class=\"tip-content\">\n              {{ tipMessage }}\n            </div>\n          </div>\n        </slot>\n      </template>\n    </el-upload>\n\n    <el-image-viewer\n      v-if=\"uploadData.imageViewerVisible\"\n      :url-list=\"fileList.map((item: UploadFile) => item.url).filter((v: string | undefined) => v !== undefined)\"\n      :initial-index=\"initialIndex\"\n      teleported\n      @close=\"previewClose\"\n    />\n  </div>\n</template>\n"],"names":["emits","__emit","attrs","useAttrs","fileList","_useModel","__props","nsEl","useNamespace","initialIndex","ref","uploadData","imageViewerVisible","progress","preview","percent","cssVar","computed","cssVarBlock","ns","namespace","value","width","height","exts","split","map","ext","pop","tipMessage","tipText","join","size","onPreview","file","indexOf","onRemove","splice","previewClose","handleBeforeUpload","fileExt","name","isTypeOk","includes","isSizeOk","URL","createObjectURL","beforeUpload","ElMessage","error","onProgress","evt","Math","floor","onSuccess","args","_createElementBlock","class","_normalizeClass","_unref","e","style","_createVNode","_component_el_upload","_mergeProps","$event","drag","limit","headers","action","data","accept","length","_withCtx","_createElementVNode","src","url","onClick","ZoomIn","disabled","Delete","tip","_renderSlot","_ctx","notip","_hoisted_5","_toDisplayString","_hoisted_1","_component_QxsIcon","icon","ImageIcon","placeholder","_createBlock","_component_el_image_viewer","item","filter","v","teleported","onClose"],"mappings":"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"}
+{"version":3,"file":"image-upload.vue.mjs","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, UploadImage, ZoomIn } from '@qxs-bns/icons'\nimport { ElImageViewer, ElMessage, ElUpload, useNamespace } from 'element-plus'\nimport { computed, ref, useAttrs } from 'vue'\n\n// 组件名称\ndefineOptions({\n  name: 'QxsImageUpload',\n})\n\n// Props 定义\nconst {\n  name = 'file',\n  size = 20,\n  width = 160,\n  height = 90,\n  limit = 1,\n  placeholder = '上传图片',\n  notip = false,\n  accept = 'image/jpeg,image/jpg,image/png,image/gif',\n  beforeUpload,\n  tipText = '',\n  disabled = false,\n} = defineProps<ImageUploadProps>()\n\n// Emits 定义\nconst emits = defineEmits<{\n  onSuccess: [res: any, uploadFile: UploadFile, uploadFiles: UploadFiles]\n  remove: [file: UploadFile]\n}>()\n\n// 类型定义\nexport interface ImageUploadProps {\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  disabled?: boolean\n  limit?: number\n}\n\ninterface UploadProgress {\n  preview: string\n  percent: number\n}\n\nconst attrs = useAttrs()\n\nconst fileList = defineModel('fileList', {\n  type: Array as () => UploadFile[],\n  default: () => [],\n})\n\n// 命名空间\nconst nsEl = useNamespace('image-upload')\n\nconst initialIndex = ref(0)\n// 响应式数据\nconst uploadData = ref<{\n  imageViewerVisible: boolean\n  progress: UploadProgress\n}>({\n  imageViewerVisible: false,\n  progress: {\n    preview: '',\n    percent: 0,\n  },\n})\n\nconst cssVar = computed(() => {\n  return nsEl.cssVarBlock({\n    ns: nsEl.namespace.value,\n    width: `${width || 160}px`,\n    height: `${height || 90}px`,\n  })\n})\n\n// 计算属性\nconst exts = computed(() =>\n  accept.split(',').map(ext => ext.split('/').pop()),\n)\n\nconst tipMessage = computed(\n  () =>\n    tipText\n    || `上传图片支持 ${exts.value.join(\n      ' / ',\n    )} 格式，且图片大小不超过 ${size}MB${width && height ? `，建议图片尺寸为 ${width}*${height}` : ''}`,\n)\n\n// 方法\nfunction onPreview(file: UploadFile) {\n  initialIndex.value = fileList.value.indexOf(file)\n  uploadData.value.imageViewerVisible = true\n}\nfunction onRemove(file: UploadFile) {\n  fileList.value.splice(fileList.value.indexOf(file), 1)\n}\n\nfunction previewClose() {\n  uploadData.value.imageViewerVisible = false\n}\n\nconst handleBeforeUpload: UploadProps['beforeUpload'] = (file) => {\n  const fileExt = file.name.split('.').pop() ?? ''\n  const isTypeOk = exts.value.includes(fileExt)\n  const isSizeOk = file.size / 1024 / 1024 < size\n\n  if (!isTypeOk) {\n    ElMessage.error(`上传图片只支持${exts.value.join(' / ')}格式！`)\n    return false\n  }\n\n  if (!isSizeOk) {\n    ElMessage.error(`上传图片大小不能超过 ${size}MB！`)\n    return false\n  }\n\n  uploadData.value.progress.preview = URL.createObjectURL(file)\n\n  return beforeUpload ? beforeUpload(file) : true\n}\n\nconst onProgress: UploadProps['onProgress'] = (evt) => {\n  uploadData.value.progress.percent = Math.floor(evt.percent)\n}\n\nconst onSuccess: UploadProps['onSuccess'] = (...args) => {\n  uploadData.value.progress = {\n    preview: '',\n    percent: 0,\n  }\n  emits('onSuccess', ...args)\n}\n</script>\n\n<template>\n  <div\n    :class=\"nsEl.e('container')\"\n    :style=\"cssVar\"\n  >\n    <ElUpload\n      v-bind=\"attrs\"\n      v-model:file-list=\"fileList\"\n      drag\n      :limit=\"limit\"\n      list-type=\"picture-card\"\n      :headers=\"headers\"\n      :action=\"action\"\n      :data=\"data\"\n      :name=\"name\"\n      :accept=\"accept\"\n      :before-upload=\"handleBeforeUpload\"\n      :on-progress=\"onProgress\"\n      :on-preview=\"onPreview\"\n      :on-success=\"onSuccess\"\n      :class=\"[nsEl.e('control'), limit <= fileList.length ? nsEl.e('more-than-limit') : '']\"\n      :on-remove=\"onRemove\"\n    >\n      <slot>\n        <div class=\"image-slot\">\n          <QxsIcon\n            size=\"32px\"\n            :icon=\"UploadImage\"\n          />\n          <p>{{ placeholder }}</p>\n        </div>\n      </slot>\n      <template #file=\"{ file }\">\n        <img\n          :class=\"`${nsEl.namespace.value}-upload-list__item-thumbnail`\"\n          :src=\"file.url\"\n        >\n        <span :class=\"`${nsEl.namespace.value}-upload-list__item-actions`\">\n          <span\n            :class=\"`${nsEl.namespace.value}-upload-list__item-preview`\"\n            @click=\"onPreview(file)\"\n          >\n            <ZoomIn size=\"14px\" />\n          </span>\n          <span style=\"width: 1px; height: 14px; background-color: rgb(255 255 255 / 50%);\" />\n          <span\n            v-if=\"!disabled\"\n            :class=\"`${nsEl.namespace.value}-upload-list__item-delete`\"\n            @click=\"onRemove(file)\"\n          >\n            <Delete size=\"14px\" />\n          </span>\n        </span>\n      </template>\n      <template #tip>\n        <slot name=\"tip\">\n          <div\n            v-if=\"!notip\"\n            :class=\"`${nsEl.namespace.value}-upload__tip-text`\"\n          >\n            <div class=\"tip-content\">\n              {{ tipMessage }}\n            </div>\n          </div>\n        </slot>\n      </template>\n    </ElUpload>\n\n    <ElImageViewer\n      v-if=\"uploadData.imageViewerVisible\"\n      :url-list=\"fileList.map((item: UploadFile) => item.url).filter((v: string | undefined) => v !== undefined)\"\n      :initial-index=\"initialIndex\"\n      teleported\n      @close=\"previewClose\"\n    />\n  </div>\n</template>\n"],"names":["emits","__emit","attrs","useAttrs","fileList","_useModel","__props","nsEl","useNamespace","initialIndex","ref","uploadData","imageViewerVisible","progress","preview","percent","cssVar","computed","cssVarBlock","ns","namespace","value","width","height","exts","split","map","ext","pop","tipMessage","tipText","join","size","onPreview","file","indexOf","onRemove","splice","previewClose","handleBeforeUpload","fileExt","name","isTypeOk","includes","isSizeOk","URL","createObjectURL","beforeUpload","ElMessage","error","onProgress","evt","Math","floor","onSuccess","args","_createElementBlock","class","_normalizeClass","_unref","e","style","_createVNode","ElUpload","_mergeProps","$event","drag","limit","headers","action","data","accept","length","_withCtx","_createElementVNode","src","url","onClick","ZoomIn","disabled","Delete","tip","_renderSlot","_ctx","notip","_hoisted_5","_toDisplayString","_hoisted_1","_component_QxsIcon","icon","UploadImage","placeholder","_createBlock","ElImageViewer","item","filter","v","teleported","onClose"],"mappings":"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"}

package/es/src/photo-crop-tool/src/composables.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"composables.mjs","sources":["../../../../../../packages/components/src/photo-crop-tool/src/composables.ts"],"sourcesContent":["// useCanvas.ts\nimport type { Ref } from 'vue'\n\nexport function useCanvas(canvasElement: HTMLCanvasElement) {\n  const context: Ref<CanvasRenderingContext2D | null> = ref(null)\n\n  if (canvasElement) {\n    context.value = canvasElement.getContext('2d')\n  }\n\n  const clearCanvas = () => {\n    if (context.value) {\n      context.value.clearRect(0, 0, canvasElement.width, canvasElement.height)\n    }\n  }\n\n  const drawColor = (x: number, y: number, width: number, height: number, color: string) => {\n    if (context.value) {\n      context.value.fillStyle = color\n      context.value.fillRect(x, y, width, height)\n    }\n  }\n\n  const drawImage = (image: HTMLImageElement, x: number, y: number, width: number, height: number) => {\n    context.value!.drawImage(image, x, y, width, height)\n  }\n\n  const cropCanvas = (x: number, y: number, width: number, height: number): Promise<File | null> => {\n    return new Promise((resolve) => {\n      if (context.value) {\n        const croppedCanvas = document.createElement('canvas')\n        croppedCanvas.width = width\n        croppedCanvas.height = height\n        const croppedContext = croppedCanvas.getContext('2d')\n        if (croppedContext) {\n          croppedContext.drawImage(canvasElement, x, y, width, height, 0, 0, width, height)\n          croppedCanvas.toBlob((blob) => {\n            if (blob) {\n              const file = new File([blob], 'cropped_image.png', { type: 'image/png' })\n              resolve(file)\n            }\n            else {\n              resolve(null)\n            }\n          }, 'image/png')\n        }\n        else {\n          resolve(null)\n        }\n      }\n      else {\n        resolve(null)\n      }\n    })\n  }\n\n  return {\n    clearCanvas,\n    drawColor,\n    drawImage,\n    cropCanvas,\n  }\n}\n"],"names":["useCanvas","canvasElement","context","ref","value","getContext","clearCanvas","clearRect","width","height","drawColor","x","y","color","fillStyle","fillRect","drawImage","image","cropCanvas","Promise","resolve","croppedCanvas","document","createElement","croppedContext","toBlob","blob","file","File","type"],"mappings":"0BAGO,SAASA,EAAUC,GACxB,MAAMC,EAAgDC,EAAI,MAEtDF,IACFC,EAAQE,MAAQH,EAAcI,WAAW,OAiD3C,MAAO,CACLC,YA/CkBA,KACdJ,EAAQE,OACVF,EAAQE,MAAMG,UAAU,EAAG,EAAGN,EAAcO,MAAOP,EAAcQ,SA8CnEC,UA1CgBA,CAACC,EAAWC,EAAWJ,EAAeC,EAAgBI,KAClEX,EAAQE,QACVF,EAAQE,MAAMU,UAAYD,EAC1BX,EAAQE,MAAMW,SAASJ,EAAGC,EAAGJ,EAAOC,KAwCtCO,UApCgBA,CAACC,EAAyBN,EAAWC,EAAWJ,EAAeC,KAC/EP,EAAQE,MAAOY,UAAUC,EAAON,EAAGC,EAAGJ,EAAOC,IAoC7CS,WAjCiBA,CAACP,EAAWC,EAAWJ,EAAeC,IAChD,IAAIU,QAASC,IAClB,GAAIlB,EAAQE,MAAO,CACjB,MAAMiB,EAAgBC,SAASC,cAAc,UAC7CF,EAAcb,MAAQA,EACtBa,EAAcZ,OAASA,EACvB,MAAMe,EAAiBH,EAAchB,WAAW,MAC5CmB,GACFA,EAAeR,UAAUf,EAAeU,EAAGC,EAAGJ,EAAOC,EAAQ,EAAG,EAAGD,EAAOC,GAC1EY,EAAcI,OAAQC,IACpB,GAAIA,EAAM,CACR,MAAMC,EAAO,IAAIC,KAAK,CAACF,GAAO,oBAAqB,CAAEG,KAAM,cAC3DT,EAAQO,EACV,MAEEP,EAAQ,OAET,cAGHA,EAAQ,KAEZ,MAEEA,EAAQ,QAWhB"}
+{"version":3,"file":"composables.mjs","sources":["../../../../../../packages/components/src/photo-crop-tool/src/composables.ts"],"sourcesContent":["import type { Ref } from 'vue'\n// useCanvas.ts\nimport { ref } from 'vue'\n\nexport function useCanvas(canvasElement: HTMLCanvasElement) {\n  const context: Ref<CanvasRenderingContext2D | null> = ref(null)\n\n  if (canvasElement) {\n    context.value = canvasElement.getContext('2d')\n  }\n\n  const clearCanvas = () => {\n    if (context.value) {\n      context.value.clearRect(0, 0, canvasElement.width, canvasElement.height)\n    }\n  }\n\n  const drawColor = (x: number, y: number, width: number, height: number, color: string) => {\n    if (context.value) {\n      context.value.fillStyle = color\n      context.value.fillRect(x, y, width, height)\n    }\n  }\n\n  const drawImage = (image: HTMLImageElement, x: number, y: number, width: number, height: number) => {\n    context.value!.drawImage(image, x, y, width, height)\n  }\n\n  const cropCanvas = (x: number, y: number, width: number, height: number): Promise<File | null> => {\n    return new Promise((resolve) => {\n      if (context.value) {\n        const croppedCanvas = document.createElement('canvas')\n        croppedCanvas.width = width\n        croppedCanvas.height = height\n        const croppedContext = croppedCanvas.getContext('2d')\n        if (croppedContext) {\n          croppedContext.drawImage(canvasElement, x, y, width, height, 0, 0, width, height)\n          croppedCanvas.toBlob((blob) => {\n            if (blob) {\n              const file = new File([blob], 'cropped_image.png', { type: 'image/png' })\n              resolve(file)\n            }\n            else {\n              resolve(null)\n            }\n          }, 'image/png')\n        }\n        else {\n          resolve(null)\n        }\n      }\n      else {\n        resolve(null)\n      }\n    })\n  }\n\n  return {\n    clearCanvas,\n    drawColor,\n    drawImage,\n    cropCanvas,\n  }\n}\n"],"names":["useCanvas","canvasElement","context","ref","value","getContext","clearCanvas","clearRect","width","height","drawColor","x","y","color","fillStyle","fillRect","drawImage","image","cropCanvas","Promise","resolve","croppedCanvas","document","createElement","croppedContext","toBlob","blob","file","File","type"],"mappings":"0BAIO,SAASA,EAAUC,GACxB,MAAMC,EAAgDC,EAAI,MAEtDF,IACFC,EAAQE,MAAQH,EAAcI,WAAW,OAiD3C,MAAO,CACLC,YA/CkBA,KACdJ,EAAQE,OACVF,EAAQE,MAAMG,UAAU,EAAG,EAAGN,EAAcO,MAAOP,EAAcQ,SA8CnEC,UA1CgBA,CAACC,EAAWC,EAAWJ,EAAeC,EAAgBI,KAClEX,EAAQE,QACVF,EAAQE,MAAMU,UAAYD,EAC1BX,EAAQE,MAAMW,SAASJ,EAAGC,EAAGJ,EAAOC,KAwCtCO,UApCgBA,CAACC,EAAyBN,EAAWC,EAAWJ,EAAeC,KAC/EP,EAAQE,MAAOY,UAAUC,EAAON,EAAGC,EAAGJ,EAAOC,IAoC7CS,WAjCiBA,CAACP,EAAWC,EAAWJ,EAAeC,IAChD,IAAIU,QAASC,IAClB,GAAIlB,EAAQE,MAAO,CACjB,MAAMiB,EAAgBC,SAASC,cAAc,UAC7CF,EAAcb,MAAQA,EACtBa,EAAcZ,OAASA,EACvB,MAAMe,EAAiBH,EAAchB,WAAW,MAC5CmB,GACFA,EAAeR,UAAUf,EAAeU,EAAGC,EAAGJ,EAAOC,EAAQ,EAAG,EAAGD,EAAOC,GAC1EY,EAAcI,OAAQC,IACpB,GAAIA,EAAM,CACR,MAAMC,EAAO,IAAIC,KAAK,CAACF,GAAO,oBAAqB,CAAEG,KAAM,cAC3DT,EAAQO,EACV,MAEEP,EAAQ,OAET,cAGHA,EAAQ,KAEZ,MAEEA,EAAQ,QAWhB"}

package/es/src/photo-crop-tool/src/photo-crop-tool.vue.mjs

@@ -1,2 +1,2 @@
-import{defineComponent as e,ref as t,computed as o,watch as l,onMounted as a,nextTick as i,onUnmounted as u,createElementBlock as n,openBlock as v,normalizeClass as s,unref as h,toDisplayString as c,Fragment as r,createElementVNode as p,withModifiers as d,normalizeStyle as f}from"vue";import{useNamespace as m}from"@qxs-bns/hooks";import{useCanvas as g}from"./composables.mjs";import{useElementSize as y,useDraggable as w}from"@vueuse/core";const x=["src"];var b=e({name:"QxsPhotoCropTool",__name:"photo-crop-tool",props:{imgFile:{type:Object,default:()=>null},aspectRatio:{type:String,default:()=>"16 / 9"},defaultWidth:{type:Number,default:()=>320},defaultHeight:{type:Number,default:()=>180},zoomType:{type:String,default:()=>"fixed"}},setup(e,{expose:b}){const T=e;let E=0,R=0,H=0,L=0;const z=m("photo-crop-tool"),F=t(null),N=t(null),W=t(null),k=t(""),M=t(""),X=t({x:0,y:0}),Y=t({width:T.defaultWidth,height:T.defaultHeight,x:0,y:0}),{width:$,height:C}=y(F),{width:_}=y(W),{x:j,y:U,style:B}=w(F,{containerElement:N,draggingElement:F,disabled:o(()=>!!M.value),exact:!0,initialValue:X}),O=o(()=>T.imgFile?URL.createObjectURL(T.imgFile):"");l(()=>T.imgFile,e=>{e&&!e.type.startsWith("image/")?k.value="文件类型错误":k.value=""});const S=o(()=>(W.value?.naturalWidth||0)/_.value),D=o(()=>{const e={left:0,top:0};return"bottom-right"===M.value?(e.left=Y.value.x,e.top=Y.value.y):"top-left"===M.value?(e.left=Y.value.x-$.value,e.top=Y.value.y-C.value):"top-right"===M.value?(e.top=Y.value.y-C.value,e.left=Y.value.x):"bottom-left"===M.value&&(e.left=Y.value.x-$.value,e.top=Y.value.y),e}),V=o(()=>{const{aspectRatio:e}=T,t={width:`${Y.value.width||T.defaultWidth}`,height:`${Y.value.height||T.defaultHeight}`,"aspect-ratio":e,top:`${D.value.top}px`,left:`${D.value.left}px`};return"free"===T.zoomType?delete t["aspect-ratio"]:"fixed"===T.zoomType&&delete t.height,z.cssVarBlock(t)});function q(e){return e*S.value}function I(e,t){const o=N.value?.clientWidth||1/0,l=N.value?.clientHeight||1/0;return{width:Math.min(Math.max(e,0),o),height:Math.min(Math.max(t,0),l)}}function P(e){return e instanceof MouseEvent?{clientX:e.clientX,clientY:e.clientY}:e instanceof TouchEvent&&e.touches.length>0?{clientX:e.touches[0].clientX,clientY:e.touches[0].clientY}:{clientX:0,clientY:0}}function Q(e,t){const{clientX:o,clientY:l}=P(e);M.value=t,E=o,R=l,H=Y.value.width,L=Y.value.height,document.addEventListener("touchmove",A,{passive:!1}),document.addEventListener("touchend",G),"bottom-right"===t?(Y.value.x=j.value,Y.value.y=U.value):"top-left"===t?(Y.value.x=j.value+$.value,Y.value.y=U.value+C.value):"top-right"===t?(Y.value.x=j.value,Y.value.y=U.value+C.value):"bottom-left"===t&&(Y.value.x=j.value+$.value,Y.value.y=U.value),e instanceof TouchEvent&&e.preventDefault()}function A(e){e instanceof TouchEvent&&M.value&&e.preventDefault();const{clientX:t,clientY:o}=P(e),l=t-E,a=o-R;if("bottom-right"===M.value){if("free"===T.zoomType){const{width:e,height:t}=I(H+l,L+a);Y.value.width=e,Y.value.height=t}else if("fixed"===T.zoomType){const e=Number.parseFloat(T.aspectRatio.split(" / ")[0])/Number.parseFloat(T.aspectRatio.split(" / ")[1]);let t=H+l,o=t/e;const{width:a,height:i}=I(t,o);i>(N.value?.clientHeight||1/0)&&(o=N.value?.clientHeight||1/0,t=o*e),Y.value.width=a,Y.value.height=i}}else if("top-left"===M.value){if("free"===T.zoomType){const{width:e,height:t}=I(H-l,L-a);Y.value.width=e,Y.value.height=t}else if("fixed"===T.zoomType){const e=Number.parseFloat(T.aspectRatio.split(" / ")[0])/Number.parseFloat(T.aspectRatio.split(" / ")[1]);let t=H-l,o=t/e;const{width:a,height:i}=I(t,o);i>(N.value?.clientHeight||1/0)&&(o=N.value?.clientHeight||1/0,t=o*e),Y.value.width=a,Y.value.height=i}j.value=D.value.left,U.value=D.value.top}else if("top-right"===M.value){if("free"===T.zoomType){const{width:e,height:t}=I(H+l,L-a);Y.value.width=e,Y.value.height=t}else if("fixed"===T.zoomType){const e=Number.parseFloat(T.aspectRatio.split(" / ")[0])/Number.parseFloat(T.aspectRatio.split(" / ")[1]);let t=H+l,o=t/e;const{width:a,height:i}=I(t,o);i>(N.value?.clientHeight||1/0)&&(o=N.value?.clientHeight||1/0,t=o*e),Y.value.width=a,Y.value.height=i}j.value=D.value.left,U.value=D.value.top}else if("bottom-left"===M.value){if("free"===T.zoomType){const{width:e,height:t}=I(H-l,L+a);Y.value.width=e,Y.value.height=t}else if("fixed"===T.zoomType){const e=Number.parseFloat(T.aspectRatio.split(" / ")[0])/Number.parseFloat(T.aspectRatio.split(" / ")[1]);let t=H-l,o=t/e;const{width:a,height:i}=I(t,o);i>(N.value?.clientHeight||1/0)&&(o=N.value?.clientHeight||1/0,t=o*e),Y.value.width=a,Y.value.height=i}j.value=D.value.left,U.value=D.value.top}}function G(){document.removeEventListener("touchmove",A),document.removeEventListener("touchend",G),M.value=""}return a(()=>{i(()=>{X.value.x=(N.value?.offsetWidth||0)/2-Y.value.width/2,X.value.y=(N.value?.offsetHeight||0)/2-Y.value.height/2}),document.addEventListener("mouseup",G),document.addEventListener("mousemove",A,{passive:!1}),document.addEventListener("touchmove",A,{passive:!1}),document.addEventListener("touchend",G)}),u(()=>{O.value&&URL.revokeObjectURL(O.value),document.removeEventListener("mouseup",G),document.removeEventListener("mousemove",A)}),b({crop:async function(e=W.value){let t="transparent";N.value&&(t=window.getComputedStyle(N.value).backgroundColor);const o=document.createElement("canvas");o.width=q(N.value?.clientWidth||0),o.height=q(N.value?.clientHeight||0);const{drawImage:l,cropCanvas:a,drawColor:i}=g(o);return i(0,0,o.width,o.height,t),l(e,q(e.offsetLeft),q(e.offsetTop),e.naturalWidth,e.naturalHeight),await a(q(j.value),q(U.value),q($.value),q(C.value))},resize:function(){Y.value.width=T.defaultWidth,Y.value.height=T.defaultHeight,j.value=0,U.value=0}}),(e,t)=>(v(),n("div",{ref_key:"containerBoxRef",ref:N,class:s([h(z).e("img-box")])},[h(k)?(v(),n("div",{key:0,class:s([h(z).e("error-message")])},c(h(k)),3)):(v(),n(r,{key:1},[p("img",{ref_key:"imgRef",ref:W,class:s([h(z).e("image")]),src:h(O)},null,10,x),p("div",{ref_key:"cropBoxRef",ref:F,class:s([h(z).e("crop-tool-box")]),style:f([h(V),h(M)?`left: ${h(D).left}px;top: ${h(D).top}px`:h(B)]),onTouchstart:t[8]||(t[8]=d(()=>{},["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},[p("div",{class:s([h(z).e("top-left")]),onMousedown:t[0]||(t[0]=d(e=>Q(e,"top-left"),["stop","prevent"])),onTouchstart:t[1]||(t[1]=d(e=>Q(e,"top-left"),["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},null,34),p("div",{class:s([h(z).e("top-right")]),onMousedown:t[2]||(t[2]=d(e=>Q(e,"top-right"),["stop","prevent"])),onTouchstart:t[3]||(t[3]=d(e=>Q(e,"top-right"),["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},null,34),p("div",{class:s([h(z).e("bottom-right")]),onMousedown:t[4]||(t[4]=d(e=>Q(e,"bottom-right"),["stop","prevent"])),onTouchstart:t[5]||(t[5]=d(e=>Q(e,"bottom-right"),["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},null,34),p("div",{class:s([h(z).e("bottom-left")]),onMousedown:t[6]||(t[6]=d(e=>Q(e,"bottom-left"),["stop","prevent"])),onTouchstart:t[7]||(t[7]=d(e=>Q(e,"bottom-left"),["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},null,34)],38)],64))],2))}});export{b as default};
+import{defineComponent as e,ref as t,computed as l,watch as o,onMounted as a,nextTick as u,onUnmounted as i,createElementBlock as n,openBlock as v,normalizeClass as s,unref as h,toDisplayString as c,Fragment as r,createElementVNode as p,withModifiers as d,normalizeStyle as f}from"vue";import{useNamespace as m}from"@qxs-bns/hooks";import{useElementSize as g,useDraggable as y}from"@vueuse/core";import{useCanvas as w}from"./composables.mjs";const x=["src"];var b=e({name:"QxsPhotoCropTool",__name:"photo-crop-tool",props:{imgFile:{type:Object,default:()=>null},aspectRatio:{type:String,default:()=>"16 / 9"},defaultWidth:{type:Number,default:()=>320},defaultHeight:{type:Number,default:()=>180},zoomType:{type:String,default:()=>"fixed"}},setup(e,{expose:b}){const T=e;let E=0,R=0,H=0,L=0;const z=m("photo-crop-tool"),F=t(null),N=t(null),W=t(null),k=t(""),M=t(""),X=t({x:0,y:0}),Y=t({width:T.defaultWidth,height:T.defaultHeight,x:0,y:0}),{width:$,height:C}=g(F),{width:_}=g(W),{x:j,y:U,style:B}=y(F,{containerElement:N,draggingElement:F,disabled:l(()=>!!M.value),exact:!0,initialValue:X}),O=l(()=>T.imgFile?URL.createObjectURL(T.imgFile):"");o(()=>T.imgFile,e=>{e&&!e.type.startsWith("image/")?k.value="文件类型错误":k.value=""});const S=l(()=>(W.value?.naturalWidth||0)/_.value),D=l(()=>{const e={left:0,top:0};return"bottom-right"===M.value?(e.left=Y.value.x,e.top=Y.value.y):"top-left"===M.value?(e.left=Y.value.x-$.value,e.top=Y.value.y-C.value):"top-right"===M.value?(e.top=Y.value.y-C.value,e.left=Y.value.x):"bottom-left"===M.value&&(e.left=Y.value.x-$.value,e.top=Y.value.y),e}),V=l(()=>{const{aspectRatio:e}=T,t={width:`${Y.value.width||T.defaultWidth}`,height:`${Y.value.height||T.defaultHeight}`,"aspect-ratio":e,top:`${D.value.top}px`,left:`${D.value.left}px`};return"free"===T.zoomType?delete t["aspect-ratio"]:"fixed"===T.zoomType&&delete t.height,z.cssVarBlock(t)});function q(e){return e*S.value}function I(e,t){const l=N.value?.clientWidth||1/0,o=N.value?.clientHeight||1/0;return{width:Math.min(Math.max(e,0),l),height:Math.min(Math.max(t,0),o)}}function P(e){return e instanceof MouseEvent?{clientX:e.clientX,clientY:e.clientY}:e instanceof TouchEvent&&e.touches.length>0?{clientX:e.touches[0].clientX,clientY:e.touches[0].clientY}:{clientX:0,clientY:0}}function Q(e,t){const{clientX:l,clientY:o}=P(e);M.value=t,E=l,R=o,H=Y.value.width,L=Y.value.height,document.addEventListener("touchmove",A,{passive:!1}),document.addEventListener("touchend",G),"bottom-right"===t?(Y.value.x=j.value,Y.value.y=U.value):"top-left"===t?(Y.value.x=j.value+$.value,Y.value.y=U.value+C.value):"top-right"===t?(Y.value.x=j.value,Y.value.y=U.value+C.value):"bottom-left"===t&&(Y.value.x=j.value+$.value,Y.value.y=U.value),e instanceof TouchEvent&&e.preventDefault()}function A(e){e instanceof TouchEvent&&M.value&&e.preventDefault();const{clientX:t,clientY:l}=P(e),o=t-E,a=l-R;if("bottom-right"===M.value){if("free"===T.zoomType){const{width:e,height:t}=I(H+o,L+a);Y.value.width=e,Y.value.height=t}else if("fixed"===T.zoomType){const e=Number.parseFloat(T.aspectRatio.split(" / ")[0])/Number.parseFloat(T.aspectRatio.split(" / ")[1]);let t=H+o,l=t/e;const{width:a,height:u}=I(t,l);u>(N.value?.clientHeight||1/0)&&(l=N.value?.clientHeight||1/0,t=l*e),Y.value.width=a,Y.value.height=u}}else if("top-left"===M.value){if("free"===T.zoomType){const{width:e,height:t}=I(H-o,L-a);Y.value.width=e,Y.value.height=t}else if("fixed"===T.zoomType){const e=Number.parseFloat(T.aspectRatio.split(" / ")[0])/Number.parseFloat(T.aspectRatio.split(" / ")[1]);let t=H-o,l=t/e;const{width:a,height:u}=I(t,l);u>(N.value?.clientHeight||1/0)&&(l=N.value?.clientHeight||1/0,t=l*e),Y.value.width=a,Y.value.height=u}j.value=D.value.left,U.value=D.value.top}else if("top-right"===M.value){if("free"===T.zoomType){const{width:e,height:t}=I(H+o,L-a);Y.value.width=e,Y.value.height=t}else if("fixed"===T.zoomType){const e=Number.parseFloat(T.aspectRatio.split(" / ")[0])/Number.parseFloat(T.aspectRatio.split(" / ")[1]);let t=H+o,l=t/e;const{width:a,height:u}=I(t,l);u>(N.value?.clientHeight||1/0)&&(l=N.value?.clientHeight||1/0,t=l*e),Y.value.width=a,Y.value.height=u}j.value=D.value.left,U.value=D.value.top}else if("bottom-left"===M.value){if("free"===T.zoomType){const{width:e,height:t}=I(H-o,L+a);Y.value.width=e,Y.value.height=t}else if("fixed"===T.zoomType){const e=Number.parseFloat(T.aspectRatio.split(" / ")[0])/Number.parseFloat(T.aspectRatio.split(" / ")[1]);let t=H-o,l=t/e;const{width:a,height:u}=I(t,l);u>(N.value?.clientHeight||1/0)&&(l=N.value?.clientHeight||1/0,t=l*e),Y.value.width=a,Y.value.height=u}j.value=D.value.left,U.value=D.value.top}}function G(){document.removeEventListener("touchmove",A),document.removeEventListener("touchend",G),M.value=""}return a(()=>{u(()=>{X.value.x=(N.value?.offsetWidth||0)/2-Y.value.width/2,X.value.y=(N.value?.offsetHeight||0)/2-Y.value.height/2}),document.addEventListener("mouseup",G),document.addEventListener("mousemove",A,{passive:!1}),document.addEventListener("touchmove",A,{passive:!1}),document.addEventListener("touchend",G)}),i(()=>{O.value&&URL.revokeObjectURL(O.value),document.removeEventListener("mouseup",G),document.removeEventListener("mousemove",A)}),b({crop:async function(e=W.value){let t="transparent";N.value&&(t=window.getComputedStyle(N.value).backgroundColor);const l=document.createElement("canvas");l.width=q(N.value?.clientWidth||0),l.height=q(N.value?.clientHeight||0);const{drawImage:o,cropCanvas:a,drawColor:u}=w(l);return u(0,0,l.width,l.height,t),o(e,q(e.offsetLeft),q(e.offsetTop),e.naturalWidth,e.naturalHeight),await a(q(j.value),q(U.value),q($.value),q(C.value))},resize:function(){Y.value.width=T.defaultWidth,Y.value.height=T.defaultHeight,j.value=0,U.value=0}}),(e,t)=>(v(),n("div",{ref_key:"containerBoxRef",ref:N,class:s([h(z).e("img-box")])},[k.value?(v(),n("div",{key:0,class:s([h(z).e("error-message")])},c(k.value),3)):(v(),n(r,{key:1},[p("img",{ref_key:"imgRef",ref:W,class:s([h(z).e("image")]),src:O.value},null,10,x),p("div",{ref_key:"cropBoxRef",ref:F,class:s([h(z).e("crop-tool-box")]),style:f([V.value,M.value?`left: ${D.value.left}px;top: ${D.value.top}px`:h(B)]),onTouchstart:t[8]||(t[8]=d(()=>{},["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},[p("div",{class:s([h(z).e("top-left")]),onMousedown:t[0]||(t[0]=d(e=>Q(e,"top-left"),["stop","prevent"])),onTouchstart:t[1]||(t[1]=d(e=>Q(e,"top-left"),["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},null,34),p("div",{class:s([h(z).e("top-right")]),onMousedown:t[2]||(t[2]=d(e=>Q(e,"top-right"),["stop","prevent"])),onTouchstart:t[3]||(t[3]=d(e=>Q(e,"top-right"),["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},null,34),p("div",{class:s([h(z).e("bottom-right")]),onMousedown:t[4]||(t[4]=d(e=>Q(e,"bottom-right"),["stop","prevent"])),onTouchstart:t[5]||(t[5]=d(e=>Q(e,"bottom-right"),["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},null,34),p("div",{class:s([h(z).e("bottom-left")]),onMousedown:t[6]||(t[6]=d(e=>Q(e,"bottom-left"),["stop","prevent"])),onTouchstart:t[7]||(t[7]=d(e=>Q(e,"bottom-left"),["stop","prevent"])),onTouchend:d(G,["stop","prevent"])},null,34)],38)],64))],2))}});export{b as default};
 //# sourceMappingURL=photo-crop-tool.vue.mjs.map

package/es/src/photo-crop-tool/src/photo-crop-tool.vue.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"photo-crop-tool.vue.mjs","sources":["../../../../../../packages/components/src/photo-crop-tool/src/photo-crop-tool.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PropType } from 'vue'\nimport { useNamespace } from '@qxs-bns/hooks'\nimport { useCanvas } from './composables'\n\ndefineOptions({\n  name: 'QxsPhotoCropTool',\n})\n\nconst props = defineProps({\n  imgFile: {\n    type: Object as PropType<File>,\n    default: () => null,\n  },\n  aspectRatio: {\n    type: String,\n    default: () => '16 / 9',\n  },\n  defaultWidth: {\n    type: Number,\n    default: () => 320,\n  },\n  defaultHeight: {\n    type: Number,\n    default: () => 180,\n  },\n  /**\n   * free 自由缩放\n   * fixed 固定比例缩放\n   */\n  zoomType: {\n    type: String,\n    default: () => 'fixed',\n  },\n})\nlet startX = 0\nlet startY = 0\nlet startWidth = 0\nlet startHeight = 0\n\nconst ns = useNamespace('photo-crop-tool')\n\nconst cropBoxRef = ref<HTMLElement | null>(null)\nconst containerBoxRef = ref<HTMLElement | null>(null)\nconst imgRef = ref<HTMLImageElement | null>(null)\nconst errorMessage = ref('')\nconst dargPoint = ref('')\nconst initialValue = ref({\n  x: 0,\n  y: 0,\n})\nconst cropInfo = ref({\n  width: props.defaultWidth,\n  height: props.defaultHeight,\n  x: 0,\n  y: 0,\n})\n\nconst { width, height } = useElementSize(cropBoxRef)\nconst { width: imgWidth } = useElementSize(imgRef)\n\nconst { x, y, style } = useDraggable(cropBoxRef, {\n  containerElement: containerBoxRef,\n  draggingElement: cropBoxRef,\n  disabled: computed(() => !!dargPoint.value),\n  exact: true,\n  initialValue,\n})\n\nconst imageUrl = computed(() => {\n  if (!props.imgFile) {\n    return ''\n  }\n  return URL.createObjectURL(props.imgFile)\n})\n\nwatch(\n  () => props.imgFile,\n  (newFile: File | null) => {\n    if (newFile && !newFile.type.startsWith('image/')) {\n      errorMessage.value = '文件类型错误'\n    }\n    else {\n      errorMessage.value = ''\n    }\n  },\n)\n\nconst ratio = computed(() => {\n  return (imgRef.value?.naturalWidth || 0) / imgWidth.value\n})\n\nconst customStyle = computed(() => {\n  const position = {\n    left: 0,\n    top: 0,\n  }\n  if (dargPoint.value === 'bottom-right') {\n    position.left = cropInfo.value.x\n    position.top = cropInfo.value.y\n  }\n  else if (dargPoint.value === 'top-left') {\n    position.left = cropInfo.value.x - width.value\n    position.top = cropInfo.value.y - height.value\n  }\n  else if (dargPoint.value === 'top-right') {\n    position.top = cropInfo.value.y - height.value\n    position.left = cropInfo.value.x\n  }\n  else if (dargPoint.value === 'bottom-left') {\n    position.left = cropInfo.value.x - width.value\n    position.top = cropInfo.value.y\n  }\n  return position\n})\n\nconst sizeStyle = computed(() => {\n  const { aspectRatio } = props\n\n  const style: {\n    'height'?: string\n    'width': string\n    'aspect-ratio'?: string\n    'top': string\n    'left': string\n  } = {\n    'width': `${cropInfo.value.width || props.defaultWidth}`,\n    'height': `${cropInfo.value.height || props.defaultHeight}`,\n    'aspect-ratio': aspectRatio,\n    'top': `${customStyle.value.top}px`,\n    'left': `${customStyle.value.left}px`,\n  }\n  if (props.zoomType === 'free') {\n    delete style['aspect-ratio']\n  }\n  else if (props.zoomType === 'fixed') {\n    delete style.height\n  }\n  return ns.cssVarBlock(style)\n})\n\nfunction zoom(pixel: number) {\n  return pixel * ratio.value\n}\nasync function crop(img: HTMLImageElement = imgRef.value!) {\n  let backgroundColor = 'transparent'\n  if (containerBoxRef.value) {\n    backgroundColor = window.getComputedStyle(\n      containerBoxRef.value,\n    ).backgroundColor\n  }\n  const canvas = document.createElement('canvas')\n  canvas.width = zoom(containerBoxRef.value?.clientWidth || 0)\n  canvas.height = zoom(containerBoxRef.value?.clientHeight || 0)\n  const { drawImage, cropCanvas, drawColor } = useCanvas(canvas)\n  drawColor(0, 0, canvas.width, canvas.height, backgroundColor)\n  drawImage(\n    img,\n    zoom(img.offsetLeft),\n    zoom(img.offsetTop),\n    img.naturalWidth,\n    img.naturalHeight,\n  )\n  return await cropCanvas(\n    zoom(x.value),\n    zoom(y.value),\n    zoom(width.value),\n    zoom(height.value),\n  )\n}\n\nfunction checkBoundaries(\n  newWidth: number,\n  newHeight: number,\n): { width: number, height: number } {\n  const maxWidth = containerBoxRef.value?.clientWidth || Infinity\n  const maxHeight = containerBoxRef.value?.clientHeight || Infinity\n\n  return {\n    width: Math.min(Math.max(newWidth, 0), maxWidth),\n    height: Math.min(Math.max(newHeight, 0), maxHeight),\n  }\n}\n\nfunction getClientPos(e: MouseEvent | TouchEvent): { clientX: number, clientY: number } {\n  if (e instanceof MouseEvent) {\n    return { clientX: e.clientX, clientY: e.clientY }\n  }\n  else if (e instanceof TouchEvent && e.touches.length > 0) {\n    return { clientX: e.touches[0].clientX, clientY: e.touches[0].clientY }\n  }\n  return { clientX: 0, clientY: 0 }\n}\n\nfunction handleStart(e: MouseEvent | TouchEvent, point: string) {\n  const { clientX, clientY } = getClientPos(e)\n  dargPoint.value = point\n  startX = clientX\n  startY = clientY\n  startWidth = cropInfo.value.width\n  startHeight = cropInfo.value.height\n\n  // 添加移动端事件监听\n  document.addEventListener('touchmove', handleMove, { passive: false })\n  document.addEventListener('touchend', handleEnd)\n\n  if (point === 'bottom-right') {\n    cropInfo.value.x = x.value\n    cropInfo.value.y = y.value\n  }\n  else if (point === 'top-left') {\n    cropInfo.value.x = x.value + width.value\n    cropInfo.value.y = y.value + height.value\n  }\n  else if (point === 'top-right') {\n    cropInfo.value.x = x.value\n    cropInfo.value.y = y.value + height.value\n  }\n  else if (point === 'bottom-left') {\n    cropInfo.value.x = x.value + width.value\n    cropInfo.value.y = y.value\n  }\n\n  // Prevent touch scrolling\n  if (e instanceof TouchEvent) {\n    e.preventDefault()\n  }\n}\n\nfunction handleMove(e: MouseEvent | TouchEvent) {\n  // Only prevent default if we're in a drag operation\n  if (e instanceof TouchEvent && dargPoint.value) {\n    e.preventDefault()\n  }\n\n  const { clientX, clientY } = getClientPos(e)\n  const deltaX = clientX - startX\n  const deltaY = clientY - startY\n\n  if (dargPoint.value === 'bottom-right') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth + deltaX,\n        startHeight + deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth + deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n  }\n  else if (dargPoint.value === 'top-left') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth - deltaX,\n        startHeight - deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth - deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n  else if (dargPoint.value === 'top-right') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth + deltaX,\n        startHeight - deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth + deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n  else if (dargPoint.value === 'bottom-left') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth - deltaX,\n        startHeight + deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth - deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n}\n\nfunction handleEnd() {\n  // 移除移动端事件监听\n  document.removeEventListener('touchmove', handleMove)\n  document.removeEventListener('touchend', handleEnd)\n\n  dargPoint.value = ''\n}\n\nfunction resize() {\n  cropInfo.value.width = props.defaultWidth\n  cropInfo.value.height = props.defaultHeight\n  x.value = 0\n  y.value = 0\n}\n\nonMounted(() => {\n  nextTick(() => {\n    // 初始化位置\n    initialValue.value.x\n      = (containerBoxRef.value?.offsetWidth || 0) / 2 - cropInfo.value.width / 2\n    initialValue.value.y\n      = (containerBoxRef.value?.offsetHeight || 0) / 2\n        - cropInfo.value.height / 2\n  })\n\n  // 只添加鼠标事件监听\n  document.addEventListener('mouseup', handleEnd)\n  document.addEventListener('mousemove', handleMove, { passive: false })\n  document.addEventListener('touchmove', handleMove, { passive: false })\n  document.addEventListener('touchend', handleEnd)\n})\n\nonUnmounted(() => {\n  if (imageUrl.value) {\n    URL.revokeObjectURL(imageUrl.value)\n  }\n  // 确保移除所有事件监听\n  document.removeEventListener('mouseup', handleEnd)\n  document.removeEventListener('mousemove', handleMove)\n})\n\ndefineExpose({\n  crop,\n  resize,\n})\n</script>\n\n<template>\n  <div\n    ref=\"containerBoxRef\"\n    :class=\"[ns.e('img-box')]\"\n  >\n    <div\n      v-if=\"errorMessage\"\n      :class=\"[ns.e('error-message')]\"\n    >\n      {{ errorMessage }}\n    </div>\n    <template v-else>\n      <img\n        ref=\"imgRef\"\n        :class=\"[ns.e('image')]\"\n        :src=\"imageUrl\"\n      >\n      <div\n        ref=\"cropBoxRef\"\n        :class=\"[ns.e('crop-tool-box')]\"\n        :style=\"[\n          sizeStyle,\n          dargPoint\n            ? `left: ${customStyle.left}px;top: ${customStyle.top}px`\n            : style,\n        ]\"\n        @touchstart.stop.prevent\n        @touchend.stop.prevent=\"handleEnd\"\n      >\n        <div\n          :class=\"[ns.e('top-left')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'top-left')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'top-left')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n        <div\n          :class=\"[ns.e('top-right')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'top-right')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'top-right')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n        <div\n          :class=\"[ns.e('bottom-right')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'bottom-right')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'bottom-right')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n        <div\n          :class=\"[ns.e('bottom-left')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'bottom-left')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'bottom-left')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n      </div>\n    </template>\n  </div>\n</template>\n"],"names":["props","__props","startX","startY","startWidth","startHeight","ns","useNamespace","cropBoxRef","ref","containerBoxRef","imgRef","errorMessage","dargPoint","initialValue","x","y","cropInfo","width","defaultWidth","height","defaultHeight","useElementSize","imgWidth","style","useDraggable","containerElement","draggingElement","disabled","computed","value","exact","imageUrl","imgFile","URL","createObjectURL","watch","newFile","type","startsWith","ratio","naturalWidth","customStyle","position","left","top","sizeStyle","aspectRatio","zoomType","cssVarBlock","zoom","pixel","checkBoundaries","newWidth","newHeight","maxWidth","clientWidth","Infinity","maxHeight","clientHeight","Math","min","max","getClientPos","e","MouseEvent","clientX","clientY","TouchEvent","touches","length","handleStart","point","document","addEventListener","handleMove","passive","handleEnd","preventDefault","deltaX","deltaY","Number","parseFloat","split","removeEventListener","onMounted","nextTick","offsetWidth","offsetHeight","onUnmounted","revokeObjectURL","__expose","crop","async","img","backgroundColor","window","getComputedStyle","canvas","createElement","drawImage","cropCanvas","drawColor","useCanvas","offsetLeft","offsetTop","naturalHeight","resize","_createElementBlock","class","_normalizeClass","_unref","_Fragment","key","_createElementVNode","src","_normalizeStyle","onTouchstart","onTouchend","onMousedown","_cache","_withModifiers","$event"],"mappings":"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"}
+{"version":3,"file":"photo-crop-tool.vue.mjs","sources":["../../../../../../packages/components/src/photo-crop-tool/src/photo-crop-tool.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PropType } from 'vue'\nimport { useNamespace } from '@qxs-bns/hooks'\nimport { useDraggable, useElementSize } from '@vueuse/core'\nimport { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'\nimport { useCanvas } from './composables'\n\ndefineOptions({\n  name: 'QxsPhotoCropTool',\n})\n\nconst props = defineProps({\n  imgFile: {\n    type: Object as PropType<File>,\n    default: () => null,\n  },\n  aspectRatio: {\n    type: String,\n    default: () => '16 / 9',\n  },\n  defaultWidth: {\n    type: Number,\n    default: () => 320,\n  },\n  defaultHeight: {\n    type: Number,\n    default: () => 180,\n  },\n  /**\n   * free 自由缩放\n   * fixed 固定比例缩放\n   */\n  zoomType: {\n    type: String,\n    default: () => 'fixed',\n  },\n})\nlet startX = 0\nlet startY = 0\nlet startWidth = 0\nlet startHeight = 0\n\nconst ns = useNamespace('photo-crop-tool')\n\nconst cropBoxRef = ref<HTMLElement | null>(null)\nconst containerBoxRef = ref<HTMLElement | null>(null)\nconst imgRef = ref<HTMLImageElement | null>(null)\nconst errorMessage = ref('')\nconst dargPoint = ref('')\nconst initialValue = ref({\n  x: 0,\n  y: 0,\n})\nconst cropInfo = ref({\n  width: props.defaultWidth,\n  height: props.defaultHeight,\n  x: 0,\n  y: 0,\n})\n\nconst { width, height } = useElementSize(cropBoxRef)\nconst { width: imgWidth } = useElementSize(imgRef)\n\nconst { x, y, style } = useDraggable(cropBoxRef, {\n  containerElement: containerBoxRef,\n  draggingElement: cropBoxRef,\n  disabled: computed(() => !!dargPoint.value),\n  exact: true,\n  initialValue,\n})\n\nconst imageUrl = computed(() => {\n  if (!props.imgFile) {\n    return ''\n  }\n  return URL.createObjectURL(props.imgFile)\n})\n\nwatch(\n  () => props.imgFile,\n  (newFile: File | null) => {\n    if (newFile && !newFile.type.startsWith('image/')) {\n      errorMessage.value = '文件类型错误'\n    }\n    else {\n      errorMessage.value = ''\n    }\n  },\n)\n\nconst ratio = computed(() => {\n  return (imgRef.value?.naturalWidth || 0) / imgWidth.value\n})\n\nconst customStyle = computed(() => {\n  const position = {\n    left: 0,\n    top: 0,\n  }\n  if (dargPoint.value === 'bottom-right') {\n    position.left = cropInfo.value.x\n    position.top = cropInfo.value.y\n  }\n  else if (dargPoint.value === 'top-left') {\n    position.left = cropInfo.value.x - width.value\n    position.top = cropInfo.value.y - height.value\n  }\n  else if (dargPoint.value === 'top-right') {\n    position.top = cropInfo.value.y - height.value\n    position.left = cropInfo.value.x\n  }\n  else if (dargPoint.value === 'bottom-left') {\n    position.left = cropInfo.value.x - width.value\n    position.top = cropInfo.value.y\n  }\n  return position\n})\n\nconst sizeStyle = computed(() => {\n  const { aspectRatio } = props\n\n  const style: {\n    'height'?: string\n    'width': string\n    'aspect-ratio'?: string\n    'top': string\n    'left': string\n  } = {\n    'width': `${cropInfo.value.width || props.defaultWidth}`,\n    'height': `${cropInfo.value.height || props.defaultHeight}`,\n    'aspect-ratio': aspectRatio,\n    'top': `${customStyle.value.top}px`,\n    'left': `${customStyle.value.left}px`,\n  }\n  if (props.zoomType === 'free') {\n    delete style['aspect-ratio']\n  }\n  else if (props.zoomType === 'fixed') {\n    delete style.height\n  }\n  return ns.cssVarBlock(style)\n})\n\nfunction zoom(pixel: number) {\n  return pixel * ratio.value\n}\nasync function crop(img: HTMLImageElement = imgRef.value!) {\n  let backgroundColor = 'transparent'\n  if (containerBoxRef.value) {\n    backgroundColor = window.getComputedStyle(\n      containerBoxRef.value,\n    ).backgroundColor\n  }\n  const canvas = document.createElement('canvas')\n  canvas.width = zoom(containerBoxRef.value?.clientWidth || 0)\n  canvas.height = zoom(containerBoxRef.value?.clientHeight || 0)\n  const { drawImage, cropCanvas, drawColor } = useCanvas(canvas)\n  drawColor(0, 0, canvas.width, canvas.height, backgroundColor)\n  drawImage(\n    img,\n    zoom(img.offsetLeft),\n    zoom(img.offsetTop),\n    img.naturalWidth,\n    img.naturalHeight,\n  )\n  return await cropCanvas(\n    zoom(x.value),\n    zoom(y.value),\n    zoom(width.value),\n    zoom(height.value),\n  )\n}\n\nfunction checkBoundaries(\n  newWidth: number,\n  newHeight: number,\n): { width: number, height: number } {\n  const maxWidth = containerBoxRef.value?.clientWidth || Infinity\n  const maxHeight = containerBoxRef.value?.clientHeight || Infinity\n\n  return {\n    width: Math.min(Math.max(newWidth, 0), maxWidth),\n    height: Math.min(Math.max(newHeight, 0), maxHeight),\n  }\n}\n\nfunction getClientPos(e: MouseEvent | TouchEvent): { clientX: number, clientY: number } {\n  if (e instanceof MouseEvent) {\n    return { clientX: e.clientX, clientY: e.clientY }\n  }\n  else if (e instanceof TouchEvent && e.touches.length > 0) {\n    return { clientX: e.touches[0].clientX, clientY: e.touches[0].clientY }\n  }\n  return { clientX: 0, clientY: 0 }\n}\n\nfunction handleStart(e: MouseEvent | TouchEvent, point: string) {\n  const { clientX, clientY } = getClientPos(e)\n  dargPoint.value = point\n  startX = clientX\n  startY = clientY\n  startWidth = cropInfo.value.width\n  startHeight = cropInfo.value.height\n\n  // 添加移动端事件监听\n  document.addEventListener('touchmove', handleMove, { passive: false })\n  document.addEventListener('touchend', handleEnd)\n\n  if (point === 'bottom-right') {\n    cropInfo.value.x = x.value\n    cropInfo.value.y = y.value\n  }\n  else if (point === 'top-left') {\n    cropInfo.value.x = x.value + width.value\n    cropInfo.value.y = y.value + height.value\n  }\n  else if (point === 'top-right') {\n    cropInfo.value.x = x.value\n    cropInfo.value.y = y.value + height.value\n  }\n  else if (point === 'bottom-left') {\n    cropInfo.value.x = x.value + width.value\n    cropInfo.value.y = y.value\n  }\n\n  // Prevent touch scrolling\n  if (e instanceof TouchEvent) {\n    e.preventDefault()\n  }\n}\n\nfunction handleMove(e: MouseEvent | TouchEvent) {\n  // Only prevent default if we're in a drag operation\n  if (e instanceof TouchEvent && dargPoint.value) {\n    e.preventDefault()\n  }\n\n  const { clientX, clientY } = getClientPos(e)\n  const deltaX = clientX - startX\n  const deltaY = clientY - startY\n\n  if (dargPoint.value === 'bottom-right') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth + deltaX,\n        startHeight + deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth + deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n  }\n  else if (dargPoint.value === 'top-left') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth - deltaX,\n        startHeight - deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth - deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n  else if (dargPoint.value === 'top-right') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth + deltaX,\n        startHeight - deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth + deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n  else if (dargPoint.value === 'bottom-left') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth - deltaX,\n        startHeight + deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth - deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n}\n\nfunction handleEnd() {\n  // 移除移动端事件监听\n  document.removeEventListener('touchmove', handleMove)\n  document.removeEventListener('touchend', handleEnd)\n\n  dargPoint.value = ''\n}\n\nfunction resize() {\n  cropInfo.value.width = props.defaultWidth\n  cropInfo.value.height = props.defaultHeight\n  x.value = 0\n  y.value = 0\n}\n\nonMounted(() => {\n  nextTick(() => {\n    // 初始化位置\n    initialValue.value.x\n      = (containerBoxRef.value?.offsetWidth || 0) / 2 - cropInfo.value.width / 2\n    initialValue.value.y\n      = (containerBoxRef.value?.offsetHeight || 0) / 2\n        - cropInfo.value.height / 2\n  })\n\n  // 只添加鼠标事件监听\n  document.addEventListener('mouseup', handleEnd)\n  document.addEventListener('mousemove', handleMove, { passive: false })\n  document.addEventListener('touchmove', handleMove, { passive: false })\n  document.addEventListener('touchend', handleEnd)\n})\n\nonUnmounted(() => {\n  if (imageUrl.value) {\n    URL.revokeObjectURL(imageUrl.value)\n  }\n  // 确保移除所有事件监听\n  document.removeEventListener('mouseup', handleEnd)\n  document.removeEventListener('mousemove', handleMove)\n})\n\ndefineExpose({\n  crop,\n  resize,\n})\n</script>\n\n<template>\n  <div\n    ref=\"containerBoxRef\"\n    :class=\"[ns.e('img-box')]\"\n  >\n    <div\n      v-if=\"errorMessage\"\n      :class=\"[ns.e('error-message')]\"\n    >\n      {{ errorMessage }}\n    </div>\n    <template v-else>\n      <img\n        ref=\"imgRef\"\n        :class=\"[ns.e('image')]\"\n        :src=\"imageUrl\"\n      >\n      <div\n        ref=\"cropBoxRef\"\n        :class=\"[ns.e('crop-tool-box')]\"\n        :style=\"[\n          sizeStyle,\n          dargPoint\n            ? `left: ${customStyle.left}px;top: ${customStyle.top}px`\n            : style,\n        ]\"\n        @touchstart.stop.prevent\n        @touchend.stop.prevent=\"handleEnd\"\n      >\n        <div\n          :class=\"[ns.e('top-left')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'top-left')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'top-left')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n        <div\n          :class=\"[ns.e('top-right')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'top-right')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'top-right')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n        <div\n          :class=\"[ns.e('bottom-right')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'bottom-right')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'bottom-right')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n        <div\n          :class=\"[ns.e('bottom-left')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'bottom-left')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'bottom-left')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n      </div>\n    </template>\n  </div>\n</template>\n"],"names":["props","__props","startX","startY","startWidth","startHeight","ns","useNamespace","cropBoxRef","ref","containerBoxRef","imgRef","errorMessage","dargPoint","initialValue","x","y","cropInfo","width","defaultWidth","height","defaultHeight","useElementSize","imgWidth","style","useDraggable","containerElement","draggingElement","disabled","computed","value","exact","imageUrl","imgFile","URL","createObjectURL","watch","newFile","type","startsWith","ratio","naturalWidth","customStyle","position","left","top","sizeStyle","aspectRatio","zoomType","cssVarBlock","zoom","pixel","checkBoundaries","newWidth","newHeight","maxWidth","clientWidth","Infinity","maxHeight","clientHeight","Math","min","max","getClientPos","e","MouseEvent","clientX","clientY","TouchEvent","touches","length","handleStart","point","document","addEventListener","handleMove","passive","handleEnd","preventDefault","deltaX","deltaY","Number","parseFloat","split","removeEventListener","onMounted","nextTick","offsetWidth","offsetHeight","onUnmounted","revokeObjectURL","__expose","crop","async","img","backgroundColor","window","getComputedStyle","canvas","createElement","drawImage","cropCanvas","drawColor","useCanvas","offsetLeft","offsetTop","naturalHeight","resize","_createElementBlock","class","_normalizeClass","_unref","_Fragment","key","_createElementVNode","src","_normalizeStyle","onTouchstart","onTouchend","onMousedown","_cache","_withModifiers","$event"],"mappings":"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"}

package/es/src/subject-action/src/subject-action.vue.mjs

@@ -1,2 +1,2 @@
-import{ElPopover as e,ElLink as l,ElCheckbox as t,ElButton as n,ElIcon as o,ElDialog as a,ElRadioGroup as s,ElRadio as i}from"element-plus/es";import"element-plus/es/components/base/style/index";import"element-plus/es/components/dialog/style/index";import"element-plus/es/components/radio-group/style/index";import"element-plus/es/components/radio/style/index";import"element-plus/es/components/button/style/index";import"element-plus/es/components/icon/style/index";import"element-plus/es/components/checkbox/style/index";import"element-plus/es/components/popover/style/index";import"element-plus/es/components/link/style/index";import{defineComponent as u,ref as d,computed as p,createElementBlock as m,openBlock as c,normalizeClass as r,unref as y,createElementVNode as f,createCommentVNode as v,createVNode as _,createBlock as b,withCtx as k,createTextVNode as x,isRef as h,Fragment as w,renderList as g,toDisplayString as V}from"vue";import{Edit as C,Delete as j,Top as O,Bottom as S}from"@element-plus/icons-vue";import{useNamespace as T}from"@qxs-bns/hooks";import U from"../../subject-type/src/subject-type.vue.mjs";const B={key:0,class:"flex-justify-between"},E={class:"flex-justify-between"},R={key:0,class:"has-set"},A={key:1,class:"flex flex-justify-end action-buttons"};var K=u({name:"QxsSubjectAction",__name:"subject-action",props:{isEdit:Boolean,isSet:{type:Boolean,default:!1},isKey:{type:Boolean,default:!1},answerCheckType:{type:Number,default:1},showOtherOption:{type:Boolean,default:!0},examAnswerRelationType:{type:Number,default:null},showRichText:{type:Boolean,default:!0},pageEnd:{type:Boolean,default:!1}},emits:["moveUp","moveDown","delete","save","edit","add","onShowRichText","setKey","setAnswerSetting"],setup(u,{emit:K}){const z=u,D=K,N=d(z.isKey),q=d(!1),Q=d(z.answerCheckType),F=T("subject-action"),G=d(!0),H=[{value:2,label:"必须全部都是支持选项，方可下一步"},{value:1,label:"无需判断是否是支持选项"},{value:3,label:"包含全部支持选项，即可下一步"}],I=p(()=>H.find(e=>e.value===Q.value)?.label);function J(){q.value=!1,D("setAnswerSetting",Q.value)}function L(){D("setKey",N.value)}function M(e,l){D("add",e,l?z.examAnswerRelationType:null)}return(d,p)=>{const T=l,K=e,z=t,P=o,W=n,X=i,Y=s,Z=a;return c(),m("div",{class:r(y(F).e("action-exam"))},[f("div",{class:r(["action flex flex-justify-between",{active:u.isEdit}])},[v(" 编辑模式 "),u.isEdit?(c(),m("div",B,[_(K,{trigger:"click"},{reference:k(()=>[_(T,{type:"primary",class:"btn-margin"},{default:k(()=>p[15]||(p[15]=[x(" +在此题后加入新题 ",-1)])),_:1,__:[15]})]),default:k(()=>[_(U,{onSelect:M})]),_:1}),u.showRichText?(c(),b(T,{key:0,type:"primary",class:"btn-margin",onClick:p[0]||(p[0]=e=>D("onShowRichText"))},{default:k(()=>p[16]||(p[16]=[x(" +添加题目描述（图文） ",-1)])),_:1,__:[16]})):v("v-if",!0),u.showOtherOption?(c(),b(T,{key:1,type:"primary",class:"btn-margin",onClick:p[1]||(p[1]=e=>q.value=!0)},{default:k(()=>p[17]||(p[17]=[x(" 答题设置 ",-1)])),_:1,__:[17]})):v("v-if",!0),u.showOtherOption?(c(),b(z,{key:2,modelValue:y(N),"onUpdate:modelValue":p[2]||(p[2]=e=>h(N)?N.value=e:null),label:"核心题",onChange:L},null,8,["modelValue"])):v("v-if",!0)])):(c(),m(w,{key:1},[v(" 非编辑模式 "),f("div",E,[u.showOtherOption?(c(),b(z,{key:0,modelValue:y(N),"onUpdate:modelValue":p[3]||(p[3]=e=>h(N)?N.value=e:null),label:"核心题",disabled:""},null,8,["modelValue"])):v("v-if",!0),u.showOtherOption?(c(),b(z,{key:1,modelValue:y(G),"onUpdate:modelValue":p[4]||(p[4]=e=>h(G)?G.value=e:null),label:y(I),disabled:"",class:"btn-margin"},null,8,["modelValue","label"])):v("v-if",!0)])],2112)),v(" 操作按钮 "),f("div",null,[u.isSet?(c(),m("div",R," *此题设置了跳题逻辑 ")):(c(),m("div",A,[u.isEdit?(c(),m(w,{key:1},[_(W,{class:"btn-margin",onClick:p[9]||(p[9]=e=>D("delete"))},{default:k(()=>p[22]||(p[22]=[x(" 删除 ",-1)])),_:1,__:[22]}),_(W,{type:"primary",onClick:p[10]||(p[10]=e=>D("save"))},{default:k(()=>p[23]||(p[23]=[x(" 完成编辑 ",-1)])),_:1,__:[23]})],64)):(c(),m(w,{key:0},[u.pageEnd?v("v-if",!0):(c(),b(W,{key:0,onClick:p[5]||(p[5]=e=>D("edit"))},{icon:k(()=>[_(P,null,{default:k(()=>[_(y(C))]),_:1})]),default:k(()=>[p[18]||(p[18]=x(" 编辑 ",-1))]),_:1,__:[18]})),_(W,{onClick:p[6]||(p[6]=e=>D("delete"))},{icon:k(()=>[_(P,null,{default:k(()=>[_(y(j))]),_:1})]),default:k(()=>[p[19]||(p[19]=x(" 删除 ",-1))]),_:1,__:[19]}),_(W,{onClick:p[7]||(p[7]=e=>D("moveUp"))},{icon:k(()=>[_(P,null,{default:k(()=>[_(y(O))]),_:1})]),default:k(()=>[p[20]||(p[20]=x(" 上移 ",-1))]),_:1,__:[20]}),_(W,{onClick:p[8]||(p[8]=e=>D("moveDown"))},{icon:k(()=>[_(P,null,{default:k(()=>[_(y(S))]),_:1})]),default:k(()=>[p[21]||(p[21]=x(" 下移 ",-1))]),_:1,__:[21]})],64))]))]),v(" 答题设置弹窗 "),_(Z,{modelValue:y(q),"onUpdate:modelValue":p[13]||(p[13]=e=>h(q)?q.value=e:null),title:"答题设置",class:"customize-dialog",onClose:p[14]||(p[14]=e=>q.value=!1)},{footer:k(()=>[_(W,{class:"customize-button",type:"primary",plain:"",onClick:p[12]||(p[12]=e=>q.value=!1)},{default:k(()=>p[24]||(p[24]=[x(" 取消 ",-1)])),_:1,__:[24]}),_(W,{class:"customize-button",type:"primary",plain:"",onClick:J},{default:k(()=>p[25]||(p[25]=[x(" 保存 ",-1)])),_:1,__:[25]})]),default:k(()=>[_(Y,{modelValue:y(Q),"onUpdate:modelValue":p[11]||(p[11]=e=>h(Q)?Q.value=e:null),class:"vertical-radio-group"},{default:k(()=>[(c(),m(w,null,g(H,e=>_(X,{key:e.value,value:e.value},{default:k(()=>[x(V(e.label),1)]),_:2},1032,["value"])),64))]),_:1},8,["modelValue"])]),_:1},8,["modelValue"])],2)],2)}}});export{K as default};
+import{defineComponent as e,ref as l,computed as a,resolveComponent as t,createElementBlock as o,openBlock as u,normalizeClass as n,unref as i,createElementVNode as s,createCommentVNode as d,createVNode as c,createBlock as r,withCtx as p,createTextVNode as f,Fragment as m,renderList as v,toDisplayString as y}from"vue";import{Edit as _,Delete as b,Top as k,Bottom as h}from"@element-plus/icons-vue";import{useNamespace as w}from"@qxs-bns/hooks";import x from"../../subject-type/src/subject-type.vue.mjs";const g={key:0,class:"flex-justify-between"},V={class:"flex-justify-between"},C={key:0,class:"has-set"},j={key:1,class:"flex flex-justify-end action-buttons"};var O=e({name:"QxsSubjectAction",__name:"subject-action",props:{isEdit:Boolean,isSet:{type:Boolean,default:!1},isKey:{type:Boolean,default:!1},answerCheckType:{type:Number,default:1},showOtherOption:{type:Boolean,default:!0},examAnswerRelationType:{type:Number,default:null},showRichText:{type:Boolean,default:!0},pageEnd:{type:Boolean,default:!1}},emits:["moveUp","moveDown","delete","save","edit","add","onShowRichText","setKey","setAnswerSetting"],setup(e,{emit:O}){const S=e,T=O,U=l(S.isKey),B=l(!1),E=l(S.answerCheckType),R=w("subject-action"),A=l(!0),K=[{value:2,label:"必须全部都是支持选项，方可下一步"},{value:1,label:"无需判断是否是支持选项"},{value:3,label:"包含全部支持选项，即可下一步"}],z=a(()=>K.find(e=>e.value===E.value)?.label);function D(){B.value=!1,T("setAnswerSetting",E.value)}function N(){T("setKey",U.value)}function q(e,l){T("add",e,l?S.examAnswerRelationType:null)}return(l,a)=>{const w=t("el-link"),O=t("el-popover"),S=t("el-checkbox"),Q=t("el-icon"),F=t("el-button"),G=t("el-radio"),H=t("el-radio-group"),I=t("el-dialog");return u(),o("div",{class:n(i(R).e("action-exam"))},[s("div",{class:n(["action flex flex-justify-between",{active:e.isEdit}])},[d(" 编辑模式 "),e.isEdit?(u(),o("div",g,[c(O,{trigger:"click"},{reference:p(()=>[c(w,{type:"primary",class:"btn-margin"},{default:p(()=>a[15]||(a[15]=[f(" +在此题后加入新题 ",-1)])),_:1,__:[15]})]),default:p(()=>[c(x,{onSelect:q})]),_:1}),e.showRichText?(u(),r(w,{key:0,type:"primary",class:"btn-margin",onClick:a[0]||(a[0]=e=>T("onShowRichText"))},{default:p(()=>a[16]||(a[16]=[f(" +添加题目描述（图文） ",-1)])),_:1,__:[16]})):d("v-if",!0),e.showOtherOption?(u(),r(w,{key:1,type:"primary",class:"btn-margin",onClick:a[1]||(a[1]=e=>B.value=!0)},{default:p(()=>a[17]||(a[17]=[f(" 答题设置 ",-1)])),_:1,__:[17]})):d("v-if",!0),e.showOtherOption?(u(),r(S,{key:2,modelValue:U.value,"onUpdate:modelValue":a[2]||(a[2]=e=>U.value=e),label:"核心题",onChange:N},null,8,["modelValue"])):d("v-if",!0)])):(u(),o(m,{key:1},[d(" 非编辑模式 "),s("div",V,[e.showOtherOption?(u(),r(S,{key:0,modelValue:U.value,"onUpdate:modelValue":a[3]||(a[3]=e=>U.value=e),label:"核心题",disabled:""},null,8,["modelValue"])):d("v-if",!0),e.showOtherOption?(u(),r(S,{key:1,modelValue:A.value,"onUpdate:modelValue":a[4]||(a[4]=e=>A.value=e),label:z.value,disabled:"",class:"btn-margin"},null,8,["modelValue","label"])):d("v-if",!0)])],2112)),d(" 操作按钮 "),s("div",null,[e.isSet?(u(),o("div",C," *此题设置了跳题逻辑 ")):(u(),o("div",j,[e.isEdit?(u(),o(m,{key:1},[c(F,{class:"btn-margin",onClick:a[9]||(a[9]=e=>T("delete"))},{default:p(()=>a[22]||(a[22]=[f(" 删除 ",-1)])),_:1,__:[22]}),c(F,{type:"primary",onClick:a[10]||(a[10]=e=>T("save"))},{default:p(()=>a[23]||(a[23]=[f(" 完成编辑 ",-1)])),_:1,__:[23]})],64)):(u(),o(m,{key:0},[e.pageEnd?d("v-if",!0):(u(),r(F,{key:0,onClick:a[5]||(a[5]=e=>T("edit"))},{icon:p(()=>[c(Q,null,{default:p(()=>[c(i(_))]),_:1})]),default:p(()=>[a[18]||(a[18]=f(" 编辑 ",-1))]),_:1,__:[18]})),c(F,{onClick:a[6]||(a[6]=e=>T("delete"))},{icon:p(()=>[c(Q,null,{default:p(()=>[c(i(b))]),_:1})]),default:p(()=>[a[19]||(a[19]=f(" 删除 ",-1))]),_:1,__:[19]}),c(F,{onClick:a[7]||(a[7]=e=>T("moveUp"))},{icon:p(()=>[c(Q,null,{default:p(()=>[c(i(k))]),_:1})]),default:p(()=>[a[20]||(a[20]=f(" 上移 ",-1))]),_:1,__:[20]}),c(F,{onClick:a[8]||(a[8]=e=>T("moveDown"))},{icon:p(()=>[c(Q,null,{default:p(()=>[c(i(h))]),_:1})]),default:p(()=>[a[21]||(a[21]=f(" 下移 ",-1))]),_:1,__:[21]})],64))]))]),d(" 答题设置弹窗 "),c(I,{modelValue:B.value,"onUpdate:modelValue":a[13]||(a[13]=e=>B.value=e),title:"答题设置",class:"customize-dialog",onClose:a[14]||(a[14]=e=>B.value=!1)},{footer:p(()=>[c(F,{class:"customize-button",type:"primary",plain:"",onClick:a[12]||(a[12]=e=>B.value=!1)},{default:p(()=>a[24]||(a[24]=[f(" 取消 ",-1)])),_:1,__:[24]}),c(F,{class:"customize-button",type:"primary",plain:"",onClick:D},{default:p(()=>a[25]||(a[25]=[f(" 保存 ",-1)])),_:1,__:[25]})]),default:p(()=>[c(H,{modelValue:E.value,"onUpdate:modelValue":a[11]||(a[11]=e=>E.value=e),class:"vertical-radio-group"},{default:p(()=>[(u(),o(m,null,v(K,e=>c(G,{key:e.value,value:e.value},{default:p(()=>[f(y(e.label),1)]),_:2},1032,["value"])),64))]),_:1},8,["modelValue"])]),_:1},8,["modelValue"])],2)],2)}}});export{O as default};
 //# sourceMappingURL=subject-action.vue.mjs.map

package/es/src/subject-action/src/subject-action.vue.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"subject-action.vue.mjs","sources":["../../../../../../packages/components/src/subject-action/src/subject-action.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Bottom, Delete, Edit, Top } from '@element-plus/icons-vue'\nimport { useNamespace } from '@qxs-bns/hooks'\nimport SubjectType from '../../subject-type/src/subject-type.vue'\n\ndefineOptions({\n  name: 'QxsSubjectAction',\n})\n\nconst props = defineProps({\n  isEdit: Boolean,\n  isSet: {\n    type: Boolean,\n    default: false,\n  },\n  isKey: {\n    type: Boolean,\n    default: false,\n  },\n  answerCheckType: {\n    type: Number,\n    default: 1,\n  },\n  showOtherOption: {\n    type: Boolean,\n    default: true,\n  },\n  examAnswerRelationType: {\n    type: Number,\n    default: null,\n  },\n  showRichText: {\n    type: Boolean,\n    default: true,\n  },\n  pageEnd: {\n    type: Boolean,\n    default: false,\n  },\n})\n\nconst emits = defineEmits([\n  'moveUp',\n  'moveDown',\n  'delete',\n  'save',\n  'edit',\n  'add',\n  'onShowRichText',\n  'setKey',\n  'setAnswerSetting',\n])\nconst isKey = ref(props.isKey)\nconst showAnswerSetting = ref(false)\nconst answerType = ref(props.answerCheckType)\nconst ns = useNamespace('subject-action')\nconst checked = ref(true)\nconst answerTextList = [\n  {\n    value: 2,\n    label: '必须全部都是支持选项，方可下一步',\n  },\n  {\n    value: 1,\n    label: '无需判断是否是支持选项',\n  },\n  {\n    value: 3,\n    label: '包含全部支持选项，即可下一步',\n  },\n]\n\nconst answerText = computed(() => {\n  return answerTextList.find(item => item.value === answerType.value)?.label\n})\n\nfunction onSaveSetting() {\n  showAnswerSetting.value = false\n  emits('setAnswerSetting', answerType.value)\n}\n\nfunction setKey() {\n  emits('setKey', isKey.value)\n}\n\nfunction selectExam(type: string, canSet: boolean) {\n  emits('add', type, canSet ? props.examAnswerRelationType : null)\n}\n</script>\n\n<template>\n  <div :class=\"ns.e('action-exam')\">\n    <div\n      class=\"action flex flex-justify-between\"\n      :class=\"{ active: isEdit }\"\n    >\n      <!-- 编辑模式 -->\n      <div\n        v-if=\"isEdit\"\n        class=\"flex-justify-between\"\n      >\n        <el-popover trigger=\"click\">\n          <template #reference>\n            <el-link\n              type=\"primary\"\n              class=\"btn-margin\"\n            >\n              +在此题后加入新题\n            </el-link>\n          </template>\n          <SubjectType @select=\"selectExam\" />\n        </el-popover>\n        <el-link\n          v-if=\"showRichText\"\n          type=\"primary\"\n          class=\"btn-margin\"\n          @click=\"emits('onShowRichText')\"\n        >\n          +添加题目描述（图文）\n        </el-link>\n        <el-link\n          v-if=\"showOtherOption\"\n          type=\"primary\"\n          class=\"btn-margin\"\n          @click=\"showAnswerSetting = true\"\n        >\n          答题设置\n        </el-link>\n        <el-checkbox\n          v-if=\"showOtherOption\"\n          v-model=\"isKey\"\n          label=\"核心题\"\n          @change=\"setKey\"\n        />\n      </div>\n\n      <!-- 非编辑模式 -->\n      <div\n        v-else\n        class=\"flex-justify-between\"\n      >\n        <el-checkbox\n          v-if=\"showOtherOption\"\n          v-model=\"isKey\"\n          label=\"核心题\"\n          disabled\n        />\n        <el-checkbox\n          v-if=\"showOtherOption\"\n          v-model=\"checked\"\n          :label=\"answerText\"\n          disabled\n          class=\"btn-margin\"\n        />\n      </div>\n\n      <!-- 操作按钮 -->\n      <div>\n        <div\n          v-if=\"isSet\"\n          class=\"has-set\"\n        >\n          *此题设置了跳题逻辑\n        </div>\n        <div\n          v-else\n          class=\"flex flex-justify-end action-buttons\"\n        >\n          <template v-if=\"!isEdit\">\n            <el-button\n              v-if=\"!pageEnd\"\n              @click=\"emits('edit')\"\n            >\n              <template #icon>\n                <el-icon><Edit /></el-icon>\n              </template>\n              编辑\n            </el-button>\n            <el-button @click=\"emits('delete')\">\n              <template #icon>\n                <el-icon><Delete /></el-icon>\n              </template>\n              删除\n            </el-button>\n            <el-button @click=\"emits('moveUp')\">\n              <template #icon>\n                <el-icon><Top /></el-icon>\n              </template>\n              上移\n            </el-button>\n            <el-button @click=\"emits('moveDown')\">\n              <template #icon>\n                <el-icon><Bottom /></el-icon>\n              </template>\n              下移\n            </el-button>\n          </template>\n          <template v-else>\n            <el-button\n              class=\"btn-margin\"\n              @click=\"emits('delete')\"\n            >\n              删除\n            </el-button>\n            <el-button\n              type=\"primary\"\n              @click=\"emits('save')\"\n            >\n              完成编辑\n            </el-button>\n          </template>\n        </div>\n      </div>\n\n      <!-- 答题设置弹窗 -->\n      <el-dialog\n        v-model=\"showAnswerSetting\"\n        title=\"答题设置\"\n        class=\"customize-dialog\"\n        @close=\"showAnswerSetting = false\"\n      >\n        <el-radio-group\n          v-model=\"answerType\"\n          class=\"vertical-radio-group\"\n        >\n          <el-radio\n            v-for=\"item in answerTextList\"\n            :key=\"item.value\"\n            :value=\"item.value\"\n          >\n            {{ item.label }}\n          </el-radio>\n        </el-radio-group>\n        <template #footer>\n          <el-button\n            class=\"customize-button\"\n            type=\"primary\"\n            plain\n            @click=\"showAnswerSetting = false\"\n          >\n            取消\n          </el-button>\n          <el-button\n            class=\"customize-button\"\n            type=\"primary\"\n            plain\n            @click=\"onSaveSetting\"\n          >\n            保存\n          </el-button>\n        </template>\n      </el-dialog>\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","emits","__emit","isKey","ref","showAnswerSetting","answerType","answerCheckType","ns","useNamespace","checked","answerTextList","value","label","answerText","computed","find","item","onSaveSetting","setKey","selectExam","type","canSet","examAnswerRelationType","_createElementBlock","class","_normalizeClass","_unref","e","_createElementVNode","active","isEdit","_createCommentVNode","_openBlock","_hoisted_1","_createVNode","_component_el_popover","trigger","reference","_component_el_link","_cache","SubjectType","onSelect","showRichText","_createBlock","onClick","showOtherOption","_component_el_checkbox","$event","onChange","_Fragment","key","_hoisted_2","disabled","isSet","_hoisted_3","_hoisted_4","_component_el_button","pageEnd","icon","_component_el_icon","Edit","Delete","Top","Bottom","_component_el_dialog","title","onClose","footer","plain","_component_el_radio_group","_renderList","_component_el_radio","_createTextVNode","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"subject-action.vue.mjs","sources":["../../../../../../packages/components/src/subject-action/src/subject-action.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Bottom, Delete, Edit, Top } from '@element-plus/icons-vue'\nimport { useNamespace } from '@qxs-bns/hooks'\nimport { computed, ref } from 'vue'\nimport SubjectType from '../../subject-type/src/subject-type.vue'\n\ndefineOptions({\n  name: 'QxsSubjectAction',\n})\n\nconst props = defineProps({\n  isEdit: Boolean,\n  isSet: {\n    type: Boolean,\n    default: false,\n  },\n  isKey: {\n    type: Boolean,\n    default: false,\n  },\n  answerCheckType: {\n    type: Number,\n    default: 1,\n  },\n  showOtherOption: {\n    type: Boolean,\n    default: true,\n  },\n  examAnswerRelationType: {\n    type: Number,\n    default: null,\n  },\n  showRichText: {\n    type: Boolean,\n    default: true,\n  },\n  pageEnd: {\n    type: Boolean,\n    default: false,\n  },\n})\n\nconst emits = defineEmits([\n  'moveUp',\n  'moveDown',\n  'delete',\n  'save',\n  'edit',\n  'add',\n  'onShowRichText',\n  'setKey',\n  'setAnswerSetting',\n])\nconst isKey = ref(props.isKey)\nconst showAnswerSetting = ref(false)\nconst answerType = ref(props.answerCheckType)\nconst ns = useNamespace('subject-action')\nconst checked = ref(true)\nconst answerTextList = [\n  {\n    value: 2,\n    label: '必须全部都是支持选项，方可下一步',\n  },\n  {\n    value: 1,\n    label: '无需判断是否是支持选项',\n  },\n  {\n    value: 3,\n    label: '包含全部支持选项，即可下一步',\n  },\n]\n\nconst answerText = computed(() => {\n  return answerTextList.find(item => item.value === answerType.value)?.label\n})\n\nfunction onSaveSetting() {\n  showAnswerSetting.value = false\n  emits('setAnswerSetting', answerType.value)\n}\n\nfunction setKey() {\n  emits('setKey', isKey.value)\n}\n\nfunction selectExam(type: string, canSet: boolean) {\n  emits('add', type, canSet ? props.examAnswerRelationType : null)\n}\n</script>\n\n<template>\n  <div :class=\"ns.e('action-exam')\">\n    <div\n      class=\"action flex flex-justify-between\"\n      :class=\"{ active: isEdit }\"\n    >\n      <!-- 编辑模式 -->\n      <div\n        v-if=\"isEdit\"\n        class=\"flex-justify-between\"\n      >\n        <el-popover trigger=\"click\">\n          <template #reference>\n            <el-link\n              type=\"primary\"\n              class=\"btn-margin\"\n            >\n              +在此题后加入新题\n            </el-link>\n          </template>\n          <SubjectType @select=\"selectExam\" />\n        </el-popover>\n        <el-link\n          v-if=\"showRichText\"\n          type=\"primary\"\n          class=\"btn-margin\"\n          @click=\"emits('onShowRichText')\"\n        >\n          +添加题目描述（图文）\n        </el-link>\n        <el-link\n          v-if=\"showOtherOption\"\n          type=\"primary\"\n          class=\"btn-margin\"\n          @click=\"showAnswerSetting = true\"\n        >\n          答题设置\n        </el-link>\n        <el-checkbox\n          v-if=\"showOtherOption\"\n          v-model=\"isKey\"\n          label=\"核心题\"\n          @change=\"setKey\"\n        />\n      </div>\n\n      <!-- 非编辑模式 -->\n      <div\n        v-else\n        class=\"flex-justify-between\"\n      >\n        <el-checkbox\n          v-if=\"showOtherOption\"\n          v-model=\"isKey\"\n          label=\"核心题\"\n          disabled\n        />\n        <el-checkbox\n          v-if=\"showOtherOption\"\n          v-model=\"checked\"\n          :label=\"answerText\"\n          disabled\n          class=\"btn-margin\"\n        />\n      </div>\n\n      <!-- 操作按钮 -->\n      <div>\n        <div\n          v-if=\"isSet\"\n          class=\"has-set\"\n        >\n          *此题设置了跳题逻辑\n        </div>\n        <div\n          v-else\n          class=\"flex flex-justify-end action-buttons\"\n        >\n          <template v-if=\"!isEdit\">\n            <el-button\n              v-if=\"!pageEnd\"\n              @click=\"emits('edit')\"\n            >\n              <template #icon>\n                <el-icon><Edit /></el-icon>\n              </template>\n              编辑\n            </el-button>\n            <el-button @click=\"emits('delete')\">\n              <template #icon>\n                <el-icon><Delete /></el-icon>\n              </template>\n              删除\n            </el-button>\n            <el-button @click=\"emits('moveUp')\">\n              <template #icon>\n                <el-icon><Top /></el-icon>\n              </template>\n              上移\n            </el-button>\n            <el-button @click=\"emits('moveDown')\">\n              <template #icon>\n                <el-icon><Bottom /></el-icon>\n              </template>\n              下移\n            </el-button>\n          </template>\n          <template v-else>\n            <el-button\n              class=\"btn-margin\"\n              @click=\"emits('delete')\"\n            >\n              删除\n            </el-button>\n            <el-button\n              type=\"primary\"\n              @click=\"emits('save')\"\n            >\n              完成编辑\n            </el-button>\n          </template>\n        </div>\n      </div>\n\n      <!-- 答题设置弹窗 -->\n      <el-dialog\n        v-model=\"showAnswerSetting\"\n        title=\"答题设置\"\n        class=\"customize-dialog\"\n        @close=\"showAnswerSetting = false\"\n      >\n        <el-radio-group\n          v-model=\"answerType\"\n          class=\"vertical-radio-group\"\n        >\n          <el-radio\n            v-for=\"item in answerTextList\"\n            :key=\"item.value\"\n            :value=\"item.value\"\n          >\n            {{ item.label }}\n          </el-radio>\n        </el-radio-group>\n        <template #footer>\n          <el-button\n            class=\"customize-button\"\n            type=\"primary\"\n            plain\n            @click=\"showAnswerSetting = false\"\n          >\n            取消\n          </el-button>\n          <el-button\n            class=\"customize-button\"\n            type=\"primary\"\n            plain\n            @click=\"onSaveSetting\"\n          >\n            保存\n          </el-button>\n        </template>\n      </el-dialog>\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","emits","__emit","isKey","ref","showAnswerSetting","answerType","answerCheckType","ns","useNamespace","checked","answerTextList","value","label","answerText","computed","find","item","onSaveSetting","setKey","selectExam","type","canSet","examAnswerRelationType","_createElementBlock","class","_normalizeClass","_unref","e","_createElementVNode","active","isEdit","_createCommentVNode","_openBlock","_hoisted_1","_createVNode","_component_el_popover","trigger","reference","_component_el_link","_cache","SubjectType","onSelect","showRichText","_createBlock","onClick","showOtherOption","_component_el_checkbox","$event","onChange","_Fragment","key","_hoisted_2","disabled","isSet","_hoisted_3","_hoisted_4","_component_el_button","pageEnd","icon","_component_el_icon","Edit","Delete","Top","Bottom","_component_el_dialog","title","onClose","footer","plain","_component_el_radio_group","_renderList","_component_el_radio","_createTextVNode","_toDisplayString"],"mappings":"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"}

package/es/src/subject-list/src/components/SubjectPageEnd.vue.mjs

@@ -1,2 +1,2 @@
-import{ElRow as e}from"element-plus/es";import"element-plus/es/components/base/style/index";import"element-plus/es/components/row/style/index";import{defineComponent as t,onMounted as n,createElementBlock as o,openBlock as s,normalizeClass as r,unref as a,createVNode as i,withCtx as l,createElementVNode as u,toDisplayString as d}from"vue";import{useNamespace as p}from"@qxs-bns/hooks";import m from"../../../subject-action/src/subject-action.vue.mjs";var c=t({name:"QxsSubjectScale",__name:"SubjectPageEnd",props:{currentPageIndex:{type:Number,required:!0},totalPage:{type:Number,required:!0},isSave:{type:Boolean,required:!0},showAction:{type:Boolean,required:!1},isEdit:{type:Boolean,required:!0},isSet:{type:Boolean,required:!0},examAnswerRelationType:{type:Number,required:!1}},emits:["move","save","delete","edit","add"],setup(t,{emit:c}){const x=t,y=c;n(function(){});const v=p("subject-end");return(t,n)=>{const p=e;return s(),o("div",{class:r(a(v).e("end-exam"))},[i(p,{type:"flex",align:"middle"},{default:l(()=>[n[5]||(n[5]=u("span",{class:"auto-line"},null,-1)),u("span",null,"第"+d(x.currentPageIndex)+" / "+d(t.totalPage)+"页",1),n[6]||(n[6]=u("span",{class:"auto-line"},null,-1))]),_:1,__:[5,6]}),i(m,{"is-edit":!1,"is-set":t.isSet,"page-end":!0,"exam-answer-relation-type":x.examAnswerRelationType,"show-other-option":!1,"show-rich-text":!1,onMoveUp:n[0]||(n[0]=e=>y("move","up")),onMoveDown:n[1]||(n[1]=e=>y("move","down")),onDelete:n[2]||(n[2]=e=>y("delete")),onEdit:n[3]||(n[3]=e=>y("edit")),onAdd:n[4]||(n[4]=e=>y("add",e))},null,8,["is-set","exam-answer-relation-type"])],2)}}});export{c as default};
+import{defineComponent as e,onMounted as t,resolveComponent as o,createElementBlock as n,openBlock as a,normalizeClass as r,unref as s,createVNode as i,withCtx as l,createElementVNode as d,toDisplayString as u}from"vue";import{useNamespace as p}from"@qxs-bns/hooks";import m from"../../../subject-action/src/subject-action.vue.mjs";var c=e({name:"QxsSubjectScale",__name:"SubjectPageEnd",props:{currentPageIndex:{type:Number,required:!0},totalPage:{type:Number,required:!0},isSave:{type:Boolean,required:!0},showAction:{type:Boolean,required:!1},isEdit:{type:Boolean,required:!0},isSet:{type:Boolean,required:!0},examAnswerRelationType:{type:Number,required:!1}},emits:["move","save","delete","edit","add"],setup(e,{emit:c}){const x=e,y=c;t(function(){});const v=p("subject-end");return(e,t)=>{const p=o("el-row");return a(),n("div",{class:r(s(v).e("end-exam"))},[i(p,{type:"flex",align:"middle"},{default:l(()=>[t[5]||(t[5]=d("span",{class:"auto-line"},null,-1)),d("span",null,"第"+u(x.currentPageIndex)+" / "+u(e.totalPage)+"页",1),t[6]||(t[6]=d("span",{class:"auto-line"},null,-1))]),_:1,__:[5,6]}),i(m,{"is-edit":!1,"is-set":e.isSet,"page-end":!0,"exam-answer-relation-type":x.examAnswerRelationType,"show-other-option":!1,"show-rich-text":!1,onMoveUp:t[0]||(t[0]=e=>y("move","up")),onMoveDown:t[1]||(t[1]=e=>y("move","down")),onDelete:t[2]||(t[2]=e=>y("delete")),onEdit:t[3]||(t[3]=e=>y("edit")),onAdd:t[4]||(t[4]=e=>y("add",e))},null,8,["is-set","exam-answer-relation-type"])],2)}}});export{c as default};
 //# sourceMappingURL=SubjectPageEnd.vue.mjs.map

package/es/src/subject-list/src/components/SubjectPageEnd.vue.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SubjectPageEnd.vue.mjs","sources":["../../../../../../../packages/components/src/subject-list/src/components/SubjectPageEnd.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useNamespace } from '@qxs-bns/hooks'\nimport SubjectAction from '../../../subject-action/src/subject-action.vue'\n\ndefineOptions({\n  name: 'QxsSubjectScale',\n})\nconst props = defineProps<{\n  currentPageIndex: number\n  totalPage: number\n  isSave: boolean\n  showAction?: boolean\n  isEdit: boolean\n  isSet: boolean\n  examAnswerRelationType?: number\n}>()\nconst emits = defineEmits(['move', 'save', 'delete', 'edit', 'add'])\n\nfunction init() {\n\n}\n\nonMounted(init)\nconst ns = useNamespace('subject-end')\n</script>\n\n<template>\n  <div :class=\"ns.e('end-exam')\">\n    <el-row\n      type=\"flex\"\n      align=\"middle\"\n    >\n      <span class=\"auto-line\" />\n      <span>第{{ props.currentPageIndex }} / {{ totalPage }}页</span>\n      <span class=\"auto-line\" />\n    </el-row>\n    <SubjectAction\n      :is-edit=\"false\"\n      :is-set=\"isSet\"\n      :page-end=\"true\"\n      :exam-answer-relation-type=\"props.examAnswerRelationType\"\n      :show-other-option=\"false\"\n      :show-rich-text=\"false\"\n      @move-up=\"emits('move', 'up')\"\n      @move-down=\"emits('move', 'down')\"\n      @delete=\"emits('delete')\"\n      @edit=\"emits('edit')\"\n      @add=\"type => emits('add', type)\"\n    />\n  </div>\n</template>\n"],"names":["props","__props","emits","__emit","onMounted","ns","useNamespace","_createElementBlock","class","_normalizeClass","_unref","e","_createVNode","_component_el_row","type","align","_createElementVNode","_toDisplayString","currentPageIndex","totalPage","SubjectAction","isSet","examAnswerRelationType","onMoveUp","onMoveDown","onDelete","onEdit","onAdd","_cache"],"mappings":"80BAOA,MAAMA,EAAQC,EASRC,EAAQC,EAMdC,EAJA,WAEA,GAGA,MAAMC,EAAKC,EAAa,kDAItBC,EAsBM,MAAA,CAtBAC,MAAKC,EAAEC,EAAAL,GAAGM,EAAC,eACfC,EAOSC,EAAA,CANPC,KAAK,OACLC,MAAM,qBAEN,IAA0B,aAA1BC,EAA0B,OAAA,CAApBR,MAAM,aAAW,MAAA,IACvBQ,EAA6D,OAAA,KAAvD,IAACC,EAAGjB,EAAMkB,kBAAmB,MAAGD,EAAGE,EAAAA,WAAY,IAAC,eACtDH,EAA0B,OAAA,CAApBR,MAAM,aAAW,MAAA,qBAEzBI,EAYEQ,EAAA,CAXC,WAAS,EACT,SAAQC,EAAAA,MACR,YAAU,EACV,4BAA2BrB,EAAMsB,uBACjC,qBAAmB,EACnB,kBAAgB,EAChBC,wBAASrB,EAAK,OAAA,OACdsB,0BAAWtB,EAAK,OAAA,SAChBuB,wBAAQvB,EAAK,WACbwB,sBAAMxB,EAAK,SACXyB,MAAGC,EAAA,KAAAA,EAAA,GAAEd,GAAQZ,QAAaY"}
+{"version":3,"file":"SubjectPageEnd.vue.mjs","sources":["../../../../../../../packages/components/src/subject-list/src/components/SubjectPageEnd.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useNamespace } from '@qxs-bns/hooks'\nimport { onMounted } from 'vue'\nimport SubjectAction from '../../../subject-action/src/subject-action.vue'\n\ndefineOptions({\n  name: 'QxsSubjectScale',\n})\nconst props = defineProps<{\n  currentPageIndex: number\n  totalPage: number\n  isSave: boolean\n  showAction?: boolean\n  isEdit: boolean\n  isSet: boolean\n  examAnswerRelationType?: number\n}>()\nconst emits = defineEmits(['move', 'save', 'delete', 'edit', 'add'])\n\nfunction init() {\n\n}\n\nonMounted(init)\nconst ns = useNamespace('subject-end')\n</script>\n\n<template>\n  <div :class=\"ns.e('end-exam')\">\n    <el-row\n      type=\"flex\"\n      align=\"middle\"\n    >\n      <span class=\"auto-line\" />\n      <span>第{{ props.currentPageIndex }} / {{ totalPage }}页</span>\n      <span class=\"auto-line\" />\n    </el-row>\n    <SubjectAction\n      :is-edit=\"false\"\n      :is-set=\"isSet\"\n      :page-end=\"true\"\n      :exam-answer-relation-type=\"props.examAnswerRelationType\"\n      :show-other-option=\"false\"\n      :show-rich-text=\"false\"\n      @move-up=\"emits('move', 'up')\"\n      @move-down=\"emits('move', 'down')\"\n      @delete=\"emits('delete')\"\n      @edit=\"emits('edit')\"\n      @add=\"type => emits('add', type)\"\n    />\n  </div>\n</template>\n"],"names":["props","__props","emits","__emit","onMounted","ns","useNamespace","_createElementBlock","class","_normalizeClass","_unref","e","_createVNode","_component_el_row","type","align","_createElementVNode","_toDisplayString","currentPageIndex","totalPage","SubjectAction","isSet","examAnswerRelationType","onMoveUp","onMoveDown","onDelete","onEdit","onAdd","_cache"],"mappings":"qtBAQA,MAAMA,EAAQC,EASRC,EAAQC,EAMdC,EAJA,WAEA,GAGA,MAAMC,EAAKC,EAAa,4DAItBC,EAsBM,MAAA,CAtBAC,MAAKC,EAAEC,EAAAL,GAAGM,EAAC,eACfC,EAOSC,EAAA,CANPC,KAAK,OACLC,MAAM,qBAEN,IAA0B,aAA1BC,EAA0B,OAAA,CAApBR,MAAM,aAAW,MAAA,IACvBQ,EAA6D,OAAA,KAAvD,IAACC,EAAGjB,EAAMkB,kBAAmB,MAAGD,EAAGE,EAAAA,WAAY,IAAC,eACtDH,EAA0B,OAAA,CAApBR,MAAM,aAAW,MAAA,qBAEzBI,EAYEQ,EAAA,CAXC,WAAS,EACT,SAAQC,EAAAA,MACR,YAAU,EACV,4BAA2BrB,EAAMsB,uBACjC,qBAAmB,EACnB,kBAAgB,EAChBC,wBAASrB,EAAK,OAAA,OACdsB,0BAAWtB,EAAK,OAAA,SAChBuB,wBAAQvB,EAAK,WACbwB,sBAAMxB,EAAK,SACXyB,MAAGC,EAAA,KAAAA,EAAA,GAAEd,GAAQZ,QAAaY"}

package/es/src/subject-list/src/components/SubjectRichText.vue.mjs

@@ -1,2 +1,2 @@
-import{defineComponent as e,useAttrs as t,ref as o,onMounted as i,createElementBlock as r,openBlock as n,normalizeClass as s,unref as a,createVNode as d,withCtx as l,createBlock as u,createCommentVNode as m,mergeProps as c,isRef as p,createElementVNode as v,createTextVNode as y,toDisplayString as x}from"vue";import{useNamespace as h}from"@qxs-bns/hooks";import{ElMessage as w}from"element-plus";import f from"../../../subject-action/src/subject-action.vue.mjs";import b from"../../../subject-layout/src/subject-layout.vue.mjs";import j from"../../../tiny-mce-editor/src/tiny-mce-editor.vue.mjs";const q={class:"preview"},S=["innerHTML"];var T=e({name:"QxsSubjectScale",__name:"SubjectRichText",props:{orderIndex:{type:Number,required:!0},richTextContent:{type:String,required:!0},title:{type:String,required:!1},isSave:{type:Boolean,required:!0},showAction:{type:Boolean,required:!1},isEdit:{type:Boolean,required:!0},isSet:{type:Boolean,required:!0},examAnswerRelationType:{type:Number,required:!1}},emits:["move","save","delete","edit","add"],setup(e,{emit:T}){const A=e,B=T,C=t(),E=o("");function M(){E.value?B("save",{richTextContent:E.value||""}):w.error("富文本内容不能为空!")}i(function(){A.richTextContent&&(E.value=A.richTextContent)});const R=h("subject-scale");return(e,t)=>(n(),r("div",{class:s(a(R).e("scale-exam"))},[d(b,{"show-edit":e.isEdit},{preview:l(()=>[v("div",q,[y(x(e.orderIndex+1)+".",1),v("div",{innerHTML:a(E)},null,8,S)])]),edit:l(()=>[d(j,c({"model-value":a(E),"onUpdate:modelValue":t[0]||(t[0]=e=>p(E)?E.value=e:null)},a(C),{style:{width:"100%"}}),null,16,["model-value"])]),default:l(()=>[e.showAction?(n(),u(f,{key:0,"is-edit":e.isEdit,"is-set":e.isSet,"exam-answer-relation-type":A.examAnswerRelationType,"show-other-option":!1,"show-rich-text":!1,onMoveUp:t[1]||(t[1]=e=>B("move","up")),onMoveDown:t[2]||(t[2]=e=>B("move","down")),onDelete:t[3]||(t[3]=e=>B("delete")),onSave:M,onEdit:t[4]||(t[4]=e=>B("edit")),onAdd:t[5]||(t[5]=e=>B("add",e))},null,8,["is-edit","is-set","exam-answer-relation-type"])):m("v-if",!0)]),_:1},8,["show-edit"])],2))}});export{T as default};
+import{defineComponent as e,useAttrs as t,ref as o,onMounted as i,createElementBlock as r,openBlock as n,normalizeClass as s,unref as a,createVNode as d,withCtx as u,createBlock as l,createCommentVNode as m,mergeProps as c,createElementVNode as p,createTextVNode as v,toDisplayString as y}from"vue";import{useNamespace as x}from"@qxs-bns/hooks";import{ElMessage as h}from"element-plus";import w from"../../../subject-action/src/subject-action.vue.mjs";import f from"../../../subject-layout/src/subject-layout.vue.mjs";import b from"../../../tiny-mce-editor/src/tiny-mce-editor.vue.mjs";const j={class:"preview"},q=["innerHTML"];var S=e({name:"QxsSubjectScale",__name:"SubjectRichText",props:{orderIndex:{type:Number,required:!0},richTextContent:{type:String,required:!0},title:{type:String,required:!1},isSave:{type:Boolean,required:!0},showAction:{type:Boolean,required:!1},isEdit:{type:Boolean,required:!0},isSet:{type:Boolean,required:!0},examAnswerRelationType:{type:Number,required:!1}},emits:["move","save","delete","edit","add"],setup(e,{emit:S}){const T=e,A=S,B=t(),C=o("");function E(){C.value?A("save",{richTextContent:C.value||""}):h.error("富文本内容不能为空!")}i(function(){T.richTextContent&&(C.value=T.richTextContent)});const M=x("subject-scale");return(e,t)=>(n(),r("div",{class:s(a(M).e("scale-exam"))},[d(f,{"show-edit":e.isEdit},{preview:u(()=>[p("div",j,[v(y(e.orderIndex+1)+".",1),p("div",{innerHTML:C.value},null,8,q)])]),edit:u(()=>[d(b,c({"model-value":C.value,"onUpdate:modelValue":t[0]||(t[0]=e=>C.value=e)},a(B),{style:{width:"100%"}}),null,16,["model-value"])]),default:u(()=>[e.showAction?(n(),l(w,{key:0,"is-edit":e.isEdit,"is-set":e.isSet,"exam-answer-relation-type":T.examAnswerRelationType,"show-other-option":!1,"show-rich-text":!1,onMoveUp:t[1]||(t[1]=e=>A("move","up")),onMoveDown:t[2]||(t[2]=e=>A("move","down")),onDelete:t[3]||(t[3]=e=>A("delete")),onSave:E,onEdit:t[4]||(t[4]=e=>A("edit")),onAdd:t[5]||(t[5]=e=>A("add",e))},null,8,["is-edit","is-set","exam-answer-relation-type"])):m("v-if",!0)]),_:1},8,["show-edit"])],2))}});export{S as default};
 //# sourceMappingURL=SubjectRichText.vue.mjs.map

package/es/src/subject-list/src/components/SubjectRichText.vue.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SubjectRichText.vue.mjs","sources":["../../../../../../../packages/components/src/subject-list/src/components/SubjectRichText.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useNamespace } from '@qxs-bns/hooks'\nimport { ElMessage } from 'element-plus'\nimport SubjectAction from '../../../subject-action/src/subject-action.vue'\nimport SubjectLayout from '../../../subject-layout/src/subject-layout.vue'\nimport TinyMceEditor from '../../../tiny-mce-editor/src/tiny-mce-editor.vue'\n\ndefineOptions({\n  name: 'QxsSubjectScale',\n})\nconst props = defineProps<{\n  orderIndex: number\n  richTextContent: string\n  title?: string\n  isSave: boolean\n  showAction?: boolean\n  isEdit: boolean\n  isSet: boolean\n  examAnswerRelationType?: number\n}>()\nconst emits = defineEmits(['move', 'save', 'delete', 'edit', 'add'])\n\nconst attrs = useAttrs()\n\nconst richContent = ref('')\n\nfunction save() {\n  if (!richContent.value) {\n    ElMessage.error('富文本内容不能为空!')\n    return\n  }\n\n  emits('save', {\n    richTextContent: richContent.value || '',\n  })\n}\n\nfunction init() {\n  if (props.richTextContent) {\n    richContent.value = props.richTextContent\n  }\n}\n\nonMounted(init)\nconst ns = useNamespace('subject-scale')\n</script>\n\n<template>\n  <div :class=\"ns.e('scale-exam')\">\n    <SubjectLayout :show-edit=\"isEdit\">\n      <template #preview>\n        <div class=\"preview\">\n          {{ orderIndex + 1 }}.<div v-html=\"richContent\" />\n        </div>\n      </template>\n      <template #edit>\n        <TinyMceEditor\n          v-model:model-value=\"richContent\"\n          v-bind=\"attrs\"\n          style=\"width: 100%;\"\n        />\n      </template>\n      <SubjectAction\n        v-if=\"showAction\"\n        :is-edit=\"isEdit\"\n        :is-set=\"isSet\"\n        :exam-answer-relation-type=\"props.examAnswerRelationType\"\n        :show-other-option=\"false\"\n        :show-rich-text=\"false\"\n        @move-up=\"emits('move', 'up')\"\n        @move-down=\"emits('move', 'down')\"\n        @delete=\"emits('delete')\"\n        @save=\"save\"\n        @edit=\"emits('edit')\"\n        @add=\"type => emits('add', type)\"\n      />\n    </SubjectLayout>\n  </div>\n</template>\n"],"names":["props","__props","emits","__emit","attrs","useAttrs","richContent","ref","save","value","richTextContent","ElMessage","error","onMounted","ns","useNamespace","_createElementBlock","class","_normalizeClass","_unref","e","_createVNode","SubjectLayout","isEdit","preview","_createElementVNode","_hoisted_1","orderIndex","innerHTML","_hoisted_2","edit","TinyMceEditor","_mergeProps","$event","style","width","showAction","_createBlock","SubjectAction","isSet","examAnswerRelationType","onMoveUp","onMoveDown","onDelete","onSave","onEdit","onAdd","_cache","type"],"mappings":"yiCAUA,MAAMA,EAAQC,EAURC,EAAQC,EAERC,EAAQC,IAERC,EAAcC,EAAI,IAExB,SAASC,IACFF,EAAYG,MAKjBP,EAAM,OAAQ,CACZQ,gBAAiBJ,EAAYG,OAAS,KALtCE,EAAUC,MAAM,aAOpB,CAQAC,EANA,WACMb,EAAMU,kBACRJ,EAAYG,MAAQT,EAAMU,gBAE9B,GAGA,MAAMI,EAAKC,EAAa,mCAItBC,EA6BM,MAAA,CA7BAC,MAAKC,EAAEC,EAAAL,GAAGM,EAAC,iBACfC,EA2BgBC,EAAA,CA3BA,YAAWC,EAAAA,QAAM,CACpBC,UACT,IAEM,CAFNC,EAEM,MAFNC,EAEM,CADDC,EAAAA,EAAAA,EAAAA,cAAiB,IAAC,GAAAF,EAA4B,MAAA,CAAvBG,UAAQT,EAAAb,IAAW,KAAA,EAAAuB,OAGtCC,OACT,IAIE,CAJFT,EAIEU,EAJFC,EAIE,CAHQ,cAAab,EAAAb,6CAAAA,EAAWG,MAAAwB,EAAA,OACxBd,EAAAf,GAAK,CACb8B,MAAA,CAAAC,MAAA,UAAoB,KAAA,GAAA,CAAA,4BAGxB,IAaE,CAZMC,EAAAA,gBADRC,EAaEC,EAAA,OAXC,UAASf,EAAAA,OACT,SAAQgB,EAAAA,MACR,4BAA2BvC,EAAMwC,uBACjC,qBAAmB,EACnB,kBAAgB,EAChBC,wBAASvC,EAAK,OAAA,OACdwC,0BAAWxC,EAAK,OAAA,SAChByC,wBAAQzC,EAAK,WACb0C,OAAMpC,EACNqC,sBAAM3C,EAAK,SACX4C,MAAGC,EAAA,KAAAA,EAAA,GAAEC,GAAQ9C,QAAa8C"}
+{"version":3,"file":"SubjectRichText.vue.mjs","sources":["../../../../../../../packages/components/src/subject-list/src/components/SubjectRichText.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useNamespace } from '@qxs-bns/hooks'\nimport { ElMessage } from 'element-plus'\nimport { onMounted, ref, useAttrs } from 'vue'\nimport SubjectAction from '../../../subject-action/src/subject-action.vue'\nimport SubjectLayout from '../../../subject-layout/src/subject-layout.vue'\nimport TinyMceEditor from '../../../tiny-mce-editor/src/tiny-mce-editor.vue'\n\ndefineOptions({\n  name: 'QxsSubjectScale',\n})\nconst props = defineProps<{\n  orderIndex: number\n  richTextContent: string\n  title?: string\n  isSave: boolean\n  showAction?: boolean\n  isEdit: boolean\n  isSet: boolean\n  examAnswerRelationType?: number\n}>()\nconst emits = defineEmits(['move', 'save', 'delete', 'edit', 'add'])\n\nconst attrs = useAttrs()\n\nconst richContent = ref('')\n\nfunction save() {\n  if (!richContent.value) {\n    ElMessage.error('富文本内容不能为空!')\n    return\n  }\n\n  emits('save', {\n    richTextContent: richContent.value || '',\n  })\n}\n\nfunction init() {\n  if (props.richTextContent) {\n    richContent.value = props.richTextContent\n  }\n}\n\nonMounted(init)\nconst ns = useNamespace('subject-scale')\n</script>\n\n<template>\n  <div :class=\"ns.e('scale-exam')\">\n    <SubjectLayout :show-edit=\"isEdit\">\n      <template #preview>\n        <div class=\"preview\">\n          {{ orderIndex + 1 }}.<div v-html=\"richContent\" />\n        </div>\n      </template>\n      <template #edit>\n        <TinyMceEditor\n          v-model:model-value=\"richContent\"\n          v-bind=\"attrs\"\n          style=\"width: 100%;\"\n        />\n      </template>\n      <SubjectAction\n        v-if=\"showAction\"\n        :is-edit=\"isEdit\"\n        :is-set=\"isSet\"\n        :exam-answer-relation-type=\"props.examAnswerRelationType\"\n        :show-other-option=\"false\"\n        :show-rich-text=\"false\"\n        @move-up=\"emits('move', 'up')\"\n        @move-down=\"emits('move', 'down')\"\n        @delete=\"emits('delete')\"\n        @save=\"save\"\n        @edit=\"emits('edit')\"\n        @add=\"type => emits('add', type)\"\n      />\n    </SubjectLayout>\n  </div>\n</template>\n"],"names":["props","__props","emits","__emit","attrs","useAttrs","richContent","ref","save","value","richTextContent","ElMessage","error","onMounted","ns","useNamespace","_createElementBlock","class","_normalizeClass","_unref","e","_createVNode","SubjectLayout","isEdit","preview","_createElementVNode","_hoisted_1","orderIndex","innerHTML","_hoisted_2","edit","TinyMceEditor","_mergeProps","$event","style","width","showAction","_createBlock","SubjectAction","isSet","examAnswerRelationType","onMoveUp","onMoveDown","onDelete","onSave","onEdit","onAdd","_cache","type"],"mappings":"8hCAWA,MAAMA,EAAQC,EAURC,EAAQC,EAERC,EAAQC,IAERC,EAAcC,EAAI,IAExB,SAASC,IACFF,EAAYG,MAKjBP,EAAM,OAAQ,CACZQ,gBAAiBJ,EAAYG,OAAS,KALtCE,EAAUC,MAAM,aAOpB,CAQAC,EANA,WACMb,EAAMU,kBACRJ,EAAYG,MAAQT,EAAMU,gBAE9B,GAGA,MAAMI,EAAKC,EAAa,mCAItBC,EA6BM,MAAA,CA7BAC,MAAKC,EAAEC,EAAAL,GAAGM,EAAC,iBACfC,EA2BgBC,EAAA,CA3BA,YAAWC,EAAAA,QAAM,CACpBC,UACT,IAEM,CAFNC,EAEM,MAFNC,EAEM,CADDC,EAAAA,EAAAA,EAAAA,cAAiB,IAAC,GAAAF,EAA4B,MAAA,CAAvBG,UAAQtB,EAAAG,OAAW,KAAA,EAAAoB,OAGtCC,OACT,IAIE,CAJFT,EAIEU,EAJFC,EAIE,CAHQ,cAAa1B,EAAAG,2CAAAH,EAAWG,MAAAwB,IACxBd,EAAAf,GAAK,CACb8B,MAAA,CAAAC,MAAA,UAAoB,KAAA,GAAA,CAAA,4BAGxB,IAaE,CAZMC,EAAAA,gBADRC,EAaEC,EAAA,OAXC,UAASf,EAAAA,OACT,SAAQgB,EAAAA,MACR,4BAA2BvC,EAAMwC,uBACjC,qBAAmB,EACnB,kBAAgB,EAChBC,wBAASvC,EAAK,OAAA,OACdwC,0BAAWxC,EAAK,OAAA,SAChByC,wBAAQzC,EAAK,WACb0C,OAAMpC,EACNqC,sBAAM3C,EAAK,SACX4C,MAAGC,EAAA,KAAAA,EAAA,GAAEC,GAAQ9C,QAAa8C"}

package/es/src/subject-list/src/components/subject-blank-fill.vue.mjs

@@ -1,2 +1,2 @@
-import{ElInput as e,ElLink as l,ElCheckboxGroup as t,ElCheckbox as s,ElTag as n,ElButton as i,ElIcon as a}from"element-plus/es";import"element-plus/es/components/base/style/index";import"element-plus/es/components/button/style/index";import"element-plus/es/components/icon/style/index";import"element-plus/es/components/tag/style/index";import"element-plus/es/components/checkbox-group/style/index";import"element-plus/es/components/checkbox/style/index";import"element-plus/es/components/link/style/index";import"element-plus/es/components/input/style/index";import{defineComponent as o,useAttrs as r,ref as u,watch as d,onMounted as m,createElementBlock as p,openBlock as c,normalizeClass as v,unref as f,createVNode as x,withCtx as y,createBlock as g,createCommentVNode as w,createElementVNode as h,isRef as _,createTextVNode as b,Fragment as k,renderList as j,toDisplayString as C,mergeProps as I}from"vue";import{Plus as V}from"@element-plus/icons-vue";import{useNamespace as S}from"@qxs-bns/hooks";import{ElMessage as A}from"element-plus";import q from"../../../subject-action/src/subject-action.vue.mjs";import O from"../../../subject-layout/src/subject-layout.vue.mjs";import T from"../../../tiny-mce-editor/src/tiny-mce-editor.vue.mjs";const R={class:"preview"},B={class:"content"},U={class:"title"},L={key:0},E=["innerHTML"],M={key:1,class:"flex flex-wrap",style:{"margin-top":"10px",color:"#a8abb2"}},D={class:"flex"},H={style:{flex:"1"}},N={class:"flex flex-justify-end"},z={class:"margin-bottom flex flex-items-center"},F={class:"margin-bottom answer-list"},G={class:"label flex flex-justify-end"},J={class:"answer-tags"},K={key:0,class:"margin-bottom flex"},P={style:{flex:"1"}},Q={key:1,class:"margin-bottom flex"},W={style:{flex:"1"}},X={class:"flex flex-justify-end"};var Y=o({__name:"subject-blank-fill",props:{orderIndex:{type:Number,required:!0},title:{type:String,required:!1},isSave:{type:Boolean,required:!0},showAction:{type:Boolean,required:!1},answerList:{type:null,required:!1},analysis:{type:String,required:!1},isEdit:{type:Boolean,required:!0},isSet:{type:Boolean,required:!0},examAnswerSettingVO:{type:Object,required:!1},examRichTextContent:{type:String,required:!1},showAnalysis:{type:Boolean,required:!1},examAnswerRelationType:{type:Number,required:!1}},emits:["move","save","delete","edit","add"],setup(o,{emit:Y}){const Z=o,$=Y,ee=r(),le=u([]),te=u(""),se=u(""),ne=u(!1),ie=u(""),ae=[{label:"答案不分顺序",value:"isInOrder"},{label:"忽略大小写",value:"isIgnoreCase"}],oe=u(["isIgnoreCase"]);function re(){te.value+=" ______",le.value.push({title:"",tag:"",showInput:!1})}function ue(){ne.value=!1,ie.value=""}function de(){te.value?le.value.length<1?A.error("至少添加一个填空符!"):$("save",{title:te.value.replaceAll(/ ______/g,"<filter></filter>"),answers:le.value.map(e=>({title:e.title,isCorrect:!0})),analysis:se.value,isSetCorrectAnswer:!0,examAnswerSettingBO:{isIgnoreCase:oe.value?.includes("isIgnoreCase"),isInOrder:oe.value?.includes("isInOrder")},examRichTextContent:ne.value?ie.value:""}):A.error("题目标题不能为空!")}d(()=>te.value,()=>{const[...e]=te.value.matchAll(/ ______/g);if(e.length!==le.value.length){const l=le.value.length-e.length;le.value.splice(le.value.length-l,l)}}),m(function(){Z.title&&(te.value=Z.title.replaceAll(/<filter><\/filter>/g," ______")),Z.answerList&&Z.answerList.length&&(le.value=Z.answerList),Z.examAnswerSettingVO&&(oe.value=oe.value.filter(e=>"isIgnoreCase"===e&&Z.examAnswerSettingVO?.isIgnoreCase||"isInOrder"===e&&Z.examAnswerSettingVO?.isInOrder)),Z.analysis&&(se.value=Z.analysis),Z.examRichTextContent&&(ie.value=Z.examRichTextContent,ne.value=!0)});const me=S("subject-blank-fill");return(o,r)=>{const u=e,d=l,m=s,S=t,A=n,Y=a,pe=i;return c(),p("div",{class:v(f(me).e("blank-fill-exam"))},[x(O,{"show-edit":o.isEdit},{preview:y(()=>[h("div",R,[h("div",B,[h("span",U,C(o.orderIndex+1)+"."+C(f(te))+"（填空题）",1),f(ne)?(c(),p("div",L,[h("div",{class:"rich-text",innerHTML:f(ie)},null,8,E)])):w("v-if",!0),f(le).some(e=>e.title)?(c(),p("div",M,[r[10]||(r[10]=h("span",{class:"title"},"正确答案：",-1)),(c(!0),p(k,null,j(f(le),(e,l)=>(c(),p("div",{key:l,class:"flex flex-wrap flex-items-center",style:{"margin-right":"10px"}},[h("span",null,"填空"+C(l+1)+":",1),h("span",null,C(e.title),1)]))),128))])):w("v-if",!0)])])]),edit:y(()=>[h("div",D,[r[11]||(r[11]=h("div",{class:"label flex flex-justify-end"},[h("span",null,"题目:")],-1)),h("div",H,[x(u,{modelValue:f(te),"onUpdate:modelValue":r[0]||(r[0]=e=>_(te)?te.value=e:null),type:"textarea",rows:7,"show-word-limit":"",maxlength:"400",placeholder:"【填空题】请输入问题",disabled:o.isSave},null,8,["modelValue","disabled"])])]),h("div",N,[w(' <el-link\n            v-if="!showRichText"\n            type="primary"\n            @click="showRichText = true"\n          >\n            添加富文本\n          </el-link> '),x(d,{class:"margin-left-10",type:"primary",disabled:o.isSave,onClick:re},{default:y(()=>r[12]||(r[12]=[b(" 插入填空符 ",-1)])),_:1,__:[12]},8,["disabled"])]),h("div",z,[r[13]||(r[13]=h("div",{class:"label flex flex-justify-end"},[h("span",null,"答题设置:")],-1)),(c(),p(k,null,j(ae,e=>x(S,{key:e.value,modelValue:f(oe),"onUpdate:modelValue":r[1]||(r[1]=e=>_(oe)?oe.value=e:null)},{default:y(()=>[x(m,{value:e.value,class:"margin-left-10"},{default:y(()=>[b(C(e.label),1)]),_:2},1032,["value"])]),_:2},1032,["modelValue"])),64))]),h("div",F,[(c(!0),p(k,null,j(f(le),(e,l)=>(c(),p("div",{key:l,class:"answer-item flex flex-items-center"},[h("div",G,[h("span",null,"第"+C(l+1)+"空答案:",1)]),h("div",J,[(c(!0),p(k,null,j(e.title.split(","),l=>(c(),p(k,{key:l},[l?(c(),g(A,{key:0,closable:"",onClose:t=>function(e,l){if(e){const t=l.title.split(","),s=t.findIndex(l=>l===e);s>-1&&(t.splice(s,1),l.title=t.join(","))}}(l,e)},{default:y(()=>[b(C(l),1)]),_:2},1032,["onClose"])):w("v-if",!0)],64))),128)),o.isSave?w("v-if",!0):(c(),p(k,{key:0},[e.showInput?(c(),g(u,{key:0,modelValue:e.tag,"onUpdate:modelValue":l=>e.tag=l,style:{width:"80px"},onBlur:()=>function(e){e.showInput=!1,e.tag&&(e.title=e.title?[e.title,e.tag].join(","):e.tag,e.tag="")}(e)},null,8,["modelValue","onUpdate:modelValue","onBlur"])):(c(),g(pe,{key:1,size:"small",onClick:l=>e.showInput=!0},{default:y(()=>[x(Y,null,{default:y(()=>[x(f(V))]),_:1}),h("span",null,C(e.title?"添加同义词":"添加答案"),1)]),_:2},1032,["onClick"]))],64))])]))),128))]),o.showAnalysis?(c(),p("div",K,[r[14]||(r[14]=h("div",{class:"label flex flex-justify-end"},[h("span",null,"解析:")],-1)),h("div",P,[x(u,{modelValue:f(se),"onUpdate:modelValue":r[2]||(r[2]=e=>_(se)?se.value=e:null),type:"textarea",rows:2,placeholder:"请输入题目解析"},null,8,["modelValue"])])])):w("v-if",!0),f(ne)?(c(),p("div",Q,[r[16]||(r[16]=h("div",{class:"label flex flex-justify-center"},[h("span",null,"富文本:")],-1)),h("div",W,[x(T,I({"model-value":f(ie),"onUpdate:modelValue":r[3]||(r[3]=e=>_(ie)?ie.value=e:null)},f(ee),{style:{width:"100%"}}),null,16,["model-value"]),h("div",X,[x(d,{type:"danger",onClick:ue},{default:y(()=>r[15]||(r[15]=[b(" 删除富文本 ",-1)])),_:1,__:[15]})])])])):w("v-if",!0)]),default:y(()=>[o.showAction?(c(),g(q,{key:0,"is-edit":o.isEdit,"is-set":o.isSet,"show-other-option":!1,"exam-answer-relation-type":Z.examAnswerRelationType,onMoveUp:r[4]||(r[4]=e=>$("move","up")),onMoveDown:r[5]||(r[5]=e=>$("move","down")),onDelete:r[6]||(r[6]=e=>$("delete")),onSave:de,onEdit:r[7]||(r[7]=e=>$("edit")),onAdd:r[8]||(r[8]=e=>$("add",e)),onOnShowRichText:r[9]||(r[9]=e=>ne.value=!0)},null,8,["is-edit","is-set","exam-answer-relation-type"])):w("v-if",!0)]),_:1},8,["show-edit"])],2)}}});export{Y as default};
+import{defineComponent as e,useAttrs as l,ref as t,watch as a,onMounted as i,resolveComponent as s,createElementBlock as n,openBlock as o,normalizeClass as u,unref as r,createVNode as d,withCtx as v,createBlock as c,createCommentVNode as m,createElementVNode as f,createTextVNode as p,Fragment as x,renderList as y,toDisplayString as g,mergeProps as w}from"vue";import{Plus as h}from"@element-plus/icons-vue";import{useNamespace as _}from"@qxs-bns/hooks";import{ElMessage as b}from"element-plus";import k from"../../../subject-action/src/subject-action.vue.mjs";import j from"../../../subject-layout/src/subject-layout.vue.mjs";import C from"../../../tiny-mce-editor/src/tiny-mce-editor.vue.mjs";const I={class:"preview"},V={class:"content"},S={class:"title"},A={key:0},q=["innerHTML"],O={key:1,class:"flex flex-wrap",style:{"margin-top":"10px",color:"#a8abb2"}},T={class:"flex"},R={style:{flex:"1"}},B={class:"flex flex-justify-end"},U={class:"margin-bottom flex flex-items-center"},L={class:"margin-bottom answer-list"},E={class:"label flex flex-justify-end"},M={class:"answer-tags"},D={key:0,class:"margin-bottom flex"},H={style:{flex:"1"}},N={key:1,class:"margin-bottom flex"},z={style:{flex:"1"}},F={class:"flex flex-justify-end"};var G=e({__name:"subject-blank-fill",props:{orderIndex:{type:Number,required:!0},title:{type:String,required:!1},isSave:{type:Boolean,required:!0},showAction:{type:Boolean,required:!1},answerList:{type:null,required:!1},analysis:{type:String,required:!1},isEdit:{type:Boolean,required:!0},isSet:{type:Boolean,required:!0},examAnswerSettingVO:{type:Object,required:!1},examRichTextContent:{type:String,required:!1},showAnalysis:{type:Boolean,required:!1},examAnswerRelationType:{type:Number,required:!1}},emits:["move","save","delete","edit","add"],setup(e,{emit:G}){const J=e,K=G,P=l(),Q=t([]),W=t(""),X=t(""),Y=t(!1),Z=t(""),$=[{label:"答案不分顺序",value:"isInOrder"},{label:"忽略大小写",value:"isIgnoreCase"}],ee=t(["isIgnoreCase"]);function le(){W.value+=" ______",Q.value.push({title:"",tag:"",showInput:!1})}function te(){Y.value=!1,Z.value=""}function ae(){W.value?Q.value.length<1?b.error("至少添加一个填空符!"):K("save",{title:W.value.replaceAll(/ ______/g,"<filter></filter>"),answers:Q.value.map(e=>({title:e.title,isCorrect:!0})),analysis:X.value,isSetCorrectAnswer:!0,examAnswerSettingBO:{isIgnoreCase:ee.value?.includes("isIgnoreCase"),isInOrder:ee.value?.includes("isInOrder")},examRichTextContent:Y.value?Z.value:""}):b.error("题目标题不能为空!")}a(()=>W.value,()=>{const[...e]=W.value.matchAll(/ ______/g);if(e.length!==Q.value.length){const l=Q.value.length-e.length;Q.value.splice(Q.value.length-l,l)}}),i(function(){J.title&&(W.value=J.title.replaceAll(/<filter><\/filter>/g," ______")),J.answerList&&J.answerList.length&&(Q.value=J.answerList),J.examAnswerSettingVO&&(ee.value=ee.value.filter(e=>"isIgnoreCase"===e&&J.examAnswerSettingVO?.isIgnoreCase||"isInOrder"===e&&J.examAnswerSettingVO?.isInOrder)),J.analysis&&(X.value=J.analysis),J.examRichTextContent&&(Z.value=J.examRichTextContent,Y.value=!0)});const ie=_("subject-blank-fill");return(e,l)=>{const t=s("el-input"),a=s("el-link"),i=s("el-checkbox"),_=s("el-checkbox-group"),b=s("el-tag"),G=s("el-icon"),se=s("el-button");return o(),n("div",{class:u(r(ie).e("blank-fill-exam"))},[d(j,{"show-edit":e.isEdit},{preview:v(()=>[f("div",I,[f("div",V,[f("span",S,g(e.orderIndex+1)+"."+g(W.value)+"（填空题）",1),Y.value?(o(),n("div",A,[f("div",{class:"rich-text",innerHTML:Z.value},null,8,q)])):m("v-if",!0),Q.value.some(e=>e.title)?(o(),n("div",O,[l[10]||(l[10]=f("span",{class:"title"},"正确答案：",-1)),(o(!0),n(x,null,y(Q.value,(e,l)=>(o(),n("div",{key:l,class:"flex flex-wrap flex-items-center",style:{"margin-right":"10px"}},[f("span",null,"填空"+g(l+1)+":",1),f("span",null,g(e.title),1)]))),128))])):m("v-if",!0)])])]),edit:v(()=>[f("div",T,[l[11]||(l[11]=f("div",{class:"label flex flex-justify-end"},[f("span",null,"题目:")],-1)),f("div",R,[d(t,{modelValue:W.value,"onUpdate:modelValue":l[0]||(l[0]=e=>W.value=e),type:"textarea",rows:7,"show-word-limit":"",maxlength:"400",placeholder:"【填空题】请输入问题",disabled:e.isSave},null,8,["modelValue","disabled"])])]),f("div",B,[m(' <el-link\n            v-if="!showRichText"\n            type="primary"\n            @click="showRichText = true"\n          >\n            添加富文本\n          </el-link> '),d(a,{class:"margin-left-10",type:"primary",disabled:e.isSave,onClick:le},{default:v(()=>l[12]||(l[12]=[p(" 插入填空符 ",-1)])),_:1,__:[12]},8,["disabled"])]),f("div",U,[l[13]||(l[13]=f("div",{class:"label flex flex-justify-end"},[f("span",null,"答题设置:")],-1)),(o(),n(x,null,y($,e=>d(_,{key:e.value,modelValue:ee.value,"onUpdate:modelValue":l[1]||(l[1]=e=>ee.value=e)},{default:v(()=>[d(i,{value:e.value,class:"margin-left-10"},{default:v(()=>[p(g(e.label),1)]),_:2},1032,["value"])]),_:2},1032,["modelValue"])),64))]),f("div",L,[(o(!0),n(x,null,y(Q.value,(l,a)=>(o(),n("div",{key:a,class:"answer-item flex flex-items-center"},[f("div",E,[f("span",null,"第"+g(a+1)+"空答案:",1)]),f("div",M,[(o(!0),n(x,null,y(l.title.split(","),e=>(o(),n(x,{key:e},[e?(o(),c(b,{key:0,closable:"",onClose:t=>function(e,l){if(e){const t=l.title.split(","),a=t.findIndex(l=>l===e);a>-1&&(t.splice(a,1),l.title=t.join(","))}}(e,l)},{default:v(()=>[p(g(e),1)]),_:2},1032,["onClose"])):m("v-if",!0)],64))),128)),e.isSave?m("v-if",!0):(o(),n(x,{key:0},[l.showInput?(o(),c(t,{key:0,modelValue:l.tag,"onUpdate:modelValue":e=>l.tag=e,style:{width:"80px"},onBlur:()=>function(e){e.showInput=!1,e.tag&&(e.title=e.title?[e.title,e.tag].join(","):e.tag,e.tag="")}(l)},null,8,["modelValue","onUpdate:modelValue","onBlur"])):(o(),c(se,{key:1,size:"small",onClick:e=>l.showInput=!0},{default:v(()=>[d(G,null,{default:v(()=>[d(r(h))]),_:1}),f("span",null,g(l.title?"添加同义词":"添加答案"),1)]),_:2},1032,["onClick"]))],64))])]))),128))]),e.showAnalysis?(o(),n("div",D,[l[14]||(l[14]=f("div",{class:"label flex flex-justify-end"},[f("span",null,"解析:")],-1)),f("div",H,[d(t,{modelValue:X.value,"onUpdate:modelValue":l[2]||(l[2]=e=>X.value=e),type:"textarea",rows:2,placeholder:"请输入题目解析"},null,8,["modelValue"])])])):m("v-if",!0),Y.value?(o(),n("div",N,[l[16]||(l[16]=f("div",{class:"label flex flex-justify-center"},[f("span",null,"富文本:")],-1)),f("div",z,[d(C,w({"model-value":Z.value,"onUpdate:modelValue":l[3]||(l[3]=e=>Z.value=e)},r(P),{style:{width:"100%"}}),null,16,["model-value"]),f("div",F,[d(a,{type:"danger",onClick:te},{default:v(()=>l[15]||(l[15]=[p(" 删除富文本 ",-1)])),_:1,__:[15]})])])])):m("v-if",!0)]),default:v(()=>[e.showAction?(o(),c(k,{key:0,"is-edit":e.isEdit,"is-set":e.isSet,"show-other-option":!1,"exam-answer-relation-type":J.examAnswerRelationType,onMoveUp:l[4]||(l[4]=e=>K("move","up")),onMoveDown:l[5]||(l[5]=e=>K("move","down")),onDelete:l[6]||(l[6]=e=>K("delete")),onSave:ae,onEdit:l[7]||(l[7]=e=>K("edit")),onAdd:l[8]||(l[8]=e=>K("add",e)),onOnShowRichText:l[9]||(l[9]=e=>Y.value=!0)},null,8,["is-edit","is-set","exam-answer-relation-type"])):m("v-if",!0)]),_:1},8,["show-edit"])],2)}}});export{G as default};
 //# sourceMappingURL=subject-blank-fill.vue.mjs.map