1 line
7.8 KiB
JSON
1 line
7.8 KiB
JSON
{"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//\nimport search from \"../../../components/Search\";\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 }\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 console.log(_this2.good);\n }\n });\n }\n }\n};","map":{"version":3,"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwEA;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;AACA;;AACA,mBACAa,GADA,CACA,gBADA,EACA;AACAC;AACAC,mCADA;AAEAjB,iCAFA;AAGAG,qCAHA;AAIAD;AAJA;AADA,OADA,EASAgB,IATA,CASA;AACA;AACA;AACA;AACAC;AACA;AACA,OAfA;AAgBA;AApCA;AA5BA","names":["name","data","icons","total","pageSize","currentPage","categoryId","searchText","good","baseApi","components","search","created","methods","loadCategories","handleCurrentPage","handleSearch","text","load","get","params","pageNum","then","console"],"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=\"width: 1300px; margin: 20px auto\">\r\n <!-- 类别菜单-->\r\n <div class=\"good-menu\">\r\n <ul v-for=\"(item, index) in icons\" :key=\"index\">\r\n <li>\r\n <i class=\"iconfont\" v-html=\"item.value\"></i>\r\n <!-- 跳转到goodList页面,参数为类别id-->\r\n <span v-for=\"(category, index2) in item.categories\" :key=\"index2\">\r\n <router-link\r\n :to=\"{\r\n path: '/goodlist',\r\n query: { categoryId: category.id },\r\n }\"\r\n @click=\"load(category.id)\"\r\n >\r\n <a href=\"#\" ><span>{{ category.name }}</span></a\r\n >\r\n </router-link>\r\n <span v-if=\"index2 != item.categories.length - 1\"> / </span>\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n\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\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.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 console.log(this.good);\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 width: 1300px;\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</style>"]},"metadata":{},"sourceType":"module"} |