super-page-runtime 1.0.16 → 1.0.17

package/components/runtime/views/assemblys/form/common/uploading.vue

@@ -1,34 +0,0 @@
-<template>
-	<el-collapse-item
-			title="上传"
-			name="uploadConfig"
-			class="amb-design-attr-group-header">
-		<div style="padding:8px 0px 0px 0px;">
-			<slot name="addition" :row="uploadConfig"></slot>
-			<el-form-item label="立即上传" class="amb-design-attr-item">
-				<el-switch v-model="uploadConfig.autoUpload" />
-			</el-form-item>
-			<el-form-item label="上传地址" class="amb-design-attr-item">
-				<el-input v-model="uploadConfig.action" placeholder="请输入" />
-			</el-form-item>
-			<el-form-item label="附件多选" class="amb-design-attr-item">
-				<el-switch v-model="uploadConfig.multiple" />
-			</el-form-item>
-			<el-form-item label="文件字段名" class="amb-design-attr-item">
-				<el-input v-model="uploadConfig.name" placeholder="请输入" />
-			</el-form-item>
-			<el-form-item label="文件限制(M)" class="amb-design-attr-item">
-				<el-input-number v-model="uploadConfig.limitFileSize" />
-			</el-form-item>
-			<el-form-item label="实时删除" class="amb-design-attr-item">
-				<el-switch v-model="uploadConfig.isDeleteNow" />
-			</el-form-item>
-		</div>
-	</el-collapse-item>
-</template>
-<script lang='ts' setup>
-const props = defineProps({
-	uploadConfig:Object
-});
-</script>
-

package/components/runtime/views/assemblys/form/common/verification.vue

@@ -1,79 +0,0 @@
-<template>
-		<el-collapse-item
-					title="校验"  
-					name="verification"
-					class="amb-design-attr-group-header">
-			<div style="padding:8px 0px 0px 0px;">
-					<el-form-item class="amb-design-attr-item" label-width="0">
-						<el-checkbox v-model="verification.required" label="必填"/>
-					</el-form-item>
-					<el-checkbox-group v-model="verification.type">
-						<el-form-item class="amb-design-attr-item" label-width="0">
-							<el-checkbox label="整形" value="int" />
-							<el-checkbox label="数字" value="number" />
-							<el-checkbox label="bool" value="boolean" />
-						</el-form-item>
-						<el-form-item class="amb-design-attr-item" label-width="0">
-							<el-checkbox label="邮件" value="mail" />
-							<el-checkbox label="网址" value="ip" />
-						</el-form-item>
-					</el-checkbox-group>
-					<el-form-item class="amb-design-attr-item" label-width="0">
-						<el-col :span="8">			
-							<el-checkbox v-model="verification.verifyMinLength" label="最小长度" value="min" /> 
-						</el-col>
-						<el-col :span="14">
-								<el-input-number
-										v-model="verification.minLength"
-										class="mx-4"
-										:min="0"
-										controls-position="right"
-										placeholder="请输入"
-								/>
-						</el-col>
-					</el-form-item>
-					<el-form-item class="amb-design-attr-item" label-width="0">
-						<el-col :span="8">
-							<el-checkbox v-model="verification.verifyMaxLength" label="最大长度" value="max" /> 
-						</el-col>
-						<el-col :span="14">
-								<el-input-number
-										v-model="verification.maxLength"
-										class="mx-4"
-										:min="0"
-										controls-position="right"
-										placeholder="请输入"
-								/>
-						</el-col>
-					</el-form-item>
-					<el-form-item class="amb-design-attr-item" label-width="0">
-							<el-col :span="8">
-								<el-checkbox v-model="verification.verifyRegex" label="正则" value="regex" />
-							</el-col>
-							<el-col :span="14">
-									<el-input
-											v-model="verification.regex"
-											class="mx-4"
-											controls-position="right"
-											placeholder="请输入"
-									/>
-							</el-col>
-					</el-form-item>
-					<el-form-item class="amb-design-attr-item" label-width="0">
-							<el-col :span="8">
-								<el-checkbox label="自定义" value="custom" />
-							</el-col>
-							<el-col :span="14">
-								<el-button>自定义逻辑</el-button><el-button :icon="Search" circle />
-							</el-col>
-					</el-form-item>
-			</div>
-		</el-collapse-item>
-</template>
-<script lang='ts' setup>
-import { Search } from '@element-plus/icons-vue'
-defineProps({
-		verification:Object
-});
-
-</script>

