super-page-runtime 1.0.14 → 1.0.15

package/src/components/runtime/utils/charts/chart-util.ts

@@ -1,37 +0,0 @@
-  import theme1 from '../../../../assets/chart-themes/theme1';
-  import theme2 from '../../../../assets/chart-themes/theme2';
-  import theme3 from '../../../../assets/chart-themes/theme3';
-
-  //缓存主题
-  const themeMap:any = {
-    'theme1':theme1,
-    'theme2':theme2,
-    'theme3':theme3
-  };
-
-  /**
-   * 获取主题对象
-   * @param themeName 获取自定义的主题名称 
-   * @returns 
-   */
-  export function getCustomTheme(themeName:string) {
-    console.log("getdd",themeName);
-    return themeMap[themeName];
-  }
-
-  /**
-   * 获取所有主题对象
-   * @returns 
-   */
-  export function getCustomThemeOptions():Array<any>{
-    return [{
-      value:'theme1',
-      label:'主题1'
-    },{
-      value:'theme2',
-      label:'主题2'
-    },{
-      value:'theme3',
-      label:'主题3'
-    }];
-  }

package/src/components/runtime/utils/container-style-util.ts

@@ -1,223 +0,0 @@
-import type { Component } from "./interfaces/page-design-types";
-/**
- * 生成通用的样式和Class
- */
-export function caculateCommonStyle(configure:Component,commonStyle:any,commonClass:any):void{
-  //清空设置
-  const tempStyle:any = {};
-  let tempClass = '';
-  const thisProps = configure.props?configure.props:{};
-  const thisStyle = configure.style?configure.style:{};
-  const thisSize = thisProps.size?thisProps.size:{};
-  //宽度
-  //固定
-  //默认按100
-  if(thisSize.widthType=='fix'&&thisSize.fixWidth){
-    tempStyle['width']=thisSize.fixWidth;
-    if(!tempStyle['width'].indexOf||tempStyle['width'].indexOf("px")==-1){
-        tempStyle['width'] = tempStyle['width']+"px";
-    }
-  }else{
-    if(thisSize.flexSpan){
-        tempClass += " el-col-"+thisSize.flexSpan;
-    }else{
-        tempClass += " el-col-24";
-    }
-  }
-  //margin
-  //外边距 设计有套一层，在此设置外部的边距
-  if(thisStyle.marginTop){
-    tempStyle['margin-top'] = thisStyle.marginTop+"px";
-  }
-  if(thisStyle.marginRight){
-    tempStyle['margin-right'] = thisStyle.marginRight+"px";
-  }
-  if(thisStyle.marginBottom){
-    tempStyle['margin-bottom'] = thisStyle.marginBottom+"px";
-  }
-  if(thisStyle.marginLeft){
-    tempStyle['margin-left'] = thisStyle.marginLeft+"px";
-  }
-  //高度
-  if(thisSize.fixHeight){
-    tempStyle['height']=thisSize.fixHeight;
-    if(!tempStyle['height'].indexOf||tempStyle['height'].indexOf("px")==-1){
-        tempStyle['height'] = tempStyle['height']+"px";
-    }
-  }
-  //检查是否固定位置
-  const position = thisProps.position;
-  //工具栏位置
-  if(position=='top'||position=='bottom'){
-    //position: -webkit-sticky
-    tempStyle['position'] = 'fixed !important';
-    tempStyle['z-index'] = '1';
-    //找展示容器的位置
-    //const contentObj = document.getElementsByClassName("amb-design-board");
-    const contentObj = [thisRef.value.parentNode];
-    if(contentObj&&contentObj.length>0){
-        const contentRec = contentObj[0].getBoundingClientRect();
-        if(position=='top'){
-            tempStyle['top'] = contentRec.top+"px";
-        }
-        if(position=='bottom'){
-            tempStyle['bottom'] = "10px";
-        }
-    }
-    //宽
-    const thisRec = thisRef.value.getBoundingClientRect();
-    tempStyle['width'] = thisRec.width+"px";
-  }else if(thisStyle.position){
-    //按定位设置
-    tempStyle['position'] = thisStyle.position;
-    if(thisStyle.position!='relative'){
-        //其余需要默认当前的宽度
-        if(!tempStyle['width']){
-            const thisRec = thisRef.value.getBoundingClientRect();
-            tempStyle['width'] = thisRec.width+"px";
-        }
-        if(thisStyle.left){
-            tempStyle['left'] = thisStyle.left+"px";
-        }
-        if(thisStyle.top){
-            tempStyle['top'] = thisStyle.top+"px";
-        }
-    }
-  }
-  commonStyle.value = tempStyle;
-  commonClass.value = tempClass;
-}
-
-/**
- * 样式转换
- * @param configure 
- * @param designStyle 动态样式名
- * @param designClass 动态class
- */
-export function caculateComponentStyle(configure:any,designStyle:any,designClass:any,designHeaderStyle:any):void{
-  //清空设置
-  const tempStyle:any = {};
-  const tempHeaderStyle:any={};
-  let tempClass = '';
-  //从默认值中获取
-  let defineStyle:any = {};
-  if(configure.default&&configure.default.style){
-    Object.assign(defineStyle,configure.default.style);
-  }
-  //设计内容覆盖
-  if(configure.style){
-    for(let pro in configure.style){
-      const proValue = configure.style[pro];
-      if(proValue!=undefined&&proValue!=null&&proValue!=''){
-        defineStyle[pro] = proValue;
-      }
-    }
-  }
-  
-  //加粗
-  if(defineStyle.fontWeight){
-    tempStyle['font-weight'] = 'bold';
-  }
-  //倾斜
-  if(defineStyle.incline){
-    tempStyle['font-style'] = 'italic';
-  }
-  //字号
-  if(defineStyle.fontSize){
-    tempStyle['font-size'] = defineStyle.fontSize;
-  }
-  //颜色
-  if(defineStyle.color){
-    tempStyle['color'] = defineStyle.color;
-  }
-  if(defineStyle.textAlign){
-    tempStyle['text-align'] = defineStyle.textAlign;
-  }
-  //背景颜色
-  if(defineStyle.backgroundColor){
-    tempStyle['background-color'] = defineStyle.backgroundColor;
-  }
-  //背景图片 待设置
-  //内边距
-  if(defineStyle.paddingTop){
-    tempStyle['padding-top'] = defineStyle.paddingTop+"px";
-  }
-  if(defineStyle.paddingRight){
-    tempStyle['padding-right'] = defineStyle.paddingRight+"px";
-  }
-  if(defineStyle.paddingBottom){
-    tempStyle['padding-bottom'] = defineStyle.paddingBottom+"px";
-  }
-  if(defineStyle.paddingLeft){
-    tempStyle['padding-left'] = defineStyle.paddingLeft+"px";
-  }
-  //线宽
-  if(defineStyle.borderWidth&&defineStyle.borderColor){
-    tempStyle['border'] = defineStyle.borderWidth+"px " + (defineStyle.borderType?defineStyle.borderType:"solid") + " " + defineStyle.borderColor;
-    //线框圆角
-    if(defineStyle.radius){
-      tempStyle['border-radius'] = defineStyle.radius+"px";
-    }
-  }
-
-  //阴影
-  if(defineStyle.shadowColor){
-    let shadow = (defineStyle.shadowTop?defineStyle.shadowTop:"0")+"px ";
-    shadow += (defineStyle.shadowRight?defineStyle.shadowRight:"0")+"px ";
-    shadow += (defineStyle.shadowBottom?defineStyle.shadowBottom:"0")+"px ";
-    shadow += (defineStyle.shadowLeft?defineStyle.shadowLeft:"0")+"px ";
-    shadow += defineStyle.shadowColor;
-    tempStyle['box-shadow'] = shadow;
-  }
-
-  //自定义class
-  if(defineStyle.customClass){
-    tempClass += " " + defineStyle.customClass.replace(/;/g,' ');
-  }
-
-  //自定义样式
-  if(defineStyle.customStyle){
-    const strs = defineStyle.customStyle.replace(/[\r\n]/g,'').split(";");
-    for(let index=0;index<strs.length;index++){
-      const ss = strs[index].split(":");
-      if(ss.length>1&&ss[0]&&ss[1]){
-        if(!isNaN(ss[0])){
-          continue;
-        }
-        tempStyle[ss[0]] = ss[1];
-      }
-    }
-  }
-  //标题的样式
-  //加粗
-  if(defineStyle.headerFontWeight){
-    tempHeaderStyle['font-weight'] = "bold";
-  }
-  //倾斜
-  if(defineStyle.headerIncline){
-    tempHeaderStyle['font-style'] = "italic";
-  }
-  //字号
-  if(defineStyle.headerFontSize){
-    tempHeaderStyle['font-size'] = defineStyle.headerFontSize;
-  }
-  //颜色
-  if(defineStyle.headerColor){
-    tempHeaderStyle['color'] = defineStyle.headerColor;
-  }
-  if(defineStyle.headerTextAlign){
-    tempHeaderStyle['text-align'] = defineStyle.headerTextAlign;
-  }else{
-    tempHeaderStyle['text-align'] = "left";
-  }
-  //背景颜色
-  if(defineStyle.headerBackgroundColor){
-    tempHeaderStyle['background-color'] = defineStyle.headerBackgroundColor;
-  }
-
-  designStyle.value = tempStyle;
-  designClass.value = tempClass;
-  if(designHeaderStyle){
-    designHeaderStyle.value = tempHeaderStyle;
-  }
-}

