From 8a50a8d67cb2c5453aa4f5e73995cb85a22dfe0b Mon Sep 17 00:00:00 2001
From: Gitea <gitea@fake.local>
Date: Thu, 25 Mar 2021 23:28:40 +0800
Subject: [PATCH] initial navbar and table style

---
 options/locale/locale_zh-CN.ini               |  23 ++
 templates/repo/modelarts/notebook/index.tmpl  | 104 ++++----
 .../modelarts/trainjob/job_paramter_list.tmpl | 127 +++++++++
 .../modelarts/trainjob/new_train_job.tmpl     | 249 ++++++++++++++++++
 .../modelarts/trainjob/train_job_list.tmpl    | 127 +++++++++
 web_src/less/themes/theme-arc-green.less      |   0
 6 files changed, 579 insertions(+), 51 deletions(-)
 create mode 100755 templates/repo/modelarts/trainjob/job_paramter_list.tmpl
 create mode 100755 templates/repo/modelarts/trainjob/new_train_job.tmpl
 create mode 100755 templates/repo/modelarts/trainjob/train_job_list.tmpl
 mode change 100644 => 100755 web_src/less/themes/theme-arc-green.less

diff --git a/options/locale/locale_zh-CN.ini b/options/locale/locale_zh-CN.ini
index 94f71ac6f..b4127d4d9 100755
--- a/options/locale/locale_zh-CN.ini
+++ b/options/locale/locale_zh-CN.ini
@@ -762,6 +762,29 @@ cloudbrain_selection=云脑选择
 cloudbrain_platform_selection=选择您准备使用的云脑平台：
 confirm_choice=确定
 
+modelarts.train_job=训练作业
+modelarts.train_job.new=新建作业
+modelarts.train_job.job_name=作业名称
+modelarts.train_job.version=作业版本
+modelarts.train_job.description=作业描述
+modelarts.train_job.algorithm_origin=算法来源
+modelarts.train_job.AI_driver=AI引擎
+modelarts.train_job.code_store_location=代码存放路径
+modelarts.train_job.start_file=启动文件
+modelarts.train_job.dataset=选择数据集
+modelarts.train_job.dataset_version=选择数据集版本
+modelarts.train_job.dataset_store_location=数据集存放路径
+modelarts.train_job.train_output_location=训练输出位置
+modelarts.train_job.run_parameter=运行参数
+modelarts.train_job.parameter_name=参数名
+modelarts.train_job.parameter_value=参数值
+modelarts.train_job.resource_pool=资源池
+modelarts.train_job.resource_type=资源类型
+modelarts.train_job.standard=规格
+modelarts.train_job.query_whether_save_parameter=保存作业参数
+modelarts.train_job.common_frame=常用框架
+modelarts.train_job.amount_of_compute_node=计算节点个数
+
 template.items=模板选项
 template.git_content=Git数据(默认分支)
 template.git_hooks=Git 钩子
diff --git a/templates/repo/modelarts/notebook/index.tmpl b/templates/repo/modelarts/notebook/index.tmpl
index cea9e50b7..948b403a9 100755
--- a/templates/repo/modelarts/notebook/index.tmpl
+++ b/templates/repo/modelarts/notebook/index.tmpl
@@ -190,41 +190,46 @@
         border-color: none;
     }
 </style>