package/components/runtime/views/assemblys/form/common/voluntarily.vue

@@ -1,27 +0,0 @@
-<template>
-	<el-collapse-item
-			title="选择后自动设置"
-			name="voluntarily"
-			class="amb-design-attr-group-header">
-		<div style="padding:8px 0px 0px 0px;">
-			<RowUlLi
-					type="input"
-					:tittle="true"
-					:showIndex="true"
-					leftTittle="可选属性"
-					rightTittle="设置到变量"
-					:list="voluntarily"></RowUlLi>
-		</div>
-	</el-collapse-item>
-</template>
-
-<script setup lang="ts">
-import RowUlLi from '../common/row-ul-li.vue'
-const props = defineProps({
-	voluntarily:Object,
-});
-</script>
-
-<style scoped>
-
-</style>

package/components/runtime/views/assemblys/form/custom/custom-attr-base.vue

@@ -1,81 +0,0 @@
-<template>
-	<el-form label-width="80px" size="small">
-		<el-collapse v-model="openCollapseItems" style="margin-top:6px;">
-			<el-collapse-item
-					title="基本"
-					name="base"
-					class="amb-design-attr-group-header">
-				<div style="padding:8px 0px 0px 0px;">
-					<el-form-item label="组件类型" class="amb-design-attr-item">
-						<el-select v-model="configure.name" placeholder="请选择" >
-							<el-option
-									v-for="item in getFormComponentOptions()"
-									:key="item.name"
-									:label="item.label"
-									:value="item.name"
-							/>
-						</el-select>
-					</el-form-item>
-					<el-form-item label="组件名" class="amb-design-attr-item">
-						<el-input v-model="configure.props.base.name" placeholder="请输入" />
-					</el-form-item>
-					<el-form-item label="绑定变量" class="amb-design-attr-item">
-						<el-input v-model="configure.props.base.prop" placeholder="请输入" />
-					</el-form-item>
-					<el-form-item label="标题" class="amb-design-attr-item">
-						<el-input v-model="configure.props.base.title" placeholder="请输入" />
-					</el-form-item>
-					<el-form-item label="状态" class="amb-design-attr-item">
-						<el-radio-group v-model="configure.props.base.state" class="ml-4">
-							<el-radio value="default">普通</el-radio>
-							<el-radio value="disabled">禁用</el-radio>
-							<el-radio value="hidden">隐藏</el-radio>
-						</el-radio-group>
-					</el-form-item>
-				</div>
-			</el-collapse-item>
-			<el-collapse-item
-					title="参数"
-					name="parameter"
-					class="amb-design-attr-group-header">
-				<div style="padding:8px 0px 0px 0px;">
-					<RowUlLi type="input" :list="configure.props.parameter"></RowUlLi>
-				</div>
-			</el-collapse-item>
-			<el-collapse-item
-					title="校验"
-					name="verification"
-					class="amb-design-attr-group-header">
-				<div style="padding:8px 0px 0px 0px;">
-					<el-form-item class="amb-design-attr-item" label-width="0">
-						<el-checkbox v-model="configure.props.verification.required" label="必填"/>
-					</el-form-item>
-					<el-form-item class="amb-design-attr-item" label-width="0">
-						<el-col :span="8">
-							<el-checkbox label="自定义" value="custom" />
-						</el-col>
-						<el-col :span="14">
-							<el-button>自定义逻辑</el-button><el-button :icon="Search" circle />
-						</el-col>
-					</el-form-item>
-				</div>
-			</el-collapse-item>
-			<CommonAttrSize :size="configure.props.size" />
-			<Title :title="configure.props.title" />
-		</el-collapse>
-	</el-form>
-</template>
-<script lang='ts' setup>
-import { ref } from 'vue';
-import { getFormComponentOptions } from '../../../../utils/assemblys-config.js'
-import CommonAttrSize from '../../common/common-attr-size.vue'
-import Title from '../common/title.vue'
-import RowUlLi from '../common/row-ul-li.vue'
-
-defineProps({
-	configure: Object,
-	default: () => ({props: {}})
-});
-const openCollapseItems = ref("")
-
-</script>

