super-page-runtime 1.0.15 → 1.0.16

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

@@ -0,0 +1,147 @@
+<template>
+	<el-button type="primary" @click="dialogVisible = true">编辑</el-button>
+	<el-dialog
+			v-model="dialogVisible"
+			title="显示判断条件"
+	>
+		<el-row style="padding-bottom: 8px">
+			<el-button
+					:icon="ElIconCirclePlusOutline"
+					plain
+					type="primary"
+					@click="add"
+			>
+				添加
+			</el-button>
+			<el-button
+					:icon="ElIconDelete"
+					plain
+					type="primary"
+					@click="remove"
+			>
+				删除
+			</el-button>
+		</el-row>
+		<el-table border highlight-current-row @current-change="handleCurrentChange" :data="list" style="width: 100%">
+			<el-table-column prop="date" label="(" width="180">
+				<template #default="scope">
+					<el-select
+							v-model="scope.row.leftBracket"
+							clearable
+							size="default"
+					>
+						<el-option label="" value=""/>
+						<el-option label="(" value="("/>
+						<el-option label="((" value="(("/>
+						<el-option label="(((" value="((("/>
+					</el-select>
+				</template>
+			</el-table-column>
+			<el-table-column prop="name" label="字段名(*)" width="180">
+				<template #default="scope">
+					<el-select
+							v-model="scope.row.propName"
+							clearable
+							size="default"
+					>
+						<el-option label="名字1" value="1"/>
+						<el-option label="名字2" value="2"/>
+						<el-option label="名字3" value="3"/>
+					</el-select>
+				</template>
+			</el-table-column>
+			<el-table-column prop="address" label="操作符">
+				<template #default="scope">
+					<el-select
+							v-model="scope.row.operator"
+							clearable
+							size="default"
+					>
+						<el-option label="操作符1" value="1"/>
+						<el-option label="操作符1" value="2"/>
+						<el-option label="操作符1" value="3"/>
+					</el-select>
+				</template>
+			</el-table-column>
+			<el-table-column prop="address" label="值(*)">
+				<template #default="scope">
+					<el-select
+							v-model="scope.row.propValueType"
+							clearable
+							size="default"
+					>
+						<el-option label="值1" value="1"/>
+						<el-option label="值2" value="2"/>
+						<el-option label="值3" value="3"/>
+					</el-select>
+				</template>
+			</el-table-column>
+			<el-table-column prop="address" label=")">
+				<template #default="scope">
+					<el-select
+							v-model="scope.row.rightBracket"
+							clearable
+							size="default"
+					>
+						<el-option label="" value=""/>
+						<el-option label=")" value=")"/>
+						<el-option label="))" value="))"/>
+						<el-option label=")))" value=")))"/>
+					</el-select>
+				</template>
+			</el-table-column>
+			<el-table-column prop="address" label="并且/或者">
+				<template #default="scope">
+					<el-select
+							v-model="scope.row.joinSign"
+							clearable
+							size="default"
+					>
+						<el-option
+								label="或者"
+								value="or"
+						/>
+						<el-option label="并且" value="and"/>
+					</el-select>
+				</template>
+			</el-table-column>
+		</el-table>
+		<template #footer>
+			<div class="dialog-footer">
+				<el-button @click="dialogVisible = false">取消</el-button>
+				<el-button type="primary" @click="dialogVisible = false">
+					确定
+				</el-button>
+			</div>
+		</template>
+	</el-dialog>
+</template>
+
+<script setup lang="ts">
+import {ref} from "vue";
+const props = defineProps({
+	list:Object
+});
+const dialogVisible = ref(false)
+const currentRow = ref({})
+function remove(){
+	props.list = props.list.filter(item => item !== currentRow.value)
+}
+function handleCurrentChange(val){
+	currentRow.value = val
+}
+function add(){
+	props.list.push({
+		leftBracket:'',
+		propName:'',
+		operator:'',
+		propValueType:'',
+		rightBracket:'',
+		joinSign:''
+	})
+}
+</script>
+
+<style scoped>
+
+</style>

package/components/runtime/views/assemblys/form/common/data-origin.vue