-
-<!-- 弹窗 -->
-<div id="mask">
-    <div id="loadingPage">
-        <div class="rect1"></div>
-        <div class="rect2"></div>
-        <div class="rect3"></div>
-        <div class="rect4"></div>
-        <div class="rect5"></div>
-    </div>
-</div>
-
-<!-- 提示框 -->
-<div class="alert"></div>
-
-<div class="repository release dataset-list view">
-    {{template "repo/header" .}}
-    <div class="ui bottom attached segment pushable">
-
-        <!-- 左侧边栏 -->
-        <div class="ui secondary pointing vertical menu" id='taskSidebar' style="float:left; text-align:right;">
-            <a class="active item" href="{{.RepoLink}}/cloudbrain">
-                <svg class="svg octicon-repo" width="16" height="16" aria-hidden="true"><use xlink:href="#octicon-repo"></use></svg> 任务列表
-            </a>
-            <a class="item" href="{{.RepoLink}}/cloudbrain/image_list">
-                <svg class="svg octicon-inbox" width="16" height="16" aria-hidden="true"><use xlink:href="#octicon-inbox"></use></svg> 镜像列表
-            </a>
+<div class="modelarts">
+    <!-- 弹窗 -->
+    <div id="mask">
+        <div id="loadingPage">
+            <div class="rect1"></div>
+            <div class="rect2"></div>
+            <div class="rect3"></div>
+            <div class="rect4"></div>
+            <div class="rect5"></div>
         </div>
+    </div>
 
-        <!-- 右侧内容区 -->
-        <div class="pusher" style="float:right;">
-            <div class="ui basic segment">
-                <!-- 列表容器 -->
-                <div class="ui container">
+    <!-- 提示框 -->
+    <div class="alert"></div>
 
+    <div class="repository release dataset-list view">
+        {{template "repo/header" .}}
+        <div class="ui container">
+            <div class="ui grid">
+                <!-- 左侧边栏 -->
+                <div class="computer three wide computer column">
+                    <div class="ui grid">
+                        <div class="sixteen wide column ui secondary sticky pointing tabular vertical menu">
+                            <a class="{{if .PageIsExploreRepositories}}active{{end}} item" href="{{AppSubUrl}}/explore/repos">
+                                {{svg "octicon-repo" 16}} {{.i18n.Tr "explore.repos"}}
+                            </a>
+                            <a class="{{if .PageIsDatasets}}active{{end}} item" href="{{AppSubUrl}}/explore/datasets">
+                                {{svg "octicon-inbox" 16}} {{.i18n.Tr "datasets"}}
+                            </a>
+                            <a class="{{if .PageIsExploreUsers}}active{{end}} item" href="{{AppSubUrl}}/explore/users">
+                                {{svg "octicon-person" 16}} {{.i18n.Tr "explore.users"}}
+                            </a>
+                            <a class="{{if .PageIsExploreOrganizations}}active{{end}} item" href="{{AppSubUrl}}/explore/organizations">
+                                {{svg "octicon-organization" 16}} {{.i18n.Tr "explore.organizations"}}
+                            </a>
+                        </div>
+                    </div>
+                </div>
+                <!-- 右侧 -->
+                <div class="ui thirteen wide computer column">
                     <!-- 中间云脑和新建任务按钮 -->
                     <div class="ui three column stack able grid">
                         <div class="column">
@@ -375,31 +380,28 @@
             </div>
         </div>
     </div>
-</div>
-
 
-<!-- 确认模态框 -->
-<div id="deletemodel">
-    <div class="ui basic modal">
-        <div class="ui icon header">
-            <i class="trash icon"></i> 删除任务
-        </div>
+    <!-- 确认模态框 -->
+    <div id="deletemodel">
+        <div class="ui basic modal">
+            <div class="ui icon header">
+                <i class="trash icon"></i> 删除任务
+            </div>
 
-        <div class="content">
-            <p>你确认删除该任务么？此任务一旦删除不可恢复。</p>
-        </div>
-        <div class="actions">
-            <div class="ui red basic inverted cancel button">
-                <i class="remove icon"></i> 取消操作
+            <div class="content">
+                <p>你确认删除该任务么？此任务一旦删除不可恢复。</p>
             </div>
-            <div class="ui green basic inverted ok button">
-                <i class="checkmark icon"></i> 确定操作
+            <div class="actions">
+                <div class="ui red basic inverted cancel button">
+                    <i class="remove icon"></i> 取消操作
+                </div>
+                <div class="ui green basic inverted ok button">
+                    <i class="checkmark icon"></i> 确定操作
+                </div>
             </div>
         </div>
     </div>
 </div>
-
-</div>
 {{template "base/footer" .}}
 
 <script>
@@ -506,4 +508,4 @@
             }
         })
     }