package/src/components/runtime/views/assemblys/button/button/button-runtime.vue

@@ -1,46 +0,0 @@
-<template>
-  <el-button
-    :disabled="designProperty.state === 'disabled'"
-    :class="runtimeClass"
-    :style="runtimeStyle"
-    :type="designProperty.type"
-    :size="designProperty.size"
-    :text="designProperty.text"
-    :round="designProperty.round"
-    :plain="designProperty.plain"
-    @click="handleEvent($event, pageContext, configure, 'click')"
-  >
-    <template v-if="designProperty.title && designProperty.iconPosition == 'right'">
-      {{ designProperty.title }}
-      <template v-if="designProperty.iconValue"> &nbsp; </template>
-    </template>
-    <template v-if="designProperty.iconType && designProperty.iconValue">
-      <SuperIcon
-        :iconType="designProperty.iconType"
-        :iconValue="designProperty.iconValue"
-      ></SuperIcon>
-    </template>
-    <template v-if="designProperty.title && designProperty.iconPosition != 'right'">
-      <template v-if="designProperty.iconValue"> &nbsp; </template>
-      {{ designProperty.title }}
-    </template>
-  </el-button>
-</template>
-<script lang="ts" setup>
-import { SuperIcon } from 'agilebuilder-ui'
-import { ref } from 'vue'
-import type { Component, PageContext } from '../../../../utils/interfaces/page-design-types'
-import { handleEvent } from '../../../../utils/events/event-util'
-
-interface MyProps {
-  pageContext: PageContext
-  configure: Component
-}
-const props = defineProps<MyProps>()
-
-//获取默认的样式及配置
-const runtimeInfo = props.configure.runtime ? props.configure.runtime : {}
-const designProperty = runtimeInfo.props ? runtimeInfo.props : {}
-const runtimeStyle = runtimeInfo.style
-const runtimeClass = runtimeInfo.class
-</script>