package/components/runtime/views/assemblys/form/custom/custom-attr-event.vue

@@ -1,14 +0,0 @@
-<template>
-	<el-form label-width="80px" size="small">
-		<AttrEvent :events="events"></AttrEvent>
-	</el-form>
-</template>
-<script lang='ts' setup>
-import { ref, computed, defineEmits } from 'vue';
-import AttrEvent from '../common/attr-event.vue'
-import {getFormComponentOptions} from '../../../../utils/assemblys-config.js'
-defineProps({
-	configure:Object
-});
-const events = ['click', 'change', 'show', 'hidden']
-</script>

package/components/runtime/views/assemblys/form/custom/custom-attr-style.vue

@@ -1,14 +0,0 @@
-<template>
-	<el-form label-width="80px" size="small">
-		<el-collapse v-model="openCollapseItems" style="margin-top:6px;">
-			<AttrStyle :configure="configure"></AttrStyle>
-		</el-collapse>
-	</el-form>
-</template>
-<script lang='ts' setup>
-import { defineProps } from 'vue';
-import AttrStyle from '../common/attr-style.vue'
-defineProps({
-	configure:Object
-});
-</script>

package/components/runtime/views/assemblys/form/custom/custom-attr.vue

@@ -1,28 +0,0 @@
-<template>
-  <div class="amb-design-attr-content">
-    <AttrHeader v-model="currentConfigType" />
-    <div class="amb-design-attr-list">
-      <AttrBase v-show="currentConfigType === 'base'" :configure="configure"></AttrBase>
-      <AttrStyle v-show="currentConfigType === 'style'" :configure="configure"></AttrStyle>
-      <AttrEvent v-show="currentConfigType === 'event'" :configure="configure"></AttrEvent>
-    </div>
-  </div>
-</template>
-<script lang="ts" setup>
-import AttrBase from './custom-attr-base.vue'
-import AttrStyle from './custom-attr-style.vue'
-import AttrHeader from '../common/attr-header.vue'
-import AttrEvent from './custom-attr-event.vue'
-import { ref } from 'vue'
-
-defineProps({
-  configure: {
-    type: Object,
-    default: () => ({ title: 'Text', props: { type: 'input-text' } }) // 设置默认值
-  }
-})
-let currentConfigType = ref('base')
-</script>
-<style>
-/* @import '../../../../../../assets/design-attr.css'; */
-</style>

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

@@ -1,57 +0,0 @@
-<template>
-  <div :class="designClass" :style="designStyle">
-    <el-form-item
-      :required="designProperty.required ? true : false"
-      :class="designClass"
-      :label-width="designProperty.labelWidth"
-      :style="designStyle"
-    >
-      <template #label>
-        <div :style="designHeaderStyle">
-          {{ designProperty.title ? designProperty.title : 'custom' }}
-        </div>
-      </template>
-      <el-button
-        :disabled="designProperty.state === 'disabled' ? true : false"
-        :size="designProperty.size"
-        type="primary"
-      >
-        自定义组件
-      </el-button>
-    </el-form-item>
-  </div>
-</template>
-<script lang="ts" setup>
-import {
-  caculateDetailComponentStyle,
-  caculateComponentProps
-} from '../../../../../../src/utils/form-design-util'
-import { FullScreen } from '@element-plus/icons-vue'
-import { ref, watch } from 'vue'
-const props = defineProps({
-  configure: Object
-})
-//定义自身详细参数
-const designStyle = ref({})
-const designClass = ref('')
-const designHeaderStyle = ref({})
-const designProperty = ref({})
-//监控配置样式的变化
-watch(
-  props.configure.style,
-  () => {
-    caculateDetailComponentStyle(props.configure, designStyle, designClass, designHeaderStyle)
-  },
-  { immediate: true }
-)
-
-//监控配置属性的变化
-watch(
-  props.configure.props,
-  () => {
-    caculateComponentProps(props.configure, designProperty)
-  },
-  { immediate: true }
-)
-</script>
-<style scoped></style>

