style

lxf

2025-06-05 8f9e4fbc244af9e91f69f8b2851f4068abe7e600

style

 src/components/commonTrade/kline.vue

@@ -126,10 +126,10 @@
        locale: langStore.language, //https://klinecharts.com/guide/i18n.html
        styles: {
          grid: {
            show: false,
            show: true,
            // 网格水平线
            horizontal: {
              show: false,
              show: true,
              size: 1,
              color: "#393939",
              style: "solid",
@@ -137,9 +137,9 @@
            },
            // 网格垂直线
            vertical: {
              show: false,
              show: true,
              size: 1,
              color: "#000",
              color: "#393939",
              style: "solid",
              dashValue: [2, 2],
            },

 src/components/constract/PerpetualContract/createOrder.vue

@@ -25,10 +25,23 @@
                : 'not-allowed',
          }"
        >
          <div @click="openLeverDialog">
          <!-- <div @click="openLeverDialog">
            <span> {{ current_lever_rate }}</span
            ><i class="icon iconfont icon-Mul_triangle lever-icon"></i>
          </div>
          </div> -->
          <!-- 替换弹窗为下拉选择 -->
          <el-select
            v-model="current_lever_rate_num"
            @change="changeLeverSelect"
          >
            <el-option
              v-for="item in [25, 50, 100, 200]"
              :key="item"
              :value="item"
            >
              {{ item }}X
            </el-option>
          </el-select>
        </div>
      </div>
      <!-- 限价+市价 -->
@@ -377,6 +390,11 @@
    },
  },
  methods: {
    changeLeverSelect(e) {
      const newLever = Number(this.current_lever_rate_num);
      this.current_lever_rate = `${newLever}.00X`;
      this.current_lever_rate_num = newLever;
    },
    //获取张数
    getAmount(val) {
      this.inputAmount = val;
@@ -638,4 +656,16 @@
  background: #484d56;
  margin-top: 20px;
}

::v-deep .el-select__wrapper {
  background: #303133;
  box-shadow: 0 0 0 1px #303133 inset;
}
::v-deep .el-select__placeholder {
  color: #fff !important;
}

::v-deep .el-select-dropdown__item.is-selected {
  color: #f7b328 !important;
}
</style>

 src/components/constract/PerpetualContract/orderCom/amountSlider.vue

@@ -23,6 +23,7 @@
        v-model="sliderAmount"
        :format-tooltip="(v) => `${v}%`"
        :marks="marks"
        :step="25"
      >
      </el-slider>
    </div>
@@ -90,15 +91,32 @@
        0: "0",
        25: "25%",
        50: "50%",
        75: "70%",
        75: "75%",
        100: "100%",
      },
      allowedSteps: [0, 25, 50, 75, 100],
    };
  },
  computed: {
    ...mapState(useUserStore, ["existToken"]),
  },
  methods: {
    onSliderInput(val) {
      // 只允许滑到指定点
      const allowed = this.allowedSteps;
      let closest = allowed[0];
      let minDiff = Math.abs(val - allowed[0]);
      for (let i = 1; i < allowed.length; i++) {
        const diff = Math.abs(val - allowed[i]);
        if (diff < minDiff) {
          minDiff = diff;
          closest = allowed[i];
        }
      }
      if (this.sliderAmount !== closest) {
        this.sliderAmount = closest;
      }
    },
    //输入框事件
    inputChange(val) {
      this.$emit("getAmount", val);
@@ -127,7 +145,7 @@
      }
    },
    emptyValue() {
      this.sliderAmount = undefined;
      this.sliderAmount = 0;
    },
  },
};