<template>
    <el-container style="width: 100%;height: 100%;">
        <el-button type="primary" size="small" @click="ejectTable">{{buttonName}}</el-button>

        <el-dialog :close-on-click-modal="false" :title="title" :visible.sync="ejectTableDialog"
                   append-to-body :width="width" top="5vh" :height="height">
            <!--列表视图-->
            <div style="height: 100%" class="dialogChildClass">
<!--                <list-view-preview :form-id="formId" :list-view-id="lViewId" :condition-id="conditionId"-->
<!--                                   is-eject-table="1" :is-table-preview="isTablePreview"-->
<!--                                   :callfill-field-arr="callfillFieldArr"-->
<!--                                   :condition-form-arr="conditionFormArr"-->
<!--                                   :main-form-data="formData" isPreview-->
<!--                                   :link-tree-view-id="linkTreeViewId"-->
<!--                                   @ejectDataChoose="ejectDataChoose"-->
<!--                                   v-if="sourceType == 'listView'">-->
<!--                </list-view-preview>-->
                <list-preview-handler v-if="sourceType == 'listView'"
                                      :form-id="formId"
                                      :list-view-id="lViewId"
                                      :condition-id="conditionId"
                                      is-eject-table="1"
                                      :callfill-field-arr="callfillFieldArr"
                                      :main-form-data="formData"
                                      :condition-form-arr="conditionFormArr"
                                      :ejectDataChoose="ejectDataChoose"
                                      isPreview
                                      :link-tree-view-id="linkTreeViewId">
                </list-preview-handler>

                <component v-if="sourceType == 'diyPage' && ejectTableDialog"
                           ref="diyPageRef"
                           :formData="formData"
                           :isEjectTable="'1'"
                           :callfill-field-arr="callfillFieldArr" :closeDialog="closeDialog"
                           :is="componentIndex">
                </component>
            </div>

            <!--自定义页面-->
            <!--弹出自定义页面-->



            <div slot="footer" class="dialog-footer">
                <!--<el-button type="primary" size="small" icon="el-icon-success" @click="ejectTableDialog = false">确 定</el-button>-->
                <el-button @click="ejectTableDialog = false" size="small" icon="el-icon-error">关 闭</el-button>
            </div>
        </el-dialog>
    </el-container>
</template>

<script>
    import ListViewPreview from "../../views/popup/listViewsComp/listViewPreview";
    import {Replace} from "sasp-base";
    export default {
        name: "pl-eject-table",
        components: {ListViewPreview},
        props:{
            formData:{type:Object,default:() => {return {};}},//表单数据
            buttonName:{type:String,default:""},
            title:{type:String,default:""},
            formId:{type:String,default:""},//基础数据表id
            lViewId:{type:String,default:""},//列表视图id
            conditionId:{type:String,default:""},//条件定义
            width:{type:String,default:"80%"},
            height:{type:String,default:"80%"},
            isTablePreview:{type:String,default:"0"},
            callfillFieldArr:{type:Array,default:() => {return [];}},//回填参数
            conditionFormArr:{type:Array,default:() => {return [];}},//表单类型的条件参数
            linkTreeViewId:{type:String,default:""},//关联树视图
            sourceType:{type:String,default:'listView'},//数据类型，默认列表视图
            diySourceId:{type:String,default:''}, //
        },
        data(){
          return {
              ejectTableDialog:false,
          }
        },
        created(){

        },
        methods:{

            /**
             * 获取自定义页面路径
             */
            getIndex(componentUrl){
                if(!componentUrl){
                    return;
                }
                let index = componentUrl.indexOf(".vue");
                if(index > -1){
                    componentUrl = componentUrl.substring(0,index);
                }
                if(componentUrl.indexOf("/") == 0){
                    componentUrl = componentUrl.substring(1);
                }
                let urlArr = componentUrl.split("/");
                let allRouterArr = this.$router.options.routes || [];
                this.eachRouterSet(allRouterArr,urlArr,-1);
            },

            /**
             * 遍历
             * @param allRouterArr
             * @param urlArr
             * @param index
             */
            eachRouterSet(allRouterArr,urlArr,index){
                allRouterArr.forEach(item =>{
                    // if(urlArr[index + 1]){
                    if(urlArr[index + 1] && (urlArr[index + 1] == (item.name ? item.name : item.path)) || ((item.name ? item.name : item.path)).indexOf(urlArr[index +1]+"/:") > -1){
                        //当前匹配
                        //判断 urlArr是否存在下级
                        if(item.children && item.children.length > 0) {
                            //如果存在下级
                            allRouterArr = item.children || [];
                            index = index + 1;
                            this.eachRouterSet(allRouterArr,urlArr,index);
                        }else{
                            this.componentIndex = item.component;
                        }
                    }
                    // }
                })
            },

            ejectTable(){
                //如果
                if(this.sourceType == 'diyPage' && this.diySourceId){
                    //查询复合视图
                   this.axios.post(this.api.resources.findResources, {id: this.diySourceId}).then(res =>{
                       let componentUrl = '';
                       if(res.data && res.data.operateObj&& res.data.operateObj.length>0){
                           componentUrl = res.data.operateObj[0].ragentUrl;
                       }
                       if(componentUrl){
                           this.getIndex(componentUrl); //格式化获取  componentUrl
                       }
                       this.ejectTableDialog = true;
                    });
                }else {
                    this.ejectTableDialog = true;
                }


            },


            /**
             * 弹出数据表选择回填方法
             * @param dataRow 当前选中行数据
             * @param callfillFieldArr  //回填参数配置
             */
            ejectDataChoose(dataRow,callfillFieldArr){
                callfillFieldArr.forEach(item => {
                    if(item.callfillField){ //老版本存在主键
                        //替换文本
                        let result= Replace.text(null,dataRow[item.callfillField]);
                        if(result == 'undefined'){
                            result="";
                        }
                        // this.$set(this.formData,item.callfillLinkField,result);
                        if(item.callfillLinkField && Array.isArray(this.formData[item.callfillLinkField])){
                            if(result){
                                this.$set(this.formData,item.callfillLinkField,result.split(","));
                            }else{
                                this.$set(this.formData,item.callfillLinkField,[]);
                            }
                        }else{
                            this.$set(this.formData,item.callfillLinkField,result);
                        }
                    }
                });
                this.$set(this.formData,'refreshUUId',this.COMMON_FUNC.getUuidByParams(32));
                this.ejectTableDialog = false;
            },

            /**
             * 关闭页面
             */
            closeDialog(){
                this.ejectTableDialog=false;
            }
        }
    }
</script>

<style scoped>

</style>
