<script lang="ts">
export default {
    name: "coin",
};
</script>

<script setup lang="ts">
import { onMounted, reactive, ref, toRefs } from "vue";
import { ElForm, ElTable, ElMessage, ElMessageBox } from "element-plus";
import type { UploadProps } from "element-plus";
import { Plus, Setting, UploadFilled } from "@element-plus/icons-vue";
import { queryContractCoinList } from "@/api/system/dashboard";
import { uploadFile } from "@/api/system/file";
import { Content } from "@/types/api/system/dashboard";
import {
    addContractCoin,
    alterContractCoin,
    initContractWallet,
    poke,
    getBias,
    setBias,
} from "@/api/swap";

const dataTableRef = ref(ElTable);
const dataFormRef = ref(ElForm);

const state = reactive({
    loading: true,
    loading2: false,
    loading3: false,
    queryParams: {
        pageNo: 1,
        pageSize: 20,
    },
    list: [] as Content[],
    total: 0,
    isAdd: true,
    dialog: {
        title: "",
        visible: false,
    },
    formData: {
        id: 0,
        symbol: "",
        baseCoinScale: 4,
        baseSymbol: "USDT",
        closeFee: 0.0001,
        coinScale: 4,
        coinSymbol: "",
        enable: 1,
        visible: 1,
        enableMarketBuy: 1,
        enableMarketSell: 1,
        enableOpenBuy: 1,
        enableOpenSell: 1,
        enableTriggerEntrust: 1,
        exchangeable: 1,
        feePercent: 0.001,
        intervalHour: 1,
        leverage: "10,20,30,40,50,60,70,80,90,100",
        leverageType: 1,
        maintenanceMarginRate: 0.005,
        makerFee: 0.0001,
        maxShare: 1000,
        minShare: 1,
        maxTotalShare: 0,
        name: "",
        openFee: 0.0001,
        shareNumber: 100,
        sort: 1,
        spread: 0,
        spreadType: 1,
        takerFee: 0.0001,
        type: 0,
        icon: "",
        isHot: 2,
        minScale: 0,
    } as Content,
    rules: {
        symbol: [
            { required: true, message: "交易对不能为空", trigger: "blur" },
        ],
        enable: [
            { required: true, message: "请选择启用/启用", trigger: "blur" },
        ],
        visible: [
            { required: true, message: "请选择显示/隐藏", trigger: "blur" },
        ],
        name: [
            { required: true, message: "合约名称不能为空", trigger: "blur" },
        ],
        coinSymbol: [
            { required: true, message: "币种不能为空", trigger: "blur" },
        ],
        baseSymbol: [
            {
                required: true,
                message: "基础量价币种不能为空",
                trigger: "blur",
            },
        ],
        shareNumber: [
            { required: true, message: "合约面值不能为空", trigger: "blur" },
        ],
        leverageType: [
            { required: true, message: "请选择杠杆倍数类型", trigger: "blur" },
        ],
        leverage: [
            { required: true, message: "杠杆倍数不能为空", trigger: "blur" },
        ],
        maintenanceMarginRate: [
            {
                required: true,
                message: "维持保证金率不能为空",
                trigger: "blur",
            },
        ],
        enableOpenBuy: [
            { required: true, message: "请选择是否允许开多", trigger: "blur" },
        ],
        enableOpenSell: [
            { required: true, message: "请选择是否允许开空", trigger: "blur" },
        ],
        enableMarketBuy: [
            {
                required: true,
                message: "请选择市价开多启用/禁止",
                trigger: "blur",
            },
        ],
        enableMarketSell: [
            {
                required: true,
                message: "请选择市价开空启用/禁止",
                trigger: "blur",
            },
        ],
        enableTriggerEntrust: [
            {
                required: true,
                message: "请选择计划委托启用/禁止",
                trigger: "blur",
            },
        ],
        exchangeable: [
            {
                required: true,
                message: "请选择可交易启用/禁止",
                trigger: "blur",
            },
        ],
        openFee: [
            {
                required: true,
                message: "开仓手续费率不能为空",
                trigger: "blur",
            },
        ],
        closeFee: [
            {
                required: true,
                message: "平仓手续费率不能为空",
                trigger: "blur",
            },
        ],
        intervalHour: [
            {
                required: true,
                message: "请输入资金费率结算周期（小时）",
                trigger: "blur",
            },
        ],
        feePercent: [
            { required: true, message: "资金费率不能为空", trigger: "blur" },
        ],
        minShare: [
            { required: true, message: "最小张数不能为空", trigger: "blur" },
        ],
        /*maxShare: [{ required: true, message: '最大张数不能为空', trigger: 'blur' }],*/
        maxTotalShare: [
            { required: true, message: "最大持仓不能为空", trigger: "blur" },
        ],
        spreadType: [
            { required: true, message: "请选择滑点类型", trigger: "blur" },
        ],
        spread: [{ required: true, message: "请输入滑点", trigger: "blur" }],
        coinScale: [
            { required: true, message: "请输入价格精度", trigger: "blur" },
        ],
        baseCoinScale: [
            { required: true, message: "请输入结算价格精度", trigger: "blur" },
        ],
        minScale: [
            { required: true, message: "请输入基础价格精度", trigger: "blur" },
        ],
        takerFee: [
            { required: true, message: "请输入Taker费率", trigger: "blur" },
        ],
        makerFee: [
            { required: true, message: "请输入Maker费率", trigger: "blur" },
        ],
        type: [{ required: true, message: "请选择合约类型", trigger: "blur" }],
        sort: [{ required: true, message: "请输入排序", trigger: "blur" }],
    },
    controlPanel: {
        title: "控盘",
        visible: false,
    },
    controlPanelData: {
        id: "",
        symbol: "",
        bias: "",
    },
});