-</script>
\ No newline at end of file
+</script>
diff --git a/templates/repo/modelarts/trainjob/job_paramter_list.tmpl b/templates/repo/modelarts/trainjob/job_paramter_list.tmpl
new file mode 100755
index 000000000..73a80a83b
--- /dev/null
+++ b/templates/repo/modelarts/trainjob/job_paramter_list.tmpl
@@ -0,0 +1,127 @@
+{{template "base/head" .}}
+<div class="repository view">
+    {{template "repo/header" .}}
+    <style>
+        .ui.segment.bottom.attached {
+            border: none;
+        }
+        
+        .ui.secondary.vertical.pointing.menu{
+            border-right-width: 0;
+            margin-right: 0;
+            border-right-color: white;
+            margin-top: 14px;
+        }
+
+    </style>
+    <div class="modelarts train_job container">
+        <div class="ui container">
+            <div class="ui grid">
+                <div class="three wide column">
+                    <div class="ui grid">
+                        <div class="sixteen wide column ui secondary sticky pointing tabular vertical menu">
+                            <a class="{{if .PageIsExploreRepositories}}active{{end}} item" href="{{AppSubUrl}}/explore/repos">
+                                {{svg "octicon-repo" 16}} {{.i18n.Tr "explore.repos"}}
+                            </a>
+                            <a class="{{if .PageIsDatasets}}active{{end}} item" href="{{AppSubUrl}}/explore/datasets">
+                                {{svg "octicon-inbox" 16}} {{.i18n.Tr "datasets"}}
+                            </a>
+                            <a class="{{if .PageIsExploreUsers}}active{{end}} item" href="{{AppSubUrl}}/explore/users">
+                                {{svg "octicon-person" 16}} {{.i18n.Tr "explore.users"}}
+                            </a>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- 右侧 -->
+                <div class="ui thirteen wide column">
+                    <div class="ui three column stackable grid">
+                        <div class="column">
+                            <h2>{{.i18n.Tr "repo.modelarts.train_job"}}</h2>
+                        </div>
+                        <div class="column">
+                        </div>
+                        <div class="column right aligned">
+                            <a class="ui green button" href="{{.RepoLink}}/modelarts/notebook/create">{{.i18n.Tr "repo.modelarts.train_job.new"}}</a>
+                        </div>
+                    </div>
+                    <div class="ui divider"></div>
+                    <div class="ui thirteen wide column">
+                        <div class="ui thirteen wide column">
+                            <div class="ui two column stackable grid">
+                                <div class="column">
+                                </div>
+                                <div class="column right aligned">
+                                    <div class="ui right dropdown type jump item">
+                                        <span class="text">
+                                            {{.i18n.Tr "repo.issues.filter_sort"}}<i class="dropdown icon"></i>
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+    
+                        <!-- 任务展示 -->
+                        <div class="train_job list">
+                            {{range .Tasks}}
+                            <div class="ui grid stackable item">
+                                <div class="row">
+                                    <!-- 任务名 -->
+                                    <div class="four wide column">
+                                        <a class="title" href="{{$.Link}}/{{.JobID}}">
+                                            <span class="fitted">{{svg "octicon-tasklist" 16}}</span>
+                                            <span class="fitted">{{.JobName}}</span>
+                                        </a>
+                                    </div>
+    
+                                    <!--引擎类型状态 -->
+                                    <div class="two wide column job-status" id="{{.JobID}}" data-repopath="{{$.RepoRelPath}}" data-jobid="{{.JobID}}">
+                                        {{.Status}}
+                                    </div>
+    
+    
+                                    <!-- 任务创建时间 -->
+                                    <div class="three wide column">
+                                        <span class="ui text center">{{svg "octicon-flame" 16}} {{TimeSinceUnix .CreatedUnix $.Lang}}</span>
+                                    </div>
+    
+                                    <!-- 查看 -->
+                                    <div class="one wide column">
+                                        <span class="ui text center clipboard">
+                                            <a class="title" href="{{$.Link}}/{{.JobID}}">
+                                                <span class="fitted">查看</span>
+                                            </a>
+                                        </span>
+                                    </div>
+    
+                                    <!-- 删除 -->
+                                    <div class="two wide column">
+                                        <div class="ui text center clipboard">
+                                            <form id="delForm-{{.JobID}}" action="{{if ne .Status "STOPPED"}}javascript:void(0){{else}}{{$.Link}}/{{.JobID}}/del{{end}}" method="post">
+                                                {{$.CsrfTokenHtml}}
+                                                <a class="fitted" onclick="assertDelete(this)" style="{{if ne .Status "STOPPED"}}color:#CCCCCC{{end}}; font-size:16px; font-weight:bold">删除</a>
+                                            </form>
+                                        </div>
+                                    </div>
+    
+                                    <!-- 停止 -->
+                                    <div class="two wide column">
+                                        <div class="ui text center clipboard">
+                                            <form id="stopForm-{{.JobID}}" action="{{if ne .Status "RUNNING"}}javascript:void(0){{else}}{{$.Link}}/{{.JobID}}/stop{{end}}" method="post">
+                                                {{$.CsrfTokenHtml}}
+                                                <a class="fitted" onclick="document.getElementById('stopForm-{{.JobID}}').submit();" style="{{if ne .Status "RUNNING"}}color:#CCCCCC{{end}}; font-size:16px; font-weight:bold">停止</a>
+                                            </form>
+                                        </div>
+                                    </div>
+    
+                                </div>
+                            </div>
+                            {{end}} {{template "base/paginate" .}}
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{{template "base/footer" .}}
\ No newline at end of file
diff --git a/templates/repo/modelarts/trainjob/new_train_job.tmpl b/templates/repo/modelarts/trainjob/new_train_job.tmpl
new file mode 100755
index 000000000..30822cabe
--- /dev/null
+++ b/templates/repo/modelarts/trainjob/new_train_job.tmpl
@@ -0,0 +1,249 @@
+{{template "base/head" .}}
+<!-- <style>
+    /* 遮罩层css效果图  */
+    
+    #mask {
+        position: fixed;
+        top: 0px;
+        left: 0px;
+        right: 0px;
+        bottom: 0px;
+        filter: alpha(opacity=60);
+        background-color: #777;
+        z-index: 1000;
+        display: none;
+        opacity: 0.8;
+        -moz-opacity: 0.5;
+        padding-top: 100px;
+        color: #000000
+    }
+    /* 加载圈css效果图 */
+    
+    #loadingPage {
+        margin: 200px auto;
+        width: 50px;
+        height: 40px;
+        text-align: center;
+        font-size: 10px;
+        display: block;
+    }
+    
+    #loadingPage>div {
+        background-color: green;
+        height: 100%;
+        width: 6px;
+        display: inline-block;
+        -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
+        animation: sk-stretchdelay 1.2s infinite ease-in-out;
+    }
+    
+    #loadingPage .rect2 {
+        -webkit-animation-delay: -1.1s;
+        animation-delay: -1.1s;
+    }
+    
+    #loadingPage .rect3 {
+        -webkit-animation-delay: -1.0s;
+        animation-delay: -1.0s;
+    }
+    
+    #loadingPage .rect4 {
+        -webkit-animation-delay: -0.9s;
+        animation-delay: -0.9s;
+    }
+    
+    #loadingPage .rect5 {
+        -webkit-animation-delay: -0.8s;
+        animation-delay: -0.8s;
+    }
+    
+    @-webkit-keyframes sk-stretchdelay {
+        0%,
+        40%,
+        100% {
+            -webkit-transform: scaleY(0.4)
+        }
+        20% {
+            -webkit-transform: scaleY(1.0)
+        }
+    }
+    
+    @keyframes sk-stretchdelay {
+        0%,
+        40%,
+        100% {
+            transform: scaleY(0.4);
+            -webkit-transform: scaleY(0.4);
+        }
+        20% {
+            transform: scaleY(1.0);
+            -webkit-transform: scaleY(1.0);
+        }
+    }
+    
+    .inline.required.field.cloudbrain_benchmark {
+        display: none;
+    }
+</style>
+
+<div id="mask">
+    <div id="loadingPage">
+        <div class="rect1"></div>
+        <div class="rect2"></div>
+        <div class="rect3"></div>
+        <div class="rect4"></div>
+        <div class="rect5"></div>
+    </div>
+</div> -->
+<style>
+    .inline.field>label{
+    
+}
+</style>
+<div class="repository">
+    {{template "repo/header" .}}
+    <div class="repository new repo ui middle very relaxed page grid">
+        <div class="column">
+            {{template "base/alert" .}}
+            
+            <!-- <div class="ui attached segment"> -->
+                
+                <form class="ui form" action="{{.Link}}" method="post">
+                    {{.CsrfTokenHtml}}
+                    <h4 class="ui top attached header">
+                        {{.i18n.Tr "repo.modelarts.train_job.new"}}
+                    </h4>
+                    <div class="ui attached segment">
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.job_name"}}</label>
+                            <input name="job_name" id="cloudbrain_job_name" placeholder={{.i18n.Tr "repo.modelarts.train_job.job_name"}} value="{{.job_name}}" tabindex="3" autofocus required maxlength="255">
+                        </div>
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.version"}}</label>
+                            <span>第一版本</span>
+                        </div>
+                                               
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.algorithm_origin"}}</label>
+                            <select class="ui search dropdown" id="cloudbrain_image" placeholder={{.i18n.Tr "repo.modelarts.train_job.common_frame"}} style='width:385px' name="image">
+                                {{range .images}}
+                                    <option name="image" value="{{.Place}}">{{.PlaceView}}</option>
+                                {{end}}
+                            </select>
+                        </div>
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.AI_driver"}}</label>
+                                <select class="ui search dropdown" id="cloudbrain_benchmark_category" style='width:385px'>
+                                    {{range .benchmark_categories}}
+                                        <option value="{{.Value}}">{{.Value}}</option>
+                                    {{end}}
+                                </select>
+                        </div>
+                        <div class="inline field">
+                            <label></label>
+                                <select class="ui search dropdown" id="cloudbrain_benchmark_category" style='width:385px'>
+                                    {{range .benchmark_categories}}
+                                        <option value="{{.Value}}">{{.Value}}</option>
+                                    {{end}}
+                                </select>
+                        </div>
+                        
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.dataset"}}</label>
+                            <select class="ui search dropdown" id="cloudbrain_benchmark_category" style='width:385px'>
+                                {{range .benchmark_categories}}
+                                    <option value="{{.Value}}">{{.Value}}</option>
+                                {{end}}
+                            </select>
+                        </div>
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.dataset_version"}}</label>
+                            <select class="ui search dropdown" id="cloudbrain_benchmark_category" style='width:385px'>
+                                {{range .benchmark_categories}}
+                                    <option value="{{.Value}}">{{.Value}}</option>
+                                {{end}}
+                            </select>
+                        </div>
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.dataset_store_location"}}</label>
+                            <input name="dataset_path" id="cloudbrain_dataset_path" value="{{.dataset_path}}" tabindex="3" autofocus required maxlength="255" readonly="readonly">
+                        </div>
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.train_output_location"}}</label>
+                            <input name="dataset_path" id="cloudbrain_dataset_path" value="{{.dataset_path}}" tabindex="3" autofocus required maxlength="255" readonly="readonly">
+                        </div>
+
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.run_parameter"}}</label>
+                            <input type="text" placeholder={{.i18n.Tr "repo.modelarts.train_job.parameter_name"}}>
+                        </div>
+                        <div class="inline field">
+                            <label></label>
+                            <input type="text" placeholder={{.i18n.Tr "repo.modelarts.train_job.parameter_value"}}>
+                        </div>
+                        
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.resource_pool"}}</label>
+                            <select class="ui search dropdown" multiple="multiple" id="cloudbrain_benchmark_category" style='width:385px'>
+                                {{range .benchmark_categories}}
+                                    <option value="{{.Value}}">{{.Value}}</option>
+                                {{end}}
+                            </select>
+                        </div>
+                        <!-- 资源类型待完善 -->
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.resource_type"}}</label>
+                            <input name="job_type" id="cloudbrain_job_type" value="{{.notebook_type}}" tabindex="3" autofocus required maxlength="255" readonly="readonly">
+                        </div>
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.standard"}}</label>
+                            <select class="ui search dropdown" multiple="multiple" id="cloudbrain_benchmark_category" style='width:385px'>
+                                {{range .benchmark_categories}}
+                                    <option value="{{.Value}}">{{.Value}}</option>
+                                {{end}}
+                            </select>
+                        </div>
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.amount_of_compute_node"}}</label>
+                        </div>
+                        <div class="inline field">
+                            <label for="description">{{.i18n.Tr "repo.modelarts.train_job.description"}}</label>
+                            <textarea id="description" name="description" rows="2"></textarea>
+                        </div>
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.code_store_location"}}</label>
+                            <input name="dataset_path" id="cloudbrain_dataset_path" value="{{.dataset_path}}" tabindex="3" autofocus required maxlength="255" readonly="readonly">
+                        </div>
+                        <div class="inline required field">
+                            <label>{{.i18n.Tr "repo.modelarts.train_job.start_file"}}</label>
+                            <input name="dataset_path" id="cloudbrain_dataset_path" value="{{.dataset_path}}" tabindex="3" autofocus required maxlength="255" readonly="readonly">
+                        </div>
+                        <div class="inline field">
+                            <label></label>
+                            <div class="ui checkbox">
+                                <input name="template" type="checkbox">
+                                <label>{{.i18n.Tr "repo.modelarts.train_job.query_whether_save_parameter"}}</label>
+                            </div>
+                        </div>
+
+                        
+                        <div class="inline field">
+                            <label></label>
+                            <button class="ui green button" onclick="showmask()">
+                            {{.i18n.Tr "repo.cloudbrain.new"}}
+                            </button>
+                            <a class="ui button" href="/">{{.i18n.Tr "repo.cloudbrain.cancel"}}</a>
+                        </div>
+                        </form>
+                    </div>
+                </form>
+            <!-- </div> -->
+        </div>
+    </div>
+</div>
+{{template "base/footer" .}}
+
+<script>
+    $('select.dropdown')
+        .dropdown();
+</script>
\ No newline at end of file
diff --git a/templates/repo/modelarts/trainjob/train_job_list.tmpl b/templates/repo/modelarts/trainjob/train_job_list.tmpl
new file mode 100755
index 000000000..6c305219f
--- /dev/null
+++ b/templates/repo/modelarts/trainjob/train_job_list.tmpl
@@ -0,0 +1,127 @@
+{{template "base/head" .}}
+<div class="repository view">
+    {{template "repo/header" .}}
+    <style>
+        .ui.segment.bottom.attached {
+            border: none;
+        }
+        
+        .ui.secondary.vertical.pointing.menu{
+            border-right-width: 0;
+            margin-right: 0;
+            border-right-color: white;
+            margin-top: 14px;
+        }
+
+    </style>
+    <div class="modelarts train_job container">
+        <div class="ui container">
+            <div class="ui grid">
+                <div class="three wide column">
+                    <div class="ui grid">
+                        <div class="sixteen wide column ui secondary sticky pointing tabular vertical menu">
+                            <a class="{{if .PageIsExploreRepositories}}active{{end}} item" href="{{AppSubUrl}}/explore/repos">
+                                {{svg "octicon-repo" 16}} {{.i18n.Tr "explore.repos"}}
+                            </a>
+                            <a class="{{if .PageIsDatasets}}active{{end}} item" href="{{AppSubUrl}}/explore/datasets">
+                                {{svg "octicon-inbox" 16}} {{.i18n.Tr "datasets"}}
+                            </a>
+                            <a class="{{if .PageIsExploreUsers}}active{{end}} item" href="{{AppSubUrl}}/explore/users">
+                                {{svg "octicon-person" 16}} {{.i18n.Tr "explore.users"}}
+                            </a>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- 右侧 -->
+                <div class="ui thirteen wide column">
+                    <div class="ui three column stackable grid">
+                        <div class="column">
+                            <h2>{{.i18n.Tr "repo.modelarts.train_job"}}</h2>
+                        </div>
+                        <div class="column">
+                        </div>
+                        <div class="column right aligned">
+                            <a class="ui green button" href="{{.RepoLink}}/modelarts/notebook/create">{{.i18n.Tr "repo.modelarts.train_job.new"}}</a>
+                        </div>
+                    </div>
+                    <div class="ui divider"></div>
+                    <div class="ui thirteen wide column">
+                        <div class="ui thirteen wide column">
+                            <div class="ui two column stackable grid">
+                                <div class="column">
+                                </div>
+                                <div class="column right aligned">
+                                    <div class="ui right dropdown type jump item">
+                                        <span class="text">
+                                            {{.i18n.Tr "repo.issues.filter_sort"}}<i class="dropdown icon"></i>
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+    
+                        <!-- 任务展示 -->
+                        <div class="train_job list">
+                            {{range .Tasks}}
+                            <div class="ui grid stackable item">
+                                <div class="row">
+                                    <!-- 任务名 -->
+                                    <div class="four wide column">
+                                        <a class="title" href="{{$.Link}}/{{.JobID}}">
+                                            <span class="fitted">{{svg "octicon-tasklist" 16}}</span>
+                                            <span class="fitted">{{.JobName}}</span>
+                                        </a>
+                                    </div>
+    
+                                    <!--任务状态 -->
+                                    <div class="two wide column job-status" id="{{.JobID}}" data-repopath="{{$.RepoRelPath}}" data-jobid="{{.JobID}}">
+                                        {{.Status}}
+                                    </div>
+    
+    
+                                    <!-- 任务创建时间 -->
+                                    <div class="three wide column">
+                                        <span class="ui text center">{{svg "octicon-flame" 16}} {{TimeSinceUnix .CreatedUnix $.Lang}}</span>
+                                    </div>
+    
+                                    <!-- 查看 -->
+                                    <div class="one wide column">
+                                        <span class="ui text center clipboard">
+                                            <a class="title" href="{{$.Link}}/{{.JobID}}">
+                                                <span class="fitted">查看</span>
+                                            </a>
+                                        </span>
+                                    </div>
+    
+                                    <!-- 删除 -->
+                                    <div class="two wide column">
+                                        <div class="ui text center clipboard">
+                                            <form id="delForm-{{.JobID}}" action="{{if ne .Status "STOPPED"}}javascript:void(0){{else}}{{$.Link}}/{{.JobID}}/del{{end}}" method="post">
+                                                {{$.CsrfTokenHtml}}
+                                                <a class="fitted" onclick="assertDelete(this)" style="{{if ne .Status "STOPPED"}}color:#CCCCCC{{end}}; font-size:16px; font-weight:bold">删除</a>
+                                            </form>
+                                        </div>
+                                    </div>
+    
+                                    <!-- 停止 -->
+                                    <div class="two wide column">
+                                        <div class="ui text center clipboard">
+                                            <form id="stopForm-{{.JobID}}" action="{{if ne .Status "RUNNING"}}javascript:void(0){{else}}{{$.Link}}/{{.JobID}}/stop{{end}}" method="post">
+                                                {{$.CsrfTokenHtml}}
+                                                <a class="fitted" onclick="document.getElementById('stopForm-{{.JobID}}').submit();" style="{{if ne .Status "RUNNING"}}color:#CCCCCC{{end}}; font-size:16px; font-weight:bold">停止</a>
+                                            </form>
+                                        </div>
+                                    </div>
+    
+                                </div>
+                            </div>
+                            {{end}} {{template "base/paginate" .}}
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{{template "base/footer" .}}
\ No newline at end of file
diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less
old mode 100644
new mode 100755