{"ast":null,"code":"import \"core-js/modules/es.number.constructor.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//\nimport search from \"../../../components/Search\";\nimport { toLoad } from \"../../../utils/initialize\";\nexport default {\n  name: \"GoodList\",\n  data: function data() {\n    return {\n      //分类icon，每个icon包含id、value、categories对象数组.category：id，name\n      icons: [],\n      total: 0,\n      pageSize: 9,\n      currentPage: 1,\n      //选择的分类\n      categoryId: Number,\n      //搜索的内容\n      searchText: \"\",\n      good: [],\n      baseApi: this.$store.state.baseApi\n    };\n  },\n  components: {\n    search: search\n  },\n  created: function created() {\n    //二者一般不同时存在\n    this.searchText = this.$route.query.searchText;\n    this.categoryId = this.$route.query.categoryId;\n    this.loadCategories();\n    this.load();\n  },\n  methods: {\n    loadCategories: function loadCategories() {\n      var _this = this;\n\n      this.request.get(\"/api/icon\").then(function (res) {\n        if (res.code === \"200\") {\n          _this.icons = res.data;\n        }\n      });\n    },\n    handleCurrentPage: function handleCurrentPage(currentPage) {\n      this.currentPage = currentPage;\n      this.load();\n    },\n    handleSearch: function handleSearch(text) {\n      this.searchText = text;\n      this.load();\n    },\n    load: function load(categoryId) {\n      var _this2 = this;\n\n      if (categoryId != undefined) {\n        this.categoryId = categoryId;\n        this.$router.push({\n          path: \"/goodlist\",\n          query: {\n            categoryId: this.categoryId\n          }\n        });\n      }\n\n      this.request.get(\"/api/good/page\", {\n        params: {\n          pageNum: this.currentPage,\n          pageSize: this.pageSize,\n          searchText: this.searchText,\n          categoryId: this.categoryId\n        }\n      }).then(function (res) {\n        if (res.code === \"200\") {\n          _this2.total = res.data.total;\n          _this2.good = res.data.records;\n          toLoad();\n        }\n      });\n    }\n  }\n};","map":{"version":3,"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2EA;AACA;AACA;AACAA,kBADA;AAEAC,MAFA,kBAEA;AACA;AACA;AACAC,eAFA;AAGAC,cAHA;AAIAC,iBAJA;AAKAC,oBALA;AAMA;AACAC,wBAPA;AAQA;AACAC,oBATA;AAUAC,cAVA;AAWAC;AAXA;AAaA,GAhBA;AAiBAC;AACAC;AADA,GAjBA;AAoBAC,SApBA,qBAoBA;AACA;AACA;AACA;AAEA;AACA;AACA,GA3BA;AA4BAC;AACAC,kBADA,4BACA;AAAA;;AACA;AACA;AACA;AACA;AACA,OAJA;AAKA,KAPA;AAQAC,qBARA,6BAQAV,WARA,EAQA;AACA;AACA;AACA,KAXA;AAYAW,gBAZA,wBAYAC,IAZA,EAYA;AACA;AACA;AACA,KAfA;AAgBAC,QAhBA,gBAgBAZ,UAhBA,EAgBA;AAAA;;AACA;AACA;AAEA;AACAa,2BADA;AAEAC;AAAAd;AAAA;AAFA;AAIA;;AACA,mBACAe,GADA,CACA,gBADA,EACA;AACAC;AACAC,mCADA;AAEAnB,iCAFA;AAGAG,qCAHA;AAIAD;AAJA;AADA,OADA,EASAkB,IATA,CASA;AACA;AACA;AACA;AACAC;AACA;AACA,OAfA;AAgBA;AAzCA;AA5BA","names":["name","data","icons","total","pageSize","currentPage","categoryId","searchText","good","baseApi","components","search","created","methods","loadCategories","handleCurrentPage","handleSearch","text","load","path","query","get","params","pageNum","then","toLoad"],"sourceRoot":"src/views/front/good","sources":["GoodList.vue"],"sourcesContent":["<template>\r\n  <div>\r\n    <search @search=\"handleSearch\"></search>\r\n    <div class=\"main-box\">\r\n      <div style=\"margin: 20px auto\">\r\n        <h2 class=\"cate\" style=\"font-size: 24px;\">\r\n          <i class=\"iconfont icon-r-list\" style=\"font-size: 30px;\"></i>\r\n           选择商品分类\r\n        </h2>\r\n        <!--      类别菜单-->\r\n        <el-row :gutter=\"20\" style=\"font-size: 18px;\">\r\n          <el-col v-for=\"(item, index) in icons\" :key=\"index\" :span=\"6\">\r\n            <i class=\"iconfont\" v-html=\"item.value\"></i> \r\n            <span v-for=\"(category, index2) in item.categories\" :key=\"index2\">\r\n              <b>\r\n                <a\r\n                  href=\"#\"\r\n                  @click.prevent=\"load(category.id)\"\r\n                  :class=\"{\r\n                    black: categoryId == category.id,\r\n                    grey: categoryId != category.id,\r\n                  }\"\r\n                >\r\n                  <span>{{ category.name }}</span>\r\n                </a>\r\n              </b>\r\n              <span v-if=\"index2 != item.categories.length - 1\"> / </span>\r\n            </span>\r\n          </el-col>\r\n        </el-row>\r\n        <hr />\r\n        <el-row :gutter=\"20\">\r\n          <el-col\r\n            :span=\"6\"\r\n            v-for=\"good in good\"\r\n            :key=\"good.id\"\r\n            style=\"margin-bottom: 20px\"\r\n          >\r\n            <!--            商品格子-->\r\n            <router-link :to=\"'goodview/' + good.id\">\r\n              <el-card :body-style=\"{ padding: '0px', background: '#e3f5f4' }\">\r\n                <img\r\n                  :src=\"baseApi + good.imgs\"\r\n                  style=\"width: 100%; height: 300px\"\r\n                />\r\n                <div style=\"padding: 5px 10px\">\r\n                  <span style=\"font-size: 18px\">{{ good.name }}</span\r\n                  ><br />\r\n                  <span style=\"color: red; font-size: 15px\"\r\n                    >￥{{ good.price }}</span\r\n                  >\r\n                </div>\r\n              </el-card>\r\n            </router-link>\r\n          </el-col>\r\n        </el-row>\r\n      </div>\r\n      <!--      分页-->\r\n      <div class=\"block\" style=\"text-align: center\">\r\n        <el-pagination\r\n          background\r\n          :hide-on-single-page=\"false\"\r\n          :current-page=\"currentPage\"\r\n          :page-size=\"pageSize\"\r\n          layout=\"total, prev, pager, next\"\r\n          :total=\"total\"\r\n          @current-change=\"handleCurrentPage\"\r\n        >\r\n        </el-pagination>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport search from \"../../../components/Search\";\r\nimport { toLoad } from \"../../../utils/initialize\";\r\nexport default {\r\n  name: \"GoodList\",\r\n  data() {\r\n    return {\r\n      //分类icon，每个icon包含id、value、categories对象数组.category：id，name\r\n      icons: [],\r\n      total: 0,\r\n      pageSize: 9,\r\n      currentPage: 1,\r\n      //选择的分类\r\n      categoryId: Number,\r\n      //搜索的内容\r\n      searchText: \"\",\r\n      good: [],\r\n      baseApi: this.$store.state.baseApi,\r\n    };\r\n  },\r\n  components: {\r\n    search,\r\n  },\r\n  created() {\r\n    //二者一般不同时存在\r\n    this.searchText = this.$route.query.searchText;\r\n    this.categoryId = this.$route.query.categoryId;\r\n\r\n    this.loadCategories();\r\n    this.load();\r\n  },\r\n  methods: {\r\n    loadCategories() {\r\n      this.request.get(\"/api/icon\").then((res) => {\r\n        if (res.code === \"200\") {\r\n          this.icons = res.data;\r\n        }\r\n      });\r\n    },\r\n    handleCurrentPage(currentPage) {\r\n      this.currentPage = currentPage;\r\n      this.load();\r\n    },\r\n    handleSearch(text) {\r\n      this.searchText = text;\r\n      this.load();\r\n    },\r\n    load(categoryId) {\r\n      if (categoryId != undefined) {\r\n        this.categoryId = categoryId;\r\n\r\n        this.$router.push({\r\n          path: \"/goodlist\",\r\n          query: { categoryId: this.categoryId },\r\n        });\r\n      }\r\n      this.request\r\n        .get(\"/api/good/page\", {\r\n          params: {\r\n            pageNum: this.currentPage,\r\n            pageSize: this.pageSize,\r\n            searchText: this.searchText,\r\n            categoryId: this.categoryId,\r\n          },\r\n        })\r\n        .then((res) => {\r\n          if (res.code === \"200\") {\r\n            this.total = res.data.total;\r\n            this.good = res.data.records;\r\n            toLoad()\r\n          }\r\n        });\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style scoped>\r\n.main-box {\r\n  background-color: white;\r\n  border: white 2px solid;\r\n  border-radius: 40px;\r\n  padding: 20px 40px;\r\n  margin: 5px auto;\r\n}\r\n\r\n.black {\r\n  color: black;\r\n}\r\n\r\n.grey {\r\n  color: grey;\r\n}\r\n</style>"]},"metadata":{},"sourceType":"module"}