const {
    controlPanelData,
    controlPanel,
    loading,
    loading2,
    loading3,
    queryParams,
    list,
    total,
    isAdd,
    dialog,
    formData,
    rules,
} = toRefs(state);

function handleQuery() {
    state.loading = true;
    queryContractCoinList(state.queryParams).then(({ data }) => {
        state.list = data.content;
        state.total = data.totalElements;
        state.loading = false;
    });
}

const showAddContractCoin = () => {
    state.isAdd = true;
    state.dialog = {
        title: "添加交易对",
        visible: true,
    };
    formData.value.id = 0;
    formData.value.symbol = "";
    formData.value.baseCoinScale = 4;
    formData.value.baseSymbol = "USDT";
    formData.value.closeFee = 0.0001;
    formData.value.coinScale = 4;
    formData.value.coinSymbol = "";
    formData.value.enable = 1;
    formData.value.visible = 1;
    formData.value.enableMarketBuy = 1;
    formData.value.enableMarketSell = 1;
    formData.value.enableOpenBuy = 1;
    formData.value.enableOpenSell = 1;
    formData.value.enableTriggerEntrust = 1;
    formData.value.exchangeable = 1;
    formData.value.feePercent = 0.001;
    formData.value.intervalHour = 1;
    formData.value.leverage = "10,20,30,40,50,60,70,80,90,100";
    formData.value.leverageType = 1;
    formData.value.maintenanceMarginRate = 0.005;
    formData.value.makerFee = 0.0001;
    formData.value.maxShare = 1000;
    formData.value.minShare = 1;
    formData.value.maxTotalShare = 0;
    formData.value.name = "";
    formData.value.openFee = 0.0001;
    formData.value.shareNumber = 100;
    formData.value.sort = 1;
    formData.value.spread = 0;
    formData.value.spreadType = 1;
    formData.value.takerFee = 0.0001;
    formData.value.type = 0;
    formData.value.icon = "";
    formData.value.isHot = 2;
    formData.value.minScale = 0;
};

