{"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\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 tabBackground text-grey\">\n <p class=\"font-28 flex-1 flex items-center justify-center h-66 buy-item\"\n :class=\"currentType == 'open' ? 'open' : ''\" @click=\"changeTab('open')\">{{ $t('买入') }}</p>\n <p class=\"font-28 flex-1 flex items-center justify-center h-66 buy-item\"\n :class=\"currentType == 'close' ? 'close' : ''\" @click=\"changeTab('close')\">{{ $t('卖出') }}</p>\n </div>\n\n <div class=\"mt-22 mb-22 inputBackground\" style=\"position:relative;\">\n <div class=\" flex justify-between items-center w-full h-70\" @click=\"selectBtn\">\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 src=\"@/assets/image/public/grey-select.png\" alt=\"select-icon\" class=\"w-22 h-11 pr-20\" />\n </div>\n <div class=\"option-box\" v-if=\"isShow\">\n <div class=\"font-30\" v-for=\"item in selectData\" :key=\"item.type\" @click=\"selectItem(item)\">{{ item.title }}\n </div>\n </div>\n </div>\n <div class=\"h-70 lh-70 inputBackground mb-25 flex justify-center px-16 textColor2\">\n <input placeholder=\"\" class=\"targetPrice w-full h-70 border-none\" v-model=\"form.price\"\n :disabled=\"type / 1 === 1\" />\n <span>USDT</span>\n </div>\n <div class=\"h-70 lh-70 inputBackground mb-25 flex justify-center px-16 textColor2\">\n <span>{{ title }}</span>\n </div>\n <div class=\"flex total-list\">\n <div class=\"total-div\" :class=\"[!isTotal ? 'active-bg' : '']\" @click=\"checkIsTotal(false)\">\n {{ $t('数量') }}\n </div>\n <div class=\"total-div\" :class=\"[isTotal ? 'active-bg' : '']\" @click=\"checkIsTotal(true)\">\n {{ $t('总额') }}\n </div>\n </div>\n <div v-if=\"!isTotal\" class=\"h-70 lh-70 inputBackground mb-36 flex justify-center px-16\">\n <input :placeholder=\"$t('数量')\" class=\" w-full h-70 border-none textColor\" v-model=\"form.volume\" @input=\"onInput\" />\n <span class=\"textColor\">{{ symbol.toLocaleUpperCase() }}</span>\n </div>\n <div v-if=\"isTotal\" class=\"h-70 lh-70 inputBackground mb-36 flex justify-center px-16\">\n <input :placeholder=\"$t('总额')\" class=\" w-full h-70 border-none textColor\" v-model=\"form.total\"\n @input=\"onInputTotal\" />\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 style=\"color: #868D9A\" class=\"font-24 w-full flex justify-between items-center\">\n <!-- <span class=\"flex-1 text-left\">0%</span> -->\n <span class=\"flex-1 tab-item\" :class=\"[percentageVal == 25 ? 'select-active' : '']\"\n @click=\"exchangeVal(25)\">25%</span>\n <span class=\"flex-1 tab-item\" :class=\"[percentageVal == 50 ? 'select-active' : '']\"\n @click=\"exchangeVal(50)\">50%</span>\n <span class=\"flex-1 tab-item\" :class=\"[percentageVal == 75 ? 'select-active' : '']\"\n @click=\"exchangeVal(75)\">75%</span>\n <span class=\"flex-1 tab-item\" :class=\"[percentageVal == 100 ? 'select-active' : '']\"\n @click=\"exchangeVal(100)\">100%</span>\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'\">{{ $t('可用') }}<span class=\"textColor ml-8\">\n {{ initOpen.volume | nan }} USDT</span>\n </p>\n <p class=\"text-grey\" v-else>{{ $t('可卖') }}<span class=\"textColor ml-8\">{{ initClose.volume | nan }} {{\n symbol.toLocaleUpperCase() }}</span></p>\n </div>\n <van-icon name=\"add-o\" @click=\"$router.push('/exchange/exchangePage')\" class=\"font-30 add-icon\" />\n <!-- <img @click=\"$router.push('/exchange/exchangePage')\" src=\"@/assets/image/public/switch.png\" class=\"w-24 h-24\" /> -->\n </div>\n <div style=\"\" 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'\" @click=\"order()\">\n {{ currentType == 'open' ? $t('买入') : $t('卖出') }}\n </div>\n\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 deep: true,\n handler(val) {\n console.log(val)\n if (val.volume / 1 > 0) {\n this.handleInitSliderOption()\n }\n }\n },\n initClose: { // 处理滚动条初始值\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') { // !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\n },\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 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 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 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 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 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 this.$store.commit('user/SET_USERINFO', { balance: data.money })\n })\n this.$emit('ordered', emitFunc)\n }).catch(() => { // 也需要重新初始化\n this.$emit('ordered', emitFunc)\n })\n },\n }\n\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.buy-item {\n @include themify() {\n background: themed(\"input_background\");\n }\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\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 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 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 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\n opacity: 1;\n}\n\n.inputBackground {\n input {\n background: transparent !important;\n }\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":[]}
|