From d8dcc06f9c6cc51a68db66e185954670eeaf7da8 Mon Sep 17 00:00:00 2001
From: colorfulberry <senluowanxiangt@gmail.com>
Date: Fri, 29 May 2020 10:25:03 +0800
Subject: [PATCH] feat: improve the pages for js

---
 templates/repo/datasets/index.tmpl | 67 +++++++++++++++++++++++++++-----------
 web_src/js/index.js                | 12 +++++++
 2 files changed, 60 insertions(+), 19 deletions(-)

diff --git a/templates/repo/datasets/index.tmpl b/templates/repo/datasets/index.tmpl
index 4afe13083..b24c4abca 100644
--- a/templates/repo/datasets/index.tmpl
+++ b/templates/repo/datasets/index.tmpl
@@ -1,30 +1,61 @@
 {{template "base/head" .}}
-<div class="repository release">
+<div class="repository release dataset-list view">
 	{{template "repo/header" .}}
-	<div class="ui container">
-		{{template "base/alert" .}}
-    <div class="ui two column stackable grid">
+	<form class="ui container">
+    {{template "base/alert" .}}
+    <div class="ui two column stackable grid" id="dataset-content">
       <div class="column">
-			  <h2>{{.i18n.Tr "datasets"}}</h2>
+        <h2>{{.i18n.Tr "datasets"}}</h2>
+        <div id="dataset-desc">
+          <span class="no-description text-italic">No Description</span>
+        </div>
       </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 class="menu">
-            <a class="item" href="{{$.Link}}?sort=newest&q={{$.Keyword}}&tab={{$.TabName}}">{{.i18n.Tr "repo.issues.filter_sort.latest"}}</a>
-            <a class="item" href="{{$.Link}}?sort=oldest&q={{$.Keyword}}&tab={{$.TabName}}">{{.i18n.Tr "repo.issues.filter_sort.oldest"}}</a>
-            <a class="item" href="{{$.Link}}?sort=oldest&q={{$.Keyword}}&tab={{$.TabName}}">{{.i18n.Tr "repo.issues.filter_sort.recentupdate"}}</a>
-            <a class="item" href="{{$.Link}}?sort=oldest&q={{$.Keyword}}&tab={{$.TabName}}">{{.i18n.Tr "repo.issues.filter_sort.leastupdate"}}</a>
-          </div>
-        </div>
+        <a class="ui button primary" href="javascript:void(0)" id="dataset-edit">
+          编辑
+        </a>
+      </div>
+    </div>
+
+    <div class="ui grid form segment success" id="dataset-content-edit" style="display:none">
+      <label class="d-block">{{.i18n.Tr "dataset.title"}}</label>
+      <div class="sixteen wide column">
+        <input name="title" placeholder='{{.i18n.Tr "dataset.title"}}' value="{{.title}}" autofocus required maxlength="255">
+      </div>
+      <label class="d-block">{{.i18n.Tr "dataset.description"}}</label>
+      <div class="sixteen wide column">
+        <textarea name="description" rows="3">{{.description}}</textarea>
+      </div>
+      <div class="sixteen wide column">
+        <a class="ui button" id="cancel">{{.i18n.Tr "cancel"}}</a>
+        <button class="ui primary button">{{.i18n.Tr "dataset.update_dataset"}}</button>
       </div>
     </div>
+
     <div class="ui divider"></div>
     <div class="ui grid">
       <div class="row">
         <div class="ui twelve wide column">
+          <div class="ui sixteen wide column">
+            <div class="ui two column stackable grid">
+            <div class="column">
+              <h2>{{.i18n.Tr "datasets"}}</h2>
+            </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 class="menu">
+                  <a class="item" href="{{$.Link}}?sort=newest&q={{$.Keyword}}&tab={{$.TabName}}">{{.i18n.Tr "repo.issues.filter_sort.latest"}}</a>
+                  <a class="item" href="{{$.Link}}?sort=oldest&q={{$.Keyword}}&tab={{$.TabName}}">{{.i18n.Tr "repo.issues.filter_sort.oldest"}}</a>
+                  <a class="item" href="{{$.Link}}?sort=oldest&q={{$.Keyword}}&tab={{$.TabName}}">{{.i18n.Tr "repo.issues.filter_sort.recentupdate"}}</a>
+                  <a class="item" href="{{$.Link}}?sort=oldest&q={{$.Keyword}}&tab={{$.TabName}}">{{.i18n.Tr "repo.issues.filter_sort.leastupdate"}}</a>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
           <div class="dataset list">
             {{template "repo/datasets/dataset_list" .}}
           </div>
@@ -41,8 +72,6 @@
         </div>
       </div>
     </div>
-
-
-	</div>
+  </form>
 </div>
 {{template "base/footer" .}}
diff --git a/web_src/js/index.js b/web_src/js/index.js
index c6f90d7ab..63d04699c 100644
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -1086,6 +1086,18 @@ async function initRepository() {
     initReactionSelector();
   }
 
+  // Datasets
+  if ($('.repository.dataset-list.view').length > 0) {
+    const editContentToggle = function () {
+      $('#dataset-content').toggle();
+      $('#dataset-content-edit').toggle();
+      $('#dataset-content input').focus();
+      return false;
+    };
+    $('#dataset-edit').on('click', editContentToggle);
+    $('#cancel').on('click', editContentToggle);
+  }
+
   // Diff
   if ($('.repository.diff').length > 0) {
     $('.diff-counter').each(function () {