{"ast":null,"code":"export default {\n  data() {\n    return {\n      user: JSON.parse(localStorage.getItem('xm-user') || '{}'),\n      typeData: [],\n      top: null,\n      notice: [],\n      goodData: [],\n      carousel_top: [require('@/assets/imgs/carousel-1.png'), require('@/assets/imgs/carousel-2.png'), require('@/assets/imgs/carousel-9.png')],\n      carousel_left: [require('@/assets/imgs/carousel-3.png'), require('@/assets/imgs/carousel-4.png'), require('@/assets/imgs/carousel-5.png')],\n      carousel_right: [require('@/assets/imgs/carousel-6.png'), require('@/assets/imgs/carousel-7.png'), require('@/assets/imgs/carousel-8.png')]\n    };\n  },\n  mounted() {\n    this.loadType();\n    this.loadNotice();\n    this.loadGoods();\n  },\n  // methods：本页面所有的点击事件或者其他函数定义区\n  methods: {\n    loadType() {\n      this.$request.get('/type/selectAll').then(res => {\n        if (res.code === '200') {\n          this.typeData = res.data;\n        } else {\n          this.$message.error(res.msg);\n        }\n      });\n    },\n    loadNotice() {\n      this.$request.get('/notice/selectAll').then(res => {\n        this.notice = res.data;\n        let i = 0;\n        if (this.notice && this.notice.length) {\n          this.top = this.notice[0].content;\n          setInterval(() => {\n            this.top = this.notice[i].content;\n            i++;\n            if (i === this.notice.length) {\n              i = 0;\n            }\n          }, 2500);\n        }\n      });\n    },\n    loadGoods() {\n      this.$request.get('/goods/selectTop15').then(res => {\n        if (res.code === '200') {\n          this.goodsData = res.data;\n        } else {\n          this.$message.error(res.msg);\n        }\n      });\n    },\n    navTo(url) {\n      location.href = url;\n    }\n  }\n};","map":{"version":3,"names":["data","user","JSON","parse","localStorage","getItem","typeData","top","notice","goodData","carousel_top","require","carousel_left","carousel_right","mounted","loadType","loadNotice","loadGoods","methods","$request","get","then","res","code","$message","error","msg","i","length","content","setInterval","goodsData","navTo","url","location","href"],"sources":["src/views/front/Home.vue"],"sourcesContent":["<template>\r\n  <div class=\"main-content\">\r\n    <div style=\"height: 60px; background-color: #C566F6FF\"></div>\r\n    <div style=\"display: flex\">\r\n      <div class=\"left\"></div>\r\n      <div style=\"width: 66%; background-color: white; height: 1000px\">\r\n        <div style=\"color: #FE0137FF; margin: 15px 0 15px 18px; font-weight: bold; font-size: 16px\">主题市场</div>\r\n        <div style=\"display: flex; margin: 0 25px; height: 550px\">\r\n          <div style=\"flex: 2\">\r\n            <div style=\"display: flex; color: #666666FF; margin: 14px 0\" v-for=\"item in typeData\">\r\n              <img :src=\"item.img\" alt=\"\" style=\"height: 20px; width: 20px\">\r\n              <div style=\"margin-left: 10px; font-size: 14px\"><a href=\"#\" @click=\"navTo('/front/type?id=' + item.id)\"> {{item.name}}</a></div>\r\n            </div>\r\n          </div>\r\n          <div style=\"flex: 5; margin-top: 15px\">\r\n            <div>\r\n              <el-carousel height=\"300px\" style=\"border-radius: 10px\">\r\n                <el-carousel-item v-for=\"item in carousel_top\">\r\n                  <img :src=\"item\" alt=\"\" style=\"width: 100%; height: 300px; border-radius: 10px\">\r\n                </el-carousel-item>\r\n              </el-carousel>\r\n            </div>\r\n            <div style=\"margin-top: 30px; display: flex\">\r\n              <div style=\"flex: 1\">\r\n                <el-carousel height=\"300px\" style=\"border-radius: 10px\">\r\n                  <el-carousel-item v-for=\"item in carousel_left\">\r\n                    <img :src=\"item\" alt=\"\" style=\"width: 100%; height: 200px; border-radius: 10px\">\r\n                  </el-carousel-item>\r\n                </el-carousel>\r\n              </div>\r\n              <div style=\"flex: 1; margin-left: 5px\">\r\n                <el-carousel height=\"300px\" style=\"border-radius: 10px\">\r\n                  <el-carousel-item v-for=\"item in carousel_right\">\r\n                    <img :src=\"item\" alt=\"\" style=\"width: 100%; height: 200px; border-radius: 10px\">\r\n                  </el-carousel-item>\r\n                </el-carousel>\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <div style=\"flex: 3; background-color: #F3F3F3FF; margin-top: 15px; margin-left: 15px; border-radius: 10px\">\r\n            <div style=\"text-align: center; margin-top: 30px\">\r\n              <img @click=\"navTo('/front/person')\" :src=\"user.avatar\" alt=\"\" style=\"width: 80px; height: 80px; border-radius: 50%\">\r\n              <div style=\"margin-top: 10px\">Hi，{{user.name}}</div>\r\n            </div>\r\n            <div style=\"margin-top: 20px; padding: 0 15px\">\r\n              <img src=\"@/assets/imgs/right.png\" alt=\"\" style=\"height: 150px; width: 100%; border-radius: 20px\">\r\n            </div>\r\n            <div style=\"margin: 20px 10px 10px 10px; width: 250px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis\">\r\n              <i class=\"el-icon-bell\"></i>\r\n              <span style=\"font-weight: bold\">公告</span>\r\n              <span style=\"color: #666666;\">：{{ top }}</span>\r\n            </div>\r\n            <div style=\"display: flex; margin-top: 50px\">\r\n              <div style=\"flex: 1; text-align: center\">\r\n                <a href=\"#\" @click=\"navTo('/front/collect')\">\r\n                  <img src=\"@/assets/imgs/收藏.png\" alt=\"\" style=\"height: 25px; width: 25px\">\r\n                  <div>我的收藏</div>\r\n                </a>\r\n              </div>\r\n              <div style=\"flex: 1; text-align: center\">\r\n                <a href=\"#\" @click=\"navTo('/front/address')\">\r\n                  <img src=\"@/assets/imgs/店铺.png\" alt=\"\" style=\"height: 25px; width: 25px\">\r\n                  <div>我的地址</div>\r\n                </a>\r\n              </div>\r\n              <div style=\"flex: 1; text-align: center\">\r\n                <a href=\"#\" @click=\"navTo('/front/cart')\">\r\n                  <img src=\"@/assets/imgs/购物车.png\" alt=\"\" style=\"height: 25px; width: 25px\">\r\n                  <div>我的购物车</div>\r\n                </a>\r\n              </div>\r\n              <div style=\"flex: 1; text-align: center\">\r\n                <a href=\"#\" @click=\"navTo('/front/orders')\">\r\n                  <img src=\"@/assets/imgs/订单.png\" alt=\"\" style=\"height: 25px; width: 25px\">\r\n                  <div>我的订单</div>\r\n                </a>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div style=\"margin: 40px 0 0 15px; height: 40px; background-color: #04BF04FF; font-size: 20px; color: white; width: 130px; font-weight: bold; line-height: 40px; text-align: center; border-radius: 20px\">热卖商品</div>\r\n        <div style=\"margin: 10px 5px 0 5px\">\r\n          <el-row>\r\n            <el-col :span=\"5\" v-for=\"item in goodsData\">\r\n              <img @click=\"navTo('/front/detail?id=' + item.id)\" :src=\"item.img\" alt=\"\" style=\"width: 100%; height: 175px; border-radius: 10px; border: #cccccc 1px solid\">\r\n              <div style=\"margin-top: 10px; font-weight: 500; font-size: 16px; width: 180px; color: #000000FF; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;\">{{item.name}}</div>\r\n              <div style=\"margin-top: 5px; font-size: 20px; color: #FF5000FF\">￥ {{item.price}} / {{item.unit}}</div>\r\n            </el-col>\r\n          </el-row>\r\n        </div>\r\n      </div>\r\n      <div class=\"right\"></div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n\r\nexport default {\r\n\r\n  data() {\r\n    return {\r\n      user: JSON.parse(localStorage.getItem('xm-user') || '{}'),\r\n      typeData: [],\r\n      top: null,\r\n      notice: [],\r\n      goodData: [],\r\n      carousel_top: [\r\n        require('@/assets/imgs/carousel-1.png'),\r\n        require('@/assets/imgs/carousel-2.png'),\r\n        require('@/assets/imgs/carousel-9.png'),\r\n      ],\r\n      carousel_left: [\r\n        require('@/assets/imgs/carousel-3.png'),\r\n        require('@/assets/imgs/carousel-4.png'),\r\n        require('@/assets/imgs/carousel-5.png'),\r\n      ],\r\n      carousel_right: [\r\n        require('@/assets/imgs/carousel-6.png'),\r\n        require('@/assets/imgs/carousel-7.png'),\r\n        require('@/assets/imgs/carousel-8.png'),\r\n      ],\r\n    }\r\n  },\r\n  mounted() {\r\n    this.loadType()\r\n    this.loadNotice()\r\n    this.loadGoods()\r\n  },\r\n  // methods：本页面所有的点击事件或者其他函数定义区\r\n  methods: {\r\n    loadType() {\r\n      this.$request.get('/type/selectAll').then(res => {\r\n        if (res.code === '200') {\r\n          this.typeData = res.data\r\n        } else {\r\n          this.$message.error(res.msg)\r\n        }\r\n      })\r\n    },\r\n    loadNotice() {\r\n      this.$request.get('/notice/selectAll').then(res => {\r\n        this.notice = res.data\r\n        let i = 0\r\n        if (this.notice && this.notice.length) {\r\n          this.top = this.notice[0].content\r\n          setInterval(() => {\r\n            this.top = this.notice[i].content\r\n            i++\r\n            if (i === this.notice.length) {\r\n              i = 0\r\n            }\r\n          }, 2500)\r\n        }\r\n      })\r\n    },\r\n    loadGoods() {\r\n      this.$request.get('/goods/selectTop15').then(res => {\r\n        if (res.code === '200') {\r\n          this.goodsData = res.data\r\n        } else {\r\n          this.$message.error(res.msg)\r\n        }\r\n      })\r\n    },\r\n    navTo(url) {\r\n      location.href = url\r\n    },\r\n  }\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.main-content {\r\n  min-height: 100vh;\r\n  /*overflow: hidden;*/\r\n  background-size: 100%;\r\n  background-image: url('@/assets/imgs/img.png');\r\n}\r\n.left {\r\n  width: 17%;\r\n  background-repeat: no-repeat;\r\n  background-image: url('@/assets/imgs/left-img.png');\r\n}\r\n.right {\r\n  width: 17%;\r\n  background-repeat: no-repeat;\r\n  background-image: url('@/assets/imgs/right-img.png')\r\n}\r\n.el-col-5{\r\n  width: 20%;\r\n  max-width: 20%;\r\n  padding: 10px 10px;\r\n}\r\n</style>"],"mappings":"AAkGA;EAEAA,KAAA;IACA;MACAC,IAAA,EAAAC,IAAA,CAAAC,KAAA,CAAAC,YAAA,CAAAC,OAAA;MACAC,QAAA;MACAC,GAAA;MACAC,MAAA;MACAC,QAAA;MACAC,YAAA,GACAC,OAAA,kCACAA,OAAA,kCACAA,OAAA,iCACA;MACAC,aAAA,GACAD,OAAA,kCACAA,OAAA,kCACAA,OAAA,iCACA;MACAE,cAAA,GACAF,OAAA,kCACAA,OAAA,kCACAA,OAAA;IAEA;EACA;EACAG,QAAA;IACA,KAAAC,QAAA;IACA,KAAAC,UAAA;IACA,KAAAC,SAAA;EACA;EACA;EACAC,OAAA;IACAH,SAAA;MACA,KAAAI,QAAA,CAAAC,GAAA,oBAAAC,IAAA,CAAAC,GAAA;QACA,IAAAA,GAAA,CAAAC,IAAA;UACA,KAAAjB,QAAA,GAAAgB,GAAA,CAAAtB,IAAA;QACA;UACA,KAAAwB,QAAA,CAAAC,KAAA,CAAAH,GAAA,CAAAI,GAAA;QACA;MACA;IACA;IACAV,WAAA;MACA,KAAAG,QAAA,CAAAC,GAAA,sBAAAC,IAAA,CAAAC,GAAA;QACA,KAAAd,MAAA,GAAAc,GAAA,CAAAtB,IAAA;QACA,IAAA2B,CAAA;QACA,SAAAnB,MAAA,SAAAA,MAAA,CAAAoB,MAAA;UACA,KAAArB,GAAA,QAAAC,MAAA,IAAAqB,OAAA;UACAC,WAAA;YACA,KAAAvB,GAAA,QAAAC,MAAA,CAAAmB,CAAA,EAAAE,OAAA;YACAF,CAAA;YACA,IAAAA,CAAA,UAAAnB,MAAA,CAAAoB,MAAA;cACAD,CAAA;YACA;UACA;QACA;MACA;IACA;IACAV,UAAA;MACA,KAAAE,QAAA,CAAAC,GAAA,uBAAAC,IAAA,CAAAC,GAAA;QACA,IAAAA,GAAA,CAAAC,IAAA;UACA,KAAAQ,SAAA,GAAAT,GAAA,CAAAtB,IAAA;QACA;UACA,KAAAwB,QAAA,CAAAC,KAAA,CAAAH,GAAA,CAAAI,GAAA;QACA;MACA;IACA;IACAM,MAAAC,GAAA;MACAC,QAAA,CAAAC,IAAA,GAAAF,GAAA;IACA;EACA;AACA"},"metadata":{},"sourceType":"module","externalDependencies":[]}