package/components/runtime/views/assemblys/form/date-picker/datepicker-runtime.vue

@@ -1,80 +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-time-picker
-      v-if="designProperty.dateType == 'time' || designProperty.dateType == 'timerange'"
-      :is-range="designProperty.dateType == 'timerange'"
-      range-separator="-"
-      :clearable="designProperty.clearable"
-      :disabled="designProperty.state === 'disabled'"
-      :readonly="designProperty.state === 'readonly'"
-      :size="designProperty.size"
-      :placeholder="designProperty.placeholder"
-      :start-placeholder="designProperty.placeholder"
-      :end-placeholder="designProperty.endPlaceholder"
-      :format="designProperty.format"
-      v-model="dynamicModelMethod"
-      :shortcuts="designProperty.shortcuts"
-      :type="designProperty.dateType"
-    />
-    <el-date-picker
-      v-else
-      :clearable="designProperty.clearable"
-      :disabled="designProperty.state === 'disabled'"
-      :readonly="designProperty.state === 'readonly'"
-      :size="designProperty.size"
-      :placeholder="designProperty.placeholder"
-      :start-placeholder="designProperty.placeholder"
-      :end-placeholder="designProperty.endPlaceholder"
-      :format="designProperty.format"
-      v-model="dynamicModelMethod"
-      :shortcuts="designProperty.shortcuts"
-      :type="designProperty.dateType"
-    />
-  </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 { getVariableValue, setVariableValue } 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 : {}
-</script>

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

@@ -1,19 +0,0 @@
-<template>
-  <el-form-item :label="configure.title" :label-position="right">
-    <el-date-picker
-        v-model="configure.fieldName"
-        type="date"
-        placeholder="Pick a day"/>
-  </el-form-item>
-</template>
-<script lang='ts' setup>
-    const props = defineProps({
-        configure:Object
-    });
-    if(props.configure.title==undefined){
-        props.configure.title = 'Date or Time';
-    }
-</script>
-<style scoped>
-  
-</style>

package/components/runtime/views/assemblys/form/dept-tree/depttree-runtime.vue

@@ -1,60 +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>
-    <OrganizationInput
-      :disabled="designProperty.state == 'disabled'"
-      :multiple="designProperty.multiple"
-      :treeType="designProperty.treeType"
-      v-model="dataModel[fieldName]"
-      :models="dataModel"
-      :fields="autoSetFields"
-      :size="designProperty.size"
-      placeholder="请选择"
-      :separator="designProperty.separator"
-    ></OrganizationInput>
-  </el-form-item>
-</template>
-<script lang="ts" setup>
-import { ref, watch } from 'vue'
-import type {
-  Component,
-  PageContext
-} from '../../../../../../src/utils/interfaces/page-design-types'
-import { getFormModelFields } from '../../../../../../src/utils/page-init-util'
-import { getVariableValue, setVariableValue } 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 : {}
-if (!entity.data) {
-  entity.data = {}
-}
-const dataModel = entity.data
-//设计时有限制只能选择data
-let dynamicFields: string[] = getFormModelFields(props.pageContext, props.configure)
-const fieldName =
-  dynamicFields.length > 0 ? dynamicFields[dynamicFields.length - 1] : props.configure.uuid
-
-//获取默认的样式及配置
-const runtimeInfo = props.configure.runtime ? props.configure.runtime : {}
-const designProperty = runtimeInfo.props ? runtimeInfo.props : {}
-const runtimeStyle = runtimeInfo.style
-const runtimeClass = runtimeInfo.class
-const headerStyle = runtimeInfo.headerStyle
-
-//关联字段设置
-const autoSetFields = designProperty.autoSetFields ? designProperty.autoSetFields : []
-</script>

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

