xnApprovel.html 8.34 KB
<!DOCTYPE html  >
<html lang="zh-CN" ng-app="myApp">
<head>
    <meta charset="utf-8">
    <meta http-equiv="Expires" CONTENT="0">
    <meta http-equiv="Cache-Control" CONTENT="no-cache">
    <meta http-equiv="Cache-Control" CONTENT="no-store">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--公共引用-->
    <link rel="Shortcut Icon"  href="https://cdn.xiniunet.com/img/favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="https://cdn.xiniunet.com/css/xn-bootstrap/1.0.2/bootstrap.min.css" >
    <link rel="stylesheet" href="https://cdn.xiniunet.com/font/xn-icon-common/2.0.7/iconfont.min.css" />
    <link rel="stylesheet" href="/guide/dist/styles/local.min.css" />
    <!--公共引用-->
    <script  type="text/javascript" src="https://cdn.xiniunet.com/js/base/1.2.0/base.min.js" ></script>
    <!--源码插件-->
    <link rel="stylesheet" href="/guide/vendor/code-prettify/prettify.css" />
    <script  type="text/javascript" src="/guide/vendor/code-prettify/prettify.js" ></script>

    <!--需要加载的文件-->
    <link rel="stylesheet"  href="https://cdn.xiniunet.com/js/xn-common/1.1.6/style.min.css" >
    <script  type="text/javascript" src="https://cdn.xiniunet.com/js/xn-common/1.1.6/commons.min.js" ></script>

    <link rel="stylesheet"  href="https://cdn.xiniunet.com/js/xn-approval/1.1.0/style.min.css" >
    <script  type="text/javascript" src="https://cdn.xiniunet.com/js/xn-approval/1.1.0/approval.min.js" ></script>

    <!--<script  type="text/javascript" src="/guide/spm_modules/xn-directive-attachment/1.3.2/directive/attachments.js" ></script>-->