const showAlterContractCoin = (row: any) => {
    state.isAdd = false;
    state.dialog = {
        title: "修改交易对",
        visible: true,
    };
    formData.value.id = row.id;
    formData.value.symbol = row.symbol;
    formData.value.baseCoinScale = row.baseCoinScale;
    formData.value.baseSymbol = row.baseSymbol;
    formData.value.closeFee = row.closeFee;
    formData.value.coinScale = row.coinScale;
    formData.value.coinSymbol = row.coinSymbol;
    formData.value.enable = row.enable;
    formData.value.visible = row.visible;
    formData.value.enableMarketBuy = row.enableMarketBuy;
    formData.value.enableMarketSell = row.enableMarketSell;
    formData.value.enableOpenBuy = row.enableOpenBuy;
    formData.value.enableOpenSell = row.enableOpenSell;
    formData.value.enableTriggerEntrust = row.enableTriggerEntrust;
    formData.value.exchangeable = row.exchangeable;
    formData.value.feePercent = row.feePercent;
    formData.value.intervalHour = row.intervalHour;
    formData.value.leverage = row.leverage;
    formData.value.leverageType = row.leverageType;
    formData.value.maintenanceMarginRate = row.maintenanceMarginRate;
    formData.value.makerFee = row.makerFee;
    formData.value.maxShare = row.maxShare;
    formData.value.minShare = row.minShare;
    formData.value.maxTotalShare = row.maxTotalShare;
    formData.value.name = row.name;
    formData.value.openFee = row.openFee;
    formData.value.shareNumber = row.shareNumber;
    formData.value.sort = row.sort;
    formData.value.spread = row.spread;
    formData.value.spreadType = row.spreadType;
    formData.value.takerFee = row.takerFee;
    formData.value.type = row.type == "PERPETUAL" ? 0 : 1;
    formData.value.icon = row.icon || "";
    formData.value.isHot = row.isHot ?? 2;
    formData.value.minScale = row.minScale ?? 0;
};

/**
 * 提交
 */
function submitFormData() {
    dataFormRef.value.validate((valid: any) => {
        if (valid) {
            loading.value = true;
            if (state.isAdd) {
                addContractCoin(state.formData)
                    .then((res: any) => {
                        if (!res.code) {
                            ElMessage.success(res.message);
                            cancel();
                            loading.value = false;
                            handleQuery();
                        } else {
                            ElMessage.error(res.message);
                            cancel();
                            loading.value = false;
                        }
                    })
                    .catch(() => {
                        loading.value = false;
                    });
            } else {
                alterContractCoin(state.formData)
                    .then((res: any) => {
                        if (!res.code) {
                            ElMessage.success(res.message);
                            cancel();
                            loading.value = false;
                            handleQuery();
                        } else {
                            ElMessage.error(res.message);
                            cancel();
                            loading.value = false;
                        }
                    })
                    .catch(() => {
                        loading.value = false;
                    });
            }
        }
    });
}

/**
 * 取消
 */
function cancel() {
    dialog.value.visible = false;
    formData.value.id = "0";
    dataFormRef.value.resetFields();
    dataFormRef.value.clearValidate();
    state.controlPanel.visible = false;
    state.controlPanelData.bias = "";
}

const optInitContractWallet = (row: any) => {
    loading2.value = true;
    initContractWallet({ contractId: row.id })
        .then((res: any) => {
            if (!res.code) {
                ElMessage.success(res.message);
                loading2.value = false;
            } else {
                ElMessage.error(res.message);
                loading2.value = false;
            }
        })
        .catch(() => {
            loading2.value = false;
        });
};

/**
 * 戳一下
 */
const elmbPoke = (row: any) => {
    ElMessageBox.prompt("请输入目标价", "", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        inputPattern: /^[+-]?(0|([1-9]\d*))(\.\d+)?$/,
        inputErrorMessage: "请输入数字",
        closeOnClickModal: false,
        showClose: false,
        inputType: "number",
        inputPlaceholder: "请输入目标价",
    })
        .then(({ value }) => {
            state.loading3 = true;
            poke({ contractId: row.id, price: value })
                .then((res: any) => {
                    if (!res.code) {
                        ElMessage.success(res.message);
                        loading3.value = false;
                    } else {
                        ElMessage.error(res.message);
                        loading3.value = false;
                    }
                })
                .catch(() => {
                    loading3.value = false;
                });
        })
        .catch(() => {
            console.log("poke cancel");
        });
};

// 控盘

const controlPanelFunction = (row: any) => {
    state.controlPanel.visible = true;
    state.controlPanelData.id = row.id;
    state.controlPanelData.symbol = row.symbol;
    getBias({ id: row.id }).then((res: any) => {
        if (res.data != null) {
            state.controlPanelData.bias = res.data.bias;
        } else {
            state.controlPanelData.bias = "";
        }
    });
};

