From 1258df77a3cb99e169bf97cabbd0db4cedca4f5a Mon Sep 17 00:00:00 2001
From: lizhixin <382352532@qq.com>
Date: Tue, 1 Jun 2021 12:13:07 +0800
Subject: [PATCH] login/account/order

---
 src/layout/dashboard/TopNavbar.vue |  39 ++++--
 src/pages/Account/index.vue        |   1 -
 src/pages/Prev/index.vue           |   3 +
 src/pages/ReCheck/OrderTable.vue   | 183 +++++++++++++++++------------
 src/pages/login/index.vue          |  92 +++++++++++++++
 src/router/index.js                |  13 +-
 src/router/routes.js               |  15 ++-
 7 files changed, 259 insertions(+), 87 deletions(-)
 create mode 100644 src/pages/Prev/index.vue
 create mode 100644 src/pages/login/index.vue

diff --git a/src/layout/dashboard/TopNavbar.vue b/src/layout/dashboard/TopNavbar.vue
index 725678c..1a704c0 100644
--- a/src/layout/dashboard/TopNavbar.vue
+++ b/src/layout/dashboard/TopNavbar.vue
@@ -45,17 +45,17 @@
             >
               <!-- <input type="text" class="form-control" placeholder="Search...">
               <div class="input-group-addon"><i class="tim-icons icon-zoom-split"></i></div> -->
-              <button
+              <!-- <button
                 class="btn btn-link"
                 id="search-button"
                 data-toggle="modal"
                 data-target="#searchModal"
               >
                 <i class="tim-icons icon-zoom-split"></i>
-              </button>
+              </button> -->
               <!-- You can choose types of search input -->
             </div>
-            <modal
+            <!-- <modal
               :show.sync="searchModalVisible"
               class="modal-search"
               id="searchModal"
@@ -70,7 +70,7 @@
                 id="inlineFormInputGroup"
                 placeholder="SEARCH"
               />
-            </modal>
+            </modal> -->
             <!-- <base-dropdown tag="li"
                            :menu-on-right="!$rtl.isRTL"
                            title-tag="a" class="nav-item">
@@ -97,7 +97,9 @@
                 <a href="#" class="nav-item dropdown-item">Another one</a>
               </li>
             </base-dropdown> -->
+            <login v-if="!isLogin" @login="login"> </login>
             <base-dropdown
+              v-else
               tag="li"
               :menu-on-right="!$rtl.isRTL"
               title-tag="a"
@@ -127,7 +129,9 @@
               </li>
               <div class="dropdown-divider"></div>
               <li class="nav-link">
-                <a href="#" class="nav-item dropdown-item">Log out</a>
+                <a href="#" class="nav-item dropdown-item" @click="logout"
+                  >登出</a
+                >
               </li>
             </base-dropdown>
           </ul>
@@ -139,11 +143,12 @@
 <script>
 import { CollapseTransition } from "vue2-transitions";
 import Modal from "@/components/Modal";
