{"ast":null,"code":"import \"vant/es/cell/style\";\nimport _Cell from \"vant/es/cell\";\nimport \"vant/es/list/style\";\nimport _List from \"vant/es/list\"; //\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//\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 \"core-js/modules/es.array.push.js\";\nimport { mapGetters } from \"vuex\";\nimport { fixDate, setStorage } from \"@/utils/utis\";\nimport ExTabs from \"@/components/ex-tabs/index.vue\";\nimport { HOST_URL } from \"@/config\";\nexport default {\n  name: \"ListQuotation\",\n  data() {\n    return {\n      fixDate,\n      HOST_URL,\n      active: 0,\n      type: \"left\",\n      //left 从左往右 right 从有王座\n      sortVal: 0\n    };\n  },\n  props: {\n    showMore: {\n      type: Boolean,\n      default: true\n    },\n    listData: {\n      type: Array,\n      default() {\n        return [];\n      }\n    },\n    tabActive: {\n      type: Number,\n      default: 0\n    }\n  },\n  computed: {\n    ...mapGetters({\n      currency: \"home/currency\"\n    })\n  },\n  components: {\n    [_List.name]: _List,\n    [_Cell.name]: _Cell,\n    ExTabs\n  },\n  methods: {\n    //排序\n    listSort(val) {\n      this.sortVal = val;\n      this.$emit(\"listSort\", val);\n    },\n    onItemClick(item) {\n      if (this.tabActive == 2) {\n        //现货\n        this.$router.push({\n          path: `/trade/${item.symbol}`\n        });\n      } else {\n        setStorage(\"symbol\", item.symbol);\n        this.$router.push({\n          path: `/perpetualContract/${item.symbol}`\n        });\n      }\n    },\n    onTabs(val) {\n      if (this.active < val) {\n        this.type = \"right\";\n      } else {\n        this.type = \"left\";\n      }\n      this.active = val;\n      if (val == 0) {\n        this.showList = [...this.listData];\n      } else if (val == 1) {\n        this.showList = [...this.listData].sort(this.compare(\"change_ratio\", \"up\"));\n      } else if (val == 2) {\n        this.showList = [...this.listData].sort(this.compare(\"change_ratio\", \"down\"));\n      } else if (val == 3) {\n        this.showList = [...this.listData].sort(this.compare(\"volume\", \"up\"));\n      }\n    },\n    compare(p, type) {\n      //这是比较函数\n      return function (m, n) {\n        var a = m[p];\n        var b = n[p];\n        if (a == b) {\n          return;\n        }\n        if (type == \"up\") {\n          return b - a; //升序\n        } else if (type == \"down\") {\n          return a - b; //降序\n        } else {\n          return a - b;\n        }\n      };\n    }\n  },\n  watch: {\n    listData() {\n      if (this.active == 0) {\n        this.showList = [...this.listData];\n      } else if (this.active == 1) {\n        this.showList = [...this.listData].sort(this.compare(\"change_ratio\", \"up\"));\n      } else if (this.active == 2) {\n        this.showList = [...this.listData].sort(this.compare(\"change_ratio\", \"down\"));\n      } else if (this.active == 3) {\n        this.showList = [...this.listData].sort(this.compare(\"volume\", \"up\"));\n      }\n      this.$forceUpdate();\n    }\n  }\n};","map":{"version":3,"names":["mapGetters","fixDate","setStorage","ExTabs","HOST_URL","name","data","active","type","sortVal","props","showMore","Boolean","default","listData","Array","tabActive","Number","computed","currency","components","_List","_Cell","methods","listSort","val","$emit","onItemClick","item","$router","push","path","symbol","onTabs","showList","sort","compare","p","m","n","a","b","watch","$forceUpdate"],"sources":["src/components/list-quotation/index.vue"],"sourcesContent":["<template>\n  <div class=\"list-quatation\">\n    <ex-tabs @tabs=\"onTabs\"></ex-tabs>\n    <van-list>\n      <!-- <van-cell> -->\n      <div\n        class=\"flex items-center w-full textNew1 font-26\"\n        style=\"margin: 6px 0 15px\"\n      >\n        <div class=\"left flex items-center newcolor1\" style=\"margin-left: 36px\">\n          <span>{{ $t(\"交易对\") }}</span>\n          <div class=\"filter-box ml-10\" v-if=\"active == 0\">\n            <div\n              class=\"w-14 h-12\"\n              :class=\"[sortVal == 1 ? 'icon_top1_active' : 'icon_top1']\"\n              @click=\"listSort(1)\"\n            ></div>\n            <div\n              class=\"w-14 h-12\"\n              :class=\"[sortVal == 2 ? 'icon_top2_active' : 'icon_top2']\"\n              @click=\"listSort(2)\"\n            ></div>\n          </div>\n        </div>\n        <div class=\"mid text-right flex justify-end items-center\">\n          {{ $t(\"最新价\") }}\n          <div class=\"filter-box ml-10\" v-if=\"active == 0\">\n            <div\n              class=\"w-14 h-12\"\n              :class=\"[sortVal == 3 ? 'icon_top1_active' : 'icon_top1']\"\n              @click=\"listSort(3)\"\n            ></div>\n            <div\n              class=\"w-14 h-12\"\n              :class=\"[sortVal == 4 ? 'icon_top2_active' : 'icon_top2']\"\n              @click=\"listSort(4)\"\n            ></div>\n          </div>\n        </div>\n        <div\n          class=\"rights text-right flex justify-end items-center\"\n          style=\"margin-right: 18px\"\n        >\n          {{ active == 3 ? $t(\"成交额\") : $t(\"24h涨跌幅\") }}\n          <div class=\"filter-box ml-10\" v-if=\"active == 0\">\n            <div\n              class=\"w-14 h-12\"\n              :class=\"[sortVal == 5 ? 'icon_top1_active' : 'icon_top1']\"\n              @click=\"listSort(5)\"\n            ></div>\n            <div\n              class=\"w-14 h-12\"\n              :class=\"[sortVal == 6 ? 'icon_top2_active' : 'icon_top2']\"\n              @click=\"listSort(6)\"\n            ></div>\n          </div>\n          <!--                  <img src=\"./icon-sort.png\" alt=\"icon\" class=\"w-13 h-22 ml-5\"/>-->\n        </div>\n      </div>\n      <!-- </van-cell> -->\n      <transition-group :name=\"type\" tag=\"div\">\n        <div v-if=\"active == 0\" :key=\"active\">\n          <van-cell v-for=\"item in listData\" :key=\"item.id\">\n            <ul\n              class=\"flex justify-between w-full items-center\"\n              @click=\"onItemClick(item)\"\n            >\n              <li class=\"flex items-center left\">\n                <div class=\"anniu\"></div>\n                <p class=\"flex flex-col\" style=\"margin-left: 5px\">\n                  <span class=\"flex items-end font-32 flex items-center\" s>\n                    <span class=\"textColor font-600 font-30\">\n                      {{ (item.symbol && item.symbol.toUpperCase()) || \"--\" }}\n                    </span>\n                    <span class=\"font-24\" style=\"position: relative; top: 1px\">\n                      {{\n                        (item.name &&\n                          item.name.replace(item.symbol.toUpperCase(), \"\")) ||\n                        \"--\"\n                      }}</span\n                    >\n                  </span>\n\n                  <span class=\"font-24 textNew1\">{{\n                    $t(\"成交量\") + \" \" + (item.amount * 1).toFixed(2)\n                  }}</span>\n                </p>\n              </li>\n              <li class=\"flex flex-col items-end mid\">\n                <p\n                  class=\"font-32 font-600\"\n                  :style=\"`color: ${\n                    item.change_ratio > 0 ? '#2EBD85' : '#F6465D'\n                  }`\"\n                >\n                  {{ item.close || \"--\" }}\n                </p>\n                <p class=\"font-24 textNew1\">\n                  {{\n                    (item.close &&\n                      (item.close * currency.rate).toFixed(\n                        item.close.toString().split(\".\")[1]\n                          ? item.close.toString().split(\".\")[1].length\n                          : 2\n                      )) ||\n                    \"--\"\n                  }}{{ currency.currency_symbol }}\n                </p>\n              </li>\n              <li class=\"rights flex items-center justify-end\">\n                <p\n                  class=\"w-153 font-31 h-71 bg-green text-white border-0 text-center btn\"\n                  v-if=\"item.change_ratio > 0\"\n                >\n                  +{{ item.change_ratio }}%\n                </p>\n                <p\n                  class=\"w-153 font-31 h-71 bg-red text-white border-0 text-center btn\"\n                  v-else\n                >\n                  {{ item.change_ratio }}%\n                </p>\n              </li>\n            </ul>\n          </van-cell>\n        </div>\n        <div v-else :key=\"active\">\n          <van-cell v-for=\"item in showList\" :key=\"item.id\">\n            <ul\n              class=\"flex justify-between w-full items-center\"\n              @click=\"onItemClick(item)\"\n            >\n              <li class=\"flex items-center left\">\n                <div class=\"anniu\"></div>\n                <p class=\"flex flex-col\" style=\"margin-left: 5px\">\n                  <span class=\"flex items-end font-32 flex items-center\">\n                    <span class=\"textColor font-600 font-30\">{{\n                      (item.symbol && item.symbol.toUpperCase()) || \"--\"\n                    }}</span>\n                    <span class=\"font-24\" style=\"position: relative; top: 1px\">\n                      {{\n                        (item.name &&\n                          item.name.replace(item.symbol.toUpperCase(), \"\")) ||\n                        \"--\"\n                      }}</span\n                    >\n                  </span>\n                  <span class=\"font-24 textNew1\">{{\n                    $t(\"成交量\") + \" \" + (item.amount * 1).toFixed(2)\n                  }}</span>\n                </p>\n              </li>\n              <li class=\"flex flex-col items-end mid\">\n                <p\n                  class=\"font-32 font-600\"\n                  :style=\"`color: ${\n                    item.change_ratio > 0 ? '#2EBD85' : '#F6465D'\n                  }`\"\n                >\n                  {{ item.close }}\n                </p>\n                <p class=\"font-24 textNew1\">\n                  {{\n                    item.close &&\n                    (item.close * currency.rate).toFixed(\n                      item.close.toString().split(\".\")[1]\n                        ? item.close.toString().split(\".\")[1].length\n                        : 2\n                    )\n                  }}\n                  {{ currency.currency_symbol }}\n                </p>\n              </li>\n              <li class=\"rights flex items-center justify-end text-right\">\n                <div\n                  v-if=\"active == 3\"\n                  class=\"textColor w-182 font-700 font-24\"\n                >\n                  {{ (item.volume * 1).toFixed(2) }}\n                </div>\n                <template v-else>\n                  <p\n                    class=\"w-153 font-31 h-71 bg-green text-white border-0 text-center btn\"\n                    v-if=\"item.change_ratio > 0\"\n                  >\n                    +{{ item.change_ratio }}%\n                  </p>\n                  <p\n                    class=\"w-153 font-31 h-71 bg-red text-white border-0 text-center btn\"\n                    v-else\n                  >\n                    {{ item.change_ratio }}%\n                  </p>\n                </template>\n              </li>\n            </ul>\n          </van-cell>\n        </div>\n      </transition-group>\n    </van-list>\n    <!-- <div class=\"flex flex-col justify-center items-center pb-58 mt-20\" @click=\"$router.push('/quotes/?active=3')\" v-if=\"showMore\">\n        <p class=\"textNew1 font-28 mb-8\">{{ $t('查看') }}</p>\n        <img src=\"./icon-arrow_more.png\" alt=\"more\" class=\"w-24 h-10\"/>\n    </div> -->\n  </div>\n</template>\n\n<script>\nimport { List, Cell } from \"vant\";\nimport { mapGetters } from \"vuex\";\nimport { fixDate, setStorage } from \"@/utils/utis\";\nimport ExTabs from \"@/components/ex-tabs/index.vue\";\nimport { HOST_URL } from \"@/config\";\nexport default {\n  name: \"ListQuotation\",\n  data() {\n    return {\n      fixDate,\n      HOST_URL,\n      active: 0,\n      type: \"left\", //left 从左往右 right 从有王座\n      sortVal: 0,\n    };\n  },\n  props: {\n    showMore: {\n      type: Boolean,\n      default: true,\n    },\n    listData: {\n      type: Array,\n      default() {\n        return [];\n      },\n    },\n    tabActive: {\n      type: Number,\n      default: 0,\n    },\n  },\n  computed: {\n    ...mapGetters({ currency: \"home/currency\" }),\n  },\n  components: {\n    [List.name]: List,\n    [Cell.name]: Cell,\n    ExTabs,\n  },\n  methods: {\n    //排序\n    listSort(val) {\n      this.sortVal = val;\n      this.$emit(\"listSort\", val);\n    },\n    onItemClick(item) {\n      if (this.tabActive == 2) {\n        //现货\n        this.$router.push({\n          path: `/trade/${item.symbol}`,\n        });\n      } else {\n        setStorage(\"symbol\", item.symbol);\n        this.$router.push({\n          path: `/perpetualContract/${item.symbol}`,\n        });\n      }\n    },\n    onTabs(val) {\n      if (this.active < val) {\n        this.type = \"right\";\n      } else {\n        this.type = \"left\";\n      }\n      this.active = val;\n      if (val == 0) {\n        this.showList = [...this.listData];\n      } else if (val == 1) {\n        this.showList = [...this.listData].sort(\n          this.compare(\"change_ratio\", \"up\")\n        );\n      } else if (val == 2) {\n        this.showList = [...this.listData].sort(\n          this.compare(\"change_ratio\", \"down\")\n        );\n      } else if (val == 3) {\n        this.showList = [...this.listData].sort(this.compare(\"volume\", \"up\"));\n      }\n    },\n    compare(p, type) {\n      //这是比较函数\n      return function (m, n) {\n        var a = m[p];\n        var b = n[p];\n        if (a == b) {\n          return;\n        }\n        if (type == \"up\") {\n          return b - a; //升序\n        } else if (type == \"down\") {\n          return a - b; //降序\n        } else {\n          return a - b;\n        }\n      };\n    },\n  },\n  watch: {\n    listData() {\n      if (this.active == 0) {\n        this.showList = [...this.listData];\n      } else if (this.active == 1) {\n        this.showList = [...this.listData].sort(\n          this.compare(\"change_ratio\", \"up\")\n        );\n      } else if (this.active == 2) {\n        this.showList = [...this.listData].sort(\n          this.compare(\"change_ratio\", \"down\")\n        );\n      } else if (this.active == 3) {\n        this.showList = [...this.listData].sort(this.compare(\"volume\", \"up\"));\n      }\n      this.$forceUpdate();\n    },\n  },\n};\n</script>\n<style lang=\"scss\" scoped>\n.left-enter-active,\n.left-leave-active,\n.right-enter-active,\n.right-leave-active {\n  will-change: transform;\n  transition: all 250ms;\n}\n\n.left-leave-active,\n.right-leave-active {\n  display: none;\n}\n\n.left-enter {\n  opacity: 0;\n  transform: translate3d(-100%, 0, 0);\n}\n\n.left-leave {\n  opacity: 0;\n  transform: translate3d(0%, 0, 0);\n}\n\n.right-enter {\n  opacity: 0;\n  transform: translate3d(100%, 0, 0);\n}\n\n.right-leave {\n  opacity: 0;\n  transform: translate3d(0%, 0, 0);\n}\n\n.btn {\n  // border-radius: 9px;\n  line-height: 71px;\n}\n\n.left {\n  width: 382px;\n}\n\n.mid {\n  width: 185px;\n}\n\n.rights {\n  width: 182px;\n  margin-left: 38px;\n}\n\n.filter-box {\n  .icon_top1 {\n    background: url(\"@/assets/image/icon_top1.png\") no-repeat center;\n    background-size: 100% 100%;\n  }\n\n  .icon_top2 {\n    background: url(\"@/assets/image/icon_top2.png\") no-repeat center;\n    background-size: 100% 100%;\n    margin-top: 5px;\n  }\n\n  .icon_top1_active {\n    background: url(\"@/assets/image/icon_top3.png\") no-repeat center;\n    background-size: 100% 100%;\n  }\n\n  .icon_top2_active {\n    background: url(\"@/assets/image/icon_top4.png\") no-repeat center;\n    background-size: 100% 100%;\n    margin-top: 5px;\n  }\n}\n</style>\n"],"mappings":"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","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]}