package/src/components/runtime/views/assemblys/button/button-group/buttongroup-runtime.vue

@@ -1,27 +0,0 @@
-<template>
-	<el-button-group
-		:class="runtimeClass" 
-		:style="runtimeStyle">
-		<template v-for="(element,itemIndex) in configure.items" :key="element.uuid">
-			<ObjectRender
-				:pageContext="pageContext"
-				:configure="element"></ObjectRender>
-		</template>
-	</el-button-group>
-</template>
-<script lang='ts' setup>
-	import {ref, watch} from 'vue';
-	import ObjectRender from '../../object-render.vue'
-    import type { Component,PageContext} from '@/components/design/utils/interfaces/page-design-types';
-	interface MyProps{
-      pageContext:PageContext,
-      configure:Component
-    }
-    const props = defineProps<MyProps>();
-
-	//自身引用
-    const runtimeInfo = props.configure.runtime?props.configure.runtime:{};
-    //运行时的自身详细参数
-    const runtimeStyle = runtimeInfo.style;
-    const runtimeClass = runtimeInfo.class;
-</script>

package/src/components/runtime/views/assemblys/button/dropdown/dropdown-runtime.vue

@@ -1,85 +0,0 @@
-<template>
-	<el-dropdown
-			:class="runtimeClass" 
-			:style="runtimeStyle"
-			:placement="designProperty.placement"
-			:split-button="designProperty.splitButton"
-			:disabled="designProperty.state === 'disabled'"
-			:type="designProperty.buttonType"
-			:size="designProperty.size"
-			:trigger="designProperty.trigger">
-		<template v-if="designProperty.triggerElement === 'button'">
-			<el-button
-				v-if="!designProperty.splitButton"
-				:size="designProperty.size"
-				:type="designProperty.buttonType">
-				{{designProperty.title}}
-			</el-button>
-			<span v-else>{{designProperty.title}}</span>
-		</template>
-		<el-text v-else>
-			{{designProperty.title}}
-			<el-icon>
-				<ArrowDown />
-			</el-icon>
-		</el-text>
-		<template #dropdown>
-			<el-dropdown-menu>
-				<el-dropdown-item v-for="(item,index) in listOptions" :key="item">{{item.label}}</el-dropdown-item>
-			</el-dropdown-menu>
-		</template>
-	</el-dropdown>
-</template>
-<script lang='ts' setup>
-	import { ArrowDown } from '@element-plus/icons-vue'
-	import {ref,computed} from 'vue';
-	import type { Component,PageContext} from '../../../../utils/interfaces/page-design-types';
-	import {formatVariableValue} from '../../../../utils/page-helper-util';
-
-	//定义的属性对象
-    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;
-	const designProperty:any =  runtimeInfo.props?runtimeInfo.props:{};
-	
-	//菜单数据
-	let listOptions:any = null;
-	//检查数据源
-	const dataOrigin = props.configure.props&&props.configure.props.dataOrigin?props.configure.props.dataOrigin:{};
-	const valueType = dataOrigin.optionValueSetType;
-	//绑定变量时，重新设置
-	if(valueType=='variable'){
-		listOptions = computed(()=>{
-			let options:any;
-			const menuValues:any = formatVariableValue(props.pageContext,designProperty.menuField);
-			if(menuValues&&Array.isArray(menuValues)){
-				options = menuValues;
-				for(let i=0;i<options.length;i++){
-					const option = options[i];
-					if(!option.label){
-						option.label = i+1;
-					}
-				}
-			}else{
-				const strs = (menuValues?(menuValues+''):'').trim().split(",");
-				options = [];
-				for(let str of strs){
-					options.push({
-						value:str,
-						label:str
-					});
-				}
-			}
-			return options;
-		});
-	}else{
-		listOptions = ref(designProperty.options?designProperty.options:[]);
-	}
-</script>

