From 9412111c022a73cd422b96074c895b2747656b80 Mon Sep 17 00:00:00 2001
From: qinzhenpen <11463128+qinzhenpen@user.noreply.gitee.com>
Date: Fri, 30 Jun 2023 19:52:10 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A8=A1=E6=8B=9F=E4=BA=A4=E6=98=93=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90=E6=90=AD=E5=BB=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/src/views/PracticeZone/index.vue     |  11 +-
 .../src/views/homepage/components/deals.vue   | 296 +++++++++---------
 ruoyi-ui/src/views/homepage/index.vue         |   2 +-
 ruoyi-ui/src/views/homepage/overview.vue      |  17 +-
 .../src/views/trade/components/Deposit.vue    | 144 +++++++++
 .../src/views/trade/components/current.vue    |  43 +--
 ruoyi-ui/src/views/trade/components/deals.vue | 252 +++++++--------
 .../src/views/trade/components/orders.vue     | 180 +++++++++++
 ruoyi-ui/src/views/trade/holding.vue          | 207 ++++++------
 ruoyi-ui/src/views/trade/strike.vue           | 265 ++++++++--------
 10 files changed, 859 insertions(+), 558 deletions(-)
 create mode 100644 ruoyi-ui/src/views/trade/components/Deposit.vue
 create mode 100644 ruoyi-ui/src/views/trade/components/orders.vue

