Dynamics CRM 365 OP版的经典模式，选项卡是滚动查看的，是否可以调成和UCI界面一样，通过Tab展示呢

 

1.经典模式的选项卡：

 

 

2.非经典模式的选项卡：

 

 

 

3.经典模式的展示，是否可以调整成非经典模式呢，其实通过代码是可以实现的，我们只需要新建一个webresoure，且放到窗体顶部即可

效果：

 

 

实现方式：

 

 

web资源代码：

<html><head>
    <meta>
<meta><meta><meta><meta></head>
<body style="overflow-wrap: break-word;">
    <meta charset="utf-8">
    <title></title>
    <link type="text/css" rel="styleSheet" href="./scw_element.css">
    <script src="./scw_vue.js"></script>
    <script src="./scw_element.js"></script>
    <script src="./scw_axios.min.js"></script>
    <script src="./scw_api.js"></script>
    <style>
        .Custom {
            width: 100%;
            height: 41px;
        }

        .el-tabs__nav-prev {
            top: 0px !important;
            font-size: 20px;
        }

        .el-tabs__nav-next {
            top: 0px !important;
            font-size: 20px;
        }
    </style>
    <meta>

    <div id="form" style="margin-top:0px;">
        <div class="Custom" v-if="da.length>0">
            <el-tabs v-model="activeName" @tab-click="handleClick">
                <el-tab-pane v-for="(item,i) in da" :key="i" :label="item.Label" :name="item.Name" v-if="i>0&amp;&amp;item.Name!='hide'">
                </el-tab-pane>
            </el-tabs>
        </div>
    </div>
    <script>
        new Vue({
            el: "#form",
            data: {
                activeName: parent.Xrm.Page.ui.tabs.getAll()[1]['$0_2']['$J_2'].Name,
                da: [],
            },
            created: function () {
                this.init();
                 if (typeof ($) === 'undefined') {
                        $ = parent.$;
                        jQuery = parent.jQuery;
                    }
                $("#stage_6").click(function () {
                   parent.document.getElementById("processControlCollapsibleArea").style.display = "";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "21.06rem").css("right", "3%").css(
                                "background-color",
                                "white")
                });
                $("#stage_5").click(function () {
                     parent.document.getElementById("processControlCollapsibleArea").style.display = "";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "21.06rem").css("right", "3%").css(
                                "background-color",
                                "white")
                });
                $("#stage_4").click(function () {
                    parent.document.getElementById("processControlCollapsibleArea").style.display = "";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "21.06rem").css("right", "3%").css(
                                "background-color",
                                "white")
                });
                $("#stage_3").click(function () {
                  parent.document.getElementById("processControlCollapsibleArea").style.display = "";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "21.06rem").css("right", "3%").css(
                                "background-color",
                                "white")
                });
                $("#stage_2").click(function () {
                    parent.document.getElementById("processControlCollapsibleArea").style.display = "";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "21.06rem").css("right", "3%").css(
                                "background-color",
                                "white")
                });
                $("#stage_1").click(function () {
                    parent.document.getElementById("processControlCollapsibleArea").style.display = "";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "21.06rem").css("right", "3%").css(
                                "background-color",
                                "white")
                });
                $("#stage_0").click(function () {
                    parent.document.getElementById("processControlCollapsibleArea").style.display = "";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "21.06rem").css("right", "3%").css(
                                "background-color",
                                "white")
                });
                $("#processControlCollapseButton").click(function () {
                   parent.document.getElementById("processControlCollapsibleArea").style.display = "none";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "10.56rem").css("right", "3%").css(
                                "background-color",
                                "white")
                });
            },
            methods: {
                setTabsOpen: function () {
                 if (typeof ($) === 'undefined') {
                        $ = parent.$;
                        jQuery = parent.jQuery;
                    }
                    parent.document.getElementById("processControlCollapsibleArea").style.display = "";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "21.06rem").css("right", "3%").css(
                                "background-color",
                                "white")
                }, setTabsClose: function () {
                 if (typeof ($) === 'undefined') {
                        $ = parent.$;
                        jQuery = parent.jQuery;
                    }
                    parent.document.getElementById("processControlCollapsibleArea").style.display = "none";
                    $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                            "95%").css("top", "11.06rem").css("right", "3%").css(
                                "background-color",
                                "white")
                },
                init: function () {

                    if (typeof ($) === 'undefined') {
                        $ = parent.$;
                        jQuery = parent.jQuery;
                    }


                    let entityName = parent.Xrm.Page.data.entity.getEntityName();
                    let contan = entityName.indexOf('scw_');
                    // let width = Number($("#tdAreas")[0].offsetWidth) * 0.97 + "px";
                    //调整样式(非自定义)
                    if (Number(contan) < 0) {
                        $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                            .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                                "95%").css("top", "21.06rem").css("right", "3%").css(
                                    "background-color",
                                    "white");
                    }
                    //调整样式(自定义)
                    else {
                        // $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                        //     .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                        //         "95%").css("top", "6.39rem").css("right", "3%").css(
                        //         "background-color",
                        //         "white");
                        $(".refresh-form .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection[name=tab_999_section_1]")
                            .css("border", "none").css("position", "fixed").css("z-index", "8").css("width",
                                "96%").css("right", "2%").css("top", "21.06rem").css(
                                    "background-color",
                                    "white");
                    }



                    $(".refresh-form DIV.ms-crm-InlineTab-Read").css("margin-bottom", "24px");
                    $(".ms-crm-Inline-LockIcon").css("z-index", "7");
                    $("#crmNotifications").css("z-index", "99").css("margin-top", "50px");

                    var tempArr = [];
                    var qqdass = parent.Xrm.Page.ui.tabs.getAll();
                    let that_ = this;

                    qqdass.forEach(function (element) {
                        var obj = {};
                        obj = { Name: element["$0_2"]["$J_2"].Name, Label: element["$0_2"]["$J_2"].Label }
                        tempArr.push(obj);
                        if (element["$0_2"]["$J_2"].Id != 'tab0') {

                            if (element["$0_2"]["$J_2"].Name == that_.activeName) {
                                element.setVisible(true);
                            } else {
                                element.setVisible(false);
                            }
                        }
                    });
                    this.da = tempArr;
                },
                handleClick: function (tab, event) {
                    var entityName = window.parent.Xrm.Page.data.entity.getEntityName();
                    let that_ = this;
                    var qqdass = parent.Xrm.Page.ui.tabs.getAll();
                    qqdass.forEach(function (element) {
                        if (element["$0_2"]["$J_2"].Id != 'tab0') {
                            if (element["$0_2"]["$J_2"].Name == that_.activeName) {
                                console.log(element);
                                element.setVisible(true);
                            } else {
                                element.setVisible(false);
                            }
                        }
                    });
                }

            },
            computed: {}
        })
    </script>

</body></html>

 

posted @ 2022-07-21 14:26  溜溜球_小钢wan  阅读(101)  评论(0)  编辑  收藏  举报