package/src/components/runtime/views/assemblys/chart/column-line/column-line-runtime.vue

@@ -1,61 +0,0 @@
-<template>
-    <div
-        :style="runtimeStyle"
-        :class="runtimeClass"
-        class="amb-widget-chart"
-        ref="thisRef">
-        <v-chart ref="chartRef" :theme="customTheme" :option="chartOption" autoresize />
-    </div>
-</template>
-<script lang='ts' setup>
-    import {ref} from 'vue';
-    import {getCustomTheme} from '../../../../utils/charts/chart-util';
-    import type { Component,PageContext} from '../../../../utils/interfaces/page-design-types';
-
-    import { use } from 'echarts/core';
-    import { CanvasRenderer } from 'echarts/renderers';
-    import {LineChart,BarChart} from 'echarts/charts';
-
-    import {
-      GridComponent,
-      LegendComponent,
-      TitleComponent,
-      TooltipComponent,
-      ToolboxComponent,
-      DataZoomComponent
-    } from 'echarts/components';
-
-    //统计图
-    use([
-      CanvasRenderer,
-      LineChart,
-      GridComponent,
-      LegendComponent,
-      TitleComponent,
-      TooltipComponent,
-      BarChart,
-      ToolboxComponent,
-      DataZoomComponent
-    ]);
-    import VChart from 'vue-echarts';
-    
-
-    interface MyProps{
-      pageContext:PageContext,
-      configure:Component
-    }
-    const props = defineProps<MyProps>();
-    //自身引用
-    const thisRef = ref(null);
-    const runtimeInfo = props.configure.runtime?props.configure.runtime:{};
-    //运行时的自身详细参数
-    const runtimeStyle = runtimeInfo.style;
-    const runtimeClass = runtimeInfo.class;
-    
-    const chartOption:any = runtimeInfo.chartOption;
-    console.log("chartOption-runtime",chartOption)
-
-    //自定义主题
-    const configureProps = props.configure.props?props.configure.props:{};
-    const customTheme:any = getCustomTheme(configureProps.customTheme);
-</script>

package/src/components/runtime/views/assemblys/chart/common/common-attr-assistant.vue