@@ -0,0 +1,81 @@
+<template>
+	<el-collapse-item
+			title="数据源"
+			name="dataOrigin"
+			class="amb-design-attr-group-header">
+		<div style="padding:8px 0px 0px 0px;">
+			<el-form-item label="数据来源" class="amb-design-attr-item">
+				<el-radio-group v-model="dataOrigin.optionValueSetType">
+					<el-radio value="static">静态数据</el-radio>
+					<el-radio value="optionGroup" style="margin-right: 0px">选项组</el-radio>
+					<el-radio value="dataTable">数据表/视图</el-radio>
+					<el-radio value="service">服务</el-radio>
+				</el-radio-group>
+			</el-form-item>
+			<RowUlLi
+					v-if="dataOrigin.optionValueSetType === 'static'"
+					type="input"
+					leftTittle="编码"
+					rightTittle="显示名称"
+					:list="dataOrigin.staticState" />
+			<el-form-item v-show="dataOrigin.optionValueSetType === 'optionGroup'" label="选项组名" class="amb-design-attr-item">
+				<dataoriginInputtable v-model:modelValue="dataOrigin.optionGroup"></dataoriginInputtable>
+			</el-form-item>
+			<el-form-item v-show="dataOrigin.optionValueSetType === 'dataTable'" label="数据表视图" class="amb-design-attr-item">
+				<dataoriginInputtable v-model:modelValue="dataOrigin.dataTable"></dataoriginInputtable>
+			</el-form-item>
+			<el-form-item v-show="dataOrigin.optionValueSetType === 'dataTable'" label="值格式化" class="amb-design-attr-item">
+				<dataoriginInputtable v-model:modelValue="dataOrigin.formatting"></dataoriginInputtable>
+			</el-form-item>
+			<el-form-item v-show="dataOrigin.optionValueSetType === 'dataTable'" label="名格式化" class="amb-design-attr-item">
+				<el-input v-model="dataOrigin.optionProp" placeholder="请输入" />
+			</el-form-item>
+			<el-form-item v-show="dataOrigin.optionValueSetType === 'dataTable'" label="排序1" class="amb-design-attr-item">
+				<div class="amb-design-attr-item-inline">
+					<el-select v-model="dataOrigin.sortOneField"  placeholder="请选择">
+						<el-option label="1" value="1"></el-option>
+					</el-select>
+					<el-select v-model="dataOrigin.sortOneWay" style="margin-left: 10px" placeholder="请选择">
+						<el-option label="1" value="1"></el-option>
+					</el-select>
+				</div>
+			</el-form-item>
+			<el-form-item v-show="dataOrigin.optionValueSetType === 'dataTable'" label="排序2" class="amb-design-attr-item">
+				<div class="amb-design-attr-item-inline">
+					<el-select v-model="dataOrigin.sortTwoField"  placeholder="请选择">
+						<el-option label="1" value="1"></el-option>
+					</el-select>
+					<el-select v-model="dataOrigin.sortTwoWay" style="margin-left: 10px" placeholder="请选择">
+						<el-option label="1" value="1"></el-option>
+					</el-select>
+				</div>
+			</el-form-item>
+			<el-form-item v-show="dataOrigin.optionValueSetType === 'dataTable'" label="显示数量" class="amb-design-attr-item">
+				<el-input v-model="dataOrigin.displayQuantity" placeholder="请输入" />
+			</el-form-item>
+			<el-form-item v-show="dataOrigin.optionValueSetType === 'dataTable'" label="过滤条件" class="amb-design-attr-item">
+				<condition :list="dataOrigin.filterList"></condition>
+			</el-form-item>
+			<el-form-item v-show="dataOrigin.optionValueSetType === 'service'" label="服务名" class="amb-design-attr-item">
+				<dataoriginInputtable v-model:modelValue="dataOrigin.serveName"></dataoriginInputtable>
+			</el-form-item>
+			<el-form-item v-show="remote && (dataOrigin.optionValueSetType === 'dataTable' || dataOrigin.optionValueSetType === 'service')" label="模糊查询" class="amb-design-attr-item">
+				<el-radio-group v-model="dataOrigin.remote" class="ml-4">
+					<el-radio :value="false">否</el-radio>
+					<el-radio :value="true">是</el-radio>
+				</el-radio-group>
+			</el-form-item>
+		</div>
+	</el-collapse-item>
+</template>
+
+<script setup lang="ts">
+import dataoriginInputtable from './dataorigin-input-table.vue'
+import condition from './condition.vue'
+import RowUlLi from './row-ul-li.vue'
+const props = defineProps({
+	dataOrigin:Object,
+	remote:Boolean, // 是否模糊查询
+});
+</script>
+

