super-page-runtime 1.0.15 → 1.0.16

package/components/runtime/views/assemblys/data/component/formatting.vue

@@ -0,0 +1,200 @@
+<template>
+	<el-dialog
+			model-value
+			title="格式设置"
+			width="40%"
+			:before-close="beforeClose"
+	>
+		<el-form v-model="formData" label-width="140px">
+			<el-form-item label="格式化分类" class="amb-design-attr-item">
+				<el-select v-model="formData.type" placeholder="请选择">
+					<el-option label="数值" value="number"/>
+					<el-option label="货币" value="currency"/>
+					<el-option label="日期" value="date"/>
+					<el-option label="时间" value="time"/>
+					<el-option label="百分比" value="percent"/>
+					<el-option label="自定义控件" value="customControl"/>
+					<el-option label="超链接" value="hyperlinks"/>
+					<el-option label="图标/标签" value="icon"/>
+					<el-option label="附件控件" value="files"/>
+					<el-option label="富文本" value="richEditor"/>
+					<el-option label="脱敏组件" value="secretInfo"/>
+					<el-option label="自定义方法" value="custom"/>
+				</el-select>
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'number'|| formData.type === 'currency'|| formData.type === 'percent'"  label="小数位数" class="amb-design-attr-item">
+				<el-input v-model="formData.decimalDigit" />
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'number'" label="科学计数" class="amb-design-attr-item">
+				<el-switch
+						v-model="formData.scientific"
+						active-text="使用"
+						inactive-text="不使用"
+				/>
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'number'" label="科学计数位数" class="amb-design-attr-item">
+				<el-input v-model="formData.scientificNum" />
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'number'" label="千位分隔符" class="amb-design-attr-item">
+				<el-switch
+						v-model="formData.thousandsSeparator"
+						active-text="使用"
+						inactive-text="不使用"
+				/>
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'number'" label="数值符号" class="amb-design-attr-item">
+				<el-input v-model="formData.symbol" />
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'currency'" label="货币符号" class="amb-design-attr-item">
+				<el-select v-model="formData.currencySymbol" placeholder="Select">
+					<el-option label="$" value="$"/>
+					<el-option label="￥" value="￥"/>
+				</el-select>
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'date'" label="日期类型" class="amb-design-attr-item">
+				<el-select v-model="formData.dataType" placeholder="Select">
+					<el-option label="yyyy-m-d" value="yyyy-m-d"/>
+					<el-option label="yyyy-m-d hh:mm:ss" value="yyyy-m-d hh:mm:ss"/>
+					<el-option label="yyyy-m" value="yyyy-m"/>
+					<el-option label="m-d" value="m-d"/>
+					<el-option label="yyyy" value="yyyy"/>
+					<el-option label="yyyy年m月d日" value="yyyy年m月d日"/>
+					<el-option
+							label="yyyy年m月d日hh时mm分ss秒"
+							value="yyyy年m月d日hh时mm分ss秒"
+					/>
+					<el-option label="yyyy年m月" value="yyyy年m月"/>
+					<el-option label="m月d日" value="m月d日"/>
+				</el-select>
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'time'" label="时间类型" class="amb-design-attr-item">
+				<el-select v-model="formData.timeType" placeholder="Select">
+					<el-option label="HH:mm" value="HH:mm"/>
+					<el-option label="HH:mm:ss" value="HH:mm:ss"/>
+					<el-option label="HH时mm分" value="HH时mm分"/>
+					<el-option label="HH时mm分ss秒" value="HH时mm分ss秒"/>
+					<el-option label="hh:mm" value="hh:mm"/>
+					<el-option label="hh:mm:ss" value="hh:mm:ss"/>
+					<el-option label="hh时mm分" value="hh时mm分"/>
+					<el-option label="hh时mm分ss秒" value="hh时mm分ss秒"/>
+				</el-select>
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'customControl'" label="自定义控件" class="amb-design-attr-item">
+				<el-input v-model="formData.customControl" />
+			</el-form-item>
+			<Suffixmodule v-if="formData.type === 'hyperlinks'" :suffixModule="formData.suffixModule"></Suffixmodule>
+			<el-form-item v-if="formData.type === 'icon'" label="图标" class="amb-design-attr-item">
+				<IconSetDialog v-model:modelValue="formData.icon" />
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'icon'" label="图标位置" class="amb-design-attr-item">
+				<el-switch
+						v-model="formData.position"
+						active-text="后缀"
+						inactive-text="前缀"
+						active-value="suf"
+						inactive-value="pre"
+				/>
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'icon'" label="回调事件" class="amb-design-attr-item">
+				<el-input v-model="formData.event" />
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'custom'" label="自定义方法" class="amb-design-attr-item">
+				<el-input v-model="formData.customControl" />
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'files'" label="是否多选">
+				<el-switch v-model="formData.multiple"/>
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'files'" label="接受上传的文件类型">
+				<el-input v-model="formData.accept"   />
+			</el-form-item>
+			<el-form-item v-if="formData.type === 'files'" label="文件限制大小(M)">
+				<el-input-number
+						v-model="formData.limitFileSize"
+						:min="1"
+				/>
+			</el-form-item>
+			<el-form-item
+					v-if="formData.type === 'files' && formData.multiple"
+					label="选择数据表"
+			>
+				<el-input
+						v-model="formData.childAnnexDataTableCode"
+						@click="openSelectDataTable"
+						clearable
+				>
+					<template #append>
+						<el-button :icon="Search" @click="openSelectDataTable" />
+					</template>
+				</el-input>
+			</el-form-item>
+			<el-form-item
+					v-if="formData.type === 'files'"
+					label="展示名称对应字段"
+			>
+				<el-select v-model="formData.showName" filterable   >
+					<el-option label="1" value="1"
+					/>
+				</el-select>
+			</el-form-item>
+			<el-form-item
+					v-if="formData.type === 'files'"
+					label="服务器名称对应字段"
+			>
+				<el-select v-model="formData.serverName" filterable   >
+					<el-option label="time" value="time"/>
+				</el-select>
+			</el-form-item>
+		</el-form>
+		<selectDataTable
+				@add="addSelectDataTable"
+				@close="closeSelectDataTable"
+				v-if="selectDataTableVisible" />
+		<template #footer>
+			<div class="dialog-footer">
+				<el-button @click="$emit('close')">取消</el-button>
+				<el-button type="primary" @click="addData">确认
+				</el-button>
+			</div>
+		</template>
+	</el-dialog>
+</template>
+
+<script lang="ts" setup>
+import Suffixmodule from '../../form/common/suffixmodule.vue'
+import IconSetDialog from '../../form/common/icon-set-dialog.vue'
+import selectDataTable from './select-data-table.vue'
+import { Search} from '@element-plus/icons-vue'
+import {ref} from "vue";
+
+const props = defineProps({
+	formatting:{
+		type:Object,
+		default:{}
+	},
+})
+const emit = defineEmits(['close','add'])
+const formData = ref({})
+formData.value = props.formatting
+
+function addData(){
+	emit('add',formData.value)
+	emit('close')
+}
+
+function beforeClose(){
+	emit('close')
+}
+
+function openSelectDataTable() {
+	selectDataTableVisible.value = true
+}
+
+const selectDataTableVisible = ref(false)
+function closeSelectDataTable() {
+	selectDataTableVisible.value = false
+}
+function addSelectDataTable(selectCode:string) {
+	 formData.value.childAnnexDataTableCode = selectCode
+}
+
+</script>

