super-page-runtime 1.0.16 → 1.0.17

package/components/runtime/views/assemblys/form/link/link-runtime.vue

@@ -1,70 +0,0 @@
-<template>
-  <el-form-item
-    :class="runtimeClass"
-    :label-width="designProperty.labelWidth"
-    :style="runtimeStyle"
-  >
-    <template #label>
-      <div v-if="designProperty.tittleShow" :style="{ ...headerStyle }">
-        {{ designProperty.title }}
-      </div>
-    </template>
-    <el-tooltip :disabled="!tooltipValue" :content="tooltipValue">
-      <el-link
-        :disabled="designProperty.state === 'disabled'"
-        :type="designProperty.type"
-        :underline="designProperty.underline"
-        @click="openLink(configure, pageContext)"
-      >
-        {{ dynamicValue }}
-      </el-link>
-    </el-tooltip>
-  </el-form-item>
-</template>
-<script lang="ts" setup>
-import { computed } from 'vue'
-import type {
-  Component,
-  PageContext
-} from '../../../../../../src/utils/interfaces/page-design-types'
-import { getFormModelFields } from '../../../../../../src/utils/page-init-util'
-import { formatVariableValue, openLink } from '../../../../../../src/utils/page-helper-util'
-//定义的属性对象
-interface MyProps {
-  //页面对象
-  pageContext: PageContext
-  configure: Component
-}
-const props = defineProps<MyProps>()
-//初始化字段及默认值
-getFormModelFields(props.pageContext, props.configure)
-//定义自身详细参数
-//运行时信息
-const runtimeInfo: any = props.configure.runtime ? props.configure.runtime : {}
-const runtimeStyle = runtimeInfo.style
-const runtimeClass = runtimeInfo.class
-const headerStyle = runtimeInfo.headerStyle
-const designProperty: any = runtimeInfo.props ? runtimeInfo.props : {}
-
-//定义内容
-let contentVariable = designProperty.formatting
-if (!contentVariable) {
-  const propsBase = props.configure.props.base ? props.configure.props.base : {}
-  contentVariable = propsBase.prop
-}
-//无值时,按UUID
-if (!contentVariable) {
-  contentVariable = '${page.' + props.configure.uuid + '}'
-}
-//显示内容
-const dynamicValue = computed(() => {
-  const resultValue = formatVariableValue(props.pageContext, contentVariable)
-  return resultValue == undefined || resultValue == null ? '' : resultValue
-})
-//tooltip
-let tooltipVariable = designProperty.tooltip
-const tooltipValue = computed(() => {
-  const resultValue = formatVariableValue(props.pageContext, tooltipVariable)
-  return resultValue == undefined || resultValue == null ? '' : resultValue
-})
-</script>

package/components/runtime/views/assemblys/form/placeholder/placeholder-runtime.vue

@@ -1,24 +0,0 @@
-<template>
-  <el-form-item :class="runtimeClass" :style="runtimeStyle">
-    <div style="width: 100%; height: 100%">&nbsp;</div>
-  </el-form-item>
-</template>
-<script lang="ts" setup>
-import type {
-  Component,
-  PageContext
-} from '../../../../../../src/utils/interfaces/page-design-types'
-
-//定义的属性对象
-interface MyProps {
-  //页面对象
-  pageContext: PageContext
-  configure: Component
-}
-const props = defineProps<MyProps>()
-//定义自身详细参数
-//运行时信息
-const runtimeInfo: any = props.configure.runtime ? props.configure.runtime : {}
-const runtimeStyle = runtimeInfo.style
-const runtimeClass = runtimeInfo.class
-</script>

package/components/runtime/views/assemblys/form/radio/radio-runtime.vue

