166 lines
6.9 KiB
Vue
166 lines
6.9 KiB
Vue
<template>
|
|
<view class="con">
|
|
<!-- 搜索栏 -->
|
|
<view class="floot">
|
|
<view class="inputs" @click="input">
|
|
<img
|
|
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAAbCAYAAACN1PRVAAAC50lEQVRIS7WWz08TURDHv9OSkiYCCZqQKI0EjVExUePJsx5MvEAEPBhveJHuwtuiCKc9ISL7FrtbPejRU/EHJ/Xgv2DUBPyR+DOFAwmYdL0ISTvm2RYLlHZp4Z02b9/MZ2fmO/OWUGKZphlqbNzXycydRHQW4P0AVgHMM+MtEc143tKMaZpqz/eijSeldLsAngBwuIKXL0Q8LIT+zC9tDZZMJoOp1OIYEW7mjT8AeJTN4mUoxN/VXiYTbGfOXgDQB+C42mPGRCTSMtrb25upBF2DWZZzJw9aJSIjnV56YJpmdos0Bxoamq8RkQ0grICxmDbsC2bb8W5mmlZ1IeKLQuivKxmq95blniPiFwBCRNwjhP6knB3lxLD3K4BWAP2God33AyqcsW23n5ldAAuet9xeTjRk2/ErzPQYwFxra8tJP7kv/hhV6/n5xfcAOphxNRbTlK+Si6R0pwFWaRSxWHRqO1EVzlqWO0jEqn5PDUPrLgNzfgA4mM3i2NCQ9qka2OSkczQQwEcAPw1DaysH+wOg3vOW67fbpAWn+bqvKIEZhlZfLo0ewA21wBKJxJ6VlexvHzDnM4AjtaRRSrcD4FkfaaxdIFI6AwCUuMoLpCB9ZsxGIi2nqpF+KrX4jggnKkq/1qaW0rkOIKGauq6OD+m6roRSus9yY8fpIUKylnEF0GXDiCofW661QSylOwHwjRxwe4M4N/05YRiaRkRcNjL1Mj92VJGj+cNzAB4GAplX4XD4m+d5oWAw3AbweWb0qRqVcOoKEdW3Am66PC3LuUSEcZ+X5whz4DTAowUwMxzDiA6UAm6CKSMlmqam5h5m6gLoDMAHcs5oAeA3RPw8nf41XZg4tu2MMWPkf6QUF6J/cCOwJKya+SilcxvArSLbe0JERTFwx2AKYtvxcWYqvrHXAXcUlm+jwu9FLvHEU0Lo4t9zNSmrZFPURuuAuwLLR3iXCEPF0e0aTEGkdCeJssFdTeNWaf4LfE9oKz70n2kAAAAASUVORK5CYII="
|
|
draggable="true"
|
|
/>
|
|
<p>请输入药名/厂家</p>
|
|
</view>
|
|
<img
|
|
class="rightimg"
|
|
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAArCAYAAAA65tviAAAEzElEQVRoQ+2ZW6hVVRSG/7HWGGvvE6UV2c2itOimZEQkpBGEJHUio/QhwUuRYCL1kF2eJHqK8hBJZAbRTbphYJGWhT1YPtRLKUYXwpIudhHRtNp7z7HWiLnbS6bLc99rn3OgM9/2vIzxf3OsveaYYxF6afV6/ZIoipYDuBHAeQAqvc0bwb46gL0AtmRZtr5SqXxd9E1hh5klqvo4gJUA4hEUOhRXKYCnmflBImrkC4+CtCDeATB3KFZHce5WZr4lhzkK4pxbA+D+URQ2HNc9IrLKL2yC1Gq1C+M4/goAB9Z+M7PVIrIZwD4iyobjqd01ZhYBOMs5101EjwI4I7CpaZpeWq1Wv2uCOOeeANAka7VfmflqIvqxXSFlrjezc1X1MwBnBnbXiMgDOchuANPyQTO7M0mSF8sUUZatRqOxlIheCOx9KSLTc5B/AFTzQWaeSER/luW8TDtmNkFVDwU2ayLSlYNYMHBERE4q03nZtpxzhwGcmNsVEeoN5JCInFy28zLtOecOApg4DlLmrrZjazwi7exeJ9aOR6QTu9qOzVIjYmZnq+pDAKaY2WYReY6IwvOoqVVVF5rZAiL63Tn3WFdX1/dFCOecz7iXmdlfZtZTqVR29QdaGoiZiap+AeCywOEqEekJBajqYjN7Kej7hZkvJqIjeZ9zbg6ArQB8cujbYWae1l+eVxpIo9HwCeWnhV3bJSIzwj7nnBd4Q9hHRN3MvCXvU9XnzeyucI6ZrUiSZF1fUSkNpF6vXx5F0c6Co+0icl0BZBOAeYV514rIJ0FEngJwbwF2ETNv6DiId+Cc2wjg9pYzf/28SUQ+KIBcA2BbkJB+xMxzwv9S6y7kU/NTWmt3t64QPpHttZUWEW/dzOI0TW/NsmyymX1YqVT8xey4VqvVLoiiqDuKov1xHL9JRFqc5F8czjkfubqIvE5Ef/cF0drE8Vyrvw0a8bFSH60RVx84HAcZzd3vzff/IiL+lZiXSI2ZhYj82TDmmpmxqvpSaV5cTEWE8zv7TwAmB6pni8iOMUfx30E8G8DHgbafReScJkij0XiViO4IBrcx89yxFhV/CKuqzx6uz7Wa2WtJkixsgqhqt5m9W4jARmZeQUR/jIXImNkkVX0GwPxQDxHdzMybwyK2T+RmFUT7Z9FnuQeI6ACA9+I43tjbvSNcZ2anq+oyAFcAkBI24lQAMwEkBVs7RMQ/akf/ML6QPTWOYy/6tAEcb2Lm+X09dqq6wMyeBeCdd7LtT9N0ZrVa3XMMiP9Rr9enx3H8tplN7U+Bmd2XJMnaQhQmOOfWEtGSTqpviibak6bpvEql4mvWzXbMFyvfYWYnqKr/TnKPL+f3IepzEbkyH3POzSKiV8xsSoch9gFYx8w9xQz5OJDgbRA552ZEUXR+lmWTiGh9IDLzhW4fRFV9BMDDwVU1n+a/p6w1s+IFbMisURQdyrLsBxHZ2dd3mj5Bit6cc98AuCgAXU5EdwO4qjjXzPYS0WIR2T5k1cNcMGiQRqPxMhEtGsiPmW0QkZVEFJb+B1rW9vigQVT1NjN7qx+PB4loOTO/0baqYRgYNIiZkaq+X6yKtHz6u/gSIvKpzqi0QYMEb7TVAJa2Pkp+a2ZPisj6gQ7JTtMNCaTTYtqx/y/2ZXxKzaQkWgAAAABJRU5ErkJggg=="
|
|
draggable="true"
|
|
/>
|
|
</view>
|
|
|
|
<!-- 轮播图 -->
|
|
<swiper
|
|
class="swiper"
|
|
:indicator-dots="indicatorDots"
|
|
:autoplay="autoplay"
|
|
:interval="interval"
|
|
:duration="duration"
|
|
:current="current"
|
|
:indicator-active-color="color"
|
|
>
|
|
<swiper-item v-for="(i, j) in list.banner" :key="j" @click="bann(j)">
|
|
<view class="swiper-item">
|
|
<img :src="'https://' + i.app_pic_url" draggable="true" />
|
|
</view>
|
|
</swiper-item>
|
|
</swiper>
|
|
|
|
<!-- 9宫格 -->
|
|
<view class="palaceGrid">
|
|
<view v-for="(i, j) in icons" :key="j" @click="newlist(j)">
|
|
<img :src="'https://' + i.cover_img" />
|
|
<p>{{ i.activity_name }}</p>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 通知栏 -->
|
|
<view class="notice">
|
|
<img src="/static/home/laba.png" class="noticeImg" />
|
|
<swiper :autoplay="autoplay" :interval="interval">
|
|
<swiper-item class="swp">
|
|
<p>医点医滴-中秋国庆放假通知</p>
|
|
</swiper-item>
|
|
<swiper-item class="swp">
|
|
<p>医点医滴APP上线拉!</p>
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
|
|
<!-- 新客特权 -->
|
|
<img src="/static/home/renzheng.jpg" class="prerog" />
|
|
|
|
<!-- 明星爆款 -->
|
|
<view>
|
|
<view
|
|
class="faddish"
|
|
v-for="(i, j) in list.activity_self_true"
|
|
:key="j"
|
|
@click="sous(j)"
|
|
>
|
|
<img src="/static/home/shu.png" alt="" />
|
|
<p>{{ i.activity_name }}</p>
|
|
</view>
|
|
<view>
|
|
<scroll-view scroll-x="true" class="scroll">
|
|
<view class="box" v-for="(i, j) in hot" :key="j" @click="sous(j)">
|
|
<img :src="'https://' + i.pc_thumb" alt="" />
|
|
<view class="info">
|
|
<p class="ling" v-if="i.retail_flag == 0">零</p>
|
|
<p class="hot" v-if="i.is_limit == 1">限</p>
|
|
<p class="jieshao">{{ i.goods_name }}</p>
|
|
</view>
|
|
<p class="gs">{{ i.manufacturer_name }}</p>
|
|
<p class="zhi">{{ i.spec_desc }}</p>
|
|
<p class="jiage">￥{{ i.sales_price }}</p>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
<Tabs></Tabs>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import Tabs from "../../components/homeTabs";
|
|
export default {
|
|
data() {
|
|
return {
|
|
|
|
indicatorDots: true,
|
|
autoplay: true,
|
|
interval: 2000,
|
|
duration: 500,
|
|
current: 0,
|
|
color: "#fff",
|
|
//保存首页接口数据
|
|
list: [],
|
|
//保存明星爆款数据
|
|
hot: [],
|
|
//保存九宫格的数据
|
|
icons: [],
|
|
};
|
|
},
|
|
created() {
|
|
this.getIndex();
|
|
},
|
|
onLoad() {},
|
|
methods: {
|
|
//掉首页接口
|
|
async getIndex() {
|
|
let res = await this.$http.index.getIndex();
|
|
this.list = res;
|
|
// console.log("接口原数据", res);
|
|
|
|
this.icons = res.activity_icons;
|
|
// console.log("九宫格数据", this.icons);
|
|
|
|
this.list.activity_self_true.forEach((i) => {
|
|
this.hot = i.goods_list.data;
|
|
// console.log("明星爆款6条数据", i.goods_list.data);
|
|
});
|
|
},
|
|
//搜索点击跳转事件
|
|
input() {
|
|
uni.navigateTo({
|
|
url: `/pages/index/search`,
|
|
});
|
|
},
|
|
//点击明星爆款跳转到搜索页面
|
|
sous(j) {
|
|
// console.log(this.hot[j].keyword);
|
|
uni.navigateTo({
|
|
url: `/pages/index/search?key=${this.hot[j].keyword}`,
|
|
});
|
|
},
|
|
//点击九宫格跳转到搜索页面
|
|
newlist(el) {
|
|
uni.navigateTo({
|
|
url: `/pages/index/search?newlist=${this.icons[el].id}`,
|
|
});
|
|
},
|
|
//轮播图点击跳转进搜索页面
|
|
bann(el){
|
|
uni.navigateTo({
|
|
url: `/pages/index/search?banner=${this.list.banner[el].id}`,
|
|
});
|
|
},
|
|
|
|
},
|
|
components: {
|
|
Tabs
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
@import "../../common/less/page/index.less";
|
|
</style>
|