package/components/runtime/views/assemblys/data/component/in-parameter.vue

@@ -0,0 +1,56 @@
+<template>
+	<el-collapse-item
+			title="入参"
+			name="parameter"
+			class="amb-design-attr-group-header">
+		<div style="padding:8px 0px 0px 0px;">
+			<el-form-item label="入参" class="amb-design-attr-item">
+				<el-button @click="parameterVisible = true" type="primary">查看</el-button>
+			</el-form-item>
+			<slot name="body" :row="parameter"></slot>
+		</div>
+		<el-dialog
+				v-model="parameterVisible"
+				title="入参"
+		>
+			<el-table border highlight-current-row @current-change="handleCurrentChange" :data="parameter.parameterList" style="width: 100%">
+				<el-table-column align="center" type="index" label="序号" width="80" />
+				<el-table-column align="center" prop="code" label="参数名" />
+				<el-table-column align="center" prop="required" label="必填" />
+				<el-table-column align="center" prop="name" label="取值" />
+			</el-table>
+			<template #footer>
+				<div class="dialog-footer">
+					<el-button @click="parameterVisible = false">取消</el-button>
+					<el-button type="primary" @click="parameterVisible = false">
+						确定
+					</el-button>
+				</div>
+			</template>
+		</el-dialog>
+	</el-collapse-item>
+</template>
+
+<script lang="ts" setup>
+import {ref} from "vue";
+
+
+const props = defineProps({
+	parameter: {
+		type:Object,
+		default:{
+			parameterList:[]
+		}
+	},
+});
+
+const parameterVisible = ref(false)
+
+function handleCurrentChange() {
+
+}
+</script>
+
+<style scoped>
+
+</style>