// 提交控盘

const submitcontrolPanelData = () => {
    setBias(state.controlPanelData).then((res: any) => {
        if (res.code == 0) {
            ElMessage.success(res.message);
            state.controlPanel.visible = false;
            state.controlPanelData.bias = "";
        }
    });
};

const handleUpload: UploadProps["httpRequest"] = (options) => {
    uploadFile(options.file).then((res: any) => {
        if (res.code === 0 && res.data) {
            state.formData.icon = res.data;
            ElMessage.success("上传成功");
        } else {
            ElMessage.error(res.message || "上传失败");
        }
    }).catch(() => {
        ElMessage.error("上传失败");
    });
};

const beforeIconUpload: UploadProps["beforeUpload"] = (rawFile) => {
    if (!["image/jpeg", "image/png", "image/gif", "image/webp"].includes(rawFile.type)) {
        ElMessage.error("请上传图片格式文件");
        return false;
    }
    if (rawFile.size / 1024 / 1024 > 2) {
        ElMessage.error("图片大小不能超过 2MB");
        return false;
    }
    return true;
};

onMounted(() => {
    handleQuery();
});
</script>

<template>
    <div class="app-container">
        <el-form-item>
            <el-button type="primary" :icon="Plus" @click="showAddContractCoin"
                >添加交易对</el-button
            >
        </el-form-item>

        <!-- 数据表格 -->
        <el-table
            ref="dataTableRef"
            v-loading="loading"
            :data="list"
            highlight-current-row
            border
        >
            <el-table-column
                label="图标"
                prop="icon"
                width="70"
                align="center"
            >
                <template #default="scope">
                    <img
                        v-if="scope.row.icon"
                        :src="scope.row.icon"
                        style="width: 32px; height: 32px; object-fit: contain; border-radius: 4px;"
                    />
                    <span v-else>-</span>
                </template>
            </el-table-column>
            <el-table-column
                label="合约交易对"
                prop="symbol"
                min-width="110"
                align="center"
            />
            <!-- <el-table-column
                label="合约面值"
                prop="shareNumber"
                min-width="160"
                align="center"
            >
                <template #default="scope">
                    <span>{{ scope.row.shareNumber }} USDT/张</span>
                </template>
            </el-table-column> -->
            <el-table-column
                label="启用"
                prop="enable"
                min-width="100"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span v-if="scope.row.enable == 1" style="color: #42b983"
                        >是</span
                    >
                    <span v-else style="color: #ff0000">否</span>
                </template>
            </el-table-column>
            <el-table-column
                label="显示"
                prop="visible"
                min-width="100"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span v-if="scope.row.visible == 1" style="color: #42b983"
                        >是</span
                    >
                    <span v-else style="color: #ff0000">否</span>
                </template>
            </el-table-column>
            <el-table-column
                label="是否热门"
                prop="isHot"
                min-width="110"
                align="center"
            >
                <template #default="scope">
                    <span v-if="scope.row.isHot == 1" style="color: #42b983">是</span>
                    <span v-else style="color: #ff0000">否</span>
                </template>
            </el-table-column>
            <el-table-column
                label="开多"
                prop="enableOpenBuy"
                min-width="120"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <div
                        v-if="scope.row.enableOpenBuy == 1"
                        style="color: #42b983"
                    >
                        是
                    </div>
                    <div v-else style="color: #ff0000">否</div>
                    <div>{{ scope.row.buyPosition }}</div>
                </template>
            </el-table-column>
            <el-table-column
                label="开空"
                prop="enableOpenSell"
                min-width="120"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <div
                        v-if="scope.row.enableOpenSell == 1"
                        style="color: #42b983"
                    >
                        是
                    </div>
                    <div v-else style="color: #ff0000">否</div>
                    <div>{{ scope.row.sellPosition }}</div>
                </template>
            </el-table-column>
            <el-table-column
                label="市价开多"
                prop="enableMarketBuy"
                min-width="110"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span
                        v-if="scope.row.enableMarketBuy == 1"
                        style="color: #42b983"
                        >是</span
                    >
                    <span v-else style="color: #ff0000">否</span>
                </template>
            </el-table-column>
            <el-table-column
                label="市价开空"
                prop="enableMarketSell"
                min-width="110"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span
                        v-if="scope.row.enableMarketSell == 1"
                        style="color: #42b983"
                        >是</span
                    >
                    <span v-else style="color: #ff0000">否</span>
                </template>
            </el-table-column>
            <el-table-column
                label="允许交易"
                prop="exchangeable"
                min-width="110"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span
                        v-if="scope.row.exchangeable == 1"
                        style="color: #42b983"
                        >是</span
                    >
                    <span v-else style="color: #ff0000">否</span>
                </template>
            </el-table-column>
            <el-table-column
                label="倍数类型"
                prop="leverageType"
                min-width="110"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span v-if="scope.row.leverageType == 1">离散</span>
                    <span v-else>连续</span>
                </template>
            </el-table-column>
            <el-table-column
                label="杠杆倍数"
                prop="leverage"
                min-width="110"
                align="center"
            />
            <el-table-column
                label="滑点类型"
                prop="spreadType"
                min-width="110"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span v-if="scope.row.spreadType == 1">百分比</span>
                    <span v-else>固定值</span>
                </template>
            </el-table-column>
            <el-table-column
                label="滑点值"
                prop="spread"
                min-width="160"
                align="center"
            >
                <template #default="scope">
                    <span v-if="scope.row.spreadType == 1"
                        >{{ scope.row.spread * 100 }} %</span
                    >
                    <span v-else>{{ scope.row.spread }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="资金费率周期"
                prop="intervalHour"
                min-width="140"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span>{{ scope.row.intervalHour }} H</span>
                </template>
            </el-table-column>
            <el-table-column
                label="资金费率"
                prop="feePercent"
                min-width="140"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span>{{ scope.row.feePercent * 100 }} %</span>
                </template>
            </el-table-column>
            <el-table-column
                label="最低保证金率"
                prop="maintenanceMarginRate"
                min-width="140"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span>{{ scope.row.maintenanceMarginRate * 100 }} %</span>
                </template>
            </el-table-column>
            <el-table-column
                label="最小张数"
                prop="minShare"
                min-width="110"
                align="center"
                sortable="custom"
            />
            <!--<el-table-column label="最大张数" prop="maxShare" min-width="110" align="center" sortable="custom" />-->
            <el-table-column
                label="最大持仓（U）"
                prop="maxTotalShare"
                min-width="150"
                align="center"
                sortable="custom"
            />
            <el-table-column
                label="开仓手续费"
                prop="openFee"
                min-width="140"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span>{{ scope.row.openFee * 100 }} %</span>
                </template>
            </el-table-column>
            <el-table-column
                label="平仓手续费"
                prop="closeFee"
                min-width="140"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span>{{ scope.row.closeFee * 100 }} %</span>
                </template>
            </el-table-column>
            <el-table-column
                label="平台盈利"
                prop="totalLoss"
                min-width="110"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span style="color: #42b983">{{
                        scope.row.totalLoss.toFixed(2)
                    }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="平台亏损"
                prop="totalProfit"
                min-width="110"
                align="center"
                sortable="custom"
            >
                <template #default="scope">
                    <span style="color: #ff0000">{{
                        scope.row.totalProfit.toFixed(2)
                    }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="操作"
                align="center"
                width="350"
                fixed="right"
            >
                <template #default="scope">
                    <el-button
                        type="primary"
                        size="small"
                        :icon="Setting"
                        @click.stop="showAlterContractCoin(scope.row)"
                        >修改</el-button
                    >
                    <el-button
                        type="success"
                        size="small"
                        :loading="loading2"
                        @click.stop="optInitContractWallet(scope.row)"
                        >生成合约账户</el-button
                    >
                    <el-button
                        type="danger"
                        size="small"
                        :loading="loading3"
                        @click.stop="elmbPoke(scope.row)"
                        >戳一下</el-button
                    >
                    <el-button
                        type="info"
                        @click.stop="controlPanelFunction(scope.row)"
                        >控盘</el-button
                    >
                </template>
            </el-table-column>
        </el-table>

        <!-- 分页工具条 -->
        <pagination
            v-if="total > 0"
            :total="total"
            v-model:page="queryParams.pageNo"
            v-model:limit="queryParams.pageSize"
            @pagination="handleQuery"
        />

        <!-- 设置比例弹窗 -->
        <el-dialog
            :title="dialog.title"
            v-model="dialog.visible"
            width="640px"
            destroy-on-close
        >
            <el-form
                ref="dataFormRef"
                :model="formData"
                :rules="rules"
                label-width="136px"
            >
                <el-form-item label="交易对" prop="symbol">
                    <el-input
                        type="text"
                        v-model="formData.symbol"
                        :disabled="!isAdd"
                    />
                </el-form-item>
                <el-form-item label="启用" prop="enable">
                    <el-select v-model="formData.enable" placeholder="请选择">
                        <el-option label="启用" :value="1" />
                        <el-option label="禁用" :value="2" />
                    </el-select>
                </el-form-item>
                <el-form-item label="显示" prop="visible">
                    <el-select v-model="formData.visible" placeholder="请选择">
                        <el-option label="显示" :value="1" />
                        <el-option label="隐藏" :value="2" />
                    </el-select>
                </el-form-item>
                <el-form-item label="合约名称" prop="name">
                    <el-input
                        type="text"
                        v-model="formData.name"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="币种" prop="coinSymbol">
                    <el-input
                        type="text"
                        v-model="formData.coinSymbol"
                        :disabled="!isAdd"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="基础量价币种" prop="baseSymbol">
                    <el-input
                        type="text"
                        v-model="formData.baseSymbol"
                        :disabled="!isAdd"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="合约面值" prop="shareNumber">
                    <el-input
                        type="number"
                        v-model="formData.shareNumber"
                        :disabled="!isAdd"
                        placeholder="请输入"
                    />
                    <el-alert type="warning" show-icon :closable="false">
                        <p style="color: #ff0000; text-align: right">
                            新建币种后，不可更改，会影响合约盈亏计算
                        </p>
                    </el-alert>
                </el-form-item>
                <el-form-item label="杠杆倍数类型" prop="leverageType">
                    <el-radio-group v-model="formData.leverageType">
                        <el-radio :label="1" size="large">离散倍数</el-radio>
                        <el-radio :label="2" size="large">连续倍数</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="杠杆倍数" prop="leverage">
                    <el-input
                        type="text"
                        v-model="formData.leverage"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="维持保证金率" prop="maintenanceMarginRate">
                    <el-input
                        type="number"
                        v-model="formData.maintenanceMarginRate"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="允许开多" prop="enableOpenBuy">
                    <el-radio-group v-model="formData.enableOpenBuy">
                        <el-radio :label="1" size="large">启用</el-radio>
                        <el-radio :label="0" size="large">禁止</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="允许开空" prop="enableOpenSell">
                    <el-radio-group v-model="formData.enableOpenSell">
                        <el-radio :label="1" size="large">启用</el-radio>
                        <el-radio :label="0" size="large">禁止</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="市价开多" prop="enableMarketBuy">
                    <el-radio-group v-model="formData.enableMarketBuy">
                        <el-radio :label="1" size="large">启用</el-radio>
                        <el-radio :label="0" size="large">禁止</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="市价开空" prop="enableMarketSell">
                    <el-radio-group v-model="formData.enableMarketSell">
                        <el-radio :label="1" size="large">启用</el-radio>
                        <el-radio :label="0" size="large">禁止</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="计划委托" prop="enableTriggerEntrust">
                    <el-radio-group v-model="formData.enableTriggerEntrust">
                        <el-radio :label="1" size="large">启用</el-radio>
                        <el-radio :label="0" size="large">禁止</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="可交易" prop="exchangeable">
                    <el-radio-group v-model="formData.exchangeable">
                        <el-radio :label="1" size="large">启用</el-radio>
                        <el-radio :label="0" size="large">禁止</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="开仓手续费率" prop="openFee">
                    <el-input
                        type="number"
                        v-model="formData.openFee"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="平仓手续费率" prop="closeFee">
                    <el-input
                        type="number"
                        v-model="formData.closeFee"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item
                    label="资金费率结算周期（小时）"
                    prop="intervalHour"
                >
                    <el-input
                        type="number"
                        v-model="formData.intervalHour"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="资金费率" prop="feePercent">
                    <el-input
                        type="number"
                        v-model="formData.feePercent"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="最小张数" prop="minShare">
                    <el-input
                        type="number"
                        v-model="formData.minShare"
                        placeholder="请输入"
                    />
                </el-form-item>
                <!--<el-form-item label="最大张数" prop="maxShare">
          <el-input type="number" v-model="formData.maxShare" placeholder="请输入" />
        </el-form-item>-->
                <el-form-item label="最大持仓（U）" prop="maxTotalShare">
                    <el-input
                        type="number"
                        v-model="formData.maxTotalShare"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="滑点类型" prop="spreadType">
                    <el-radio-group v-model="formData.spreadType">
                        <el-radio :label="1" size="large">百分比</el-radio>
                        <el-radio :label="2" size="large">固定值</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="滑点" prop="spread">
                    <el-input
                        type="number"
                        v-model="formData.spread"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="价格精度" prop="coinScale">
                    <el-input
                        type="number"
                        v-model="formData.coinScale"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="结算价格精度" prop="baseCoinScale">
                    <el-input
                        type="number"
                        v-model="formData.baseCoinScale"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="基础价格精度" prop="minScale">
                    <el-input
                        type="number"
                        v-model="formData.minScale"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="Taker费率" prop="takerFee">
                    <el-input
                        type="number"
                        v-model="formData.takerFee"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="Maker费率" prop="makerFee">
                    <el-input
                        type="number"
                        v-model="formData.makerFee"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="合约类型" prop="type">
                    <el-radio-group v-model="formData.type">
                        <el-radio :label="0" size="large">USDT本位</el-radio>
                        <el-radio :label="1" size="large" disabled
                            >币本位</el-radio
                        >
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="排序" prop="sort">
                    <el-input
                        type="number"
                        v-model="formData.sort"
                        placeholder="请输入"
                    />
                </el-form-item>
                <el-form-item label="是否热门">
                    <el-select v-model="formData.isHot" placeholder="请选择">
                        <el-option label="是" :value="1" />
                        <el-option label="否" :value="2" />
                    </el-select>
                </el-form-item>
                <el-form-item label="币种图标">
                    <el-upload
                        class="avatar-uploader"
                        :show-file-list="false"
                        :http-request="handleUpload"
                        :before-upload="beforeIconUpload"
                    >
                        <img
                            v-if="formData.icon"
                            :src="formData.icon"
                            style="width: 48px; height: 48px; object-fit: contain; border-radius: 4px;"
                        />
                        <el-button v-else size="default" :icon="UploadFilled">上传图标</el-button>
                    </el-upload>
                </el-form-item>
            </el-form>
            <template #footer>
                <div class="dialog-footer">
                    <el-button
                        type="primary"
                        :loading="loading"
                        @click="submitFormData"
                        >确 定</el-button
                    >
                    <el-button @click="cancel">取 消</el-button>
                </div>
            </template>
        </el-dialog>
        <el-dialog
            :title="controlPanel.title"
            v-model="controlPanel.visible"
            width="640px"
            destroy-on-close
        >
            <el-form
                ref="dataFormRef"
                :model="controlPanelData"
                :rules="rules"
                label-width="136px"
            >
                <el-form-item label="id" prop="id">
                    <el-input
                        type="text"
                        v-model="controlPanelData.id"
                        disabled
                    />
                </el-form-item>
                <el-form-item label="交易对" prop="symbol">
                    <el-input
                        type="text"
                        v-model="controlPanelData.symbol"
                        disabled
                    />
                </el-form-item>
                <el-form-item label="偏移值" prop="bias">
                    <el-input
                        type="text"
                        v-model="controlPanelData.bias"
                        placeholder="请输入偏移值"
                    />
                </el-form-item>
            </el-form>
            <template #footer>
                <div class="dialog-footer">
                    <el-button
                        type="primary"
                        :loading="loading"
                        @click="submitcontrolPanelData"
                        >确 定</el-button
                    >
                    <el-button @click="cancel">取 消</el-button>
                </div>
            </template>
        </el-dialog>
    </div>
</template>

<style lang="scss" scoped>
.el-alert {
    padding-top: 0;
    padding-bottom: 0;
}
</style>
