第コンボイ操作 - 遠位折り畳み式ツリーを達成します

まず、ポータルを開きます

1.ブログのアドレス：
リーを楽しむ：https://www.cnblogs.com/lx2509/

シェン李黄：https://edu.cnblogs.com/campus/fzu/2019FZUSEZ/homework/8736

2.GitHubアドレス
https://github.com/lx509/031702509-031702535

第二に、労働者の特定の部門

リーは楽しむ：書き込みコード、テスト、UIデザイン
シェン李、黄：代替、更新、ブログの書き込みの新バージョン

三、PSP用フォーム

PSP2.1	パーソナルソフトウェアプロセス段階	推定時間がかかる（分）	実際の時間がかかる（分）
プランニング	計画	60	30
推計	このタスクが必要とどのくらいの時間を見積もります	60	60
開発	開発	2160	2880
分析	（新しい技術を学ぶ含む）ニーズ分析	600	720
デザインスペック	設計ドキュメントの生成	60	40
デザインレビュー	デザインレビュー	30	30
標準コーディング	コードの仕様（現在の開発のための適切な規範の開発）	10	10
設計	具体的な設計	60	60
コーディング	具体的なコーディング	720	900
コードレビュー	コードレビュー	60	30
テスト	検査（セルフテスト、コードを変更し、変更を提出）	120	180
報告	レポート	60	60
テストrepor	テストレポート	20	20
サイズ測定	コンピューティングのワークロード	10	10
死後＆プロセス改善計画	その後まとめ、およびプロセス改善計画	10	10
	トータル	1850	2100

問題解決のためのアイデアの記述と説明の第四に、設計と実装

問題解決のためのアイデア

スパニングツリーは〜のjQueryを使用しています

コード組織と内部実装設計（クラス図）

により、我々は基本的に匿名関数や構造あるコードには、特定のメソッド名で書かれたので、このような何かすることはできません。

部分的なフローチャートを達成するための鍵と鍵アルゴリズム
アルゴリズム1の鍵部分
入力データ分割処理は、今接続ロジック出力ノードスーパーバイザに従って、学生の残りの部分は、その後、ノード教師に接続されたノードを判定しています。
・
2.フローチャート
一般的スキーム：

処理ノードフローチャート教師：

処理ノードの他のフローチャート：

・

3.キーコードと解説

アレイへのテキスト入力ボックス - スプリットSS []アレイに分割（）メソッドと正規表現を使用して

var s =document.getElementById("text1").value;
var reg = new RegExp("导师：","g");
s.replace(reg,"导师：/");
var reg = new RegExp("级博士生：","g");
s.replace(reg,"级博士生：/");
var reg = new RegExp("级硕士生：","g");
s.replace(reg,"级硕士生：/");
var reg = new RegExp("级本科生：","g");
s.replace(reg,"级本科生：/");
var reg = new RegExp(" ","g");
s.replace(reg,"");
var length=s.length;
if (s[length-1].match(/\n|\r/g))
alert("文本末不能有空行！");
var reg = /\n(\n)*( )*(\n)*\n/g;
s = s.replace(reg,"\n");
var ss = s.split(/、|\n|\r|：|\t|\ +/g);

プロセススーパバイザノード - リスティングSS [I] ==「教師」、HTMLを使用すると、に分割されているノードのリストに追加し続ける場合は、最初の追加及びスーパーバイザノードは、ノードが最初に添加されていない教師であります

if(i==0){
    if(ss[i]=="导师"){
        $("#Tree").html('<li id="id4'+num4+'"><span  id="id5'+num5+'" class="badge badge-success"> 导师</span></li>');
        num4++;
        i++;
        $('#id5'+num5).after('<ul><li id="tc'+tc+'"><span id="teacher"> '+ss[i]+'</span></li></u1>');
        num5++;
    }
    else{
    break;
    } 
    console.log(ss[i]);
}
else{
    if(ss[i]=="导师"){
    $('#id4'+(num4-1)).after('<li id="id4'+num4+'"><span  id="id5'+num5+'" class="badge badge-success"> 导师</span></li>');
    num4++;
    i++;
    $('#id5'+num5).after('<ul><li id="tc'+tc+'"><span id="teacher"> '+ss[i]+'</span></li></u1>');
    num5++;
    }
    else{
        break;
    } 
    console.log(ss[i]);
}

他のキーワード処理ノード（もしSS [i]は、キーワード「博士号レベル」、「マスタークラス」、「学部生」、HTMLのリストを使用して、継続的にノードのリストに追加するための）

if(ss[i].match(/(([0-9]+)级博士生)|(([0-9]+)级硕士生)|(([0-9]+)级本科生)/)){
    $('#tc'+tc).after('<li><span id="id'+num1+'" class="badge badge-success"> </span></li>');

    $('#id'+num1).html(ss[i]);
    console.log(ss[i]);
    i++;
    var j=1;
    for(;i<ss.length;i++){
        console.log(ss[i]);
        if(ss[i].match(/(([0-9]+)级博士生)|(([0-9]+)级硕士生)|(([0-9]+)级本科生)|导师/)){
            i--;
            break;
        }
        if(j==1){
            $('#id'+num1).after('<ul><li id="id3'+num3+'"><span id="id2'+num2+'"> </span></li></u1>');
            j++;
        }
        else{
            $('#id3'+(num3-1)).after('<li id="id3'+num3+'"><span id="id2'+num2+'"> </span></li>');
        }
        $('#id2'+num2).html(ss[i]);
        num2=num2+1;
        num3=num3+1;
        console.log(ss[i]);
    }  
        num1=num1+1;
}
else{
    break;
}

