1

PC-20250623MANY\Administrator

2025-10-21 7bbf9b23bcd3f2bbf54aa62476cd2c4e7ea88aaa

 src/views/modules/cryptos-spots/cryptos-spots-transport.vue

@@ -1,365 +1,341 @@
<template>
  <div class="mod-cryptos-spots-transport">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="当前单" name="1"></el-tab-pane>
      <el-tab-pane label="历史单" name="2"></el-tab-pane>
    </el-tabs>
    <avue-crud
      ref="crud"
      :page.sync="page"
      :data="dataList"
      :option="tableOption"
      :cell-class-name="addClasscolor"
      @search-change="searchChange"
      @selection-change="selectionChange"
      @refresh-change="refreshChange"
      @on-load="getDataList"
    >
      <template slot-scope="scope" slot="userNamesolt">
        <span @click="searchName(scope.row.userName)" class="seachButton">{{
   <div class="mod-cryptos-spots-transport">
      <el-tabs v-model="activeName" @tab-click="handleClick">
         <el-tab-pane label="当前单" name="1"></el-tab-pane>
         <el-tab-pane label="历史单" name="2"></el-tab-pane>
      </el-tabs>
      <avue-crud ref="crud" :page.sync="page" :data="dataList" :option="tableOption" :cell-class-name="addClasscolor"
         @search-change="searchChange" @selection-change="selectionChange" @refresh-change="refreshChange"
         @on-load="getDataList">
         <template slot-scope="scope" slot="userNamesolt">
            <span @click="searchName(scope.row.userName)" class="seachButton">{{
          scope.row.userName
        }}</span>
      </template>
      <!-- （剩余/委托金额） -->
      <template slot-scope="scope" slot="vove">
        <span class="green">{{ scope.row.volumeUnitAmount }}</span
        >/<span>{{ scope.row.volumeOpenUnitAmount }}</span>
      </template>
      <!-- （剩余/委托保证金） -->
      <template slot-scope="scope" slot="depo">
        <span class="green">{{ scope.row.deposit }}</span
        >/<span>{{ scope.row.depositOpen }}</span>
      </template>
      <template slot-scope="scope" slot="closTime">
        <span v-if="scope.row.closeTime">{{
         </template>
         <!-- （剩余/委托金额） -->
         <template slot-scope="scope" slot="vove">
            <span
               class="green">{{ scope.row.volumeUnitAmount }}</span>/<span>{{ scope.row.volumeOpenUnitAmount }}</span>
         </template>
         <!-- （剩余/委托保证金） -->
         <template slot-scope="scope" slot="depo">
            <span class="green">{{ scope.row.deposit }}</span>/<span>{{ scope.row.depositOpen }}</span>
         </template>
         <template slot-scope="scope" slot="closTime">
            <span v-if="scope.row.closeTime">{{
          new Date(scope.row.closeTime * 1000).toLocaleString()
        }}</span>
      </template>
      <template slot="menuLeft">
        <div class="cheBoxMain" v-if="activeName == 1">
          <div style="margin-bottom: 10px">调整行情</div>
          <div class="chekClect">
            <el-select
              v-model="dataForm.symbol"
              clearable
              placeholder="请选择币种"
            >
              <el-option
                v-for="item in option"
                :key="item.symbol"
                :label="item.name"
                :value="item.symbol"
              >
              </el-option>
            </el-select>
          </div>
          <div class="chekClect" style="margin-top: 3px">
            <el-button
              type="primary"
              icon="el-icon-edit"
              size="small"
              @click="addOrUpdateHandle(dataForm.symbol)"
              >调整</el-button
            >
          </div>
        </div>
      </template>
      <template slot="menuLeft">
        <div class="main">
          <el-tabs
            v-if="activeName == '2'"
            v-model="activeName2"
            @tab-click="handleClick2"
          >
            <el-tab-pane label="全部" name="1"></el-tab-pane>
            <el-tab-pane label="持仓" name="2"></el-tab-pane>
            <el-tab-pane label="已平仓" name="3"></el-tab-pane>
          </el-tabs>
        </div>
      </template>
      <template
        slot-scope="scope"
        slot="menu"
        v-if="scope.row.state == 'submitted'"
      >
        <el-button
          type="primary"
          icon="el-icon-edit"
          size="small"
          v-if="isAuth('sys:user:delete')"
          @click.stop="deleteHandle(scope.row.orderNo)"
          >平仓</el-button
        >
      </template>
    </avue-crud>
    <add-or-update
      v-if="addOrUpdateVisible"
      ref="addOrUpdate"
      @refreshDataList="refreshChange"
    ></add-or-update>
    <el-dialog
      title="完整用户名(完整钱包地址)"
      :close-on-click-modal="false"
      :visible.sync="userNamevisible"
    >
      <el-form :model="dataForm" ref="dataForm">
        <el-form-item label="" prop="">
          <div style="font-size: 20px">
            <span>{{ username }}</span
            ><a
              class="seachButton"
              target="_blank"
              :href="'https://etherscan.io/address/' + username"
              >在Etherscan上查看</a
            >
          </div>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="userNamevisible = false">取消</el-button>
        <el-button type="primary" @click="userNamevisible = false"
          >确定</el-button
        >
      </span>
    </el-dialog>
  </div>
         </template>
         <template slot="menuLeft">
            <div class="cheBoxMain" v-if="activeName == 1">
               <div style="margin-bottom: 10px">调整行情</div>
               <div class="chekClect">
                  <el-select v-model="dataForm.symbol" clearable placeholder="请选择币种">
                     <el-option v-for="item in option" :key="item.symbol" :label="item.name"
                        :value="item.symbol">
                     </el-option>
                  </el-select>
               </div>
               <div class="chekClect" style="margin-top: 3px">
                  <el-button type="primary" icon="el-icon-edit" size="small"
                     @click="addOrUpdateHandle(dataForm.symbol)">调整</el-button>
               </div>
            </div>
         </template>
         <template slot="menuLeft">
            <div class="main">
               <el-tabs v-if="activeName == '2'" v-model="activeName2" @tab-click="handleClick2">
                  <el-tab-pane label="全部" name="1"></el-tab-pane>
                  <el-tab-pane label="持仓" name="2"></el-tab-pane>
                  <el-tab-pane label="已平仓" name="3"></el-tab-pane>
               </el-tabs>
            </div>
         </template>
         <template slot-scope="scope" slot="menu" v-if="scope.row.state == 'submitted'">
            <el-button type="primary" icon="el-icon-edit" size="small" v-if="isAuth('sys:user:delete')"
               @click.stop="deleteHandle(scope.row.orderNo)">平仓</el-button>
            <el-button type="primary" icon="el-icon-edit" size="small"
               @click.stop="UpdateHandle(scope.row)">盈亏控制</el-button>
         </template>
      </avue-crud>
      <!-- 弹窗,  修改 -->
      <add-or-updates v-if="UpdateVisibles" ref="Updates" @refreshDataList="getDataList"></add-or-updates>

      <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="refreshChange"></add-or-update>
      <el-dialog title="完整用户名(完整钱包地址)" :close-on-click-modal="false" :visible.sync="userNamevisible">
         <el-form :model="dataForm" ref="dataForm">
            <el-form-item label="" prop="">
               <div style="font-size: 20px">
                  <span>{{ username }}</span><a class="seachButton" target="_blank"
                     :href="'https://etherscan.io/address/' + username">在Etherscan上查看</a>
               </div>
            </el-form-item>
         </el-form>
         <span slot="footer" class="dialog-footer">
            <el-button @click="userNamevisible = false">取消</el-button>
            <el-button type="primary" @click="userNamevisible = false">确定</el-button>
         </span>
      </el-dialog>
   </div>
</template>

<script>
import { tableOption } from "@/crud/shop/transportm";
import AddOrUpdate from "./transport-add-or-update";
export default {
  data() {
    return {
      dateRange: [],
      option: [
        {
          symbol: 1,
          name: "DOGE/USTD",
        },
      ],
      dataForm: {
        transName: "",
      },
      state: "submitted",
      activeName: "1", //选项卡
      activeName2: "1",
      dataList: [],
      dataListLoading: false,
      dataListSelections: [],
      username: "",
      userNamevisible: false,
      addOrUpdateVisible: false,
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 10, // 每页显示多少条
      },
      searchParams: {}, // 搜索条件
      tableOption: tableOption,
    };
  },
  components: {
    AddOrUpdate,
  },
  created() {
    this.getAction();
  },
  mounted() {},
  computed: {},
  methods: {
    addClasscolor({ column, row }) {
      //表单样式
      if (
        (column.property === "direction" && row.direction == "buy") ||
        (column.property === "profitLoss" && row.profitLoss * 1 > 0) ||
        (column.property === "roleName" && row.roleName == "MEMBER") ||
        (column.property === "volume" && row.volume * 1 >= 0) ||
        (column.property === "vnvu" && row.vnvu) ||
        (column.property === "dd" && row.dd)
      ) {
        return "green";
      } else if (
        (column.property === "direction" && row.direction == "sell") ||
        (column.property === "profitLoss" && row.profitLoss * 1 < 0)
      ) {
        return "red";
      } else if (column.property === "roleName" && row.roleName == "GUEST") {
        return "yellow";
      }
    },
    // 获取数据列表
    getDataList(page, done) {
      page = page === undefined ? this.page : page;
      this.dataListLoading = true;
      this.$http({
        url: this.$http.adornUrl(
          "/normal/adminContractOrderAction!/list.action"
        ),
        method: "get",
        params: this.$http.adornParams(
          Object.assign(
            {
              type: "cryptos", //forex->外汇,commodities->大宗商品，指数/ETF->indices, A-stocks->A股, HK-stocks->港股.US-stocks->美股，cryptos->虚拟货币
              current: page == null ? this.page.currentPage : page.currentPage,
              size: page == null ? this.page.pageSize : page.pageSize,
              userName: this.dataForm.orderNumber2,
              orderNo: this.dataForm.orderNumber,
              roleName: this.dataForm.value,
              state: this.state,
              // startTime: this.dateRange === null ? null : this.dateRange[0], // 开始时间
              // endTime: this.dateRange === null ? null : this.dateRange[1], // 结束时间
            },
            this.searchParams
          ),
          false
        ),
      }).then(({ data }) => {
        this.dataList = data.data.records;
        this.page.total = data.data.total;
        this.dataListLoading = false;
        if (done) {
          done();
        }
      });
    },
    searchName(name) {
      this.username = name;
      this.userNamevisible = true;
    },
    // 清除数据
    clearDatas() {
      this.dataForm = {};
      this.dateRange = [];
    },
    // 每页数
    sizeChangeHandle(val) {
      this.page.pageSize = val;
      this.page.currentPage = 1;
      this.getDataList(this.page);
    },
    // 当前页
    currentChangeHandle(val) {
      this.page.currentPage = val;
      this.getDataList(this.page);
    },
    // 选项卡
    handleClick(tab, event) {
      //console.log(this.activeName)
      if (this.activeName == 1) {
        this.state = "submitted";
      } else {
        this.state = "created";
      }
      this.getDataList();
    },
    handleClick2(tab, event) {
      //console.log(this.activeName2)
      if (this.activeName2 == 1) {
        this.state = "";
      } else if (this.activeName2 == 2) {
        this.state = "submitted";
      } else {
        this.state = "created";
      }
      this.getDataList();
    },
    // 新增 / 修改
    addOrUpdateHandle(id) {
      if (this.dataForm.symbol) {
        this.addOrUpdateVisible = true;
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(id);
        });
      } else {
        this.$message({
          message: "请先选择币种",
          type: "error",
        });
      }
    },
    // 平仓
    deleteHandle(orderNo) {
      this.$confirm("您确定要进行平仓操作吗", "是否确认平仓", {
        //系统管理用户是否已绑定
        distinguishCancelAndClose: true,
        confirmButtonText: "取消",
        cancelButtonText: "平仓",
        type: "success",
      })
        .then(() => {})
        .catch((action) => {
          if (action === "cancel") {
            this.$http({
              url: this.$http.adornUrl(
                "/normal/adminContractOrderAction!/close.action"
              ),
              method: "get",
              params: this.$http.adornParams({
                orderNo: orderNo,
              }),
            }).then(({ data }) => {
              this.$message({
                message: "平仓成功",
                type: "success",
                duration: 1500,
                onClose: () => {
                  this.visible = false;
                  this.getDataList();
                },
              });
            });
          } else {
          }
        });
    },
    //行情数据
    getAction() {
      this.$http({
        url: this.$http.adornUrl("/normal/adminItemAction!/list"),
        method: "get",
        params: this.$http.adornParams({
          type: "cryptos", //forex->外汇,commodities->大宗商品，指数/ETF->indices, A-stocks->A股, HK-stocks->港股.US-stocks->美股，cryptos->虚拟货币
        }),
      }).then(({ data }) => {
        if (data.data.records) {
          this.option = data.data.records.map((item, index) => {
            return Object.assign({}, { symbol: item.symbol, name: item.name });
          });
        }
      });
    },
    // 条件查询
    searchChange(params, done) {
      this.page.currentPage = 1; // 重置当前页为第一页
      this.searchParams = params;
      this.getDataList(this.page, done);
    },
    // 刷新回调用
    refreshChange() {
      this.page = this.$refs.crud.$refs.tablePage.defaultPage;
      this.getDataList(this.page);
      this.dataListSelections = [];
      this.$refs.crud.selectClear();
    },
    // 多选变化
    selectionChange(val) {
      console.log("val: ", val);
      this.dataListSelections = val;
    },
  },
};
   import {
      tableOption
   } from "@/crud/shop/transportm";
   import AddOrUpdate from "./transport-add-or-update";
   import Updates from "./finance-add-or-updates";
   export default {
      data() {
         return {
            dateRange: [],
            option: [{
               symbol: 1,
               name: "DOGE/USTD",
            }, ],
            dataForm: {
               transName: "",
            },
            state: "submitted",
            activeName: "1", //选项卡
            activeName2: "1",
            dataList: [],
            dataListLoading: false,
            dataListSelections: [],
            username: "",
            userNamevisible: false,
            addOrUpdateVisible: false,
            UpdateVisibles: false,
            page: {
               total: 0, // 总页数
               currentPage: 1, // 当前页数
               pageSize: 10, // 每页显示多少条
            },
            searchParams: {}, // 搜索条件
            tableOption: tableOption,
         };
      },
      components: {
         AddOrUpdate,
         'add-or-updates': Updates
      },
      created() {
         this.getAction();
      },
      mounted() {},
      computed: {},
      methods: {
         addClasscolor({
            column,
            row
         }) {
            //表单样式
            if (
               (column.property === "direction" && row.direction == "buy") ||
               (column.property === "profitLoss" && row.profitLoss * 1 > 0) ||
               (column.property === "roleName" && row.roleName == "MEMBER") ||
               (column.property === "volume" && row.volume * 1 >= 0) ||
               (column.property === "vnvu" && row.vnvu) ||
               (column.property === "dd" && row.dd)
            ) {
               return "green";
            } else if (
               (column.property === "direction" && row.direction == "sell") ||
               (column.property === "profitLoss" && row.profitLoss * 1 < 0)
            ) {
               return "red";
            } else if (column.property === "roleName" && row.roleName == "GUEST") {
               return "yellow";
            }
         },

         // 获取数据列表
         getDataList(page, done) {
            page = page === undefined ? this.page : page;
            this.dataListLoading = true;
            this.$http({
               url: this.$http.adornUrl(
                  "/normal/adminContractOrderAction!/list.action"
               ),
               method: "get",
               params: this.$http.adornParams(
                  Object.assign({
                        type: "cryptos", //forex->外汇,commodities->大宗商品，指数/ETF->indices, A-stocks->A股, HK-stocks->港股.US-stocks->美股，cryptos->虚拟货币
                        current: page == null ? this.page.currentPage : page.currentPage,
                        size: page == null ? this.page.pageSize : page.pageSize,
                        userName: this.dataForm.orderNumber2,
                        orderNo: this.dataForm.orderNumber,
                        roleName: this.dataForm.value,
                        state: this.state,
                        // startTime: this.dateRange === null ? null : this.dateRange[0], // 开始时间
                        // endTime: this.dateRange === null ? null : this.dateRange[1], // 结束时间
                     },
                     this.searchParams
                  ),
                  false
               ),
            }).then(({
               data
            }) => {
               this.dataList = data.data.records;
               this.page.total = data.data.total;
               this.dataListLoading = false;
               if (done) {
                  done();
               }
            });
         },
         searchName(name) {
            this.username = name;
            this.userNamevisible = true;
         },
         // 清除数据
         clearDatas() {
            this.dataForm = {};
            this.dateRange = [];
         },
         // 每页数
         sizeChangeHandle(val) {
            this.page.pageSize = val;
            this.page.currentPage = 1;
            this.getDataList(this.page);
         },
         // 当前页
         currentChangeHandle(val) {
            this.page.currentPage = val;
            this.getDataList(this.page);
         },
         // 选项卡
         handleClick(tab, event) {
            //console.log(this.activeName)
            if (this.activeName == 1) {
               this.state = "submitted";
            } else {
               this.state = "created";
            }
            this.getDataList();
         },
         handleClick2(tab, event) {
            //console.log(this.activeName2)
            if (this.activeName2 == 1) {
               this.state = "";
            } else if (this.activeName2 == 2) {
               this.state = "submitted";
            } else {
               this.state = "created";
            }
            this.getDataList();
         },
         // 修改
         UpdateHandle(id) {
            this.UpdateVisibles = true;
            this.$nextTick(() => {
               this.$refs.Updates.init(id);
            });
         },
         // 新增 / 修改
         addOrUpdateHandle(id) {
            if (this.dataForm.symbol) {
               this.addOrUpdateVisible = true;
               this.$nextTick(() => {
                  this.$refs.addOrUpdate.init(id);
               });
            } else {
               this.$message({
                  message: "请先选择币种",
                  type: "error",
               });
            }
         },
         // 平仓
         deleteHandle(orderNo) {
            this.$confirm("您确定要进行平仓操作吗", "是否确认平仓", {
                  //系统管理用户是否已绑定
                  distinguishCancelAndClose: true,
                  confirmButtonText: "取消",
                  cancelButtonText: "平仓",
                  type: "success",
               })
               .then(() => {})
               .catch((action) => {
                  if (action === "cancel") {
                     this.$http({
                        url: this.$http.adornUrl(
                           "/normal/adminContractOrderAction!/close.action"
                        ),
                        method: "get",
                        params: this.$http.adornParams({
                           orderNo: orderNo,
                        }),
                     }).then(({
                        data
                     }) => {
                        this.$message({
                           message: "平仓成功",
                           type: "success",
                           duration: 1500,
                           onClose: () => {
                              this.visible = false;
                              this.getDataList();
                           },
                        });
                     });
                  } else {}
               });
         },
         //行情数据
         getAction() {
            this.$http({
               url: this.$http.adornUrl("/normal/adminItemAction!/list"),
               method: "get",
               params: this.$http.adornParams({
                  type: "cryptos", //forex->外汇,commodities->大宗商品，指数/ETF->indices, A-stocks->A股, HK-stocks->港股.US-stocks->美股，cryptos->虚拟货币
               }),
            }).then(({
               data
            }) => {
               if (data.data.records) {
                  this.option = data.data.records.map((item, index) => {
                     return Object.assign({}, {
                        symbol: item.symbol,
                        name: item.name
                     });
                  });
               }
            });
         },
         // 条件查询
         searchChange(params, done) {
            this.page.currentPage = 1; // 重置当前页为第一页
            this.searchParams = params;
            this.getDataList(this.page, done);
         },
         // 刷新回调用
         refreshChange() {
            this.page = this.$refs.crud.$refs.tablePage.defaultPage;
            this.getDataList(this.page);
            this.dataListSelections = [];
            this.$refs.crud.selectClear();
         },
         // 多选变化
         selectionChange(val) {
            console.log("val: ", val);
            this.dataListSelections = val;
         },
      },
   };
</script>
<style></style>
<style lang="scss" scoped>
.mod-transport {
  .cheBoxMain {
    overflow: hidden;
    padding: 50px 20px;
  }
  .chekClect {
    float: left;
    margin-right: 20px;
  }
}
</style>
   .mod-transport {
      .cheBoxMain {
         overflow: hidden;
         padding: 50px 20px;
      }

      .chekClect {
         float: left;
         margin-right: 20px;
      }
   }
</style>