package/components/runtime/views/assemblys/form/common/data-orign-in-parameter.vue

@@ -0,0 +1,64 @@
+<template>
+	<el-collapse-item
+			title="入参"
+			name="inparameter"
+			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>
+			<el-form-item label="数据集字段" class="amb-design-attr-item">
+				<el-select v-model="inParameter.dataSet" placeholder="请选择">
+					<el-option label="1" value="1"></el-option>
+				</el-select>
+			</el-form-item>
+			<el-form-item label="值字段" class="amb-design-attr-item">
+				<el-select v-model="inParameter.dataSetValue" placeholder="请选择">
+					<el-option label="1" value="1"></el-option>
+				</el-select>
+			</el-form-item>
+			<el-form-item label="名字段" class="amb-design-attr-item">
+				<el-select v-model="inParameter.dataSetName" placeholder="请选择">
+					<el-option label="1" value="1"></el-option>
+				</el-select>
+			</el-form-item>
+		</div>
+		<el-dialog
+				v-model="parameterVisible"
+				title="入参"
+		>
+			<el-table border highlight-current-row @current-change="handleCurrentChange" :data="inParameter.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 setup lang="ts">
+import {ref} from "vue";
+
+const props = defineProps({
+	inParameter:Object,
+});
+
+const parameterVisible = ref(false)
+
+function handleCurrentChange() {
+
+}
+</script>
+
+<style scoped>
+
+</style>

package/components/runtime/views/assemblys/form/common/dataorigin-input-table.vue

@@ -0,0 +1,106 @@
+<template>
+	<el-input
+		v-model="inputValue"
+		placeholder="请选择"
+		@click="inputClick"
+	>
+		<template #suffix>
+			<el-icon @click="inputClick"><search /></el-icon>
+		</template>
+	</el-input>
+	<el-dialog
+			v-model="dialogVisible"
+			title="Tips"
+			width="500"
+	>
+		<el-table :data="tableData" style="width: 100%" @selection-change="handleSelectionChange">
+			<el-table-column type="selection" width="55" />
+			<el-table-column prop="date" label="Date" width="180" />
+			<el-table-column prop="name" label="Name" width="180" />
+			<el-table-column prop="address" label="Address" />
+		</el-table>
+		<template #footer>
+			<div class="dialog-footer">
+				<el-button @click="dialogVisible = false">取消</el-button>
+				<el-button type="primary" @click="confirm">
+					确定
+				</el-button>
+			</div>
+		</template>
+	</el-dialog>
+
+</template>
+
+<script setup lang="ts">
+import { Search } from '@element-plus/icons-vue'
+import {ref,watch} from "vue";
+
+const props = defineProps({
+	modelValue:{
+		type:String,
+		default:''
+	}
+})
+
+const inputValue = ref(props.modelValue);
+const emit = defineEmits(['update:modelValue'])
+
+const tableData = [
+	{
+		id:1,
+		date: '2016-05-03',
+		name: 'Tom',
+		address: 'No. 189, Grove St, Los Angeles',
+	},
+	{
+		id:2,
+		date: '2016-05-02',
+		name: 'Tom',
+		address: 'No. 189, Grove St, Los Angeles',
+	},
+	{
+		id:3,
+		date: '2016-05-04',
+		name: 'Tom',
+		address: 'No. 189, Grove St, Los Angeles',
+	},
+	{
+		id:4,
+		date: '2016-05-01',
+		name: 'Tom',
+		address: 'No. 189, Grove St, Los Angeles',
+	},
+]
+const dialogVisible = ref(false)
+const selectData = ref([])
+
+watch(() =>props.modelValue,newVal =>{
+	inputValue.value = newVal
+})
+
+function confirm() {
+	if (selectData.value.length > 0){
+		let str = ''
+		selectData.value.forEach(item =>{
+			str = str + item.name + ','
+		})
+		str = str.substring(0,str.length-1)
+		emit('update:modelValue',str)
+		dialogVisible.value = false
+	}else {
+		dialogVisible.value = false
+	}
+}
+
+function handleSelectionChange(selection:Array<any>) {
+	selectData.value = selection
+}
+
+function inputClick(){
+	dialogVisible.value = true
+}
+</script>
+
+<style scoped>
+
+</style>