django add router support

cuaFramework · Nov 1, 2017 · b7e17ce · b7e17ce
1 parent 9e1b7f7
commit b7e17ce
Show file tree

Hide file tree

Showing 3 changed files with 96 additions and 36 deletions.
diff --git a/arbiter-web/arbiter/core/templates/case/index.html b/arbiter-web/arbiter/core/templates/case/index.html
@@ -129,16 +129,14 @@ <h2 slot="left">用例管理</h2>
     <div id="case-paper">
         <div v-for="(value, key) in caseMap">
             <div>
-                <div class="flex-between"><b class="grey-text paper-pyname" @click="showcode(key)">{{ key }}</b>
+                <div class="flex-between"><b class="grey-text paper-pyname" @click="showcode(key,value)">{{ key }}</b>
                     <mu-icon-button icon="delete" icon-class="red-icon"></mu-icon-button>
                 </div>
             </div>
             <div v-if="pyname===key">
-                <mu-paper class="code-paper" :z-depth="2" :key="key">
-                    <div class="flex-between"><i class="brown800-text paper-casename">{{ value }}</i>
-                        <mu-icon-button icon="play_arrow" icon-class="green-icon"
-                                        @click="run(key,value)"></mu-icon-button>
-                    </div>
+                <mu-paper class="code-paper" :z-depth="2" :key="key" >
+                    <code-paper :pypath="value"></code-paper>
+                     <div id="codecontent" ref="mybox+"></div>
                 </mu-paper>
             </div>
             <div v-else v-for="(v, k) in value">
@@ -157,9 +155,7 @@ <h2 slot="left">用例管理</h2>
 <template id="codePaper">
     {% verbatim %}
     <div id="code-paper">
-        <mu-paper class="long-little-paper" :z-depth="2">
-            <div id="code-content"></div>
-        </mu-paper>
+            <div id="codecontent"></div>
     </div>
     {% endverbatim %}
 

diff --git a/arbiter-web/arbiter/static/arbiter/css/index.css b/arbiter-web/arbiter/static/arbiter/css/index.css
@@ -28,15 +28,11 @@ body {
     display: none;
 }
 
-#code-content {
-    position: fixed;
-    left: 256px;
-    top: 60px;
-    right: 0;
-    width: auto;
+#codecontent {
+    top: 0;
+
     bottom: 0;
-    size: 14px;
-    z-index: -1;
+
 
 }
 
@@ -47,6 +43,7 @@ body {
     right: 0;
     width: auto;
     bottom: 0;
+    overflow-y: scroll;
     size: 14px;
     z-index: -1;
 }

diff --git a/arbiter-web/arbiter/static/arbiter/js/slide.js b/arbiter-web/arbiter/static/arbiter/js/slide.js
@@ -52,7 +52,7 @@ let Event = new Vue();
 let username = getusername();
 let casefullname = null;
 let run_socket = new WebSocket("ws://" + window.location.host + "/arbiter/");
