Browse Source

修复图片,选择用户组件

qin_s4
liwenxuan 1 month ago
parent
commit
75c30da017
  1. 29
      src/components/DesignForm/formControlPropertiNew.vue
  2. 23
      src/components/DesignForm/public/expand/lowcodeImage.vue
  3. 67
      src/components/DesignForm/public/expand/rangedUserTree.vue

29
src/components/DesignForm/formControlPropertiNew.vue

@ -4,7 +4,7 @@
@ 备注: 表单控件app专用 @ 备注: 表单控件app专用
--> -->
<script lang="ts" setup> <script lang="ts" setup>
import { reactive, computed, toRefs, ref, watch, inject } from "vue"; import { reactive, computed, toRefs, ref, watch, inject, onBeforeMount, onMounted } from "vue";
import { getRequest } from "@/api/DesignForm"; import { getRequest } from "@/api/DesignForm";
import { useDesignFormStore } from "@/store/DesignForm/designForm"; import { useDesignFormStore } from "@/store/DesignForm/designForm";
import validate from "./validate"; import validate from "./validate";
@ -4512,17 +4512,7 @@ getCustomerFormList().then(({ data }) => {
}); });
const orgAndManTree = ref<Tree[]>(); const orgAndManTree = ref<Tree[]>();
// getAssociatedFormsOrgAndManTree().then(({ data }) => {
// let resData = ref(data.children);
// orgAndManTree.value = [
// {
// id: data.id,
// //label: data.label,
// label: "",
// children: [...resData.value],
// },
// ];
// });
const roleTree = ref<Tree[]>(); const roleTree = ref<Tree[]>();
getAssociatedFormsRoleTree().then(({ data }) => { getAssociatedFormsRoleTree().then(({ data }) => {
@ -5465,6 +5455,21 @@ onMounted(() => {
gainAiagentList() gainAiagentList()
}); });
onBeforeMount(() => {
getAssociatedFormsOrgAndManTree().then(({ data }) => {
let resData = ref(data.children);
orgAndManTree.value = [
{
id: data.id,
//label: data.label,
label: "组织机构",
children: [...resData.value],
},
];
});
});
watch( watch(
() => state.tabsName, () => state.tabsName,
(val: string) => { (val: string) => {

23
src/components/DesignForm/public/expand/lowcodeImage.vue

@ -7,7 +7,7 @@
import { import {
AnalysisCss, AnalysisCss,
AnalysisInputCss, AnalysisInputCss,
} from "@/components/DesignForm/public/form/calculate/cssInfo"; } from "@/components/DesignForm/public/form/calculate/cssInfo.ts";
import errimg from "@/assets/404_images/imgNotFound.png"; import errimg from "@/assets/404_images/imgNotFound.png";
import { uploadUrl, getRequest } from "@/api/DesignForm"; import { uploadUrl, getRequest } from "@/api/DesignForm";
import { ref,useAttrs } from 'vue' import { ref,useAttrs } from 'vue'
@ -16,8 +16,6 @@ import { Plus } from '@element-plus/icons-vue'
import type { UploadProps, UploadUserFile } from 'element-plus' import type { UploadProps, UploadUserFile } from 'element-plus'
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import NoImgPage from '@/assets/images/1.png'
import { getCurrentInstance } from 'vue'; import { getCurrentInstance } from 'vue';
const getAncestorComponentNames = () => { const getAncestorComponentNames = () => {
@ -312,7 +310,7 @@ const fit = computed(()=>{
</script> </script>
<template> <template>
<el-image <el-image
v-if="(!hasELCard(ancestors))&&props.data.control&&props.type==5" v-if="(!hasELCard(ancestors))&&props.data.control.useDefaultImg&&props.type==5"
:src="value" :src="value"
class="avatar" class="avatar"
:style="getFormItemInputStyle(configStyle, 2)" :style="getFormItemInputStyle(configStyle, 2)"
@ -353,23 +351,6 @@ const fit = computed(()=>{
:style="getFormItemInputStyle(configStyle, 2)" :style="getFormItemInputStyle(configStyle, 2)"
:fit="fit" :fit="fit"
/> />
</el-upload>
<el-upload
v-if="props.type==1"
v-bind="$props"
class="upload-demo"
:action="uploadUrl"
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload"
v-loading="imgLoading"
>
<el-image
:src="props.modelValue?props.modelValue:NoImgPage"
class="avatar"
:style="getFormItemInputStyle(configStyle, 2)"
:fit="fit"
/>
</el-upload> </el-upload>
<!-- <img referrerpolicy="no-referrer" :src="url" :style="styleObject" :fit="fit" :class="[boderAndShadowClassIsActive ? boderAndShadowClass : '', radiusClassIsActive ? radiusClass : '',mp, floatFlag ? floatStyle : '']" /> --> <!-- <img referrerpolicy="no-referrer" :src="url" :style="styleObject" :fit="fit" :class="[boderAndShadowClassIsActive ? boderAndShadowClass : '', radiusClassIsActive ? radiusClass : '',mp, floatFlag ? floatStyle : '']" /> -->
<!-- <div></div> --> <!-- <div></div> -->

67
src/components/DesignForm/public/expand/rangedUserTree.vue

@ -1,5 +1,5 @@
<script lang='ts' setup> <script lang='ts' setup>
import { computed, onMounted, onBeforeMount,nextTick,inject } from 'vue' import { computed, onMounted, onBeforeMount, onUnmounted, nextTick, inject, ref, watch } from 'vue'
import { criteriaForPeopleList } from '@/api/hr/org/type' import { criteriaForPeopleList } from '@/api/hr/org/type'
import request from '@/utils/request'; import request from '@/utils/request';
import { useAttrs } from 'vue' import { useAttrs } from 'vue'
@ -15,7 +15,6 @@ const props = withDefaults(
{} {}
) )
const emits = defineEmits<{ const emits = defineEmits<{
(e: 'update:modelValue', value: string): void (e: 'update:modelValue', value: string): void
}>() }>()
@ -30,6 +29,9 @@ const { location, updateLocation } = inject('location')
// //
const lastSelectedValue = ref(null) const lastSelectedValue = ref(null)
//
const isMounted = ref(false)
// //
const handleValueChange = (newValue) => { const handleValueChange = (newValue) => {
if (!multiSelect.value) { if (!multiSelect.value) {
@ -60,8 +62,9 @@ const handleValueChange = (newValue) => {
//, liwenxuan 2025-11-11 start //, liwenxuan 2025-11-11 start
//,form //,form
updateLocation(value.value,props.data.name) if (isMounted.value) {
updateLocation(value.value, props.data.name)
}
//, liwenxuan 2025-11-11 end //, liwenxuan 2025-11-11 end
} else { } else {
@ -114,10 +117,28 @@ function parseStringToArray(str: string) {
} }
} }
// children
const sanitizeTreeData = (data: any[]): any[] => {
if (!Array.isArray(data)) return [];
return data.map(node => {
const newNode = { ...node };
if (newNode.children != null) {
if (Array.isArray(newNode.children)) {
//
newNode.children = sanitizeTreeData(newNode.children);
} else {
// childrenel-tree
delete newNode.children;
}
}
return newNode;
});
}
onBeforeMount(() => { onBeforeMount(() => {
setTimeout(()=>{ setTimeout(()=>{
//
if (!isMounted.value) return;
if(props.modelValue){ if(props.modelValue){
const initialValue = parseStringToArray(props.modelValue) const initialValue = parseStringToArray(props.modelValue)
value.value = initialValue; value.value = initialValue;
@ -126,14 +147,21 @@ onBeforeMount(() => {
} }
} }
},1500) },1500)
})
onMounted(() => {
isMounted.value = true;
}) })
onUnmounted(()=>{ onUnmounted(()=>{
//console.log("onUnmounted") isMounted.value = false;
//
if (pollingTimer) clearTimeout(pollingTimer);
}) })
//
let pollingTimer: ReturnType<typeof setTimeout> | null = null;
// //
const processTreeData = (data: any[]) => { const processTreeData = (data: any[]) => {
return data.map(node => { return data.map(node => {
@ -165,17 +193,23 @@ const loadFullData = async () => {
const result = await checkorgAndManTree1(); const result = await checkorgAndManTree1();
// multiSelect // children
const processedData = !multiSelect.value ? processTreeData(result) : result; const cleanedData = sanitizeTreeData(result);
const processedData = !multiSelect.value ? processTreeData(cleanedData) : cleanedData;
treeData.value = processedData; //
isDataLoaded.value = true; if (isMounted.value) {
treeData.value = processedData;
isDataLoaded.value = true;
}
return processedData; return processedData;
} catch (error) { } catch (error) {
console.error('加载组织数据失败:', error); console.error('加载组织数据失败:', error);
return []; return [];
} finally { } finally {
loading.value = false; if (isMounted.value) {
loading.value = false;
}
} }
} }
@ -200,6 +234,11 @@ const resData = computed(() => {
function checkorgAndManTree1() { function checkorgAndManTree1() {
return new Promise((resolve) => { return new Promise((resolve) => {
const check = () => { const check = () => {
//
if (!isMounted.value) {
resolve([]);
return;
}
let result = [] let result = []
let i = 0 let i = 0
props.orgAndManTree.forEach((element: any) => { props.orgAndManTree.forEach((element: any) => {
@ -216,7 +255,7 @@ function checkorgAndManTree1() {
}); });
resolve(result) resolve(result)
} else { } else {
setTimeout(check, 100) pollingTimer = setTimeout(check, 100)
} }
} }
check() check()

Loading…
Cancel
Save