</head>
<body ng-controller="PageController" >
<div class="xn-main xn-width mt-20 xn-grid-layout auto clearfix" >
    <div class="xn-main-header">
        <span>{{setting.name}}</span>
        <span class="ml-50 font-sm">{{setting.subtitle}}</span>
    </div>
    <div class="xn-main-body xn-grid-14  xn-lh" >
        <div class="xn-demo">
            <div class="title"><span class="h3-title">示例:</span></div>
            <div class="xn-input-line clearfix">
                <div class="mt-25" xn-approve  ng-model="approveResult"  user-id="$principal.userId"
                     is-show-button="true"  do-approve="doApprove()" do-reject="doReject()"
                     do-transfer="setTransfer()"
                     ></div>
            </div>

        </div>
        <div class="xn-options">
            <div class="title"><span class="h3-title">代码:</span></div>
            <div class="xn-input-line clearfix">
                <pre class="prettyprint lang-html linenums prettyprinted" id="options"></pre>
            </div>
        </div>

        <div class="xn-explain">
            <div class="title"><span class="h3-title">说明:</span><span class="f-right">(点击标题查看详情)</span></div>
            <div class="xn-input-line">
                flowId 需要从网址上获取。
            </div>

            <div class="xn-input-line clearfix">
                <div class="sub-title" >ng-model</div>
                <div class="explain-content" >
                    <p>必填 : 为选择后返回的数据</p>
                </div>
            </div>

            <div class="xn-input-line clearfix">
                <div class="sub-title" >user-id</div>
                <div class="explain-content" >
                    <p>必填: $principal.userId<p>
                </div>
            </div>

            <div class="xn-input-line clearfix">
                <div class="sub-title" ng-click="tabSubNav(1)">is-show-button</div>
                <div class="explain-content" ng-if="setting.subNavActive===1">
                    <p>可选 :显示是否有审批按钮,一般用于查看,现在有 xnApprovelView 指令了,如果为false可以使用 xnApprovelView组件代替<p>

                </div>
            </div>

            <div class="xn-input-line clearfix">
                <div class="sub-title" ng-click="tabSubNav(2)"> do-approve</div>
                <div class="explain-content" ng-if="setting.subNavActive===2">
                    <p>可选 :点击同意后触发的事件。<p>
                    <pre>
                      do-approve="doApprove()"
                   </pre>

                </div>
            </div>
            <div class="xn-input-line clearfix">
                <div class="sub-title" ng-click="tabSubNav(3)">do-reject</div>
                <div class="explain-content" ng-if="setting.subNavActive===3">
                    <p>可选 :点击拒绝后触发的事件。<p>
                   <pre>
                      do-reject="doReject()"
                   </pre>
                </div>
            </div>
            <div class="xn-input-line clearfix">
                <div class="sub-title" ng-click="tabSubNav(4)">do-transfer</div>
                <div class="explain-content" ng-if="setting.subNavActive===4">
                   <p>可选 :点击拒绝后触发的事件。<p>
                   <pre>
                   do-transfer="setTransfer()"
                   </pre>
                </div>
            </div>
        </div>
    </div>

    <div class="xn-main-body xn-col-md-8 xn-col-md-offset-1 xn-lh" >
        <div class="xn-info">
            <div class="title"><span class="h3-title">基本信息</span></div>
            <div class="xn-input-line clearfix ">
                <label class="xn-col-md-6 xn-text-right xn-label">隶属于:</label>
                <div class="xn-col-md-18">{{setting.affiliated}}</div>
            </div>
            <div class="xn-input-line clearfix ">
                <label class="xn-col-md-6 xn-text-right xn-label">version: </label>
                <div class="xn-col-md-18" >{{setting.version}}</div>
            </div>
            <div class="xn-input-line clearfix ">
                <label class="xn-col-md-6 xn-text-right xn-label">依赖组件:</label>
                <div class="xn-col-md-18">{{setting.rely}}</div>
            </div>
            <div class="xn-input-line clearfix ">
                <label class="xn-col-md-6 xn-text-right xn-label">CDN路径:</label>
                <div class="xn-col-md-18 clearfix" >
                    {{setting.jsUrl}}<br/>{{setting.cssUrl}}
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    //    配置设置
    (function () {
        function htmlEscape(s) {
            return s
                    .replace(/&/g, '&amp;')
                    .replace(/</g, '&lt;')
                    .replace(/>/g, '&gt;');
        }
        // this page's own source code


        var quineHtml = htmlEscape(
                '<div  xn-approve  \n' +
                '   ng-model="{string}" \n' +
                '   user-id="{string}"\n' +
                '   [is-show-button="{boolean}"]\n' +
                '   [do-approve="{expression}"]\n' +
                '   [do-reject="{expression}"]\n' +
                '   [do-transfer="{expression}"]\n' +
                '   >\n' +
                '</div>');


        // Highlight the operative parts:
        quineHtml = quineHtml.replace(
                /&lt;script src[\s\S]*?&gt;&lt;\/script&gt;|&lt;!--\?[\s\S]*?--&gt;|&lt;pre\b[\s\S]*?&lt;\/pre&gt;/g,
                '<span class="operative">$&<\/span>');

        // insert into PRE
        document.getElementById("options").innerHTML = quineHtml;

    })();
    var pageController = function ($scope,$timeout) {
        var version="1.1.0";
        $scope.setting={
            name:"添加审批人员",
            subtitle:"xnApprovel",
            affiliated:"xn.directive.approval",
            version:version,
            rely:"xn.common",
            jsUrl:"js/xn-approval/"+version+"/approval.min.js",
            cssUrl:"js/xn-approval/"+version+"/style.min.css",
            subNavActive:null
        };
        $scope.tabSubNav=function (index) {
            if($scope.setting.subNavActive==index){
                $scope.setting.subNavActive=null
            }else {
                $scope.setting.subNavActive=index
            }
        };

        $scope.approvalId="852493229462261760";

    };
    var xnConfig = {
        myUrl: "http://my-plat.xiniunet.com/"
    };
    angular.module("myApp",["xn.directive.approval","xn.common"])
            .value("xnConfig",xnConfig)
            .controller("PageController", ["$scope","$timeout", pageController]);
</script>
</body>
</html>