diff --git a/ruoyi-ui/src/views/PracticeZone/index.vue b/ruoyi-ui/src/views/PracticeZone/index.vue
index cb5667b..54300ea 100644
--- a/ruoyi-ui/src/views/PracticeZone/index.vue
+++ b/ruoyi-ui/src/views/PracticeZone/index.vue
@@ -35,7 +35,6 @@ export default {
   name: "",
   components: {
     tabs1,
-  
   },
   data() {
     return {
@@ -53,11 +52,13 @@ export default {
   computed: {},
   methods: {
     handleClick(tab) {
-      tab.name == "tabs1"? this.nowName = tab.name: this.nowName = tab.name;
+      tab.name == "tabs1"
+        ? (this.nowName = tab.name)
+        : (this.nowName = tab.name);
+    },
+    progress() {
+      this.$tab.openPage("进行中", "/trade/index");
     },
-    progress(){
-        this.$tab.openPage("进行中", "/trade/index");
-    }
   },
 };
 </script>
diff --git a/ruoyi-ui/src/views/homepage/components/deals.vue b/ruoyi-ui/src/views/homepage/components/deals.vue
index 9080ca4..f7d48cc 100644
--- a/ruoyi-ui/src/views/homepage/components/deals.vue
+++ b/ruoyi-ui/src/views/homepage/components/deals.vue
@@ -1,146 +1,158 @@
 <template>
-        <div>
-           <el-table :data="tableData"   style="width: 100%">
-       <el-table-column prop="ranking" label="时间" width="150" align="center">
-       </el-table-column>
-       <el-table-column  prop="class" label="交易品种" width="140"  align="center">
-       </el-table-column>
-       <el-table-column prop="StudentID" label="订单号"  align="center">
-          
-       </el-table-column>
-       <el-table-column prop="profit" label="类型"  align="center">
+  <div>
+    <el-table
+      :data="tableData"
+      style="width: 100%"
+      :cell-style="{ background: '#f8f8f9' }"
+    >
+      <el-table-column prop="ranking" label="时间" width="150" align="center">
+      </el-table-column>
+      <el-table-column prop="class" label="交易品种" width="140" align="center">
+      </el-table-column>
+      <el-table-column prop="StudentID" label="订单号" align="center">
+      </el-table-column>
+      <el-table-column prop="profit" label="类型" align="center">
         <template slot-scope="scope">
-               <el-button v-if="scope.row.profit " style="color: #fc3d64;border:none;background-color: #FAEFF0 ;" size="small">买方 </el-button>
-               <el-button v-else style="color: #3C9CF5 ;border:none;background-color: #EAF5FF ;" size="small">卖方 </el-button>
-         </template>
-       </el-table-column>
-       <el-table-column prop="income"  label="交易量"  align="center">
-      
-       </el-table-column>
-       <el-table-column prop="income" label="交易价位"  align="center">
-       </el-table-column>
-       <el-table-column prop="number" label="止损"  align="center">
-       </el-table-column>
-       <el-table-column prop="Simulation" label="止盈"  align="center">
-       </el-table-column>
-       <el-table-column prop="experiment" label="平仓时间"  align="center">
-       </el-table-column>
-       <el-table-column prop="address" label="平仓价位"  align="center">
-       </el-table-column>
-       <el-table-column prop="address" label="盈利"  align="center">
-       </el-table-column>
-           </el-table>
-           <pagination
-         :total="10"
-       />
-       <div class="transaction-footer">
-            <span>累计盈亏: <i>+8999.22</i> </span>
-        </div>
-        </div>
-    </template>
+          <el-button
+            v-if="scope.row.profit"
+            style="color: #fc3d64; border: none; background-color: #faeff0"
+            size="small"
+            >买方
+          </el-button>
+          <el-button
+            v-else
+            style="color: #3c9cf5; border: none; background-color: #eaf5ff"
+            size="small"
+            >卖方
+          </el-button>
+        </template>
+      </el-table-column>
+      <el-table-column prop="income" label="交易量" align="center">
+      </el-table-column>
+      <el-table-column prop="income" label="交易价位" align="center">
+      </el-table-column>
+      <el-table-column prop="number" label="止损" align="center">
+      </el-table-column>
+      <el-table-column prop="Simulation" label="止盈" align="center">
+      </el-table-column>
+      <el-table-column prop="experiment" label="平仓时间" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="平仓价位" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="盈利" align="center">
+      </el-table-column>
+    </el-table>
+    <pagination :total="10" />
+    <div class="transaction-footer">
+      <span>累计盈亏: <i>+8999.22</i> </span>
+    </div>
+  </div>
+</template>
     <script>
-    export default {
-       data(){
-           return{
-               tableData: [{
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name:1,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"50%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           }, {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 0,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           }, {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name:0,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           },
-           {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 1,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           },
-           {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 0,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           },
-           {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 1,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           },
-           
-            {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 0,
-             StudentID:"2003001",
-             profit :"-20000",
-             income:"40%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-           }]
-           }
-       }
-    }
-    </script>
+export default {
+  data() {
+    return {
+      tableData: [
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 1,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "50%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 1,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 1,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 0,
+          StudentID: "2003001",
+          profit: "-20000",
+          income: "40%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+      ],
+    };
+  },
+};
+</script>
     <style lang="scss" scoped>
-     .transaction-footer{
-        height: 25px;
-        display: flex;
-        justify-content: flex-end;
-        margin-bottom: 16px;
-       & span{
-            margin-right: 51px;
-            & i{
-                color: pink;
-                font-size: 24px;
-                font-weight:bold;
-            }
-        }
-      }
-    </style>
\ No newline at end of file
+.transaction-footer {
+  height: 25px;
+  display: flex;
+  justify-content: flex-end;
+  margin-bottom: 16px;
+  & span {
+    margin-right: 51px;
+    & i {
+      color: pink;
+      font-size: 24px;
+      font-weight: bold;
+    }
+  }
+
+}
+.pagination-container {
+    background: #f5f6f6 !important;
+  }
+</style>
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/homepage/index.vue b/ruoyi-ui/src/views/homepage/index.vue
index 584b7cd..4eb5cbd 100644
--- a/ruoyi-ui/src/views/homepage/index.vue
+++ b/ruoyi-ui/src/views/homepage/index.vue
@@ -91,7 +91,7 @@ export default {
     border-bottom: none;
     max-width: 80% !important;
   }
-  .el-tabs__nav-scroll {
+  .el-tabs__nav {
     border: none !important;
     .el-tabs__item {
       background-color: transparent;
diff --git a/ruoyi-ui/src/views/homepage/overview.vue b/ruoyi-ui/src/views/homepage/overview.vue
index 1f597b4..a512ecd 100644
--- a/ruoyi-ui/src/views/homepage/overview.vue
+++ b/ruoyi-ui/src/views/homepage/overview.vue
@@ -127,5 +127,20 @@ export default {
   padding: 10px 0;
   background-color: #f9fafc;
 }
-
+::v-deep .tabs {
+  background: #F5F6F6;
+  padding: 19px;
+  border-radius: 5px;
+  .el-tabs__nav-wrap::after {
+    background: transparent;
+  }
+  .el-tabs__item {
+    background: #F5F6F6 !important;
+    margin-right: 0px !important;
+    &.is-active {
+      background-color: #3c9cf5;
+      color: #3c9cf5 !important;
+    }
+  }
+}
 </style>
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/trade/components/Deposit.vue b/ruoyi-ui/src/views/trade/components/Deposit.vue
new file mode 100644
index 0000000..148a7fe
--- /dev/null
+++ b/ruoyi-ui/src/views/trade/components/Deposit.vue
@@ -0,0 +1,144 @@
+<template>
+    <div class="homepage-current">
+      <el-table
+        :data="tableData"
+        style="width: 100%"
+      >
+        <el-table-column
+          prop="ranking"
+          label="账号"
+          width="100"
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column prop="class" label="姓名" width="140" align="center">
+        </el-table-column>
+        <el-table-column label="已用保证金" align="center" prop="profit">
+         
+        </el-table-column>
+        <el-table-column prop="StudentID" label="净值" align="center">
+        </el-table-column>
+        <el-table-column label="保证金水平" align="center" prop="profit">
+        
+        </el-table-column>
+        <el-table-column prop="income" label="保证金报警水平" align="center">
+        </el-table-column>
+        <el-table-column prop="number" label="状态" align="center">
+            <template slot-scope="scope">
+            <el-tag v-if="scope.row.number >0" type="danger">预警中</el-tag>
+            <el-tag v-else>已停用</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="class" label="设置时间" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="操作" align="center" width="200">
+          <el-button size="mini"   @click="centerDialogVisible = true">删除</el-button>
+          <el-button size="mini" type="primary" @click="colseDialogVisible = true" >启用</el-button
+          >
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <pagination :total="10" />
+      <el-row>
+      <el-col :span="24"><div class="grid-content bg-purple-dark">预警</div></el-col>
+      </el-row>
+      <el-table :data="tableData"  style="width: 100%" >
+        <el-table-column prop="ranking" label="账号" width="100" align="center" >
+        </el-table-column>
+        <el-table-column prop="class" label="姓名" width="140" align="center">
+        </el-table-column>
+        <el-table-column label="已用保证金" align="center" prop="profit">
+        </el-table-column>
+        <el-table-column prop="StudentID" label="净值" align="center">
+        </el-table-column>
+        <el-table-column label="保证金水平" align="center" prop="profit">
+        </el-table-column>
+        <el-table-column prop="income" label="保证金报警水平" align="center">
+        </el-table-column>
+        <el-table-column prop="number" label="状态" align="center">
+            <template slot-scope="scope">
+            <el-tag v-if="scope.row.number >0" type="danger">预警中</el-tag>
+            <el-tag v-else>已停用</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="class" label="设置时间" align="center">
+        </el-table-column>
+        <el-table-column prop="address" label="操作" align="center" width="200">
+          <el-button size="mini"   @click="centerDialogVisible = true">删除</el-button>
+        </el-table-column>
+      </el-table>
+      <pagination :total="10" />
+    </div>
+  </template>
+  <script>
+  export default {
+    data() {
+      return {
+    
+        tableData: [
+          {
+            ranking: "euresd",
+            class: "1612167713",
+            name: 1,
+            StudentID: "2003001",
+            profit: "+20000",
+            income: "50%",
+            number: "8",
+            Simulation: "80",
+            experiment: "70",
+          },
+          {
+            ranking: "euresd",
+            class: "1612167713",
+            name: 1,
+            StudentID: "2003001",
+            profit: "+20000",
+            income: "50%",
+            number: "8",
+            Simulation: "80",
+            experiment: "70",
+          },
+          {
+            ranking: "euresd",
+            class: "1612167713",
+            name: 0,
+            StudentID: "2003001",
+            profit: "+20000",
+            income: "20%",
+            number: "-8",
+            Simulation: "80",
+            experiment: "70",
+          },
+          {
+            ranking: "euresd",
+            class: "1612167713",
+            name: 0,
+            StudentID: "2003001",
+            profit: "+20000",
+            income: "20%",
+            number: "8",
+            Simulation: "80",
+            experiment: "-70",
+          },
+          {
+            ranking: "euresd",
+            class: "1612167713",
+            name: 1,
+            StudentID: "2003001",
+            profit: "+20000",
+            income: "20%",
+            number: "-8",
+            Simulation: "80",
+            experiment: "70",
+          },
+        ],
+      };
+    },
+  };
+  </script>
+  <style lang="scss" scoped>
+  .pagination-container {
+    background: #f5f6f6;
+  }
+
+  </style>
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/trade/components/current.vue b/ruoyi-ui/src/views/trade/components/current.vue
index b455bfa..a4ea87d 100644
--- a/ruoyi-ui/src/views/trade/components/current.vue
+++ b/ruoyi-ui/src/views/trade/components/current.vue
@@ -16,31 +16,14 @@
       </el-table-column>
       <el-table-column label="类型" align="center">
         <template slot-scope="scope">
-          <el-button
-            v-if="scope.row.name < 1"
-            style="color: #fc3d64; border: none; background-color: #faeff0"
-            size="small"
-            >买方</el-button
-          >
-          <el-button
-            v-else
-            style="color: #3c9cf5; border: none; background-color: #eaf5ff"
-            size="small"
-            >卖方</el-button
-          >
+          <el-tag v-if="scope.row.profit >0" type="danger">买</el-tag>
+          <el-tag v-else>卖</el-tag>
         </template>
       </el-table-column>
       <el-table-column prop="StudentID" label="交易量(手)" align="center">
       </el-table-column>
-      <el-table-column label="交易价位" align="center">
-        <template slot-scope="scope">
-          <span v-if="scope.row.profit > 0" style="color: #f98133">{{
-            scope.row.profit
-          }}</span>
-          <span v-else-if="scope.row.profit < 0" style="color: #36b9b2">{{
-            scope.row.profit
-          }}</span>
-        </template>
+      <el-table-column label="交易价位" align="center" prop="profit">
+      
       </el-table-column>
       <el-table-column prop="income" label="止损" align="center">
       </el-table-column>
@@ -48,19 +31,17 @@
       </el-table-column>
       <el-table-column prop="Simulation" label="当前价位" align="center">
       </el-table-column>
-      <el-table-column prop="experiment" label="持仓盈亏" align="center">
+      <el-table-column  label="持仓盈亏" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.experiment > 0" style="color: #EC6C01;">{{ scope.row.experiment}}</span>
+          <span v-else style="color: #2CB7B0;">{{ scope.row.experiment}}</span>
+        </template>
       </el-table-column>
       <el-table-column prop="class" label="交易时间" align="center">
       </el-table-column>
       <el-table-column prop="address" label="操作" align="center" width="200">
-        <el-button
-          size="mini"
-          type="primary"
-          @click="centerDialogVisible = true"
-          >修 改</el-button
-        >
-        <el-button size="mini" type="warning" @click="colseDialogVisible = true"
-          >平 仓</el-button
+        <el-button size="mini"  type="primary" @click="centerDialogVisible = true">修改</el-button>
+        <el-button size="mini" type="warning" @click="colseDialogVisible = true" >平仓</el-button
         >
       </el-table-column>
     </el-table>
@@ -198,7 +179,7 @@ export default {
           income: "20%",
           number: "8",
           Simulation: "80",
-          experiment: "70",
+          experiment: "-70",
         },
         {
           ranking: "euresd",
diff --git a/ruoyi-ui/src/views/trade/components/deals.vue b/ruoyi-ui/src/views/trade/components/deals.vue
index 9080ca4..9b72e75 100644
--- a/ruoyi-ui/src/views/trade/components/deals.vue
+++ b/ruoyi-ui/src/views/trade/components/deals.vue
@@ -1,146 +1,114 @@
 <template>
-        <div>
-           <el-table :data="tableData"   style="width: 100%">
-       <el-table-column prop="ranking" label="时间" width="150" align="center">
-       </el-table-column>
-       <el-table-column  prop="class" label="交易品种" width="140"  align="center">
-       </el-table-column>
-       <el-table-column prop="StudentID" label="订单号"  align="center">
-          
-       </el-table-column>
-       <el-table-column prop="profit" label="类型"  align="center">
+  <div>
+    <el-table
+      :data="tableData"
+      style="width: 100%"
+      :cell-style="{ background: '#f8f8f9' }"
+    >
+      <el-table-column prop="ranking" label="时间" width="150" align="center">
+      </el-table-column>
+      <el-table-column prop="class" label="交易品种" width="140" align="center">
+      </el-table-column>
+      <el-table-column prop="StudentID" label="订单号" align="center">
+      </el-table-column>
+      <el-table-column prop="profit" label="类型" align="center">
         <template slot-scope="scope">
-               <el-button v-if="scope.row.profit " style="color: #fc3d64;border:none;background-color: #FAEFF0 ;" size="small">买方 </el-button>
-               <el-button v-else style="color: #3C9CF5 ;border:none;background-color: #EAF5FF ;" size="small">卖方 </el-button>
-         </template>
-       </el-table-column>
-       <el-table-column prop="income"  label="交易量"  align="center">
-      
-       </el-table-column>
-       <el-table-column prop="income" label="交易价位"  align="center">
-       </el-table-column>
-       <el-table-column prop="number" label="止损"  align="center">
-       </el-table-column>
-       <el-table-column prop="Simulation" label="止盈"  align="center">
-       </el-table-column>
-       <el-table-column prop="experiment" label="平仓时间"  align="center">
-       </el-table-column>
-       <el-table-column prop="address" label="平仓价位"  align="center">
-       </el-table-column>
-       <el-table-column prop="address" label="盈利"  align="center">
-       </el-table-column>
-           </el-table>
-           <pagination
-         :total="10"
-       />
-       <div class="transaction-footer">
-            <span>累计盈亏: <i>+8999.22</i> </span>
-        </div>
-        </div>
-    </template>
+          <el-tag v-if="scope.row.profit >0">买</el-tag>
+          <el-tag v-else>卖</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column prop="income" label="交易量" align="center">
+      </el-table-column>
+      <el-table-column prop="income" label="交易价位" align="center">
+      </el-table-column>
+      <el-table-column prop="number" label="止损" align="center">
+      </el-table-column>
+      <el-table-column prop="Simulation" label="止盈" align="center">
+      </el-table-column>
+      <el-table-column prop="experiment" label="平仓时间" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="平仓价位" align="center">
+      </el-table-column>
+      <el-table-column prop="address" label="盈利" align="center">
+      </el-table-column>
+    </el-table>
+    <pagination :total="10" />
+    <div class="transaction-footer">
+      <span>累计盈亏: <i>+8999.22</i> </span>
+    </div>
+  </div>
+</template>
     <script>
-    export default {
-       data(){
-           return{
-               tableData: [{
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name:1,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"50%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           }, {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 0,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           }, {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name:0,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           },
-           {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 1,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           },
-           {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 0,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           },
-           {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 1,
-             StudentID:"2003001",
-             profit :"+20000",
-             income:"20%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-    
-           },
-           
-            {
-             ranking: '2023-06-13 22:22:21',
-             class: 'eurusd',
-             name: 0,
-             StudentID:"2003001",
-             profit :"-20000",
-             income:"40%",
-             number:"8",
-             Simulation:"80",
-             experiment:"70"
-           }]
-           }
-       }
-    }
-    </script>
-    <style lang="scss" scoped>
-     .transaction-footer{
-        height: 25px;
-        display: flex;
-        justify-content: flex-end;
-        margin-bottom: 16px;
-       & span{
-            margin-right: 51px;
-            & i{
-                color: pink;
-                font-size: 24px;
-                font-weight:bold;
-            }
+export default {
+  data() {
+    return {
+      tableData: [
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 1,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "50%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "2023-06-13 22:22:21",
+          class: "eurusd",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
         }
-      }
-    </style>
\ No newline at end of file
+      
+      ],
+    };
+  },
+};
+</script>
+    <style lang="scss" scoped>
+.transaction-footer {
+  height: 25px;
+  display: flex;
+  justify-content: flex-end;
+  margin-bottom: 16px;
+  & span {
+    margin-right: 51px;
+    & i {
+      color: pink;
+      font-size: 24px;
+      font-weight: bold;
+    }
+  }
+}
+.pagination-container {
+  background: #f5f6f6;
+}
+</style>
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/trade/components/orders.vue b/ruoyi-ui/src/views/trade/components/orders.vue
new file mode 100644
index 0000000..d653017
--- /dev/null
+++ b/ruoyi-ui/src/views/trade/components/orders.vue
@@ -0,0 +1,180 @@
+<template>
+    <div class="homepage-current">
+      <el-table
+        :data="tableData"
+        style="width: 100%"
+        :cell-style="{ background: '#f8f8f9' }"
+      >
+        <el-table-column
+          prop="ranking"
+          label="委托时间"
+          width="100"
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column prop="class" label="交易品种" width="140" align="center">
+        </el-table-column>
+        <el-table-column label="委托单号" align="center" prop="profit">
+        
+        </el-table-column>
+        <el-table-column prop="StudentID" label="类型" align="center">
+        </el-table-column>
+        <el-table-column label="交易量 (手)" align="center" prop="profit">
+        
+        </el-table-column>
+        <el-table-column prop="income" label="委托价位" align="center">
+        </el-table-column>
+        <el-table-column prop="number" label="止损" align="center">
+        </el-table-column>
+        <el-table-column prop="Simulation" label="止盈" align="center">
+        </el-table-column>
+        <el-table-column  label="当前价位" align="center">
+          <template slot-scope="scope">
+            <span v-if="scope.row.experiment > 0" style="color: #EC6C01;">{{ scope.row.experiment}}</span>
+            <span v-else style="color: #2CB7B0;">{{ scope.row.experiment}}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="class" label="持仓盈亏" align="center">
+        </el-table-column>
+        <el-table-column prop="class" label="有效期" align="center">
+        </el-table-column>
+       
+        <el-table-column prop="address" label="操作" align="center" width="200">
+       
+          <el-button size="mini" type="warning" @click="colseDialogVisible = true" >撤单</el-button
+          >
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <pagination :total="10" />
+      <!-- 修改 -->
+
+      <!-- 平仓 -->
+      <el-dialog
+        title="平仓"
+        :visible.sync="colseDialogVisible"
+        width="30%"
+        append-to-body
+      >
+        <el-form ref="ruleForm" label-width="100px" class="demo-ruleForm">
+          <el-form-item label="交易品种:">
+            <el-select placeholder="活动区域" style="width: 100%">
+              <el-option label="区域一" value="shanghai"></el-option>
+              <el-option label="区域二" value="beijing"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="名称:">
+            <el-input type="password" autocomplete="off"></el-input>
+          </el-form-item>
+          <div class="dialog-inline" style="display: flex">
+            <el-form-item label="订 单 号:">
+              <el-input></el-input>
+            </el-form-item>
+            <el-form-item label="持仓方向:">
+              <el-input></el-input>
+            </el-form-item>
+          </div>
+          <el-form-item label="交 易 量:">
+            <el-input></el-input>
+          </el-form-item>
+          <el-form-item label="开仓价位:">
+            <template>
+              <span
+                style="
+                  font-size: 18px;
+                  font-weight: bold;
+                  font-family: Microsoft YaHei;
+                  color: #1d2129;
+                "
+                >9661.00</span
+              >
+              <div class="price">6.90494 / 6.90498</div>
+            </template>
+          </el-form-item>
+        </el-form>
+        <span slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="colseDialogVisible = false"
+            >平 仓</el-button
+          >
+          <el-button @click="colseDialogVisible = false" type="info"
+            >取 消</el-button
+          >
+        </span>
+      </el-dialog>
+    </div>
+  </template>
+  <script>
+  export default {
+    data() {
+      return {
+        
+        // 平仓
+        colseDialogVisible: false,
+        tableData: [
+          {
+            ranking: "euresd",
+            class: "1612167713",
+            name: 1,
+            StudentID: "2003001",
+            profit: "+20000",
+            income: "50%",
+            number: "8",
+            Simulation: "80",
+            experiment: "70",
+          },
+          {
+            ranking: "euresd",
+            class: "1612167713",
+            name: 0,
+            StudentID: "2003001",
+            profit: "+20000",
+            income: "20%",
+            number: "8",
+            Simulation: "80",
+            experiment: "70",
+          },
+          {
+            ranking: "euresd",
+            class: "1612167713",
+            name: 0,
+            StudentID: "2003001",
+            profit: "+20000",
+            income: "20%",
+            number: "8",
+            Simulation: "80",
+            experiment: "-70",
+          },
+          {
+            ranking: "euresd",
+            class: "1612167713",
+            name: 1,
+            StudentID: "2003001",
+            profit: "+20000",
+            income: "20%",
+            number: "8",
+            Simulation: "80",
+            experiment: "70",
+          },
+        ],
+      };
+    },
+  };
+  </script>
+  <style lang="scss" scoped>
+  .pagination-container {
+    background: #f5f6f6;
+  }
+  ::v-deep .price {
+    max-width: calc(100% - 136px);
+    min-height: 60px;
+    background: #f2f3f4;
+    border-radius: 4px;
+    margin-left: 20px;
+    text-align: center;
+    line-height: 60px;
+    font-size: 18px;
+    font-family: Microsoft YaHei;
+    font-weight: bold;
+    color: #1d2129;
+  }
+  </style>
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/trade/holding.vue b/ruoyi-ui/src/views/trade/holding.vue
index 8a6057e..306733d 100644
--- a/ruoyi-ui/src/views/trade/holding.vue
+++ b/ruoyi-ui/src/views/trade/holding.vue
@@ -1,31 +1,34 @@
 <template>
-     <div>
-        <el-table :data="tableData"   style="width: 100%">
-    <el-table-column prop="ranking" label="交易品种" width="100" align="center">
-    </el-table-column>
-    <el-table-column  prop="class" label="名称" width="140"  align="center">
-    </el-table-column>
-    <el-table-column  label="卖佳"  align="center">
-       
-    </el-table-column>
-    <el-table-column prop="StudentID" label="最高卖价/最低卖价"  align="center">
-    </el-table-column>
-    <el-table-column  label="买价"  align="center">
-    
-    </el-table-column>
-    <el-table-column prop="income" label="最高买价/最低买价"  align="center">
-    </el-table-column>
-    <el-table-column prop="number" label="日变化"  align="center">
-    </el-table-column>
-    <el-table-column prop="Simulation" label="日变化"  align="center">
-    </el-table-column>
-    <el-table-column prop="Simulation" label="操作"  align="center">
-      <el-button type="primary" size="mini">交易</el-button>
-    </el-table-column>
-        </el-table>
-        <pagination
-      :total="10"
-    />
+  <div>
+    <el-table :data="tableData" style="width: 100%">
+      <el-table-column
+        prop="ranking"
+        label="交易品种"
+        width="100"
+        align="center"
+      >
+      </el-table-column>
+      <el-table-column prop="class" label="名称" align="center">
+      </el-table-column>
+      <el-table-column label="卖价" align="center"> </el-table-column>
+      <el-table-column
+        prop="StudentID"
+        label="最高卖价/最低卖价"
+        align="center"
+      >
+      </el-table-column>
+      <el-table-column label="买价" align="center"> </el-table-column>
+      <el-table-column prop="income" label="最高买价/最低买价" align="center">
+      </el-table-column>
+      <el-table-column prop="number" label="日变化" align="center">
+      </el-table-column>
+      <el-table-column prop="Simulation" label="日变化" align="center">
+      </el-table-column>
+      <el-table-column prop="Simulation" label="操作" align="center">
+        <el-button type="primary" size="mini">交易</el-button>
+      </el-table-column>
+    </el-table>
+    <pagination :total="10" />
     <el-tabs class="tabs" v-model="activeName" @tab-click="handleClick">
       <el-tab-pane
         v-for="(item, index) in tabsArr"
@@ -40,19 +43,21 @@
         ></components>
       </el-tab-pane>
     </el-tabs>
-     </div>
+  </div>
 </template>
 <script>
 import tabs1 from "./components/current.vue";
-import tabs2 from "./components/deals.vue";
+import tabs3 from "./components/deals.vue";
+import tabs2 from "./components/orders.vue";
 export default {
   components: {
     tabs1,
     tabs2,
+    tabs3,
   },
-    data(){
-        return{
-          activeName: "tabs1",
+  data() {
+    return {
+      activeName: "tabs1",
       nowName: "tabs1",
       tabsArr: [
         {
@@ -60,92 +65,90 @@ export default {
           name: "tabs1",
         },
         {
-          label: "历史成交",
+          label: "现有挂单",
           name: "tabs2",
         },
+        {
+          label: "历史成交",
+          name: "tabs3",
+        },
       ],
-            tableData: [{
-          ranking: 'euresd',
-          class: '1612167713',
-          name:1,
-          StudentID:"2003001",
-          profit :"+20000",
-          income:"50%",
-          number:"8",
-          Simulation:"80",
-          experiment:"70"
-
-        }, {
-          ranking: 'euresd',
-          class: '1612167713',
+      tableData: [
+        {
+          ranking: "euresd",
+          class: "1612167713",
+          name: 1,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "50%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "euresd",
+          class: "1612167713",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "euresd",
+          class: "1612167713",
           name: 0,
-          StudentID:"2003001",
-          profit :"+20000",
-          income:"20%",
-          number:"8",
-          Simulation:"80",
-          experiment:"70"
-
-        }, {
-          ranking: 'euresd',
-          class: '1612167713',
-          name:0,
-          StudentID:"2003001",
-          profit :"+20000",
-          income:"20%",
-          number:"8",
-          Simulation:"80",
-          experiment:"70"
-
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
         },
         {
-          ranking: 'euresd',
-          class: '1612167713',
+          ranking: "euresd",
+          class: "1612167713",
           name: 1,
-          StudentID:"2003001",
-          profit :"+20000",
-          income:"20%",
-          number:"8",
-          Simulation:"80",
-          experiment:"70"
-
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
         },
         {
-          ranking: 'euresd',
-          class: '1612167713',
+          ranking: "euresd",
+          class: "1612167713",
           name: 0,
-          StudentID:"2003001",
-          profit :"+20000",
-          income:"20%",
-          number:"8",
-          Simulation:"80",
-          experiment:"70"
-
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
         },
         {
-          ranking: 'euresd',
-          class: '1612167713',
+          ranking: "euresd",
+          class: "1612167713",
           name: 1,
-          StudentID:"2003001",
-          profit :"+20000",
-          income:"20%",
-          number:"8",
-          Simulation:"80",
-          experiment:"70"
-
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
         },
-        
-       ]
-        }
-    },
-    methods: {
+      ],
+    };
+  },
+  methods: {
     handleClick(tab) {
-      tab.name == "tabs1"
-        ? (this.nowName = tab.name)
-        : (this.nowName = tab.name);
+      tab.name == "tabs1" ? this.nowName = tab.name: ( tab.name = "tabs2" ? this.nowName = tab.name : this.nowName = tab.name)
     },
   },
-}
+};
 </script>
 <style lang="scss" scoped>
 ::v-deep.el-tabs {
@@ -163,7 +166,7 @@ export default {
     }
   }
 }
-.pagination-container{
+.pagination-container {
   margin-bottom: 20px !important;
 }
 </style>
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/trade/strike.vue b/ruoyi-ui/src/views/trade/strike.vue
index 3b2ecef..8052b3f 100644
--- a/ruoyi-ui/src/views/trade/strike.vue
+++ b/ruoyi-ui/src/views/trade/strike.vue
@@ -1,146 +1,143 @@
 <template>
     <div>
-       <el-table :data="tableData"   style="width: 100%">
-   <el-table-column prop="ranking" label="时间" width="150" align="center">
-   </el-table-column>
-   <el-table-column  prop="class" label="交易品种" width="140"  align="center">
-   </el-table-column>
-   <el-table-column prop="StudentID" label="订单号"  align="center">
-      
-   </el-table-column>
-   <el-table-column prop="profit" label="类型"  align="center">
-    <template slot-scope="scope">
-           <el-button v-if="scope.row.profit " style="color: #fc3d64;border:none;background-color: #FAEFF0 ;" size="small">买方 </el-button>
-           <el-button v-else style="color: #3C9CF5 ;border:none;background-color: #EAF5FF ;" size="small">卖方 </el-button>
-     </template>
-   </el-table-column>
-   <el-table-column prop="income"  label="交易量"  align="center">
-  
-   </el-table-column>
-   <el-table-column prop="income" label="交易价位"  align="center">
-   </el-table-column>
-   <el-table-column prop="number" label="止损"  align="center">
-   </el-table-column>
-   <el-table-column prop="Simulation" label="止盈"  align="center">
-   </el-table-column>
-   <el-table-column prop="experiment" label="平仓时间"  align="center">
-   </el-table-column>
-   <el-table-column prop="address" label="平仓价位"  align="center">
-   </el-table-column>
-   <el-table-column prop="address" label="盈利"  align="center">
-   </el-table-column>
-       </el-table>
-       <pagination
-     :total="10"
-   />
-   <div class="transaction-footer">
-        <span>累计盈亏: <i>+8999.22</i> </span>
-    </div>
+      <el-tabs class="tabs" v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane
+        v-for="(item, index) in tabsArr"
+        :key="index"
+        :label="item.label"
+        :name="item.name"
+      >
+        <components
+          :is="item.name"
+          :id="id"
+          v-if="item.name == nowName"
+        ></components>
+      </el-tab-pane>
+    </el-tabs>
     </div>
 </template>
 <script>
+import tabs1 from "./components/Deposit.vue";
+import tabs3 from "./components/deals.vue";
+import tabs2 from "./components/orders.vue";
 export default {
-   data(){
-       return{
-           tableData: [{
-         ranking: '2023-06-13 22:22:21',
-         class: 'eurusd',
-         name:1,
-         StudentID:"2003001",
-         profit :"+20000",
-         income:"50%",
-         number:"8",
-         Simulation:"80",
-         experiment:"70"
-
-       }, {
-         ranking: '2023-06-13 22:22:21',
-         class: 'eurusd',
-         name: 0,
-         StudentID:"2003001",
-         profit :"+20000",
-         income:"20%",
-         number:"8",
-         Simulation:"80",
-         experiment:"70"
-
-       }, {
-         ranking: '2023-06-13 22:22:21',
-         class: 'eurusd',
-         name:0,
-         StudentID:"2003001",
-         profit :"+20000",
-         income:"20%",
-         number:"8",
-         Simulation:"80",
-         experiment:"70"
-
-       },
-       {
-         ranking: '2023-06-13 22:22:21',
-         class: 'eurusd',
-         name: 1,
-         StudentID:"2003001",
-         profit :"+20000",
-         income:"20%",
-         number:"8",
-         Simulation:"80",
-         experiment:"70"
-
-       },
-       {
-         ranking: '2023-06-13 22:22:21',
-         class: 'eurusd',
-         name: 0,
-         StudentID:"2003001",
-         profit :"+20000",
-         income:"20%",
-         number:"8",
-         Simulation:"80",
-         experiment:"70"
-
-       },
-       {
-         ranking: '2023-06-13 22:22:21',
-         class: 'eurusd',
-         name: 1,
-         StudentID:"2003001",
-         profit :"+20000",
-         income:"20%",
-         number:"8",
-         Simulation:"80",
-         experiment:"70"
-
-       },
-       
+  components: {
+    tabs1,
+    tabs2,
+    tabs3,
+  },
+  data() {
+    return {
+      activeName: "tabs1",
+      nowName: "tabs1",
+      tabsArr: [
         {
-         ranking: '2023-06-13 22:22:21',
-         class: 'eurusd',
-         name: 0,
-         StudentID:"2003001",
-         profit :"-20000",
-         income:"40%",
-         number:"8",
-         Simulation:"80",
-         experiment:"70"
-       }]
-       }
-   }
-}
+          label: "保证金预警",
+          name: "tabs1",
+        },
+        {
+          label: "行情预警",
+          name: "tabs2",
+        },
+        {
+          label: "持仓时长预警",
+          name: "tabs3",
+        },
+      ],
+      tableData: [
+        {
+          ranking: "euresd",
+          class: "1612167713",
+          name: 1,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "50%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "euresd",
+          class: "1612167713",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "euresd",
+          class: "1612167713",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "euresd",
+          class: "1612167713",
+          name: 1,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "euresd",
+          class: "1612167713",
+          name: 0,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+        {
+          ranking: "euresd",
+          class: "1612167713",
+          name: 1,
+          StudentID: "2003001",
+          profit: "+20000",
+          income: "20%",
+          number: "8",
+          Simulation: "80",
+          experiment: "70",
+        },
+      ],
+    };
+  },
+  methods: {
+    handleClick(tab) {
+      tab.name == "tabs1" ? this.nowName = tab.name: ( tab.name = "tabs2" ? this.nowName = tab.name : this.nowName = tab.name)
+    },
+  },
+};
 </script>
 <style lang="scss" scoped>
- .transaction-footer{
-    height: 25px;
-    display: flex;
-    justify-content: flex-end;
-    margin-bottom: 16px;
-   & span{
-        margin-right: 51px;
-        & i{
-            color: pink;
-            font-size: 24px;
-            font-weight:bold;
-        }
+::v-deep.el-tabs {
+  background: #f8f8f9;
+  padding: 0 20px;
+  .el-tabs__nav-wrap::after {
+    background: transparent;
+  }
+  .el-tabs__item {
+    background: #f8f8f9 !important;
+    margin-right: 0px !important;
+    &.is-active {
+      background-color: #3c9cf5;
+      color: #3c9cf5 !important;
     }
   }
+}
+.pagination-container {
+  margin-bottom: 20px !important;
+}
 </style>
\ No newline at end of file