文件,链接

src/components/lowCode/assistant/uploadPage.vue

@@ -138,8 +138,9 @@ const uploadSuccess = (response: any, uploadFile: any, uploadFiles: any) => {
 	// console.log("uploadSuccess=fileList==>",fileList)
 }
 </script>
-<template>{{types}}
-    <div>
+<template><!-- {'{types}} -->
+    <div style="width: 100%;
+    display: inline;">
 		<el-upload
 			v-bind="props.control"
 			:action="uploadUrl"
@@ -162,7 +163,8 @@ const uploadSuccess = (response: any, uploadFile: any, uploadFiles: any) => {
 				<el-button type="primary" plain v-if="props.config?.btnText">
 					{{ props.config?.btnText }} 
 				</el-button>
-				<i v-else class="icon-plus"><i class="fa fa-paperclip" ></i></i>
+				<!-- <i v-else class="icon-plus"><i class="fa fa-paperclip" ></i></i> -->
+				<el-button v-else style="color:grey;font-weight: bolder;"><el-icon style="margin-right: 7px;font-weight: bolder;"><Plus /></el-icon>上传文件</el-button>
 			</template>
 			<template #tip v-if="props.config?.tip">
 				<div class="el-upload__tip">
@@ -172,6 +174,15 @@ const uploadSuccess = (response: any, uploadFile: any, uploadFiles: any) => {
 		</el-upload>
 	</div>
 </template>
-<style  lang='scss' scoped>
+<style  lang='scss' >
+.el-upload-list__item {
+    border-radius: 4px;
+    box-sizing: border-box;
+    color: var(--el-text-color-regular);
+    font-size: 14px;
+    margin-bottom: 5px;
+    position: relative;
+    transition: all .5s cubic-bezier(.55,0,.1,1);
 
+}
 </style>

src/components/lowCode/assistant/urlLink.vue

@@ -5,104 +5,104 @@
 -->
 <script lang='ts' setup>
 import {
-    constControlChange,
-    constFormProps
+	constControlChange,
+	constFormProps
 } from '@/api/lowCode/utils';
-import { FormList,FormItem } from "@/api/lowCode/form/type"
+import { FormList, FormItem } from "@/api/lowCode/form/type"
 import validate from "@/api/lowCode/form/validate"
 
 const props = withDefaults(
-    defineProps<{
+	defineProps<{
 		data: FormList
 		tablekey: any
 		numrun?: number
 		modelValue?: any // 子表和弹性布局时时有传
 		tProp?: string // 子表时的form-item的prop值，用于子表校验用
 		types?: string
-    }>(),
-    {}
+	}>(),
+	{}
 )
 const emits = defineEmits<{
-    (e: 'update:modelValue', numVal: any): void
+	(e: 'update:modelValue', numVal: any): void
 }>()
 
 const formProps = inject(constFormProps, {}) as any
 const type = computed(() => {
-    return formProps.value.type
+	return formProps.value.type
 })
 const config = computed(() => {
-    return props.data.config || {}
+	return props.data.config || {}
 })
 
 const changeEvent = inject(constControlChange, '') as any
 
 const value = computed({
-    get() {
+	get() {
 		if (props.tProp) {
 			// 表格和弹性布局
 			return props.modelValue
 		} else {
 			return formProps.value.model[props.data.name]
 		}
-    },
-    set(newVal: any) {
+	},
+	set(newVal: any) {
 		if (props.tProp) {
 			emits('update:modelValue', newVal)
 		}
 		updateModel(newVal)
-    }
+	}
 })
 const updateModel = (val: any) => {
 	let controlAttribute = ""
-	if(props.data.control){
-		if(props.data.control.type){
+	if (props.data.control) {
+		if (props.data.control.type) {
 			controlAttribute = props.data.control.type
 		}
 	}
-    changeEvent &&
-    changeEvent({
-        key: props.data.name,
-        value: val,
-        data: props.data,
-        tProp: props.tProp,
-		type: props.data.type,
-		attribute: controlAttribute
-    })
+	changeEvent &&
+		changeEvent({
+			key: props.data.name,
+			value: val,
+			data: props.data,
+			tProp: props.tProp,
+			type: props.data.type,
+			attribute: controlAttribute
+		})
 }
 
 
 
 const getLabel = (ele: FormItem) => {
-    const showColon = formProps.value.showColon ? '：' : ''
-    if (ele) {
-    	return ele.showLabel ? '' : ele.label + showColon
-    } else {
-      	return ''
-    }
+	const showColon = formProps.value.showColon ? '：' : ''
+	if (ele) {
+		return ele.showLabel ? '' : ele.label + showColon
+	} else {
+		return ''
+	}
 }
 
 // 返回当前item项的校验规则
 const itemRules = computed(() => {
-    let temp
-    const itemR: any = props.data.item?.rules || []
-    const customR = formatCustomRules()
-    // 如果三个都没有设置，则返回undefined
-    if (itemR?.length || customR?.length) {
-      	temp = [...customR, ...itemR]
-    }
-    return temp
+	let temp
+	const itemR: any = props.data.item?.rules || []
+	const customR = formatCustomRules()
+	// 如果三个都没有设置，则返回undefined
+	if (itemR?.length || customR?.length) {
+		temp = [...customR, ...itemR]
+	}
+	return temp
 })
 // 处理自定义校验规则，将customRules转换后追加到rules里
 const formatCustomRules = () => {
-    const rulesReg: any = {}
-    validate &&
-    validate.forEach(item => {
-        rulesReg[item.type] = item.regExp
-    })
-
-    // 获取校验方法 父级使用provide方法注入
-    const temp: any = []
-    props.data.customRules?.forEach((item: any) => {
+	const rulesReg: any = {}
+	validate &&
+		validate.forEach(item => {
+			rulesReg[item.type] = item.regExp
+		})
+
+	// 获取校验方法 父级使用provide方法注入
+	const temp: any = []
+	props.data.customRules?.forEach((item: any) => {
 		if (!item.message && item.type !== 'methods') {
 			return // 方法时允许提示信息为空
 		}
@@ -116,7 +116,7 @@ const formatCustomRules = () => {
 			// 方法时
 			const methods: any = item.methods
 			if (methods) {
-			obj = { validator: inject(methods, {}) }
+				obj = { validator: inject(methods, {}) }
 			}
 		} else if (item.type) {
 			obj = { pattern: rulesReg[item.type as string] }
@@ -136,39 +136,37 @@ const formatCustomRules = () => {
 				message
 			)
 		)
-    })
-    return temp
+	})
+	return temp
 }
 const urlVal = ref("http://")
 //访问URL
 const openUrl = () => {
-	console.log(1)
-	alert(1)
 	let patt = /^http(s)?:\/\/[\w-]+(\.[\w-]+)+(\:\d+)?(\/\w+)*(\?\w+=.*(\&\w+=.*)*)?$/i;
-	console.log("编码组件-url-1111-》",value.value,patt.test(value.value))
-	if(patt.test(value.value)){
+	console.log("编码组件-url-1111-》", value.value, patt.test(value.value))
+	if (patt.test(value.value)) {
 		// console.log("编码组件-url--》",value)
-		window.open(value.value,'_blank')
-	}else{
+		window.open(value.value, '_blank')
+	} else {
 		// console.log("编码组件-url-1-》",value)
-		window.open(urlVal.value+value.value,'_blank')
+		window.open(urlVal.value + value.value, '_blank')
 	}
 
 	// router.push({path:value})
 }
 
 
-function openUrl1(){
+function openUrl1() {
 	/* console.log(1)
 	alert(1) */
 	let patt = /^http(s)?:\/\/[\w-]+(\.[\w-]+)+(\:\d+)?(\/\w+)*(\?\w+=.*(\&\w+=.*)*)?$/i;
-	console.log("编码组件-url-1111-》",value.value,patt.test(value.value))
-	if(patt.test(value.value)){
+	console.log("编码组件-url-1111-》", value.value, patt.test(value.value))
+	if (patt.test(value.value)) {
 		// console.log("编码组件-url--》",value)
-		window.open(value.value,'_blank')
-	}else{
+		window.open(value.value, '_blank')
+	} else {
 		// console.log("编码组件-url-1-》",value)
-		window.open(urlVal.value+value.value,'_blank')
+		window.open(urlVal.value + value.value, '_blank')
 	}
 
 	// router.push({path:value})
@@ -178,7 +176,7 @@ onMounted(() => {
 })
 </script>
 <template>
-    <el-input v-if="types != 3" v-model="value">
+	<el-input v-if="types != 3" v-model="value">
 		<template #prepend>
 			<el-select v-model="urlVal" style="width: 115px">
 				<el-option label="http://" value="http://" />
@@ -188,10 +186,39 @@ onMounted(() => {
 		<template #append><el-button type="warning" @click="openUrl">访问</el-button></template>
 	</el-input>
 
-	<div v-else style="border: 0px solid black; cursor: pointer; color:#0000EE; text-decoration:underline;" class="wordColor" @click="openUrl1">{{urlVal}}{{value}}</div><el-button v-show="false" type="warning" @click="openUrl">访问</el-button>
+
+
+	
+<div v-if="types==3" class="url-container" @click="openUrl1">
+  
+  <span class="url-content">
+    {{urlVal}}{{value}}
+  </span>
+</div>
 </template>
-<style  lang='scss' scoped>
-.wordColor{
-	color:#000000;
+<style lang='scss' scoped>
+.wordColor {
+	color: #000000;
+}
+
+.url-container {
+  /* 容器样式（保持点击和下划线等特性） */
+  cursor: pointer;
+  color: #0000EE;
+  text-decoration: underline;
+  /* 可选：限制容器最大宽度，避免span无限拉伸 */
+  max-width: 100%; 
+}
+
+.url-content {
+  /* 1. 自定义触发溢出的宽度（例如300px） */
+  width: 100%; 
+  /* 2. 块级显示，确保width生效 */
+  display: inline-block; 
+  /* 3. 超出宽度后自动换行（默认行为，可省略） */
+  white-space: normal; 
+  /* 4. 处理长英文/数字不换行问题（可选） */
+  word-wrap: break-word; 
+  text-decoration:underline;
 }
 </style>