-let allCase = {};
+let allCase = null;
 
 const ArbiterNavbar = {
     template: '#arbiterNavbar'
@@ -305,11 +305,11 @@ const CaseFloatBtn = {
         return {
             modalShow: true,
             seen: false,
-            casefullname:"",
+            casefullname: "",
             logDialog: false,
             logContent: [],
         }
-    },mounted() {
+    }, mounted() {
         let _this = this;
         Event.$on('run-case', function (casefullname) {
             _this.casefullname = casefullname;
@@ -338,7 +338,7 @@ const CaseFloatBtn = {
         cleanLog() {
             this.logContent = [];
         },
-                run() {
+        run() {
             if (username === null) {
                 window.location.href = "login";
             }
@@ -365,9 +365,65 @@ const CaseFloatBtn = {
         },
     }
 };
+const CodePaper = {
+    data: {pypath: null,},
+    template: '#codePaper',
+    mounted() {
+
+
+        if (!!this.pypath) {
+           for (let [k, v] of Object.entries(this.pypath)) {
+                caseNamePath = k;
+            }
+            caseNamePath = caseNamePath.split(":")[0];
+            this.pypath = caseNamePath.split(".").join("/") + ".py";
+
+            this.loadCaseFile(this.pypath)
+        }
+
+    }
+    ,
+    methods: {
+        showcode(key, value) {
+            this.$router.push({name: 'casepathpy', params: {pyname: key}});
+            let caseNamePath = null;
+
+            for (let [k, v] of Object.entries(value)) {
+                caseNamePath = k;
+            }
+            caseNamePath = caseNamePath.split(":")[0];
+            this.pypath = caseNamePath.split(".").join("/") + ".py";
+
+        },
+        loadCaseFile(caseNamePath) {
+
+          //  document.getElementById("codecontent").style.fontSize = "14px";
+           // document.getElementById("codecontent").style.height = "600px";
+            let codeContent = ace.edit(this.$el);
+            codeContent.setTheme("ace/theme/github");
+            codeContent.setReadOnly(true);//设置只读
+            codeContent.$blockScrolling = Infinity;
+            codeContent.session.setMode("ace/mode/python");
+            // setBtn("edit");
+            /*查询可编辑状态*/
+            new ValidateEditWebSocket(caseNamePath);
+            let xhr = new XMLHttpRequest();
+            xhr.open('GET', '/static/' + caseNamePath, true);
+            xhr.setRequestHeader("If-Modified-Since", "0");
+            xhr.onreadystatechange = function () {
+                if (xhr.readyState === 4) {
+                    codeContent.setValue(xhr.responseText, -1);//设置显示内容，并将光标移动到start处
+                }
+            };
+            xhr.send(null);
+        }
+
+    }
+};
 const CasePaper = {
-    props: {casemodel: "",pyname:""},
+    props: {casemodel: "", pyname: "",pypath:""},
     template: '#casePaper',
+    components:{'CodePaper': CodePaper,},
     data() {
         return {caseMap: {}};
     },
@@ -398,6 +454,14 @@ const CasePaper = {
             });
             _this.caseMap = toAllpaperMap(_this.caseMap);
         });
+
+        if (!!allCase) {
+            Event.$emit('change-paper', allCase);
+        }
+        if (!!this.pyname) {
+          this.loadCaseFile(this.pypath);
+        }
+
     }
     ,
     methods: {
@@ -406,21 +470,22 @@ const CasePaper = {
             Event.$emit('run-case', testcase);
 
         },
-        showcode(key) {
-             this.$router.push({name: 'casepathpy', params: {pyname: key}});
-             this.loadCaseFile(casePath)
+        showcode(key, value) {
+            this.$router.push({name: 'casepathpy', params: {pyname: key}});
+            let caseNamePath = null;
+
+            for (let [k, v] of Object.entries(value)) {
+                caseNamePath = k;
+            }
+            caseNamePath = caseNamePath.split(":")[0];
+            this.pypath = caseNamePath.split(".").join("/") + ".py";
 
         },
-                loadCaseFile(casePath) {
-            //guide 显示到隐藏，root-case从隐藏到显示
-            casefullname = casePath;
-            //设置标题显示用例类名+方法名
-            let caseclassname = casefullname.split(":")[1];
-            //读取用例文件,并设置codeContent
-            let caseNamePathList = casefullname.split("/");//获取用例路径，解析内容
-            let caseNamePath = caseNamePathList[caseNamePathList.length - 1].split(":")[0].split(".").join("/") + ".py";
-            document.getElementById("code-content").style.fontSize = "14px";
-            let codeContent = ace.edit("code-content");
+        loadCaseFile(caseNamePath) {
+            console.log(this.$refs.mybox);
+          //  document.getElementById("codecontent").style.fontSize = "14px";
+           // document.getElementById("codecontent").style.height = "600px";
+            let codeContent = ace.edit(this.$refs.xxx);
             codeContent.setTheme("ace/theme/github");
             codeContent.setReadOnly(true);//设置只读
             codeContent.$blockScrolling = Infinity;
@@ -442,6 +507,7 @@ const CasePaper = {
     }
 };
 
+
 const router = new VueRouter({
     mode: 'history',
     base: "arbiter",
@@ -488,8 +554,9 @@ let navbar_app = new Vue({
         'ArbiterNavbar': ArbiterNavbar,
         'ArbiterSlide': ArbiterSlide,
         'CodeFloatBtn': CodeFloatBtn,
-        'CaseFloatBtn':CaseFloatBtn,
+        'CaseFloatBtn': CaseFloatBtn,
         'CasePaper': CasePaper,
+        'CodePaper': CodePaper,
     }
 });