From a9bbbe822377536e6f3374b05e2b64b12b2f188c Mon Sep 17 00:00:00 2001 From: wangting <675591594@qq.com> Date: 星期一, 27 五月 2024 10:25:43 +0800 Subject: [PATCH] action文档 --- Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue | 149 ++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 134 insertions(+), 15 deletions(-) diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue index 804a731..360191b 100644 --- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue +++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue @@ -1,39 +1,158 @@ <template> - <div></div> + <div class="UI-dynamic" :id="'UI-dynamic-'+areasName+componentVO.oid"> + <el-alert + class="alert" + :closable="false" + v-if="isError" + title="鑷畾涔夌粍浠堕厤缃俊鎭敊璇紒" + type="error" + show-icon + description="杩欎釜鑷畾涔夐〉闈㈢殑鍦板潃鏍煎紡涓嶆纭�傛帹鑽愪娇鐢ㄢ�滅粍浠秐ame?param=xxx鈥濓紙鑷畾涔夌粍浠讹級鎴栬�呪��?type=xxx&context=yyy&pparam=zzz鈥濓紙UI寮曟搸锛夎繖2绉嶅舰寮�"> + </el-alert> + <component v-else :is="currentComponent" + :btmType="btmType" + :context="context" + :inDialog="true" + :key="areasName+'customCom-'+componentVO.oid" + :componentVO="componentVO" + :sourceData="sourceData" + :dataStore="dataStore" + :areasName="areasName" + :paramVOS="urlParams"></component> + </div> </template> <script> +import {queryStringToObject} from '@/util/util' +import {validatenull} from "@/util/validate"; export default { name: "dynamic-custom", - props:{ - componentVO:{ - type:Object, + props: { + //ui涓婁笅鏂囩殑涓氬姟绫诲瀷锛堟垨閾炬帴绫诲瀷锛� + uiBtmType: { + type: String + }, + //ui涓婁笅鏂� + uiContext:{ + type: String + }, + componentVO: { + type: Object, default: {} }, inDialog: { type: Boolean, default: false }, - areasName:{ - type:String, - default:'' + canEdit:{ + //鍐呭鏄惁鍙紪杈� + type:Boolean, + default:false }, - sourceData:{ - //鑿滃崟婧愭暟鎹垨鑰呭脊绐楁椂鎸夐挳鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁 - type:Object, + areasName: { + type: String, + default: '' + }, + sourceData: { + //鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁 + type: Object, default: {} }, - paramVOS:{ - type:Object, + dataStore: { + //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁 + type: Array, + default: [] + }, + paramVOS: { + type: Object, default: {} - } + }, + isShow: { + //鎵�鍦ㄥ尯鍩熸槸鍚﹀凡鏄剧ず锛岄拡瀵箃ab鍜宑ollapse + type: Boolean, + default: true + }, }, data() { - return {} + return { + btmType: '', + context: '', + urlParams: {}, + height: '300px', + customClass: '', //?type=xxx&context=yyy¶m=zzz 鎴栬�� 缁勪欢name?type=xxx&context=yyy¶m=zzz + isError: false, //璺緞瑙f瀽澶辫触 + ComponentUrl:'base/UIContentViewerInDialog', + currentComponent: null + } + }, + watch: { + sourceData: { + handler(newval) { + //婧愭暟鎹湁鍙樺寲鏃跺彉鏇村綋鍓嶅尯鍩熸暟鎹� + console.log(this.areasName); + console.log(newval); + }, + deep: true, + immediate: true + } + }, + computed: {}, + created() { + this.customClass=this.componentVO.customClass; + this.componentVO.customClass.split(';').forEach(item=>{ + if(item.indexOf('web=')==0){ + this.customClass=item.split('web=')[1]; + } + }) + let urlParams = {}; + // 濡傛灉璺緞涓瓨鍦� '?'锛屽垯鍙栭棶鍙峰墠闈㈤儴鍒嗙粰 parts + if (this.customClass.includes('?')) { + this.ComponentUrl = this.customClass.split("?")[0]; + urlParams = queryStringToObject(this.customClass); + } else { + this.ComponentUrl = this.customClass; // 涓嶅瓨鍦� '?' 鏁存潯璺緞灏辨槸 parts + } + if(validatenull(this.ComponentUrl) || ['ui', 'UI', 'base','bs'].includes(this.ComponentUrl)){ + this.ComponentUrl='views/base/UIContentViewerInDialog'; + }else if(this.ComponentUrl.indexOf('views/')===-1){ + this.ComponentUrl='views/custom-ui/'+this.ComponentUrl; + } + + if (this.ComponentUrl=='base/UIContentViewerInDialog' && (!urlParams.type || !urlParams.context)) { + this.isError = true; + return; + } + + this.btmType = urlParams.type; + this.context = urlParams.context; + this.urlParams = Object.assign({},this.paramVOS, urlParams) + this.loadCompoent(); + }, + mounted() { + //this.getHeight(this.$parent); + }, + methods: { + loadCompoent(){ + // 鍔ㄦ�佸鍏ョ粍浠� + import(`@/${this.ComponentUrl}.vue`).then((module) => { + // 鎴愬姛瀵煎叆鍚庯紝灏嗙粍浠舵敞鍐屽埌Vue瀹炰緥涓� + this.currentComponent = module.default; + }).catch((error) => { + // 澶勭悊瀵煎叆澶辫触鐨勬儏鍐� + console.error('缁勪欢鍔犺浇澶辫触:', error); + }); + }, + getHeight(el) { + if (el.$el.clientHeight > 50) { + this.height = el.$el.clientHeight + 'px'; + } else { + this.getHeight(el.$parent); + } + } } } </script> -<style scoped> +<style scoped lang="scss"> </style> -- Gitblit v1.9.3