@@ -1,203 +0,0 @@
-<template>
-  <el-form-item
-    :required="designProperty.required"
-    :class="runtimeClass"
-    :label-width="designProperty.labelWidth"
-    :style="runtimeStyle"
-  >
-    <template #label>
-      <div v-if="designProperty.tittleShow" :style="{ ...headerStyle }">
-        {{ designProperty.title }}
-      </div>
-    </template>
-    <el-radio-group
-      :disabled="designProperty.state === 'disabled'"
-      :size="designProperty.size"
-      @change="designProperty.changeMethod"
-      v-model="dynamicModelMethod"
-    >
-      <el-radio
-        v-for="item in listOptions"
-        :key="item.value"
-        :value="item.value"
-        :label="item.label"
-      >
-      </el-radio>
-    </el-radio-group>
-  </el-form-item>
-</template>
-<script lang="ts" setup>
-import { ref, computed, watch } from 'vue'
-import type {
-  Component,
-  PageContext
-} from '../../../../../../src/utils/interfaces/page-design-types'
-import {
-  queryOptionDatasources,
-  autoSetAfterSelect
-} from '../../../../../../src/utils/page-helper-util'
-import { getFormModelFields } from '../../../../../../src/utils/page-init-util'
-import {
-  getVariableValue,
-  setVariableValue,
-  getOptionDatasFromPage
-} from '../../../../../../src/utils/page-helper-util'
-
-//定义的属性对象
-interface MyProps {
-  //页面对象
-  pageContext: PageContext
-  configure: Component
-}
-
-const props = defineProps<MyProps>()
-
-const entity: any = props.pageContext.entity ? props.pageContext.entity : {}
-
-let dynamicFields: string[] = getFormModelFields(props.pageContext, props.configure)
-
-//绑定模型的字段
-const dynamicModelMethod = computed({
-  get() {
-    return getVariableValue(entity, dynamicFields)
-  },
-  set(value) {
-    setVariableValue(entity, dynamicFields, value)
-  }
-})
-
-//运行时信息
-const runtimeInfo: any = props.configure.runtime ? props.configure.runtime : {}
-const runtimeStyle = runtimeInfo.style
-const runtimeClass = runtimeInfo.class
-const headerStyle = runtimeInfo.headerStyle
-const designProperty: any = runtimeInfo.props ? runtimeInfo.props : {}
-//选项组数据
-const listOptions: any = ref(designProperty.options ? designProperty.options : [])
-//缓存中有值时,从缓存中获取
-const cacheOptions: any = getOptionDatasFromPage(props.pageContext, props.configure)
-if (cacheOptions.length > 0) {
-  listOptions.value = cacheOptions
-}
-
-//检查是否需要绑定远程查询对象
-const dataOrigin =
-  props.configure.props && props.configure.props.dataOrigin ? props.configure.props.dataOrigin : {}
-const valueType = dataOrigin.optionValueSetType
-//检查是否有自动设置值
-let autoSets: any = []
-//检查自动设置
-if (valueType == 'dynamicData' || valueType == 'dataTable' || valueType == 'service') {
-  if (dataOrigin.autoSets) {
-    for (let obj of dataOrigin.autoSets) {
-      if (obj.source) {
-        autoSets.push(obj)
-      }
-    }
-  }
-}
-//检查是否有绑定标签的变量
-if (
-  props.configure &&
-  props.configure.props &&
-  props.configure.props.base &&
-  props.configure.props.base.optionProp
-) {
-  autoSets.push({
-    source: 'label',
-    target: props.configure.props.base.optionProp
-  })
-}
-if (autoSets.length > 0) {
-  designProperty.changeMethod = optionChange
-}
-
-//监控字段
-const monitorFields: any = designProperty.monitorFields
-const monitorFieldInfos: any = []
-//监控对应的字段变化
-if (monitorFields) {
-  const preFields: any = []
-  for (let propName of monitorFields) {
-    if (propName.startsWith('${')) {
-      propName = propName.substring(2, propName.length - 1)
-      const fields = propName.split('.')
-      if (fields[0] === 'page' || fields[0] === 'task' || fields[0] === 'data') {
-        monitorFieldInfos.push(fields)
-        if (!preFields.includes(fields[0])) {
-          preFields.push(fields[0])
-        }
-      }
-    }
-  }
-  //监控对应的字段
-  for (let preField of preFields) {
-    watch(entity[preField], () => {
-      monitorFieldChange()
-    })
-  }
-}
-
-/**
- * 获取监控的数据值
- */
-function getMonitorFieldValues(): any {
-  let values = ''
-  for (let fieldInfo of monitorFieldInfos) {
-    values += '_' + getVariableValue(entity, fieldInfo)
-  }
-  return values
-}
-
-//初始化时检查一次
-let initMonitorValue: string = getMonitorFieldValues()
-
-let monitorTimeout: any = false
-
-//查询的参数
-const optionconfigInfo = designProperty.optionconfigInfo ? designProperty.optionconfigInfo : {}
-/**
- * 监控数据变化时
- */
-function monitorFieldChange() {
-  if (monitorTimeout) {
-    clearTimeout(monitorTimeout)
-  }
-  //延迟200毫秒执行
-  monitorTimeout = setTimeout(function () {
-    const newValue = getMonitorFieldValues()
-    if (newValue == initMonitorValue) {
-      return
-    }
-    initMonitorValue = newValue
-    queryOptionDatasources(props.pageContext, optionconfigInfo, undefined).then((error) => {
-      console.log('查询失败!', error)
-    })
-  }, 200)
-}
-
-//数据选择变化后自动设置值
-function optionChange(value: any) {
-  let selItems: any = null
-  if (listOptions.value && value != undefined && value != null) {
-    selItems = listOptions.value.filter((item: any) => {
-      return value === item.value
-    })
-  }
-  autoSetAfterSelect(props.configure, props.pageContext, autoSets, selItems)
-}
-
-/**
- * 更新选项组
- */
-function updateOptions(newOptions: any) {
-  listOptions.value = newOptions ? newOptions : []
-}
-
-/**
- * 暴露更新选项组内容的方法
- */
-defineExpose({
-  updateOptions
-})
-</script>