@@ -1,32 +0,0 @@
-<template>
-    <el-collapse-item
-            title="辅助功能"  
-            name="propsAssistant"
-            class="amb-design-attr-group-header">
-        <div style="padding:8px 0px 0px 0px;margin-bottom:-35px;">
-        <el-row>
-            <el-col :span=12>
-            <el-form-item
-                    label="下载按钮">
-                    <el-switch v-model="configure.props.enableDownloadBtn"/>
-            </el-form-item>
-            </el-col>
-            <el-col :span=12>
-            <el-form-item
-                label="数据按钮">
-                <el-switch v-model="configure.props.enableDataBtn"/>
-            </el-form-item>
-            </el-col>
-        </el-row>
-        </div>
-    </el-collapse-item>
-</template>
-<script lang='ts' setup>
-    defineProps({
-        configure:{
-            type:Object,
-            required:true
-        }
-    });
-</script>
-

package/src/components/runtime/views/assemblys/chart/common/common-attr-base.vue

@@ -1,60 +0,0 @@
-<template>
-    <el-collapse-item
-              title="基本"  
-              name="propsBase"
-              class="amb-design-attr-group-header">
-        <div style="padding:8px 0px 0px 0px;">
-            <el-form-item label="组件类型" style="margin-top:4px;">
-            <el-text>{{configure.label}}({{configure.name}})</el-text>
-            </el-form-item>
-            <el-form-item
-                label="组件名" style="margin-top:-10px;">
-                <el-text>{{configure.props.refId}}</el-text>
-            </el-form-item>
-            <el-form-item
-                label="主标题" style="margin-top:-10px">
-                <el-input v-model="configure.props.title" placeholder="请输入">
-                </el-input>
-            </el-form-item>
-            <el-form-item
-                label="副标题" style="margin-top:-10px">
-                <el-input v-model="configure.props.subTitle" placeholder="请输入">
-                </el-input>
-            </el-form-item>
-            <el-form-item
-                v-show="chartType=='columnLine'"
-                label="条形图" style="margin-top:-10px">
-                <el-switch v-model="configure.props.isBar"/>
-            </el-form-item>
-            <el-form-item
-                label="主题" style="margin-top:-10px">
-                <el-radio-group v-model="configure.props.theme">
-                <el-radio-button value="default">默认</el-radio-button>
-                <el-radio-button value="dark">暗黑</el-radio-button>
-                </el-radio-group>
-            </el-form-item>
-            <el-form-item
-                label="定时刷新" style="margin-top:-10px">
-                <el-input v-model="configure.props.refreshInterval">
-                    <template #suffix>
-                    秒
-                    </template>
-                </el-input>
-            </el-form-item>
-            <el-form-item
-                label="状态" style="margin-top:-10px;margin-bottom:-10px;">
-                <el-radio-group v-model="configure.props.state">
-                <el-radio-button value="show">显示</el-radio-button>
-                <el-radio-button value="hide">隐藏</el-radio-button>
-                </el-radio-group>
-            </el-form-item>
-        </div>
-    </el-collapse-item>
-</template>
-<script lang='ts' setup>
-    defineProps({
-        configure:Object,
-        chartType:Object
-    });
-</script>
-

package/src/components/runtime/views/assemblys/chart/common/common-attr-drill.vue

@@ -1,39 +0,0 @@
-<template>
-    <el-collapse-item
-            title="数据钻取"  
-            name="propsDrill"
-            class="amb-design-attr-group-header">
-        <div style="padding:8px 0px 0px 0px;">
-            <el-form-item
-                label="开启" style="margin-top:0px;margin-bottom:-15px;">
-                <el-switch v-model="configure.props.enableDrill"/>
-            </el-form-item>
-            <el-form-item
-                v-show="configure.props.enableDrill"
-                label="钻取顺序" style="margin-top:20px;margin-bottom:10px;">
-                <el-input 
-                v-model="configure.props.drillOrders"
-                placeholder="请输入"></el-input>
-                <el-text type="success" size="small">逗号隔开,第一层为统计纬度</el-text>
-            </el-form-item>
-            <el-form-item
-                v-show="configure.props.enableDrill"
-                label="显示位置" style="margin-top:-10px;margin-bottom:-15px;">
-                <el-radio-group v-model="configure.props.drillLabelAlign">
-                    <el-radio-button value="left">左</el-radio-button>
-                    <el-radio-button value="center">中</el-radio-button>
-                    <el-radio-button value="right">右</el-radio-button>
-                </el-radio-group>
-            </el-form-item>
-        </div>
-    </el-collapse-item>
-</template>
-<script lang='ts' setup>
-    defineProps({
-        configure:{
-            required:true,
-            type:Object
-        }
-    });
-</script>
-