折り処理

$('.tree li:has(ul)').addClass('parent_li').find(' > span').attr('title', 'Collapse this branch');

    $('.tree li.parent_li > span').on('click', function (e) {
        var children = $(this).parent('li.parent_li').find(' > ul > li');
    
        if (children.is(":visible")) {
            children.hide('fast');
            $(this).attr('title', 'Expand this branch').find(' > i').addClass('icon-plus-sign').removeClass('icon-minus-sign');
            } 
        else {
            children.show('fast');
            $(this).attr('title', 'Collapse this branch').find(' > i').addClass('icon-minus-sign').removeClass('icon-plus-sign');
        }
            e.stopPropagation();
    });
        
});

5つの追加のデザインや表示機能

1.ユニークなデザインの創造、設計センス
同時に入力、複数のツリーの共存をデータの複数のセットをサポートするためには、
各生成された入力ツリーからのデータは、後続の試験なしで、生成されたツリーの最後の入力を覆うとで使用することができます繰り返し更新し、
インターフェース造園を、

2.実現する考え
すべての入力データは、次にノード教師学生と次の世代を識別する、ノードを識別するために、教師、博士ステージXX、XXレベルのマスター、XX学部学生とインストラクターに分割します。
、フォントのリソースをダウンロードしてPSおよび他のバックグラウンド、およびCSS / bootstrap.min.cssとCSS / CSSのstyle.cssページが造園された呼び出します。

3.実績展
首尾よく実証され

第六に、カタログの説明と使用のための指示書

七、ユニットテスト

1.テストツール：モカの
学習ウェブサイト：http://www.ruanyifeng.com/blog/2015/12/a-mocha-tutorial-of-examples.html
簡単なチュートリアル：
1、ファイル内のgitディレクトリにテストします
2、インストールノードの前提の下でコマンドを実行します。
CDモカ-デモが

インストールNPM

：3、総合的な設置環境を
NPM --globalモカインストール

：アサーションライブラリチャイをインストールし、4を
NPMチャイインストールし

、5テストファイルを実行します。
モカtest.js

テストを学習ウェブサイトの方法で作成した文書を参照してください

テストコードと試験結果の一部は、
（1）入力の単一のセットは、

（2）入力の単一のセットは、注文転置をキーワード

スーパーバイザキーの欠如以外の入力（3）単一のセット、

入力（4）単一のセットのみスーパバイザ・ノード

（ 5）は、2つの入力

の入力の三つのグループ、各入力が変化し（6）

の入力（7）は、3つのグループを、各入力ライン数は、各群において同じではない

（8）開始家庭教師する入力されていない

（9）入力テキスト空行の終わり

テストデータを構築するという考え

入力と入力の複数のセットの単一のセットを考慮するので、関連するテスト・データ構造。
異なるメンターの学生を考慮すると、複数のカテゴリが含まれていてもよい、それだけの学生の単一のクラスなので、関連する試験データの構造をしてもよいです。
考慮し、ユーザが入力データの順序に必ずしもではない場合、入力データ、データ構造。
アカウントに入るデータは自然に最後のグループは、その通知を行いますEnterキーを押して、データの入力が終了している可能性があるユーザーを取ります。

八、GitHubのコードチェックインの記録

ナインは、コードモジュールは困難または結び目とソリューションを経験されて

問題の説明：
1は、それがデータツリーノードを作成し、テキストボックスを扱うことができない
1、情報への2件のアクセスを、についてハード考えるように：試みるために何をした
解決するかどうか：された
JSONデータファイルをオンにしようとし始めて全く分からない、：どのような収穫ターン、彼はあきらめなければなりませんでした。最後に、分割（）メソッドとキックを強制する正規表現。
複数のツリーノードを実行するときに2、第2のツリーは、最初の木のの一部となります
1、デバッグコンソールを使用して、再度、サンプルコード分析を使用して2を踏襲：何をしてみてくださいするには
解決されます。ある
ものを収穫：コンソールは、実際にはかなり良いですが、デバッグアーティファクト！
3、どのように関連ツリーを形成するために
何をしようとするんでした：1は、情報へのアクセス2、についてハード考えるように
対処するかどうか：いいえ
何収穫：時間の不足が救命ああを考えて！

テン、あなたのチームメイトを評価

シェン李黄：
・価値の学習場所は
本当に、学習能力、超信頼できるパートナーである忍耐、彼女の後ろ足をドラッグ少しを感じ、そして彼女から学ぶことがたくさんある必要があります。
・改善のための領域
輝きは、まだ発見します！

リーは楽しむ：
・勉強の価値が
始まりと彼のチームメイトは何の手掛かりを持っていないので、あなたが分割することを選択し、一緒に徹夜、ほとんど木の友人の2つのバージョンを作るためにポイントハハ、頑張ってチームメイトに感謝します！
・改善のための領域は、
VUEを学ぶために一緒に時間を持っていますか？

ソフトウェア工学実践2019第五の求人 - ペアプログラミング