package/components/runtime/views/assemblys/form/rate/rate-design.vue

@@ -1,16 +0,0 @@
-<template>
-  <el-form-item :label="configure.title" :label-position="right">
-      <el-rate v-model="configure.fieldName" />
-  </el-form-item>
-</template>
-<script lang='ts' setup>
-    const props = defineProps({
-        configure:Object
-    });
-    if(props.configure.title==undefined){
-        props.configure.title = 'Rate';
-    }
-</script>
-<style scoped>
-  
-</style>

package/components/runtime/views/assemblys/form/rich-text/richtext-runtime.vue

@@ -1,169 +0,0 @@
-<template>
-  <!--无标题时不用form-item-->
-  <el-form-item
-    v-if="designProperty.tittleShow"
-    :required="designProperty.required"
-    :class="runtimeClass"
-    :label-width="designProperty.labelWidth"
-    :style="runtimeStyle"
-  >
-    <template #label>
-      <div v-if="designProperty.tittleShow" :style="{ ...headerStyle }">
-        {{ designProperty.title }}
-      </div>
-    </template>
-    <div style="width: 100%; height: 100%">
-      <div ref="quillEditorRef" style="width: 100%">{{ initValue }}</div>
-      <!-- 使用自定义图片上传 -->
-      <input type="file" hidden accept=".jpg,.png" ref="fileBtn" @change="handleUpload" />
-    </div>
-  </el-form-item>
-  <div v-else style="width: 100%; height: 100%" class="amb-widget-richtext-single">
-    <div ref="quillEditorRef" style="width: 100%">{{ initValue }}</div>
-    <!-- 使用自定义图片上传 -->
-    <input type="file" hidden accept=".jpg,.png" ref="fileBtn" @change="handleUpload" />
-  </div>
-</template>
-<script lang="ts" setup>
-import { ref, onMounted } from 'vue'
-import type {
-  Component,
-  PageContext
-} from '../../../../../../src/utils/interfaces/page-design-types'
-import { getFormModelFields } from '../../../../../../src/utils/page-init-util'
-import { formatVariableValue, setVariableValue } from '../../../../../../src/utils/page-helper-util'
-import Quill from 'quill'
-import 'quill/dist/quill.snow.css' // 引入样式文件
-//定义的属性对象
-interface MyProps {
-  //页面对象
-  pageContext: PageContext
-  configure: Component
-}
-const props = defineProps<MyProps>()
-
-const entity: any = props.pageContext.entity ? props.pageContext.entity : {}
-//初始化字段及默认值
-const dynamicFields: string[] = getFormModelFields(props.pageContext, props.configure)
-
-//定义自身详细参数
-//运行时信息
-const runtimeInfo: any = props.configure.runtime ? props.configure.runtime : {}
-const runtimeStyle = runtimeInfo.style
-const runtimeClass = runtimeInfo.class
-const headerStyle = runtimeInfo.headerStyle
-const designProperty: any = runtimeInfo.props ? runtimeInfo.props : {}
-
-//初始化显示内容
-let contentVariable = designProperty.value
-const initValue = formatVariableValue(props.pageContext, contentVariable)
-
-//富文本引用
-const quillEditorRef = ref(null)
-const quill: any = ref(null)
-const fileBtn: any = ref(null)
-//初始化富文本控件
-const fontSize = [
-  '12px',
-  '13px',
-  '14px',
-  '15px',
-  '16px',
-  '18px',
-  '20px',
-  '24px',
-  '28px',
-  '32px',
-  '36px'
-]
-const option = ref({
-  modules: {
-    toolbar: [
-      ['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
-      ['blockquote', 'code-block'], // 引用
-      [{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表
-      [{ script: 'sub' }, { script: 'super' }], // 上标/下标
-      [{ indent: '-1' }, { indent: '+1' }], // 缩进
-      [{ direction: 'rtl' }], // 文本方向
-      [{ size: fontSize }], // 字体大小
-      [{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题
-      [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
-      [{ font: [] }], // 字体种类
-      [{ align: [] }], // 对齐方式
-      ['clean'], // 清除文本格式
-      ['link', 'image'] // 链接、图片、视频
-    ]
-  },
-  theme: 'snow',
-  placeholder: designProperty.placeholder,
-  readOnly: designProperty.state == 'readonly'
-})
-
-/**
- * 计算并更新高度
- */
-function updateEditorHeight() {
-  //计算高度
-  if (quill && quill.value) {
-    if (quill.value.container) {
-      //获取相对高度
-      const parentNode = quill.value.container.parentNode
-      const parentRect = parentNode.getBoundingClientRect()
-
-      const thisRect = quill.value.container.getBoundingClientRect()
-      //计算高度
-      let newHeight = parentRect.height - (thisRect.top - parentRect.top)
-      if (newHeight < 100) {
-        newHeight = 100
-      }
-      quill.value.container.style.height = newHeight + 'px'
-    }
-  }
-}
-
-//上传图片
-const imgHandler = (state) => {
-  if (fileBtn.value && state) {
-    fileBtn.value.click()
-  }
-}
-//上传
-const handleUpload = (e) => {
-  const files = Array.prototype.slice.call(e.target.files)
-  if (!files) {
-    return
-  }
-  const formdata = new FormData()
-  formdata.append('file', files[0])
-  alert('TODO:上传图片')
-  //此处使用服务端提供上传接口
-  /**backsite.uploadFile(formdata) 
-			.then(res => {
-			if (res.data.url) {
-				const quill = toRaw(myQuillEditor.value).getQuill()
-				const length = quill.getSelection().index
-				quill.insertEmbed(length, 'image', res.data.url)
-				quill.setSelection(length + 1)
-			}
-			})*/
-}
-//初始化编辑器
-onMounted(() => {
-  quill.value = new Quill(quillEditorRef.value, option.value)
-  //添加上传文件
-  quill.value.getModule('toolbar').addHandler('image', imgHandler)
-  //绑定事件
-  quill.value.on('text-change', function (delta, oldDelta, source) {
-    //1秒后设置到缓存中
-    if (window.updateQuillTimeout) {
-      clearTimeout(window.updateQuillTimeout)
-    }
-    window.updateQuillTimeout = setTimeout(function () {
-      setVariableValue(entity, dynamicFields, quill.value.root.innerHTML)
-      console.log('new entity', entity)
-    }, 1000)
-  })
-  //计算高度
-  updateEditorHeight()
-})
-</script>