package/components/runtime/views/assemblys/data/component/querySetting.vue

@@ -0,0 +1,52 @@
+<template>
+	<el-dialog
+			model-value
+			title="查询设置"
+			width="600"
+			:before-close="beforeClose"
+	>
+		<el-form v-model="selectQuerySetting" label-width="150">
+			<el-form-item label="查询设置控件宽度">
+				<el-input v-model="selectQuerySetting.width" placeholder="请输入" />
+			</el-form-item>
+			<el-form-item label="查询设置Label宽度">
+				<el-input v-model="selectQuerySetting.labelWidth" placeholder="请输入" />
+			</el-form-item>
+			<el-form-item label="查询设置显示宽度">
+				<el-input v-model="selectQuerySetting.label" placeholder="请输入" />
+			</el-form-item>
+		</el-form>
+		<template #footer>
+			<div class="dialog-footer">
+				<el-button @click="$emit('close')">取消</el-button>
+				<el-button type="primary" @click="addData">确认
+				</el-button>
+			</div>
+		</template>
+	</el-dialog>
+</template>
+
+<script lang="ts" setup>
+import Suffixmodule from '../../form/common/suffixmodule.vue'
+import IconSetDialog from '../../form/common/icon-set-dialog.vue'
+import {ref} from "vue";
+
+const props = defineProps({
+	formatting:{
+		type:Object,
+		default:{}
+	},
+})
+const emit =defineEmits(['close','add'])
+const selectQuerySetting = ref({})
+selectQuerySetting.value = props.formatting
+
+function addData(){
+	emit('add',selectQuerySetting.value)
+	emit('close')
+}
+
+function beforeClose(){
+	emit('close')
+}
+</script>

package/components/runtime/views/assemblys/data/component/return-set-table.vue

@@ -0,0 +1,91 @@
+<template>
+	<el-dialog
+			model-value
+			title="组合条件"
+			width="70%"
+			append-to-body
+			@before-close="() =>{$emit('close')}"
+	>
+		<el-row style="padding-bottom: 8px">
+			<el-button
+					:icon="CirclePlus"
+					plain
+					type="primary"
+					@click="add"
+			>
+				添加
+			</el-button>
+			<el-button
+					:icon="Delete"
+					plain
+					type="primary"
+					@click="remove"
+			>
+				删除
+			</el-button>
+		</el-row>
+		<el-table highlight-current-row @current-change="handleCurrentChange" :data="list" style="width: 100%">
+			<el-table-column type="index" align="center" label="序号"/>
+			<el-table-column prop="date" align="center" label="返回字段">
+				<template #default="scope">
+					<el-select
+							v-model="scope.row.returnName"
+							clearable
+							size="default"
+					>
+						<el-option label="字段1" value="1"/>
+						<el-option label="字段2" value="2"/>
+					</el-select>
+				</template>
+			</el-table-column>
+			<el-table-column prop="name" align="center" label="设置到">
+				<template #default="scope">
+					<el-select
+							v-model="scope.row.setName"
+							clearable
+							size="default"
+					>
+						<el-option label="字段1" value="1"/>
+						<el-option label="字段2" value="2"/>
+					</el-select>
+				</template>
+			</el-table-column>
+		</el-table>
+		<template #footer>
+			<div class="dialog-footer">
+				<el-button @click="$emit('close')">取消</el-button>
+				<el-button type="primary" @click="$emit('close')">确定</el-button>
+			</div>
+		</template>
+	</el-dialog>
+</template>
+
+<script setup lang="ts">
+import {CirclePlus,Delete} from '@element-plus/icons-vue'
+import {ref} from "vue";
+const props = defineProps({
+	list:Array
+});
+const $emit = defineEmits(['remove'])
+const currentRow = ref({})
+
+function remove(){
+	$emit('remove',currentRow.value)
+}
+
+function handleCurrentChange(val){
+	currentRow.value = val
+}
+
+function add(){
+	props.list.push({
+		returnName:'',
+		setName:'',
+	})
+}
+
+function confirm(){
+
+}
+</script>
+