-
+import Login from "../../pages/login";
 export default {
   components: {
     CollapseTransition,
-    Modal
+    Modal,
+    Login
   },
   computed: {
     routeName() {
@@ -159,9 +164,17 @@ export default {
       activeNotifications: false,
       showMenu: false,
       searchModalVisible: false,
-      searchQuery: ""
+      searchQuery: "",
+      isLogin: localStorage.getItem("robotToken")
     };
   },
+
+  created() {
+    if (localStorage.getItem("robotToken")) {
+      if (this.$route.path == "/prev") this.$router.push("/robot/0");
+    }
+  },
+
   methods: {
     capitalizeFirstLetter(string) {
       return string.charAt(0).toUpperCase() + string.slice(1);
@@ -180,6 +193,16 @@ export default {
     },
     toggleMenu() {
       this.showMenu = !this.showMenu;
+    },
+    login(isLogin) {
+      this.isLogin = isLogin;
+      console.log(isLogin, "why");
+      this.$router.push("/robot/0");
+    },
+    logout() {
+      localStorage.clear();
+      this.isLogin = false;
+      this.$router.push({ path: "/" });
     }
   }
 };
diff --git a/src/pages/Account/index.vue b/src/pages/Account/index.vue
index 6a37e89..1c8bece 100644
--- a/src/pages/Account/index.vue
+++ b/src/pages/Account/index.vue
@@ -94,7 +94,6 @@ import { Modal } from "@/components";
 import { accountTypes } from "../prePages/js/selectoptions";
 
 const tableColumns = [
-  { name: "账号名称", prop: "Name" },
   { name: "账号AccessKey", prop: "AccessKey" },
   { name: "账号SecretKey", prop: "SecretKey" },
   { name: "帐号类型", prop: "AccountType", customSlot: "type" },
diff --git a/src/pages/Prev/index.vue b/src/pages/Prev/index.vue
new file mode 100644
index 0000000..e7d7e89
--- /dev/null
+++ b/src/pages/Prev/index.vue
@@ -0,0 +1,3 @@
+<template>
+  <h3 style="textAlign:center">请先登陆</h3>
+</template>
diff --git a/src/pages/ReCheck/OrderTable.vue b/src/pages/ReCheck/OrderTable.vue
index d684994..d641f27 100644
--- a/src/pages/ReCheck/OrderTable.vue
+++ b/src/pages/ReCheck/OrderTable.vue
@@ -1,78 +1,96 @@
 <template>
-  <div class="table-full-width table-responsive" style="height:500px">
-    <custom-base-table
-      :data="data"
-      :columns="columns"
-      thead-classes="text-primary"
+  <div>
+    <el-select
+      class="select-danger"
+      style="width:200px"
+      placeholder="不限"
+      v-model="sortType"
+      @change="sortChange"
     >
-      <!-- 卖卖类型 -->
-      <template slot="OrderType">
-        <p>买入</p>
-        <p>卖出</p>
-      </template>
-      <!-- 买卖时间 -->
-      <template slot="KLineId" slot-scope="item">
-        <p>
-          {{
-            item.row.item.PurchaseKLineId
-              ? moment(item.row.item.PurchaseKLineId * 1000).format(
-                  "YYYY-MM-DD HH:mm:ss"
-                )
-              : "-"
-          }}
-        </p>
-        <p>
-          {{
-            item.row.item.SaleKLineId
-              ? moment(item.row.item.SaleKLineId * 1000).format(
-                  "YYYY-MM-DD HH:mm:ss"
-                )
-              : "-"
-          }}
-        </p>
-      </template>
-      <!-- 买卖价格 -->
-      <template slot="Price" slot-scope="item">
-        <p>{{ item.row.item.PurchasePrice || "-" }}</p>
-        <p>{{ item.row.item.SalePrice || "-" }}</p>
-      </template>
-      <!-- 买卖数量 -->
-      <template slot="Count" slot-scope="item">
-        <p>{{ item.row.item.PurchaseCoinCount || "-" }}</p>
-        <p>{{ item.row.item.SaleCoinCount || "-" }}</p>
-      </template>
-      <!-- 最大浮亏 -->
-      <template slot="MaxLossRatio" slot-scope="item">
-        <p>{{ item.row.item.MaxLossPrice || "-" }}</p>
-        <p>{{ item.row.item.MaxLossRatio || "-" }}%</p>
-      </template>
-      <!-- 盈亏 -->
-      <template slot="Profit" slot-scope="item">
-        <p>{{ item.row.item.Profit }}</p>
-        <p v-if="item.row.item.Profit">
-          {{
-            (
-              (item.row.item.Profit / item.row.item.TotalPurchasePrice) *
-              100
-            ).toFixed(2)
-          }}%
-        </p>
-        <p v-else>-</p>
-      </template>
-      <!-- 累计盈亏 -->
-      <template slot="TotalProfit" slot-scope="item">
-        <p>{{ item.row.item.TotalProfit }}</p>
-        <p v-if="item.row.item.TotalProfit">
-          {{
-            (
-              (item.row.item.TotalProfit / item.row.item.TotalPurchasePrice) *
-              100
-            ).toFixed(2)
-          }}%
-        </p>
-        <p v-else>-</p>
-      </template>
-    </custom-base-table>
+      <el-option
+        v-for="item in orderTypes"
+        class="select-danger"
+        :value="item.value"
+        :label="item.title"
+        :key="item.value"
+      >
+      </el-option>
+    </el-select>
+    <div class="table-full-width table-responsive" style="height:500px">
+      <custom-base-table
+        :data="data"
+        :columns="columns"
+        thead-classes="text-primary"
+      >
+        <!-- 卖卖类型 -->
+        <template slot="OrderType">
+          <p>买入</p>
+          <p>卖出</p>
+        </template>
+        <!-- 买卖时间 -->
+        <template slot="KLineId" slot-scope="item">
+          <p>
+            {{
+              item.row.item.PurchaseKLineId
+                ? moment(item.row.item.PurchaseKLineId * 1000).format(
+                    "YYYY-MM-DD HH:mm:ss"
+                  )
+                : "-"
+            }}
+          </p>
+          <p>
+            {{
+              item.row.item.SaleKLineId
+                ? moment(item.row.item.SaleKLineId * 1000).format(
+                    "YYYY-MM-DD HH:mm:ss"
+                  )
+                : "-"
+            }}
+          </p>
+        </template>
+        <!-- 买卖价格 -->
+        <template slot="Price" slot-scope="item">
+          <p>{{ item.row.item.PurchasePrice || "-" }}</p>
+          <p>{{ item.row.item.SalePrice || "-" }}</p>
+        </template>
+        <!-- 买卖数量 -->
+        <template slot="Count" slot-scope="item">
+          <p>{{ item.row.item.PurchaseCoinCount || "-" }}</p>
+          <p>{{ item.row.item.SaleCoinCount || "-" }}</p>
+        </template>
+        <!-- 最大浮亏 -->
+        <template slot="MaxLossRatio" slot-scope="item">
+          <p>{{ item.row.item.MaxLossPrice || "-" }}</p>
+          <p>{{ item.row.item.MaxLossRatio || "-" }}%</p>
+        </template>
+        <!-- 盈亏 -->
+        <template slot="Profit" slot-scope="item">
+          <p>{{ item.row.item.Profit }}</p>
+          <p v-if="item.row.item.Profit">
+            {{
+              (
+                (item.row.item.Profit / item.row.item.TotalPurchasePrice) *
+                100
+              ).toFixed(2)
+            }}%
+          </p>
+          <p v-else>-</p>
+        </template>
+        <!-- 累计盈亏 -->
+        <template slot="TotalProfit" slot-scope="item">
+          <p>{{ item.row.item.TotalProfit }}</p>
+          <p v-if="item.row.item.TotalProfit">
+            {{
+              (
+                (item.row.item.TotalProfit / item.row.item.TotalPurchasePrice) *
+                100
+              ).toFixed(2)
+            }}%
+          </p>
+          <p v-else>-</p>
+        </template>
+      </custom-base-table>
+    </div>
   </div>
 </template>
 
@@ -88,7 +106,24 @@ export default {
   },
   components: { CustomBaseTable },
   data() {
-    return { moment, columns: tradeColumns };
+    return {
+      moment,
+      columns: tradeColumns,
+      sortType: 0,
+      orderTypes: [
+        { value: 0, title: "买入排序" },
+        { value: 1, title: "卖出排序" }
+      ]
+    };
+  },
+  methods: {
+    sortChange(value) {
+      if (value == 0) {
+        this.data.sort((a, b) => b.PurchaseKLineId - a.PurchaseKLineId);
+      } else {
+        this.data.sort((a, b) => b.SaleKLineId - a.SaleKLineId);
+      }
+    }
   }
 };
 </script>
diff --git a/src/pages/login/index.vue b/src/pages/login/index.vue
new file mode 100644
index 0000000..fe0c238
--- /dev/null
+++ b/src/pages/login/index.vue
@@ -0,0 +1,92 @@
+<template>
+  <div>
+    <a @click="show" style="cursor: pointer;"> 登陆</a>
+    <modal
+      :show.sync="visible"
+      body-classes="p-0"
+      modal-classes="modal-dialog-centered modal-xl"
+    >
+      <card
+        type="secondary"
+        header-classes="bg-white pb-5"
+        body-classes="px-lg-5 py-lg-5"
+        class="border-0 mb-0"
+        style="padding:0 60px"
+      >
+        <!-- <template>
+          <div class="text-muted text-center mb-3">
+            <small>Sign in with</small>
+          </div>
+          <div class="btn-wrapper text-center">
+            <base-button type="default">
+              <img
+                slot="icon"
+                src="https://demos.creative-tim.com/argon-design-system/assets/img/icons/common/github.svg"
+              />
+              微信
+            </base-button>
+
+            <base-button type="danger">
+              <img
+                slot="icon"
+                src="https://demos.creative-tim.com/argon-design-system/assets/img/icons/common/google.svg"
+              />
+              QQ
+            </base-button>
+          </div>
+        </template> -->
+        <template>
+          <div class="text-center text-muted mb-4">
+            <small>请使用账号密码登陆</small>
+          </div>
+          <form role="form">
+            <base-input class="mb-3" placeholder="账号" v-model="form.account">
+            </base-input>
+            <base-input
+              type="password"
+              placeholder="密码"
+              v-model="form.password"
+            >
+            </base-input>
+            <base-checkbox v-model="rememberMe">
+              记住我
+            </base-checkbox>
+            <div class="text-center">
+              <base-button type="primary" class="my-4" @click="login"
+                >登陆</base-button
+              >
+            </div>
+          </form>
+        </template>
+      </card>
+    </modal>
+  </div>
+</template>
+<script>
+import Modal from "../../components/Modal";
+export default {
+  components: { Modal },
+  data() {
+    return {
+      visible: false,
+      form: {},
+      rememberMe: false
+    };
+  },
+  methods: {
+    show() {
+      console.log(this.visible);
+      this.visible = true;
+    },
+    login() {
+      if (this.rememberMe) {
+        localStorage.setItem("robotAccount", this.form.account);
+        localStorage.setItem("robotPassword", this.form.password);
+      }
+      localStorage.setItem("robotToken", "123");
+      this.$emit("login", true);
+    },
+    request() {}
+  }
+};
+</script>
diff --git a/src/router/index.js b/src/router/index.js
index 1670c1f..7d8872f 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -5,13 +5,20 @@ import routes from "./routes";
 const router = new VueRouter({
   routes, // short for routes: routes
   linkExactActiveClass: "active",
-  scrollBehavior: (to) => {
+  scrollBehavior: to => {
     if (to.hash) {
-      return {selector: to.hash}
+      return { selector: to.hash };
     } else {
-      return { x: 0, y: 0 }
+      return { x: 0, y: 0 };
     }
   }
 });
+router.beforeEach((to, from, next) => {
+  if (to.meta.auth && !localStorage.getItem("robotToken")) {
+
+  } else {
+    next();
+  }
+});
 
 export default router;
diff --git a/src/router/routes.js b/src/router/routes.js
index 8a74024..26639af 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -16,40 +16,53 @@ const Edit = () => import("@/pages/Robot/edit.vue");
 const WinRate = () => import("@/pages/WinRate");
 const ReCheck = () => import("@/pages/ReCheck");
 const Capital = () => import("@/pages/Profit");
+const Prev = () => import("@/pages/Prev");
 const routes = [
   {
     path: "/",
     component: DashboardLayout,
-    redirect: "/robot/0",
+    redirect: "/prev",
     children: [
+      {
+        path: "prev",
+        name: "prev",
+        meta: { auth: false },
+        component: Prev
+      },
       {
         path: "robot/:type",
         name: "robot",
+        meta: { auth: true },
         component: Robot
       },
       {
         path: "edit/:id",
         name: "edit",
+        meta: { auth: true },
         component: Edit
       },
       {
         path: "winRate",
         name: "winRate",
+        meta: { auth: true },
         component: WinRate
       },
       {
         path: "account/:type",
         name: "account",
+        meta: { auth: true },
         component: Account
       },
       {
         path: "reCheck",
         name: "reCheck",
+        meta: { auth: true },
         component: ReCheck
       },
       {
         path: "capital",
         name: "capital",
+        meta: { auth: true },
         component: Capital
       }
       // {