{"ast":null,"code":"import \"vant/es/tab/style\";\nimport _Tab from \"vant/es/tab\";\nimport \"vant/es/tabs/style\";\nimport _Tabs from \"vant/es/tabs\";\nimport \"vant/es/popup/style\";\nimport _Popup from \"vant/es/popup\";\nimport \"core-js/modules/es.array.push.js\";\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\nimport config from \"@/config\";\nimport VueSlider from \"vue-slider-component\";\nimport \"vue-slider-component/theme/default.css\";\nimport { _getBalance } from \"@/API/trade.api\";\nimport TradeApi from \"@/API/trading.js\";\nimport { mapGetters } from \"vuex\";\n// import PopupConfirmOrder from '@/components/popup-confirm-order'\nexport default {\n name: \"perpetualPosition\",\n components: {\n VueSlider,\n [_Popup.name]: _Popup,\n [_Tabs.name]: _Tabs,\n [_Tab.name]: _Tab\n },\n props: {\n symbol: {\n type: String,\n default: \"\"\n },\n price: {\n type: [Number, String],\n default: \"0.00\"\n },\n initOpen: {\n type: Object,\n default() {\n return {};\n }\n },\n initClose: {\n type: Object,\n default() {\n return {};\n }\n }\n },\n computed: {\n ...mapGetters(\"user\", [\"userInfo\"])\n },\n activated() {\n this.selectData = [{\n title: this.$t(\"市价委托\"),\n type: \"1\"\n }, {\n title: this.$t(\"限价委托\"),\n type: \"2\"\n }];\n this.title = this.selectData[0].title;\n this.type = this.selectData[0].type;\n },\n watch: {\n initOpen: {\n // 处理滚动条初始值\n deep: true,\n handler(val) {\n console.log(val);\n if (val.volume / 1 > 0) {\n this.handleInitSliderOption();\n }\n }\n },\n initClose: {\n // 处理滚动条初始值\n deep: true,\n handler(newVal, oldVal) {\n if (newVal.volume / 1 > 0) {\n this.handleInitSliderOption(true);\n }\n }\n },\n price(val) {\n if (this.type === \"1\") {\n // !this.focus &&\n this.form.price = val;\n }\n }\n },\n filters: {\n nan(val) {\n return isNaN(val) ? \"--\" : val;\n }\n },\n data() {\n return {\n options: config.sliderOptions,\n value: 0,\n isShow: false,\n title: this.$t(\"市价委托\"),\n selectData: [],\n form: {\n volume: \"\",\n session_token: \"\",\n symbol: \"\",\n // 币种\n price: \"\",\n total: \"\",\n order_price_type: \"opponent\" // 市价or限价\n },\n type: \"1\",\n //选中市价或限价类型\n currentType: \"open\",\n //开仓类型\n interval: 0.001,\n marks: val => val % 25 === 0,\n isTotal: false,\n percentageVal: 0\n };\n },\n mounted() {},\n methods: {\n checkIsTotal(val) {\n this.isTotal = val;\n this.percentageVal = 0;\n this.form.total = \"\";\n this.form.volume = \"\";\n },\n exchangeVal(val) {\n this.percentageVal = val;\n if (!this.isTotal) {\n if (this.currentType == \"open\") {\n let sum = parseFloat(this.initOpen.volume) * (val / 100) / parseFloat(this.form.price);\n this.form.volume = Math.floor(sum * 100000) / 100000;\n } else {\n let sum = parseFloat(this.initClose.volume);\n this.form.volume = Math.floor(sum * (val / 100) * 100000) / 100000;\n }\n } else {\n if (this.currentType == \"open\") {\n this.form.total = this.initOpen.volume * (val / 100);\n } else {\n this.form.total = Math.floor(this.initClose.volume * (val / 100) * parseFloat(this.form.price) * 1000) / 1000;\n }\n }\n },\n handleInitSliderOption(volume) {\n if (!volume) {\n // 金额是否需要变动\n this.form.volume = \"\";\n }\n console.log(this.initOpen.volume);\n let vol;\n if (this.currentType === \"open\") {\n vol = this.initOpen.volume / 1;\n } else {\n vol = this.initClose.volume / 1;\n }\n this.options.max = Number(vol.toFixed(3));\n if (this.options.max > 0) {\n this.options.disabled = false;\n } else {\n this.options.disabled = true;\n }\n },\n onInput() {\n // 数量变化\n if (this.currentType === \"open\") {\n let maxSum = parseFloat(this.initOpen.volume) / parseFloat(this.form.price);\n console.log(this.initOpen.volume);\n console.log(this.form.price);\n console.log(maxSum);\n if (this.form.volume * 1 > maxSum / 1) {\n this.form.volume = maxSum;\n }\n } else {\n if (this.form.volume * 1 / 1 > this.options.max / 1) {\n this.form.volume = this.options.max / 1;\n }\n }\n },\n onInputTotal() {\n //总额变化\n //最大额度\n if (this.form.total > 0) {\n if (this.currentType === \"open\") {\n console.log(this.initOpen.volume);\n if (this.form.total * 1 > this.initOpen.volume * 1) {\n this.form.total = this.initOpen.volume;\n }\n } else {\n let sum = (parseFloat(this.form.total) / parseFloat(this.form.price)).toFixed(5);\n if (parseFloat(sum) > parseFloat(this.initClose.volume)) {\n this.form.total = (parseFloat(this.initClose.volume) * parseFloat(this.form.price)).toFixed(5);\n }\n }\n }\n },\n //价格类型下拉框切换\n selectBtn() {\n this.isShow = !this.isShow;\n },\n //选择价格类型\n selectItem(item) {\n if (item.type == 1) {\n this.form.price = this.price;\n }\n this.form.order_price_type = item.type === \"1\" ? \"opponent\" : \"limit\";\n this.title = item.title;\n this.type = item.type;\n this.isShow = false;\n },\n //选择开仓类型\n changeTab(type) {\n // 开仓和\n this.percentageVal = 0;\n this.isTotal = false;\n this.form.total = \"\";\n console.log(\"changeTab\", type);\n // TODO: 这里应该是换函数\n // this.form.direction = type === 'open' ? 'buy' : 'sell'\n if (this.currentType === type) {\n return;\n }\n this.currentType = type;\n if (this.currentType === \"close\") {\n this.$emit(\"ordered\", \"close\"); // 更新平仓初始化参数\n } else {\n this.$emit(\"ordered\", \"open\"); // 更新平仓初始化参数\n }\n this.handleInitSliderOption();\n },\n order() {\n if (!this.userInfo.token) {\n this.$router.push(\"/login\");\n return;\n }\n let volume = \"\";\n if (this.isTotal) {\n if (!this.form.total) {\n this.$toast.fail(this.$t(\"请输入总额\"));\n return;\n }\n if (this.currentType === \"open\") {\n this.form.volume = parseFloat(this.form.total).toFixed(5);\n } else {\n this.form.volume = parseFloat(this.form.total) / parseFloat(this.form.price);\n this.form.volume = this.form.volume.toFixed(5);\n }\n volume = this.form.volume;\n } else {\n if (!this.form.volume) {\n this.$toast.fail(this.$t(\"请输入数量\"));\n return;\n }\n if (this.currentType === \"open\") {\n volume = parseFloat(this.form.volume) * parseFloat(this.form.price);\n } else {\n volume = this.form.volume;\n }\n }\n this.form.symbol = this.$route.params.symbol;\n let _order = null; // api\n let emitFunc = null; // 触发函数\n\n if (this.currentType === \"open\") {\n this.form.session_token = this.initOpen.session_token;\n } else {\n this.form.session_token = this.initClose.session_token;\n }\n _order = this.currentType === \"open\" ? TradeApi.tradeBuy : TradeApi.tradeSell;\n emitFunc = this.currentType;\n _order({\n volume: volume,\n session_token: this.form.session_token,\n symbol: this.form.symbol,\n // 币种\n price: this.form.price,\n total: this.form.total,\n order_price_type: this.form.order_price_type // 市价or限价\n }).then(res => {\n this.$toast(this.$t(\"操作成功\"));\n this.form.volume = \"\";\n this.form.total = \"\";\n _getBalance().then(data => {\n // 刷新余额\n this.$store.commit(\"user/SET_USERINFO\", {\n balance: data.money\n });\n });\n this.$emit(\"ordered\", emitFunc);\n }).catch(() => {\n // 也需要重新初始化\n this.$emit(\"ordered\", emitFunc);\n });\n }\n }\n};","map":{"version":3,"names":["config","VueSlider","_getBalance","TradeApi","mapGetters","name","components","_Popup","_Tabs","_Tab","props","symbol","type","String","default","price","Number","initOpen","Object","initClose","computed","activated","selectData","title","$t","watch","deep","handler","val","console","log","volume","handleInitSliderOption","newVal","oldVal","form","filters","nan","isNaN","data","options","sliderOptions","value","isShow","session_token","total","order_price_type","currentType","interval","marks","isTotal","percentageVal","mounted","methods","checkIsTotal","exchangeVal","sum","parseFloat","Math","floor","vol","max","toFixed","disabled","onInput","maxSum","onInputTotal","selectBtn","selectItem","item","changeTab","$emit","order","userInfo","token","$router","push","$toast","fail","$route","params","_order","emitFunc","tradeBuy","tradeSell","then","res","$store","commit","balance","money","catch"],"sources":["src/components/trade-order-area/index.vue"],"sourcesContent":["<template>\n <div class=\"flex flex-col flex-1\">\n <div class=\"flex items-center h-66 text-grey\">\n <p\n class=\"font-28 flex-1 flex items-center justify-center mr-20 h-66 buy-item\"\n :class=\"'open'\"\n @click=\"changeTab('open')\"\n >\n {{ $t(\"买入\") }}\n </p>\n <p\n class=\"font-28 flex-1 flex items-center justify-center h-66 buy-item\"\n :class=\"'close'\"\n @click=\"changeTab('close')\"\n >\n {{ $t(\"卖出\") }}\n </p>\n </div>\n\n <div class=\"mt-22 mb-22 box-show\" style=\"position: relative\">\n <div\n class=\"flex justify-between items-center w-full h-70\"\n @click=\"selectBtn\"\n >\n <!-- <img src=\"@/assets/image/public/warn.png\" alt=\"warn-icon\" class=\"w-25 h-25 pl-20\"/> -->\n <div class=\"pl-16 textColor\" style=\"width: 80%\">{{ title }}</div>\n <img\n src=\"@/assets/image/public/grey-select.png\"\n alt=\"select-icon\"\n class=\"w-22 h-11 pr-20\"\n />\n </div>\n <div class=\"option-box\" v-if=\"isShow\">\n <div\n class=\"font-30\"\n v-for=\"item in selectData\"\n :key=\"item.type\"\n @click=\"selectItem(item)\"\n >\n {{ item.title }}\n </div>\n </div>\n </div>\n <div\n class=\"h-70 lh-70 box-show mb-25 flex justify-center px-16 textColor2\"\n >\n <input\n placeholder=\"\"\n class=\"targetPrice w-full h-70 border-none\"\n v-model=\"form.price\"\n :disabled=\"type / 1 === 1\"\n />\n <span>USDT</span>\n </div>\n <div\n class=\"h-70 lh-70 box-show mb-25 flex justify-center px-16 textColor2\"\n >\n <span>{{ title }}</span>\n </div>\n <div class=\"flex total-list\">\n <div\n class=\"total-div\"\n :class=\"[!isTotal ? 'active-bg' : '']\"\n @click=\"checkIsTotal(false)\"\n >\n {{ $t(\"数量\") }}\n </div>\n <div\n class=\"total-div\"\n :class=\"[isTotal ? 'active-bg' : '']\"\n @click=\"checkIsTotal(true)\"\n >\n {{ $t(\"总额\") }}\n </div>\n </div>\n <div\n v-if=\"!isTotal\"\n class=\"h-70 lh-70 inputBackground mb-36 flex justify-center px-16\"\n >\n <input\n :placeholder=\"$t('数量')\"\n class=\"w-full h-70 border-none textColor\"\n v-model=\"form.volume\"\n @input=\"onInput\"\n />\n <span class=\"textColor\">{{ symbol.toLocaleUpperCase() }}</span>\n </div>\n <div\n v-if=\"isTotal\"\n class=\"h-70 lh-70 inputBackground mb-36 flex justify-center px-16\"\n >\n <input\n :placeholder=\"$t('总额')\"\n class=\"w-full h-70 border-none textColor\"\n v-model=\"form.total\"\n @input=\"onInputTotal\"\n />\n <span class=\"textColor\">{{ \"USDT\" }}</span>\n </div>\n <!-- <vue-slider v-bind=\"options\" v-model=\"form.volume\" :interval=\"interval\"></vue-slider> -->\n <!-- <vue-slider class=\"mainBox\" v-bind=\"options\" :interval=\"interval\" v-model=\"form.volume\" :hide-label=\"true\" :railStyle=\"{ background: '#404040', height: '10px' }\"\n :processStyle=\"{ background: '#266BFF', height: '10px' }\">\n <template v-slot:step=\"{ active }\">\n <div :class=\"['custom-step', { active }]\"></div>\n </template>\n </vue-slider> -->\n <div\n style=\"color: #868d9a\"\n class=\"font-24 w-full flex justify-between items-center\"\n >\n <!-- <span class=\"flex-1 text-left\">0%</span> -->\n <span\n class=\"flex-1 tab-item\"\n :class=\"[percentageVal == 25 ? 'select-active' : '']\"\n @click=\"exchangeVal(25)\"\n >25%</span\n >\n <span\n class=\"flex-1 tab-item\"\n :class=\"[percentageVal == 50 ? 'select-active' : '']\"\n @click=\"exchangeVal(50)\"\n >50%</span\n >\n <span\n class=\"flex-1 tab-item\"\n :class=\"[percentageVal == 75 ? 'select-active' : '']\"\n @click=\"exchangeVal(75)\"\n >75%</span\n >\n <span\n class=\"flex-1 tab-item\"\n :class=\"[percentageVal == 100 ? 'select-active' : '']\"\n @click=\"exchangeVal(100)\"\n >100%</span\n >\n </div>\n <div class=\"flex justify-between items-center mt-40\">\n <div class=\"flex flex-col font-24\">\n <p class=\"text-grey\" v-if=\"this.currentType === 'open'\">\n {{ $t(\"可用\")\n }}<span class=\"textColor ml-8\">\n {{ initOpen.volume | nan }} USDT</span\n >\n </p>\n <p class=\"text-grey\" v-else>\n {{ $t(\"可卖\")\n }}<span class=\"textColor ml-8\"\n >{{ initClose.volume | nan }} {{\n symbol.toLocaleUpperCase()\n }}</span\n >\n </p>\n </div>\n <van-icon\n name=\"add-o\"\n @click=\"$router.push('/exchange/exchangePage')\"\n class=\"font-30 add-icon\"\n />\n <!-- <img @click=\"$router.push('/exchange/exchangePage')\" src=\"@/assets/image/public/switch.png\" class=\"w-24 h-24\" /> -->\n </div>\n <div\n style=\"\"\n class=\"w-full h-90 lh-90 flex justify-center text-white text-center rounded buyandSell mt-70\"\n :class=\"currentType === 'open' ? 'bg-green' : 'bg-red'\"\n @click=\"order()\"\n >\n {{ currentType == \"open\" ? $t(\"买入\") : $t(\"卖出\") }}\n </div>\n </div>\n</template>\n\n<script>\nimport config from \"@/config\";\nimport { Popup, Tabs, Tab } from \"vant\";\nimport VueSlider from \"vue-slider-component\";\nimport \"vue-slider-component/theme/default.css\";\nimport { _getBalance } from \"@/API/trade.api\";\nimport TradeApi from \"@/API/trading.js\";\nimport { mapGetters } from \"vuex\";\n// import PopupConfirmOrder from '@/components/popup-confirm-order'\nexport default {\n name: \"perpetualPosition\",\n components: {\n VueSlider,\n [Popup.name]: Popup,\n [Tabs.name]: Tabs,\n [Tab.name]: Tab,\n },\n props: {\n symbol: {\n type: String,\n default: \"\",\n },\n price: {\n type: [Number, String],\n default: \"0.00\",\n },\n initOpen: {\n type: Object,\n default() {\n return {};\n },\n },\n initClose: {\n type: Object,\n default() {\n return {};\n },\n },\n },\n computed: {\n ...mapGetters(\"user\", [\"userInfo\"]),\n },\n activated() {\n this.selectData = [\n { title: this.$t(\"市价委托\"), type: \"1\" },\n { title: this.$t(\"限价委托\"), type: \"2\" },\n ];\n this.title = this.selectData[0].title;\n this.type = this.selectData[0].type;\n },\n watch: {\n initOpen: {\n // 处理滚动条初始值\n deep: true,\n handler(val) {\n console.log(val);\n if (val.volume / 1 > 0) {\n this.handleInitSliderOption();\n }\n },\n },\n initClose: {\n // 处理滚动条初始值\n deep: true,\n handler(newVal, oldVal) {\n if (newVal.volume / 1 > 0) {\n this.handleInitSliderOption(true);\n }\n },\n },\n price(val) {\n if (this.type === \"1\") {\n // !this.focus &&\n this.form.price = val;\n }\n },\n },\n filters: {\n nan(val) {\n return isNaN(val) ? \"--\" : val;\n },\n },\n data() {\n return {\n options: config.sliderOptions,\n value: 0,\n isShow: false,\n title: this.$t(\"市价委托\"),\n selectData: [],\n form: {\n volume: \"\",\n session_token: \"\",\n symbol: \"\", // 币种\n price: \"\",\n total: \"\",\n order_price_type: \"opponent\", // 市价or限价\n },\n type: \"1\", //选中市价或限价类型\n currentType: \"open\", //开仓类型\n interval: 0.001,\n marks: (val) => val % 25 === 0,\n isTotal: false,\n percentageVal: 0,\n };\n },\n mounted() {},\n methods: {\n checkIsTotal(val) {\n this.isTotal = val;\n this.percentageVal = 0;\n this.form.total = \"\";\n this.form.volume = \"\";\n },\n exchangeVal(val) {\n this.percentageVal = val;\n if (!this.isTotal) {\n if (this.currentType == \"open\") {\n let sum =\n (parseFloat(this.initOpen.volume) * (val / 100)) /\n parseFloat(this.form.price);\n this.form.volume = Math.floor(sum * 100000) / 100000;\n } else {\n let sum = parseFloat(this.initClose.volume);\n this.form.volume = Math.floor(sum * (val / 100) * 100000) / 100000;\n }\n } else {\n if (this.currentType == \"open\") {\n this.form.total = this.initOpen.volume * (val / 100);\n } else {\n this.form.total =\n Math.floor(\n this.initClose.volume *\n (val / 100) *\n parseFloat(this.form.price) *\n 1000\n ) / 1000;\n }\n }\n },\n handleInitSliderOption(volume) {\n if (!volume) {\n // 金额是否需要变动\n this.form.volume = \"\";\n }\n console.log(this.initOpen.volume);\n let vol;\n if (this.currentType === \"open\") {\n vol = this.initOpen.volume / 1;\n } else {\n vol = this.initClose.volume / 1;\n }\n this.options.max = Number(vol.toFixed(3));\n if (this.options.max > 0) {\n this.options.disabled = false;\n } else {\n this.options.disabled = true;\n }\n },\n onInput() {\n // 数量变化\n if (this.currentType === \"open\") {\n let maxSum =\n parseFloat(this.initOpen.volume) / parseFloat(this.form.price);\n console.log(this.initOpen.volume);\n console.log(this.form.price);\n console.log(maxSum);\n if (this.form.volume * 1 > maxSum / 1) {\n this.form.volume = maxSum;\n }\n } else {\n if ((this.form.volume * 1) / 1 > this.options.max / 1) {\n this.form.volume = this.options.max / 1;\n }\n }\n },\n onInputTotal() {\n //总额变化\n //最大额度\n if (this.form.total > 0) {\n if (this.currentType === \"open\") {\n console.log(this.initOpen.volume);\n if (this.form.total * 1 > this.initOpen.volume * 1) {\n this.form.total = this.initOpen.volume;\n }\n } else {\n let sum = (\n parseFloat(this.form.total) / parseFloat(this.form.price)\n ).toFixed(5);\n if (parseFloat(sum) > parseFloat(this.initClose.volume)) {\n this.form.total = (\n parseFloat(this.initClose.volume) * parseFloat(this.form.price)\n ).toFixed(5);\n }\n }\n }\n },\n //价格类型下拉框切换\n selectBtn() {\n this.isShow = !this.isShow;\n },\n //选择价格类型\n selectItem(item) {\n if (item.type == 1) {\n this.form.price = this.price;\n }\n this.form.order_price_type = item.type === \"1\" ? \"opponent\" : \"limit\";\n this.title = item.title;\n this.type = item.type;\n this.isShow = false;\n },\n //选择开仓类型\n changeTab(type) {\n // 开仓和\n this.percentageVal = 0;\n this.isTotal = false;\n this.form.total = \"\";\n console.log(\"changeTab\", type);\n // TODO: 这里应该是换函数\n // this.form.direction = type === 'open' ? 'buy' : 'sell'\n if (this.currentType === type) {\n return;\n }\n this.currentType = type;\n if (this.currentType === \"close\") {\n this.$emit(\"ordered\", \"close\"); // 更新平仓初始化参数\n } else {\n this.$emit(\"ordered\", \"open\"); // 更新平仓初始化参数\n }\n this.handleInitSliderOption();\n },\n order() {\n if (!this.userInfo.token) {\n this.$router.push(\"/login\");\n return;\n }\n let volume = \"\";\n if (this.isTotal) {\n if (!this.form.total) {\n this.$toast.fail(this.$t(\"请输入总额\"));\n return;\n }\n if (this.currentType === \"open\") {\n this.form.volume = parseFloat(this.form.total).toFixed(5);\n } else {\n this.form.volume =\n parseFloat(this.form.total) / parseFloat(this.form.price);\n this.form.volume = this.form.volume.toFixed(5);\n }\n volume = this.form.volume;\n } else {\n if (!this.form.volume) {\n this.$toast.fail(this.$t(\"请输入数量\"));\n return;\n }\n if (this.currentType === \"open\") {\n volume = parseFloat(this.form.volume) * parseFloat(this.form.price);\n } else {\n volume = this.form.volume;\n }\n }\n this.form.symbol = this.$route.params.symbol;\n let _order = null; // api\n let emitFunc = null; // 触发函数\n\n if (this.currentType === \"open\") {\n this.form.session_token = this.initOpen.session_token;\n } else {\n this.form.session_token = this.initClose.session_token;\n }\n _order =\n this.currentType === \"open\" ? TradeApi.tradeBuy : TradeApi.tradeSell;\n emitFunc = this.currentType;\n _order({\n volume: volume,\n session_token: this.form.session_token,\n symbol: this.form.symbol, // 币种\n price: this.form.price,\n total: this.form.total,\n order_price_type: this.form.order_price_type, // 市价or限价\n })\n .then((res) => {\n this.$toast(this.$t(\"操作成功\"));\n this.form.volume = \"\";\n this.form.total = \"\";\n _getBalance().then((data) => {\n // 刷新余额\n this.$store.commit(\"user/SET_USERINFO\", { balance: data.money });\n });\n this.$emit(\"ordered\", emitFunc);\n })\n .catch(() => {\n // 也需要重新初始化\n this.$emit(\"ordered\", emitFunc);\n });\n },\n },\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.buy-item {\n // width: 48%;\n // background-color: #00b69b;\n}\n\n.bg-f3 {\n background: #f3f3f3;\n}\n\n.options {\n box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.3);\n border-radius: 6px;\n\n div {\n font-size: 22px;\n text-align: center;\n width: 140px;\n height: 60px;\n line-height: 60px;\n\n &.option-active {\n background-color: #f5f5f5;\n }\n }\n}\n\n.right-word {\n top: 50%;\n transform: translateY(-50%);\n right: 19px;\n position: absolute;\n border-radius: 6px;\n}\n\n.vue-slider {\n height: 3px !important;\n padding: 0 10px !important;\n}\n\n.vue-slider-dot {\n width: 28px !important;\n height: 28px !important;\n}\n\n.vue-slider-mark-label {\n font-size: 16px;\n margin-top: 14px !important;\n}\n\n.vue-slider-mark-label-active {\n color: #868d9a !important;\n}\n\n.vue-slider-dot-handle {\n border: 3px solid #2c78f8;\n}\n\n.vue-slider-mark {\n width: 20px !important;\n height: 20px !important;\n\n &:nth-child(1) {\n .vue-slider-mark-label {\n transform: translateX(-14px) !important;\n }\n }\n\n &:nth-child(5) {\n .vue-slider-mark-label {\n transform: translateX(-60px) !important;\n }\n }\n}\n\n// 开仓样式\n.tabcon {\n // padding-bottom: 16%;\n position: relative;\n height: 80px;\n}\n\n.tab {\n position: absolute;\n left: 0px;\n right: 0px;\n top: 0px;\n bottom: 0px;\n display: flex;\n align-items: center;\n background-color: #f3f3f3;\n border-radius: 5px;\n overflow: hidden;\n}\n\n.tab > * {\n height: 100%;\n}\n\n.tab > img {\n margin-left: -2px;\n margin-right: -2px;\n}\n\n.tab > a {\n flex-grow: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n}\n\n.open {\n // background-color: #2EBD85;\n // background: url(@/assets/image/public/open-bg.png) no-repeat right center;\n // background-size: 100% 100%;\n background-color: #00b69b;\n color: white;\n}\n\n.close {\n // background-color: #F6465D;\n // background: url(@/assets/image/public/close-bg.png) no-repeat left center;\n // background-size: 100% 100%;\n background-color: #ff1414;\n\n color: white;\n}\n\n// 下拉\n.option-box {\n position: absolute;\n left: 0;\n right: 0;\n top: 90px;\n width: 100%;\n z-index: 3;\n\n @include themify() {\n background: themed(\"grey_bg\");\n }\n\n text-align: center;\n\n @include themify() {\n box-shadow: 0px 0px 3px 3px themed(\"grey_bg\");\n }\n\n border-radius: 4px;\n\n @include themify() {\n color: themed(\"text_color3\");\n }\n}\n\n.option-box > div {\n padding: 30px 0;\n}\n\n.option-box > div:hover {\n // background-color: #F5F5F5;\n}\n\n.num-text-color {\n color: #4c4a54;\n}\n\nselect {\n appearance: none;\n /* 去掉默认图标 */\n -moz-appearance: none;\n /* Firefox */\n -webkit-appearance: none;\n /* Safari and Chrome */\n padding: 0 20px 0 20px;\n background: url(\"../../assets/image/public/grey-select.png\") no-repeat scroll\n right center transparent;\n /* 自己的图*/\n background-size: 20px 11px;\n}\n\n.with100 {\n width: 100%;\n}\n\n.height100 {\n height: 100%;\n}\n\n.targetPrice {\n opacity: 1;\n}\n\n.inputBackground {\n input {\n background: transparent !important;\n }\n}\n\n.custom-step {\n width: 20px;\n height: 20px;\n border-radius: 50%;\n background: fff;\n border: solid 1px #2256f7;\n background: #fff;\n}\n\n.custom-step.active {\n box-shadow: 0 0 0 2px #2256f7;\n background-color: #2256f7;\n}\n\n.tab-item {\n display: flex;\n align-items: center;\n justify-content: center;\n\n @include themify() {\n background: themed(\"input_background\");\n }\n\n border-radius: 4px;\n margin-right: 10px;\n padding: 10px 0;\n}\n\n.total-list {\n @include themify() {\n background: themed(\"grey_bg\");\n }\n\n display: flex;\n\n @include themify() {\n color: themed(\"text_color\");\n }\n\n font-size: 26px;\n align-items: center;\n justify-content: center;\n margin-bottom: 20px;\n position: relative;\n\n // ::after {\n // position: absolute;\n // content: '';\n // top: 20%;\n // left: 50%;\n // height: 40px;\n // background: #373737;\n // width: 1px;\n\n // }\n\n .total-div {\n flex: 1;\n text-align: center;\n padding: 20px 0;\n }\n}\n\n.add-icon {\n color: #1194f7;\n}\n\n.active-bg {\n @include themify() {\n background: themed(\"bg_dark\");\n }\n}\n\n.select-active {\n background: #2ebd85;\n\n @include themify() {\n color: themed(\"text_color\") !important;\n }\n}\n\n.buyandSell {\n position: relative;\n z-index: 9;\n}\n</style>\n"],"mappings":"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","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]}
|