package/components/runtime/views/assemblys/data/component/row-backgroud-color.vue

@@ -0,0 +1,58 @@
+<template>
+	<div class="row-backgroud-header-tittle">
+		<div>判断条件</div>
+		<div>{{ showStyleTittle?'显示的样式':'' }}</div>
+	</div>
+	<div v-for="(item,index) in list" :key="index">
+		<el-input v-model="item.condition" style="margin-top: 8px" class="amb-design-attr-item" />
+		<el-input
+				v-model="item.style"
+				:autosize="{ minRows: 4 }"
+				class="amb-design-attr-item"
+				type="textarea"
+				placeholder="Please input"
+		/>
+		<div>
+			<el-icon style="width: 100%">
+				<Plus @click="addOrgFieldsItem" />
+				<Minus @click="reomveOrgFieldsItem(index)" />
+			</el-icon>
+		</div>
+	</div>
+	<el-icon v-if="!list ||list.length === 0" style="width: 100%">
+		<Plus @click="addOrgFieldsItem" />
+	</el-icon>
+</template>
+
+<script lang="ts" setup>
+import {Plus,Minus} from '@element-plus/icons-vue'
+const props = defineProps({
+	list:{
+		type:Array,
+		default:[]
+	},
+	showStyleTittle:{
+		type:Boolean,
+		default:true
+	}
+});
+
+function addOrgFieldsItem(){
+	props.list.push({type:'',model:''})
+}
+
+function reomveOrgFieldsItem(index:number) {
+	props.list.splice(index,1)
+}
+</script>
+
+<style scoped>
+.row-backgroud-header-tittle{
+	display: flex;
+	justify-content: space-between;
+	text-align: center
+}
+.row-backgroud-header-tittle > div{
+	width: 100%
+}
+</style>

package/components/runtime/views/assemblys/data/component/select-data-table.vue

@@ -0,0 +1,86 @@
+<template>
+	<el-dialog
+			model-value
+			title="选择数据表"
+			width="45%"
+			append-to-body
+			:before-close="() =>{$emit('close')}"
+	>
+		<el-form class="form" :model="queryForm" inline label-width="90">
+			<el-row>
+				<el-col :span="8">
+					<el-form-item label="数据表名">
+						<el-input v-model="queryForm.name" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="8">
+					<el-form-item label="数据表别名">
+						<el-input v-model="queryForm.name" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="8" style="text-align: center">
+					<el-button type="primary">查询</el-button>
+					<el-button>重置</el-button>
+				</el-col>
+			</el-row>
+		</el-form>
+		<el-table class="table" :data="tableData" @selection-change="handleSelectionChange" style="width: 100%;margin: 30px 0;">
+			<el-table-column type="selection" width="55" />
+			<el-table-column type="index" label="序号" />
+			<el-table-column prop="name" label="数据表名" />
+			<el-table-column prop="alias" label="数据表别名" />
+		</el-table>
+		<div style="display: flex;justify-content: flex-end">
+			<el-pagination
+					v-model:current-page="queryForm.page"
+					v-model:page-size="queryForm.pageSize"
+					:page-sizes="[10, 20, 40, 60]"
+					background
+					small
+					layout="total, sizes, prev, pager, next, jumper"
+					:total="400"
+					@change="queryList"
+			/>
+		</div>
+		<template #footer>
+			<div class="dialog-footer">
+				<el-button size="default" @click="$emit('close')">取消</el-button>
+				<el-button size="default" type="primary" @click="confirm">
+					确定
+				</el-button>
+			</div>
+		</template>
+	</el-dialog>
+</template>
+
+<script setup lang="ts">
+
+import {ref} from "vue";
+const emit = defineEmits(['add','close'])
+
+const queryForm = ref({})
+const tableData = ref([{name:'222',alias:'11',code:'TEST_CODE'}])
+const selectData = ref([])
+
+function queryList() {
+
+}
+
+function handleSelectionChange(newSelection: any[]) {
+	selectData.value = newSelection
+}
+
+function confirm() {
+	if (selectData.value.length > 0){
+		emit('add',selectData.value[0].code)
+	}else {
+		emit('add','')
+	}
+	emit('close')
+}
+
+</script>
+
+<style scoped>
+
+</style>