jiazhipeng
/
flavorOfTimeSzMall
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

封装接口

master
chenkainan 2 months ago
parent
8fd3c3284b
commit
794884fc66
5 changed files with 137 additions and 106 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      .env.development
  2. 5
      .env.production
  3. 6
      src/libs/axios.js
  4. 123
      src/views/Home.vue
  5. 20
      src/views/Index.vue

5
.env.development
View File

@ -0,0 +1,5 @@
NODE_ENV='development'
# 请求域名前缀
VUE_APP_URL='https://swsz.api.js-dyyj.com'
# 打包后输出目录
VUE_APP_OUTPUTDIR='dist_dev'

5
.env.production
View File

@ -0,0 +1,5 @@
NODE_ENV='production'
# 请求域名前缀
VUE_APP_URL='https://api.sutenong.com'
# 打包后输出目录
VUE_APP_OUTPUTDIR='dist'

6
src/libs/axios.js
View File

@ -17,7 +17,7 @@ http.interceptors.request.use((config) => {
config.baseURL = process.env.VUE_APP_URL; config.baseURL = process.env.VUE_APP_URL;
} }
const token = store.state.user.userInfo.token; const token = store.state.user?.userInfo?.token || '';
config.headers['token'] = token config.headers['token'] = token
config.headers['Content-Type'] = 'application/json;charset=UTF-8'; config.headers['Content-Type'] = 'application/json;charset=UTF-8';
@ -84,7 +84,7 @@ http.interceptors.response.use(response => {
}); });
// 请求方法挂载 // 请求方法挂载
Vue.prototype.get = (params, url, loading = true) => { Vue.prototype.get = (params, url, loading = false) => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http.get(url, { http.get(url, {
params, params,
@ -99,7 +99,7 @@ Vue.prototype.get = (params, url, loading = true) => {
}) })
} }
Vue.prototype.post = (data, url, loading = true) => { Vue.prototype.post = (data, url, loading = false) => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
http.post(url, data, { http.post(url, data, {
loading // 传递加载状态参数 loading // 传递加载状态参数

123
src/views/Home.vue
View File

@ -11,7 +11,7 @@
v-lazy="`https://picsum.photos/1200/500?random=${item}`" v-lazy="`https://picsum.photos/1200/500?random=${item}`"
alt="轮播图片" alt="轮播图片"
class="carousel-img" class="carousel-img"
> />
</el-carousel-item> </el-carousel-item>
</el-carousel> </el-carousel>
@ -35,7 +35,9 @@
<div class="hot-products"> <div class="hot-products">
<div class="section-header"> <div class="section-header">
<h2 class="section-title">热门商品</h2> <h2 class="section-title">热门商品</h2>
<a href="#" class="more-link">查看更多 <i class="el-icon-arrow-right"></i></a> <a href="#" class="more-link"
>查看更多 <i class="el-icon-arrow-right"></i
></a>
</div> </div>
<ProductList :products="hotProducts" /> <ProductList :products="hotProducts" />
@ -45,7 +47,9 @@
<div class="new-products"> <div class="new-products">
<div class="section-header"> <div class="section-header">
<h2 class="section-title">新品上市</h2> <h2 class="section-title">新品上市</h2>
<a href="#" class="more-link">查看更多 <i class="el-icon-arrow-right"></i></a> <a href="#" class="more-link"
>查看更多 <i class="el-icon-arrow-right"></i
></a>
</div> </div>
<ProductList :products="newProducts" /> <ProductList :products="newProducts" />
@ -60,7 +64,7 @@
v-lazy="`https://picsum.photos/600/300?random=10`" v-lazy="`https://picsum.photos/600/300?random=10`"
alt="促销活动图片" alt="促销活动图片"
class="promotion-img" class="promotion-img"
> />
<div class="promotion-info"> <div class="promotion-info">
<h3>夏季大促</h3> <h3>夏季大促</h3>
<p>全场商品低至5折</p> <p>全场商品低至5折</p>
@ -72,7 +76,7 @@
v-lazy="`https://picsum.photos/600/300?random=11`" v-lazy="`https://picsum.photos/600/300?random=11`"
alt="促销活动图片" alt="促销活动图片"
class="promotion-img" class="promotion-img"
> />
<div class="promotion-info"> <div class="promotion-info">
<h3>新品首发</h3> <h3>新品首发</h3>
<p>限量发售，先到先得</p> <p>限量发售，先到先得</p>
@ -85,13 +89,13 @@
</template> </template>
<script> <script>
import { mapGetters, mapActions } from 'vuex' import { mapGetters, mapActions } from "vuex";
import ProductList from '../components/product/ProductList' import ProductList from "../components/product/ProductList";
export default { export default {
name: 'Home', name: "Home",
components: { components: {
ProductList ProductList,
}, },
data() { data() {
return { return {
@ -99,135 +103,131 @@ export default {
hotProducts: [ hotProducts: [
{ {
id: 1, id: 1,
name: '超薄笔记本电脑', name: "超薄笔记本电脑",
price: 5999, price: 5999,
originalPrice: 6999, originalPrice: 6999,
image: 'https://picsum.photos/300/300?random=1', image: "https://picsum.photos/300/300?random=1",
sales: 1254, sales: 1254,
categoryId: 1 categoryId: 1,
}, },
{ {
id: 2, id: 2,
name: '智能手表', name: "智能手表",
price: 1599, price: 1599,
originalPrice: 1799, originalPrice: 1799,
image: 'https://picsum.photos/300/300?random=2', image: "https://picsum.photos/300/300?random=2",
sales: 856, sales: 856,
categoryId: 1 categoryId: 1,
}, },
{ {
id: 3, id: 3,
name: '纯棉T恤', name: "纯棉T恤",
price: 99, price: 99,
originalPrice: 199, originalPrice: 199,
image: 'https://picsum.photos/300/300?random=3', image: "https://picsum.photos/300/300?random=3",
sales: 2356, sales: 2356,
categoryId: 2 categoryId: 2,
}, },
{ {
id: 4, id: 4,
name: '休闲牛仔裤', name: "休闲牛仔裤",
price: 199, price: 199,
originalPrice: 399, originalPrice: 399,
image: 'https://picsum.photos/300/300?random=4', image: "https://picsum.photos/300/300?random=4",
sales: 1890, sales: 1890,
categoryId: 2 categoryId: 2,
}, },
{ {
id: 5, id: 5,
name: '舒适沙发', name: "舒适沙发",
price: 2999, price: 2999,
originalPrice: 3999, originalPrice: 3999,
image: 'https://picsum.photos/300/300?random=5', image: "https://picsum.photos/300/300?random=5",
sales: 324, sales: 324,
categoryId: 3 categoryId: 3,
}, },
{ {
id: 6, id: 6,
name: '智能扫地机器人', name: "智能扫地机器人",
price: 1899, price: 1899,
originalPrice: 2299, originalPrice: 2299,
image: 'https://picsum.photos/300/300?random=6', image: "https://picsum.photos/300/300?random=6",
sales: 754, sales: 754,
categoryId: 3 categoryId: 3,
} },
], ],
// 模拟新品数据 // 模拟新品数据
newProducts: [ newProducts: [
{ {
id: 7, id: 7,
name: '高清投影仪', name: "高清投影仪",
price: 3299, price: 3299,
originalPrice: 3699, originalPrice: 3699,
image: 'https://picsum.photos/300/300?random=7', image: "https://picsum.photos/300/300?random=7",
sales: 156, sales: 156,
categoryId: 1 categoryId: 1,
}, },
{ {
id: 8, id: 8,
name: '保湿面霜', name: "保湿面霜",
price: 299, price: 299,
originalPrice: 359, originalPrice: 359,
image: 'https://picsum.photos/300/300?random=8', image: "https://picsum.photos/300/300?random=8",
sales: 423, sales: 423,
categoryId: 4 categoryId: 4,
}, },
{ {
id: 9, id: 9,
name: '有机水果礼盒', name: "有机水果礼盒",
price: 159, price: 159,
originalPrice: 199, originalPrice: 199,
image: 'https://picsum.photos/300/300?random=9', image: "https://picsum.photos/300/300?random=9",
sales: 287, sales: 287,
categoryId: 5 categoryId: 5,
}, },
{ {
id: 10, id: 10,
name: '经典文学名著', name: "经典文学名著",
price: 129, price: 129,
originalPrice: 199, originalPrice: 199,
image: 'https://picsum.photos/300/300?random=10', image: "https://picsum.photos/300/300?random=10",
sales: 342, sales: 342,
categoryId: 6 categoryId: 6,
}, },
{ {
id: 11, id: 11,
name: '无线蓝牙耳机', name: "无线蓝牙耳机",
price: 799, price: 799,
originalPrice: 999, originalPrice: 999,
image: 'https://picsum.photos/300/300?random=11', image: "https://picsum.photos/300/300?random=11",
sales: 567, sales: 567,
categoryId: 1 categoryId: 1,
}, },
{ {
id: 12, id: 12,
name: '运动鞋', name: "运动鞋",
price: 499, price: 499,
originalPrice: 699, originalPrice: 699,
image: 'https://picsum.photos/300/300?random=12', image: "https://picsum.photos/300/300?random=12",
sales: 432, sales: 432,
categoryId: 2 categoryId: 2,
} },
] ],
} };
}, },
computed: { computed: {
...mapGetters([ ...mapGetters(["getCategories"]),
'getCategories'
]),
categories() { categories() {
return this.getCategories return this.getCategories;
} },
}, },
created() { created() {
this.fetchCategories() this.fetchCategories();
}, },
methods: { methods: {
...mapActions([ ...mapActions(["fetchCategories"]),
'fetchCategories' },
]) };
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -317,7 +317,8 @@ export default {
} }
} }
.hot-products, .new-products { .hot-products,
.new-products {
margin-bottom: 40px; margin-bottom: 40px;
} }

20
src/views/Index.vue
View File

@ -30,6 +30,7 @@ export default {
}, },
data() { data() {
return { return {
topBanner: [],
newProducts: [ newProducts: [
{ {
id: 7, id: 7,
@ -74,6 +75,25 @@ export default {
], ],
}; };
}, },
created() {
this.getTopBanner();
},
methods: {
getTopBanner() {
// 头部banner
this.post(
{
type_id: 6,
position: 0,
},
"/api/adv/getAdv"
).then((res) => {
if (res) {
this.topBanner = res.data;
}
});
},
},
}; };
</script> </script>

Write Preview
Loading…
Cancel
Save