@@ -1,44 +0,0 @@
-<template>
-  <el-divider
-    :direction="designProperty.direction"
-    :border-style="designProperty.borderType"
-    :content-position="designProperty.titlePosition"
-  >
-    <div :style="headerStyle">
-      {{ dynamicValue }}
-    </div>
-  </el-divider>
-</template>
-<script lang="ts" setup>
-import { computed } from 'vue'
-import type {
-  Component,
-  PageContext
-} from '../../../../../../src/utils/interfaces/page-design-types'
-import { formatVariableValue } from '../../../../../../src/utils/page-helper-util'
-
-//定义的属性对象
-interface MyProps {
-  //页面对象
-  pageContext: PageContext
-  configure: Component
-}
-const props = defineProps<MyProps>()
-
-//定义自身详细参数
-//运行时信息
-const runtimeInfo: any = props.configure.runtime ? props.configure.runtime : {}
-const headerStyle = runtimeInfo.headerStyle
-const designProperty: any = runtimeInfo.props ? runtimeInfo.props : {}
-
-//定义内容
-let contentVariable = designProperty.value
-//显示内容
-const dynamicValue = computed(() => {
-  if (!contentVariable) {
-    return ''
-  }
-  const resultValue = formatVariableValue(props.pageContext, contentVariable)
-  return resultValue == undefined || resultValue == null ? '' : resultValue
-})
-</script>

package/components/runtime/views/assemblys/form/file-picture/picture-design.vue

@@ -1,80 +0,0 @@
-<template>
-    <el-form-item :label="configure.title" :label-position="right">
-        <el-upload
-            v-model:file-list="fileList"
-            action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
-            list-type="picture-card"
-            :on-preview="handlePictureCardPreview"
-            :on-remove="handleRemove"
-        >
-        <el-icon><Plus /></el-icon>
-        </el-upload>
-        <el-dialog v-model="dialogVisible">
-            <img w-full :src="dialogImageUrl" alt="Preview Image" />
-        </el-dialog>
-    </el-form-item>
-</template>
-<script lang='ts' setup>
-    import { ref } from 'vue'
-    import { ElMessage, ElMessageBox } from 'element-plus'
-    import { Plus } from '@element-plus/icons-vue'
-    import type { UploadProps, UploadUserFile } from 'element-plus'
-
-    //配置参数
-    const props = defineProps({
-        configure:Object
-    });
-    if(props.configure.title==undefined){
-        props.configure.title = '';
-    }
-    const dialogImageUrl = ref('')
-    const dialogVisible = ref(false)
-
-    //默认的文件
-    const fileList = ref<UploadUserFile[]>([
-        {
-            name: 'food.jpeg',
-            url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
-        },
-        {
-            name: 'plant-1.png',
-            url: 'https://element-plus.org/images/plant-1.png',
-        },
-        {
-            name: 'food.jpeg',
-            url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
-        },
-        {
-            name: 'plant-2.png',
-            url: 'https://element-plus.org/images/plant-2.png',
-        },
-        {
-            name: 'food.jpeg',
-            url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
-        },
-        {
-            name: 'figure-1.png',
-            url: 'https://element-plus.org/images/figure-1.png',
-        },
-        {
-            name: 'food.jpeg',
-            url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
-        },
-        {
-            name: 'figure-2.png',
-            url: 'https://element-plus.org/images/figure-2.png',
-        },
-      ])
-
-    const handleRemove: UploadProps['onRemove'] = (file, uploadFiles) => {
-    console.log(file, uploadFiles)
-    }
-
-    const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
-        dialogImageUrl.value = uploadFile.url!
-        dialogVisible.value = true
-    }
-</script>
-<style scoped>
-  
-</style>