From 425ff32236e9bc706402dbde9a7d73f05a9c6a60 Mon Sep 17 00:00:00 2001
From: hucan <951870319@qq.com>
Date: Tue, 26 Aug 2025 16:37:10 +0800
Subject: [PATCH] 1

---
 .../line-reverse-position/close-position.vue  | 201 ++++++++++
 .../admin/line-reverse-position/detail.vue    | 139 +++++++
 .../admin/line-reverse-position/index.vue     | 355 ++++++++++++++++++
 .../line-reverse-position/order-list.vue      | 282 ++++++++++++++
 4 files changed, 977 insertions(+)
 create mode 100644 src/views/admin/line-reverse-position/close-position.vue
 create mode 100644 src/views/admin/line-reverse-position/detail.vue
 create mode 100644 src/views/admin/line-reverse-position/index.vue
 create mode 100644 src/views/admin/line-reverse-position/order-list.vue

diff --git a/src/views/admin/line-reverse-position/close-position.vue b/src/views/admin/line-reverse-position/close-position.vue
new file mode 100644
index 0000000..8c522e2
--- /dev/null
+++ b/src/views/admin/line-reverse-position/close-position.vue
@@ -0,0 +1,201 @@
+<template>
+
+  <!-- 添加或修改对话框 -->
+  <el-dialog title="批量平仓" :visible.sync="open" width="500px" @close="handleClose" @open="handleOpen">
+    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+
+      <el-form-item label="下单Api" prop="reverseApiId">
+        <el-select v-model="form.reverseApiId" placeholder="请选择">
+          <el-option
+            v-for="dict in reverseApiIdOptions"
+            :key="'reverseApiId' + dict.id"
+            :label="dict.name"
+            :value="dict.id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="持仓方向" prop="positionSide">
+        <el-select v-model="form.positionSide" placeholder="请选择">
+          <el-option
+            v-for="dict in positionSideOptions"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="交易对" prop="symbol">
+        <template #label>
+          <span>交易对</span>
+          <el-popover trigger="hover" content="交易对为空时，代表平仓全部">
+            <template #reference>
+              <i class="el-icon-question" />
+            </template>
+          </el-popover>
+        </template>
+        <el-select
+          v-model="form.symbol"
+          style="width: 100%;"
+          placeholder="请选择交易对"
+          clearable
+          filterable
+          :remote-method="(e) => getSymbol(e, 1, 'binance')"
+          :loading="searchLoding"
+          remote
+          size="small"
+        >
+          <el-option
+            v-for="dict in symbol.symbolList"
+            :key="dict.id"
+            :label="dict.symbol"
+            :value="dict.symbol"
+          />
+          <div class="page">
+            <pagination
+              v-show="symbol.total > 0"
+              :background="false"
+              :total="symbol.total"
+              layout="prev, pager, next"
+              :page.sync="symbol.pageIndex"
+              :limit.sync="symbol.pageSize"
+              @pagination="getSymbol($event, 1, 'binance')"
+            />
+          </div>
+        </el-select>
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button type="primary" :loading="loading" @click="submitForm">确 定</el-button>
+      <el-button @click="cancel">取 消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { batchClosePosition } from '@/api/admin/line-reverse-position'
+import { listLineSymbol } from '@/api/admin/line-symbol'
+import { getReverseOptionsAll } from '@/api/admin/line-api-user'
+
+export default {
+  name: 'Detail',
+  props: {
+    open: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      reverseApiIdOptions: [],
+      positionSideOptions: [{
+        value: 'LONG',
+        label: '多'
+      }, {
+        value: 'SHORT',
+        label: '空'
+      }],
+      sideOptions: [{
+        value: 'SELL',
+        label: '卖'
+      }, {
+        value: 'BUY',
+        label: '买'
+      }],
+      form: {
+        reverseApiId: undefined,
+        positionSide: undefined,
+        symbol: undefined
+      },
+      // 表单校验
+      rules: {
+        apiId: [{ required: true, message: 'api_id不能为空', trigger: 'blur' }],
+        reverseApiId: [{ required: true, message: '反单api_id不能为空', trigger: 'blur' }],
+        side: [{ required: true, message: '买卖方向 BUY SELL不能为空', trigger: 'blur' }],
+        positionSide: [{ required: true, message: '持仓方向 LONG SHORT不能为空', trigger: 'blur' }]
+      },
+      loading: false,
+      searchLoding: false,
+      symbol: {
+        symbolList: [],
+        total: 0,
+        pageIndex: 1,
+        pageSize: 6
+      }
+    }
+  },
+  methods: {
+    // 取消按钮
+    cancel() {
+      this.handleClose()
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        reverseApiId: undefined,
+        positionSide: undefined,
+        symbol: undefined
+      }
+      this.resetForm('form')
+    },
+    /** 提交按钮 */
+    submitForm: function() {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          this.loading = true
+
+          batchClosePosition(this.form).then(res => {
+            console.log('res', res)
+            if (res.code === 200) {
+              if (res.data === null || res.data === undefined || res.data === '') {
+                this.$message.success('批量平仓成功')
+                this.handleClose()
+              } else {
+                this.$notify.error({
+                  title: '错误',
+                  message: res.data
+                })
+              }
+            }
+          }).catch(err => {
+            console.log(err)
+          }).finally(() => {
+            this.loading = false
+          })
+        }
+      })
+    },
+    handleClose() {
+      this.reset()
+      this.$emit('update:open', false)
+    },
+    // 交易对列表
+    getSymbol(e, type, exchangeType) {
+      this.searchLoding = true
+      const { pageIndex } = this.symbol
+      const symbol = typeof e === 'object' ? '' : e
+      listLineSymbol({ pageIndex, pageSize: 6, type: 1, symbol, exchangeType: 'binance' }).then(res => {
+        this.symbol.total = res.data.count
+        this.symbol.symbolList = res.data.list
+      }).finally(() => {
+        this.searchLoding = false
+      })
+    },
+    // 打开弹窗
+    handleOpen() {
+      this.getSymbol('', 1, 'binance')
+      this.getApiOptions()
+    },
+    // 获取api列表
+    getApiOptions() {
+      getReverseOptionsAll({}).then(res => {
+        if (res.code === 200) {
+          this.reverseApiIdOptions = res.data
+        }
+      })
+        .catch(err => {
+          console.log(err)
+        })
+    }
+  }
+}
+</script>
diff --git a/src/views/admin/line-reverse-position/detail.vue b/src/views/admin/line-reverse-position/detail.vue
new file mode 100644
index 0000000..4a86ea1
--- /dev/null
+++ b/src/views/admin/line-reverse-position/detail.vue
@@ -0,0 +1,139 @@
+<template>
+
+  <!-- 添加或修改对话框 -->
+  <el-dialog :title="title" :visible.sync="open" width="500px" @close="handleClose">
+    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+
+      <el-form-item label="api_id" prop="apiId">
+        <el-select v-model="form.apiId" placeholder="请选择">
+          <el-option v-for="dict in apiIdOptions" :key="dict.value" :label="dict.label" :value="dict.value" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="反单api_id" prop="reverseApiId">
+        <el-select v-model="form.reverseApiId" placeholder="请选择">
+          <el-option v-for="dict in reverseApiIdOptions" :key="dict.value" :label="dict.label" :value="dict.value" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="反单仓位" prop="reverseAmount">
+        <el-input v-model="form.reverseAmount" placeholder="反单仓位" />
+      </el-form-item>
+      <el-form-item label="买卖方向 BUY SELL" prop="side">
+        <el-select v-model="form.side" placeholder="请选择">
+          <el-option v-for="dict in sideOptions" :key="dict.value" :label="dict.label" :value="dict.value" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="持仓方向 LONG SHORT" prop="positionSide">
+        <el-select v-model="form.positionSide" placeholder="请选择">
+          <el-option v-for="dict in positionSideOptions" :key="dict.value" :label="dict.label" :value="dict.value" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="交易对" prop="symbol">
+        <el-input v-model="form.symbol" placeholder="交易对" />
+      </el-form-item>
+      <el-form-item label="仓位状态 1-已开仓 2-已平仓" prop="status">
+        <el-input v-model="form.status" placeholder="仓位状态 1-已开仓 2-已平仓" />
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="cancel">取 消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+
+export default {
+  name: 'Detail',
+  props: {
+    open: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: '添加'
+    },
+    form: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data() {
+    return {
+      reverseApiIdOptions: [],
+      positionSideOptions: [],
+      apiIdOptions: [],
+      sideOptions: [{
+        value: 'SELL',
+        label: '卖'
+      }, {
+        value: 'BUY',
+        label: '买'
+      }],
+      // 表单校验
+      rules: {
+        apiId: [{ required: true, message: 'api_id不能为空', trigger: 'blur' }],
+        reverseApiId: [{ required: true, message: '反单api_id不能为空', trigger: 'blur' }],
+        side: [{ required: true, message: '买卖方向 BUY SELL不能为空', trigger: 'blur' }],
+        positionSide: [{ required: true, message: '持仓方向 LONG SHORT不能为空', trigger: 'blur' }],
+        symbol: [{ required: true, message: '交易对不能为空', trigger: 'blur' }]
+      }
+    }
+  },
+  methods: {
+
+    // 取消按钮
+    cancel() {
+      this.open = false
+      this.reset()
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+
+        id: undefined,
+        apiId: undefined,
+        reverseApiId: undefined,
+        reverseAmount: undefined,
+        side: undefined,
+        positionSide: undefined,
+        symbol: undefined,
+        status: undefined
+      }
+      this.resetForm('form')
+    },
+    /** 提交按钮 */
+    submitForm: function() {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          // if (this.form.id !== undefined) {
+          //     updateLineReversePosition(this.form).then(response => {
+          //         if (response.code === 200) {
+          //             this.msgSuccess(response.msg)
+          //             this.handleClose()
+          //         } else {
+          //             this.msgError(response.msg)
+          //         }
+          //     })
+          // } else {
+          //     addLineReversePosition(this.form).then(response => {
+          //         if (response.code === 200) {
+          //             this.msgSuccess(response.msg)
+          //             this.handleClose()
+          //         } else {
+          //             this.msgError(response.msg)
+          //         }
+          //     })
+          // }
+        }
+      })
+    },
+    handleClose() {
+      this.$emit('update:open', false)
+      this.$emit('close')
+      this.reset()
+    }
+  }
+}
+</script>
diff --git a/src/views/admin/line-reverse-position/index.vue b/src/views/admin/line-reverse-position/index.vue
new file mode 100644
index 0000000..5a03264
--- /dev/null
+++ b/src/views/admin/line-reverse-position/index.vue
@@ -0,0 +1,355 @@
+<template>
+  <BasicLayout>
+    <template #wrapper>
+      <el-card class="box-card">
+        <el-form ref="queryForm" :model="queryParams" :inline="true" label-width="100px">
+
+          <el-form-item label="反单买卖方向" prop="side">
+            <el-select v-model="queryParams.side" prop="side" size="small" clearable>
+              <el-option
+                v-for="item in sideOptions"
+                :key="'query-side-' + item.value"
+                :value="item.value"
+                :label="item.label"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="反单持仓方向" prop="positionSide">
+            <el-select v-model="queryParams.positionSide" clearable size="small">
+              <el-option
+                v-for="item in positionSideOptions"
+                :key="'query-positionSide-' + item.value"
+                :value="item.value"
+                :label="item.label"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="交易对" prop="symbol"><el-input
+            v-model="queryParams.symbol"
+            placeholder="请输入交易对"
+            clearable
+            size="small"
+            @keyup.enter.native="handleQuery"
+          />
+          </el-form-item>
+
+          <el-form-item>
+            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+          </el-form-item>
+        </el-form>
+
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button
+              v-permisaction="['admin:lineReversePosition:closePosition']"
+              type="primary"
+              icon="el-icon-s-flag"
+              size="mini"
+              @click="handleCloseBatches"
+            >平仓
+            </el-button>
+          </el-col>
+          <!-- <el-col :span="1.5">
+            <el-button v-permisaction="['admin:lineReversePosition:add']" type="primary" icon="el-icon-plus" size="mini"
+              @click="handleAdd">新增
+            </el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button v-permisaction="['admin:lineReversePosition:edit']" type="success" icon="el-icon-edit"
+              size="mini" :disabled="single" @click="handleUpdate">修改
+            </el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button v-permisaction="['admin:lineReversePosition:remove']" type="danger" icon="el-icon-delete"
+              size="mini" :disabled="multiple" @click="handleDelete">删除
+            </el-button>
+          </el-col> -->
+        </el-row>
+
+        <el-table v-loading="loading" :data="lineReversePositionList" @selection-change="handleSelectionChange">
+          <el-table-column type="selection" width="55" align="center" />
+          <el-table-column label="交易对" align="center" prop="symbol" width="120px" />
+          <el-table-column label="主单用户" align="center" prop="apiName" width="100px" />
+          <el-table-column label="反单用户" align="center" prop="reverseApiName" width="100px" />
+          <el-table-column label="主单仓位" align="center" prop="amount" :show-overflow-tooltip="true" />
+          <el-table-column label="主单总仓位" align="center" prop="totalAmount" />
+          <el-table-column label="主单持仓方向" align="center" prop="side" width="100px" />
+          <el-table-column label="反单仓位" align="center" prop="reverseAmount" :show-overflow-tooltip="true" />
+          <el-table-column label="反单总仓位" align="center" prop="totalReverseAmount" />
+          <el-table-column label="反单持仓方向" align="center" prop="positionSide" width="100px">
+            <template slot-scope="scope">
+              {{ scope.row.positionSide === 'LONG' ? '多' : '空' }}
+            </template>
+          </el-table-column>
+          <el-table-column label="主单仓位" align="center" prop="status">
+            <template slot-scope="scope">
+              <el-tag v-if="scope.row.status === 0">正常</el-tag>
+              <el-tag v-else-if="scope.row.status === 1" type="primary">开仓</el-tag>
+              <el-tag v-else type="success">平仓</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="反单仓位" align="center" prop="reverseStatus" width="80px">
+            <template slot-scope="scope">
+              <el-tag v-if="scope.row.reverseStatus === 0">正常</el-tag>
+              <el-tag v-else-if="scope.row.reverseStatus === 1" type="primary">开仓</el-tag>
+              <el-tag v-else type="success">平仓</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template slot-scope="scope">
+              <!-- <el-popconfirm class="delete-popconfirm" title="确认要修改吗?" confirm-button-text="修改"
+                @confirm="handleUpdate(scope.row)">
+                <el-button slot="reference" v-permisaction="['admin:lineReversePosition:edit']" size="mini" type="text"
+                  icon="el-icon-edit">修改
+                </el-button>
+              </el-popconfirm> -->
+              <el-popconfirm
+                class="delete-popconfirm"
+                title="确认要删除吗?"
+                confirm-button-text="删除"
+                @confirm="handleDelete(scope.row)"
+              >
+                <el-button
+                  slot="reference"
+                  v-permisaction="['admin:lineReversePosition:remove']"
+                  size="mini"
+                  type="text"
+                  icon="el-icon-delete"
+                >删除
+                </el-button>
+              </el-popconfirm>
+              <el-popconfirm
+                class="delete-popconfirm"
+                title="确认要平仓吗?"
+                confirm-button-text="平仓"
+                @confirm="handleClosePosition(scope.row)"
+              >
+                <el-button
+                  v-if="scope.row.reverseStatus ===1"
+                  slot="reference"
+                  v-permisaction="['admin:lineReversePosition:closePosition']"
+                  size="mini"
+                  type="text"
+                  icon="el-icon-s-flag"
+                >平仓
+                </el-button>
+              </el-popconfirm>
+
+              <el-button
+                v-permisaction="['admin:lineReversePosition:edit']"
+                size="mini"
+                type="text"
+                icon="el-icon-s-order"
+                @click="handleShowOrders(scope.row)"
+              >订单明细
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <pagination
+          v-show="total > 0"
+          :total="total"
+          :page.sync="queryParams.pageIndex"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getList"
+        />
+
+        <!--仓位详情-->
+        <detail :open.sync="open" :title="title" :form="form" :is-edit="isEdit" @close="handleClose" />
+        <!--仓位订单明细-->
+        <order-list :show.sync="showOrders" :position-id="selectedPositionId" />
+        <!--平仓操作-->
+        <close-position :open.sync="showClosePosition" />
+      </el-card>
+    </template>
+  </BasicLayout>
+</template>
+
+<script>
+import { delLineReversePosition, listLineReversePosition, getLineReversePosition, closePosition } from '@/api/admin/line-reverse-position'
+import Detail from './detail.vue'
+import OrderList from './order-list.vue'
+import ClosePosition from './close-position.vue'
+
+export default {
+  name: 'LineReversePosition',
+  components: {
+    Detail,
+    OrderList,
+    ClosePosition
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 总条数
+      total: 0,
+      // 弹出层标题
+      title: '',
+      // 是否显示弹出层
+      open: false,
+      isEdit: false,
+      // 类型数据字典
+      typeOptions: [],
+      lineReversePositionList: [],
+      positionSideOptions: [{
+        label: '多',
+        value: 'LONG'
+      }, {
+        label: '空',
+        value: 'SHORT'
+      }],
+      sideOptions: [{
+        label: '买',
+        value: 'BUY'
+      }, {
+        label: '卖',
+        value: 'SELL'
+      }],
+      // 关系表类型
+
+      // 查询参数
+      queryParams: {
+        pageIndex: 1,
+        pageSize: 10,
+        apiId: undefined,
+        reverseApiId: undefined,
+        side: undefined,
+        positionSide: undefined,
+        symbol: undefined,
+        idOrder: 'desc'
+      },
+      // 表单参数
+      form: {
+      },
+
+      showOrders: false,
+      selectedPositionId: null,
+
+      showClosePosition: false
+    }
+  },
+  created() {
+    this.getList()
+  },
+  methods: {
+    /** 查询参数列表 */
+    getList() {
+      this.loading = true
+      listLineReversePosition(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
+        this.lineReversePositionList = response.data.list
+        this.total = response.data.count
+        this.loading = false
+      }
+      )
+    },
+    getImgList: function() {
+      this.form[this.fileIndex] = this.$refs['fileChoose'].resultList[0].fullUrl
+    },
+    fileClose: function() {
+      this.fileOpen = false
+    },
+    // 关系
+    // 文件
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageIndex = 1
+      this.getList()
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.dateRange = []
+      this.resetForm('queryForm')
+      this.handleQuery()
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset()
+      this.open = true
+      this.title = '添加反单管理-仓位'
+      this.isEdit = false
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length !== 1
+      this.multiple = !selection.length
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset()
+      const id =
+        row.id || this.ids
+      getLineReversePosition(id).then(response => {
+        this.form = response.data
+        this.open = true
+        this.title = '修改反单管理-仓位'
+        this.isEdit = true
+      })
+    },
+    handleClose() {
+      this.getList()
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      var Ids = (row.id && [row.id]) || this.ids
+
+      this.$confirm('是否确认删除编号为"' + Ids + '"的数据项?', '警告', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(function() {
+        return delLineReversePosition({ 'ids': Ids })
+      }).then((response) => {
+        if (response.code === 200) {
+          this.msgSuccess(response.msg)
+          this.open = false
+          this.getList()
+        } else {
+          this.msgError(response.msg)
+        }
+      }).catch(function() {
+      })
+    },
+    // 仓位订单明细
+    handleShowOrders(row) {
+      this.showOrders = true
+      this.selectedPositionId = row.id
+    },
+    // 批量平仓
+    handleCloseBatches() {
+      this.showClosePosition = true
+    },
+    // 平仓
+    handleClosePosition(row) {
+      this.loading = true
+      const data = {
+        id: Number(row.id)
+      }
+
+      closePosition(data).then(response => {
+        if (response.code === 200) {
+          this.msgSuccess(response.msg)
+        } else {
+          this.msgError(response.msg)
+        }
+      })
+        .catch(error => {
+          console.log(error)
+        })
+        .finally(() => {
+          this.loading = false
+          this.getList()
+        })
+    }
+  }
+}
+</script>
diff --git a/src/views/admin/line-reverse-position/order-list.vue b/src/views/admin/line-reverse-position/order-list.vue
new file mode 100644
index 0000000..4b366d9
--- /dev/null
+++ b/src/views/admin/line-reverse-position/order-list.vue
@@ -0,0 +1,282 @@
+<template>
+  <el-drawer title="仓位订单明细" :visible.sync="show" direction="rtl" size="80%" @open="handleOpen" @close="handleClose">
+    <el-form ref="queryForm" :model="queryParams" :inline="true" label-width="68px">
+      <el-form-item label="类别" prop="category">
+        <el-select v-model="queryParams.category" clearable>
+          <el-option
+            v-for="item in categoryOptions"
+            :key="'query-category' + item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="下单类型" prop="type">
+        <el-select v-model="queryParams.type" clearable>
+          <el-option
+            v-for="item in typeOptions"
+            :key="'query-type' + item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="订单类型" prop="orderType">
+        <el-select v-model="queryParams.orderType" clearable>
+          <el-option
+            v-for="item in orderTypeOptions"
+            :key="'query-orderType' + item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="状态" prop="status">
+        <el-select v-model="queryParams.status" clearable>
+          <el-option
+            v-for="item in statusOptions"
+            :key="'query-status' + item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table v-loading="loading" :data="lineReverseOrderList" :row-class-name="tableRowClassName">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="类别" align="center" prop="category" width="80px">
+        <template slot-scope="scope">
+          {{ categoryFormat(scope) }}
+        </template>
+      </el-table-column>
+      <el-table-column label="订单号" align="center" prop="orderSn" :show-overflow-tooltip="true" />
+      <el-table-column label="币安订单号" align="center" prop="orderId" :show-overflow-tooltip="true" />
+      <el-table-column label="交易对" align="center" prop="symbol" :show-overflow-tooltip="true" />
+      <el-table-column label="下单类型" align="center" prop="type">
+        <template slot-scope="scope">
+          {{ typeFormat(scope) }}
+        </template>
+      </el-table-column>
+      <el-table-column label="订单类型" align="center" prop="orderType">
+        <template slot-scope="scope">
+          {{ orderTypeFormat(scope) }}
+        </template>
+      </el-table-column>
+      <el-table-column label="购买金额" align="center" prop="buyPrice" :show-overflow-tooltip="true" />
+      <el-table-column label="委托价格" align="center" prop="price" :show-overflow-tooltip="true" />
+      <el-table-column label="实际成交价" align="center" prop="finalPrice" :show-overflow-tooltip="true" />
+      <el-table-column label="成交数量" align="center" prop="totalNum" :show-overflow-tooltip="true" />
+      <el-table-column label="持仓方向" align="center" prop="positionSide">
+        <template slot-scope="scope">
+          <el-tag v-if="scope.row.positionSide === 'LONG'" type="warning" effect="plain">多</el-tag>
+          <el-tag v-else type="success" effect="plain">空</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="买卖方向" align="center" prop="side" :show-overflow-tooltip="true" />
+      <el-table-column label="触发时间" align="center" prop="triggerTime">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.triggerTime) }}</span>
+        </template>
+      </el-table-column><el-table-column label="状态" align="center" prop="status">
+        <template slot-scope="scope">
+          {{ statusFormat(scope) }}
+        </template>
+      </el-table-column>
+      <el-table-column label="描述" align="center" prop="remark" :show-overflow-tooltip="true" />
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageIndex"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+  </el-drawer>
+</template>
+
+<script>
+import { listLineReverseOrder } from '@/api/admin/line-reverse-order'
+
+export default {
+  name: 'OrderList',
+  props: {
+    show: {
+      type: Boolean,
+      default: false
+    },
+    positionId: {
+      type: Number,
+      default: null
+    }
+
+  },
+  data() {
+    return {
+      categoryOptions: [{
+        value: 0,
+        label: '主单'
+      }, {
+        value: 1,
+        label: '反单'
+      }],
+      typeOptions: [{
+        value: 'LIMIT',
+        label: '限价'
+      }, {
+        value: 'MARKET',
+        label: '市价'
+      }, {
+        value: 'STOP',
+        label: '限价止损'
+      }, {
+        value: 'TAKE_PROFIT',
+        label: '限价止盈'
+      }, {
+        value: 'STOP_MARKET',
+        label: '市价止损'
+      }, {
+        value: 'TAKE_PROFIT_MARKET',
+        label: '市价止盈'
+      }, {
+        value: 'LIQUIDATION',
+        label: '爆仓'
+      }],
+      positionSideOptions: [{
+        value: 'LONG',
+        label: '多'
+      }, {
+        value: 'SHORT',
+        label: '空'
+      }],
+      sideOptions: [{
+        value: 'SELL',
+        label: '卖'
+      }, {
+        value: 'BUY',
+        label: '买'
+      }],
+      orderTypeOptions: [{
+        value: 0,
+        label: '主单'
+      }, {
+        value: 1,
+        label: '止盈单'
+      }, {
+        value: 2,
+        label: '止损单'
+      }, {
+        value: 3,
+        label: '减仓单'
+      }, {
+        value: 4,
+        label: '平仓单'
+      }],
+
+      statusOptions: [{
+        value: 1,
+        label: '待下单'
+      }, {
+        value: 2,
+        label: '已下单'
+      }, {
+        value: 3,
+        label: '已成交'
+      }, {
+        value: 6,
+        label: '已取消'
+      }, {
+        value: 7,
+        label: '已过期'
+      }, {
+        value: 8,
+        label: '已失败'
+      }],
+      queryParams: {
+        pageIndex: 1,
+        pageSize: 10,
+        category: undefined,
+        type: undefined,
+        orderType: undefined,
+        status: undefined,
+        idOrder: 'desc'
+      },
+      total: 0,
+      loading: false,
+      lineReverseOrderList: []
+    }
+  },
+  methods: {
+    categoryFormat(scope) {
+      const category = this.categoryOptions.find(item => item.value === scope.row.category)
+      return category ? category.label : ''
+    },
+    typeFormat(scope) {
+      const type = this.typeOptions.find(item => item.value === scope.row.type)
+      return type ? type.label : ''
+    },
+    statusFormat(scope) {
+      const status = this.statusOptions.find(item => item.value === scope.row.status)
+      return status ? status.label : ''
+    },
+    orderTypeFormat(scope) {
+      const orderType = this.orderTypeOptions.find(item => item.value === scope.row.orderType)
+      return orderType ? orderType.label : ''
+    },
+    handleOpen() {
+      this.lineReverseOrderList = []
+
+      this.getList()
+    },
+    handleClose() {
+      this.$emit('update:show', false)
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageIndex = 1
+      this.getList()
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm('queryForm')
+      this.handleQuery()
+    },
+    /** 查询参数列表 */
+    getList() {
+      this.loading = true
+      const queryData = { positionId: this.positionId, ...this.queryParams }
+      console.log('queryData', queryData)
+      if (queryData.category === undefined || queryData.category === null || queryData.category === '') {
+        queryData.category = -1
+      } else {
+        queryData.category = Number(queryData.category)
+      }
+      listLineReverseOrder(this.addDateRange(queryData, this.dateRange)).then(response => {
+        this.lineReverseOrderList = response.data.list
+        this.total = response.data.count
+        this.loading = false
+      }
+      )
+    },
+    tableRowClassName({ row, rowIndex }) {
+      if (row.category === 0) {
+        return 'main-order'
+      }
+
+      return ''
+    }
+  }
+}
+</script>
+
+<style scoped>
+::v-deep .el-table__body tr.main-order {
+    background-color: oldlace !important;
+}
+</style>