完成搜索页面，优化商品列表组件，修改Storage访问方式

components/goods/list.vue

@@ -5,7 +5,7 @@
         <view class="good" @click="clickHandler(cx.page_url)">
           <view class="good-img">
             <image
-              mode="aspectFit"
+              mode="aspectFill"
               :src="cx.cover_pic"
               style="width: 100%; height: 100%;"
             />
@@ -38,11 +38,13 @@ export default {
     return {
       g: [],
       showSku:false,
-      sku:{}
+      sku:{},
+      mainColor:""
     };
   },
   mounted() {
     this.g = this.list;
+    this.mainColor = this.$uiConfig.mainColor;
   },
   watch: {
     list: {

components/userbox/index.vue

@@ -22,7 +22,7 @@ export default {
     };
   },
   created() {
-    this.u = wx.getStorageSync("userinfo");
+    this.u = uni.getStorageSync("userinfo");
     if (!this.u) {
       this.u = {
         nickName: "未登录",

node_modules/uview-ui/components/u-empty/u-empty.vue

 <template>
 	<view class="u-empty" v-if="show" :style="{
-		marginTop: marginTop + 'rpx'
+		marginTop: marginTop + 'rpx',
+		paddingTop: paddingTop + '%'
 	}">
 		<image class="u-image" :src="src ? src : icons[mode].image" mode="widthFix" :style="{
 			width: imgWidth + 'rpx',
@@ -84,6 +85,10 @@
 			marginTop: {
 				type: [String, Number],
 				default: 0
+			},
+			paddingTop: {
+				type: [String, Number],
+				default: 30
 			}
 		},
 		data() {

node_modules/uview-ui/components/u-search/u-search.vue

@@ -29,7 +29,7 @@
 				}, inputStyle]"
 			/>
 			<view class="u-close-wrap" v-if="keyword && clearabled && focused" @touchstart="clear">
-				<u-icon class="u-clear-icon" name="close" :size="16" color="#fff" @touchstart="clear"></u-icon>
+				<u-icon class="u-clear-icon" name="cross" :size="16" color="#fff" @touchstart="clear"></u-icon>
 			</view>
 		</view>
 		<view :style="[actionStyle]" class="u-action" 

node_modules/uview-ui/components/u-tag/u-tag.vue

@@ -7,8 +7,8 @@
 	]"
 	 class="u-tag" :style="[customStyle]" @tap="clickTag">
 		{{text}}
-		<view class="u-icon-wrap" @tap.stop>
-			<u-icon @click="close" size="22" v-if="closeable" name="close" class="u-close-icon" :style="[iconStyle]"></u-icon>
+		<view class="u-icon-wrap" style="vertical-align: text-bottom;" @tap.stop>
+			<u-icon @click="close" size="28" v-if="closeable" name="cross" class="u-close-icon" :style="[iconStyle]"></u-icon>
 		</view>
 	</view>
 </template>
@@ -158,7 +158,10 @@
 		font-size: 22rpx;
 		padding: 12rpx 22rpx;
 	}
-	
+	.u-size-big {
+		font-size: 26rpx;
+		padding: 22rpx;
+	}
 	.u-size-mini {
 		font-size: 20rpx;
 		padding: 6rpx 12rpx;

pages.json

@@ -3,6 +3,9 @@
         "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
     },
     "pages": [{
+            "path": "pages/search/search"
+        },
+        {
             "path": "pages/cart/cart"
         },
         {

pages/address/address.vue

@@ -89,8 +89,8 @@ export default {
 	 
   },
   onLoad() {
-    console.log(wx.getStorageSync("basedata"));
-    this.u = wx.getStorageSync("userinfo");
+    console.log(uni.getStorageSync("basedata"));
+    this.u = uni.getStorageSync("userinfo");
     if (!this.u) {
       this.u = {
         nickName: "未登录",

pages/cart/cart.vue

@@ -234,8 +234,8 @@ export default {
     this.listbottom = c - 2 + 50 + "px";
     this.contentHeight = this.$utils.calcContentHeight(c);
     let u = "/" + currentPages[currentPages.length - 1].route;
-    let pages = wx.getStorageSync("basedata")
-      ? wx.getStorageSync("basedata").bar_title
+    let pages = uni.getStorageSync("basedata")
+      ? uni.getStorageSync("basedata").bar_title
       : [];
     pages.forEach((x) => {
       if (x.value == u) {

pages/cats/cats.vue

@@ -134,8 +134,8 @@ export default {
     this.contentHeight = this.$utils.calcContentHeight(c);
     console.log(this.contentHeight);
     let u = "/" + currentPages[currentPages.length - 1].route;
-    let pages = wx.getStorageSync("basedata")
-      ? wx.getStorageSync("basedata").bar_title
+    let pages = uni.getStorageSync("basedata")
+      ? uni.getStorageSync("basedata").bar_title
       : [];
     pages.forEach((x) => {
       if (x.value == u) {

pages/favorite/favorite.vue

@@ -85,7 +85,7 @@
 			 this.init()
 		},
 		onLoad(){
-			this.u = wx.getStorageSync("userinfo");
+			this.u = uni.getStorageSync("userinfo");
 			if (!this.u) {
 			  this.u = {
 				nickName: "未登录",

pages/foot/index/index.vue

@@ -109,7 +109,7 @@
 			 
 		},
 		onLoad(){
-			this.u = wx.getStorageSync("userinfo");
+			this.u = uni.getStorageSync("userinfo");
 			if (!this.u) {
 			  this.u = {
 				nickName: "未登录",

pages/goods/comment-list.vue

@@ -124,8 +124,8 @@ export default {
     initPage() {
       let currentPages = getCurrentPages();
       let u = "/" + currentPages[currentPages.length - 1].route;
-      let pages = wx.getStorageSync("basedata")
-        ? wx.getStorageSync("basedata").bar_title
+      let pages = uni.getStorageSync("basedata")
+        ? uni.getStorageSync("basedata").bar_title
         : [];
       pages.forEach((x) => {
         if (x.value == u) {

pages/goods/goods.vue

@@ -245,8 +245,8 @@ export default {
     initPage() {
       let currentPages = getCurrentPages();
       let u = "/" + currentPages[currentPages.length - 1].route;
-      let pages = wx.getStorageSync("basedata")
-        ? wx.getStorageSync("basedata").bar_title
+      let pages = uni.getStorageSync("basedata")
+        ? uni.getStorageSync("basedata").bar_title
         : [];
       pages.forEach((x) => {
         if (x.value == u) {

pages/order-submit/order-submit.vue

@@ -416,8 +416,8 @@ export default {
     initPage() {
       let currentPages = getCurrentPages();
       let u = "/" + currentPages[currentPages.length - 1].route;
-      let pages = wx.getStorageSync("basedata")
-        ? wx.getStorageSync("basedata").bar_title
+      let pages = uni.getStorageSync("basedata")
+        ? uni.getStorageSync("basedata").bar_title
         : [];
       pages.forEach((x) => {
         if (x.value == u) {

pages/search/search.vue

+<template>
+  <view class="searchpage">
+    <view class="ctrl-box">
+      <u-search
+        action-text="搜索"
+        :focus="true"
+        :clearabled="true"
+        :show-action="true"
+        radius="40"
+        v-model="searchKey"
+        @search="searchHandler"
+        @custom="searchHandler"
+        @change="changeHandler"
+      ></u-search>
+    </view>
+    <view class="historys" v-if="searchKey == '' || !loadSearch">
+      <view class="title-box">
+        <view class="title">搜索历史</view>
+        <view class="editor" v-if="searchHistory.length > 0">
+          <u-icon
+            size="36"
+            name="delete"
+            color="#999"
+            v-if="!isEditor"
+            @click="changeEditorHandler"
+          ></u-icon>
+          <view v-else>
+            <text
+              @click="clearHandler"
+              style="
+                font-size: 12px;
+                color: gray;
+                padding-right: 15px;
+                border-right: 1px solid #eee;
+              "
+              >全部删除</text
+            >
+            <text
+              style="font-size: 12px; padding-left: 15px;"
+              :style="{ color: mainColor }"
+              @click="changeEditorHandler"
+              >完成</text
+            >
+          </view>
+        </view>
+      </view>
+      <view class="details" v-if="searchHistory.length > 0">
+        <template v-for="(x, i) in searchHistory">
+          <view class="item" v-if="i < 6 || showAllHistory" :key="i">
+            <u-tag
+              bg-color="#f1f1f1"
+              size="big"
+              :text="x"
+              color="#111"
+              shape="circle"
+              mode="dark"
+              :closeable="isEditor"
+              close-color="#333"
+              :index="i"
+              @close="delHistoryItemHandler"
+              @click="tagClickHandler(x)"
+            ></u-tag>
+          </view>
+        </template>
+        <view
+          class="arrow"
+          @click="changeShowHandler"
+          v-if="searchHistory.length > 6 && !isEditor"
+        >
+          <u-icon
+            :name="showAllHistory ? 'arrow-up' : 'arrow-down'"
+            size="24"
+            color="#000"
+          ></u-icon>
+        </view>
+      </view>
+      <u-empty
+        text="没有搜索历史记录"
+        v-else
+        mode="news"
+        font-size="24"
+        img-width="120"
+      ></u-empty>
+    </view>
+    <view v-else class="search-content">
+      <scroll-view
+        :scroll-y="true"
+        @scrolltolower="lower"
+        :enable-back-to-top="true"
+        :enable-flex="true"
+        style="height: 100%;"
+        v-if="g.length > 0"
+      >
+        <view style="padding: 12px;">
+          <goodlist :list="g"></goodlist>
+          <u-loadmore
+            v-if="showLoading"
+            :status="status"
+            :load-text="loadText"
+            :font-size="24"
+            :margin-top="20"
+            :margin-bottom="20"
+            bg-color="#f8f8f8"
+          />
+        </view>
+      </scroll-view>
+      <view
+        v-if="!loading && g.length == 0"
+        style="height: calc(100vh - 42px); overflow-y: auto;"
+      >
+        <u-empty
+          text="抱歉，没有找到商品额~"
+          mode="search"
+          font-size="24"
+          img-width="120"
+          margin-top="24"
+          padding-top="0"
+        ></u-empty>
+        <view style="padding: 12px;">
+          <view class="recommed">
+            <view class="title">为你推荐</view>
+          </view>
+          <goodlist :list="recommedGoods"></goodlist>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import goodlist from "@/components/goods/list";
+export default {
+  components: {
+    goodlist,
+  },
+  data() {
+    return {
+      pageTitle: "",
+      searchHistory: [],
+      isEditor: false,
+      mainColor: "",
+      showAllHistory: false,
+      searchKey: "",
+      loadSearch: false,
+      loadText: {
+        loadmore: "轻轻上拉，加载更多",
+        loading: "努力加载中",
+        nomore: "没有更多商品了",
+      },
+      showLoading: false,
+      g: [],
+      page: 1,
+      page_count: 1,
+      status: "loadmore",
+      isover: false,
+      loading: false,
+      recommedGoods: [],
+    };
+  },
+  onLoad(option) {
+    this.initPage();
+    this.initRecommend();
+    if (uni.getStorageSync("search_his")) {
+      this.searchHistory = uni.getStorageSync("search_his");
+    }
+    this.mainColor = this.$uiConfig.mainColor;
+  },
+  methods: {
+    initRecommend() {
+      this.request(
+        {
+          url: "",
+          data: {
+            r: "api/goods/new-recommend",
+            goods_id: 0,
+            type: "goods",
+          },
+        },
+        (res) => {
+          this.recommedGoods = res.data.list;
+        }
+      );
+    },
+    initPage() {
+      let currentPages = getCurrentPages();
+      let u = "/" + currentPages[currentPages.length - 1].route;
+      let pages = uni.getStorageSync("basedata")
+        ? uni.getStorageSync("basedata").bar_title
+        : [];
+
+      pages.forEach((x) => {
+        if (x.value == u) {
+          this.pageTitle = x.new_name ? x.new_name : x.name;
+        }
+      });
+      uni.setNavigationBarTitle({
+        title: this.pageTitle,
+      });
+    },
+    changeShowHandler() {
+      this.showAllHistory = !this.showAllHistory;
+    },
+    clearHandler() {
+      this.searchHistory = [];
+      uni.removeStorageSync("search_his");
+    },
+    changeEditorHandler() {
+      this.isEditor = !this.isEditor;
+      this.showAllHistory = true;
+    },
+    delHistoryItemHandler(i) {
+      this.searchHistory.splice(i, 1);
+      uni.setStorageSync("search_his", this.searchHistory);
+    },
+    changeHandler(val) {
+      if (val == "") {
+        this.loadSearch = false;
+      }
+    },
+    tagClickHandler(val) {
+      if (!this.isEditor) {
+        this.searchHandler(val);
+      }
+    },
+    searchHandler(val) {
+      if (val != "") {
+        let index = -1;
+        this.searchHistory.forEach((x, i) => {
+          if (x == val) {
+            index = i;
+          }
+        });
+        if (index != -1) {
+          this.searchHistory.splice(index, 1);
+        }
+        this.searchHistory.unshift(val);
+        uni.setStorageSync("search_his", this.searchHistory);
+        this.page = 1;
+        this.g = [];
+        this.searchKey = val;
+        this.loadSearch = true;
+        this.init();
+      } else {
+        this.searchKey = "";
+        this.loadSearch = false;
+      }
+    },
+    init() {
+      this.isover = false;
+      this.loading = true;
+      this.showLoading = this.page != 1;
+      this.request(
+        {
+          url: "",
+          data: {
+            r: "api/default/goods-list",
+            page: this.page,
+            keyword: this.searchKey,
+            sign: "",
+          },
+        },
+        (res) => {
+          this.showLoading = true;
+          this.g = this.g.concat(res.data.list);
+          this.page_count = res.data.pagination.page_count;
+          if (this.page_count == 1) {
+            this.isover = true;
+            this.status = "nomore";
+          } else {
+            this.status = "loadmore";
+          }
+          this.loading = false;
+        }
+      );
+    },
+    lower(e) {
+      if (this.page < this.page_count) {
+        if (!this.loading) {
+          this.status = "loading";
+          this.page++;
+          this.init();
+        }
+      } else {
+        this.isover = true;
+        this.status = "nomore";
+      }
+    },
+  },
+};
+</script>
+
+<style>
+.searchpage {
+  min-height: 100vh;
+}
+.searchpage .ctrl-box {
+  padding: 5px 10px;
+}
+.searchpage .historys {
+  padding: 20px;
+}
+.searchpage .historys .title-box {
+  display: flex;
+  align-items: center;
+  margin-bottom: 10px;
+}
+.searchpage .historys .title-box .title,
+.searchpage .recommed .title {
+  font-size: 16px;
+  color: #000;
+  flex: 1;
+  font-size: 600;
+}
+.searchpage .historys .details {
+  display: flex;
+  flex-wrap: wrap;
+}
+.searchpage .historys .details .item {
+  margin-right: 10px;
+  margin-top: 10px;
+}
+.searchpage .historys .details .arrow {
+  margin-right: 10px;
+  margin-top: 10px;
+  height: 37px;
+  display: flex;
+  width: 20px;
+  align-items: center;
+}
+.searchpage .search-content {
+  height: calc(100vh - 42px);
+  background: #f8f8f8;
+}
+.searchpage .recommed {
+  margin-top: 20px;
+}
+.searchpage .recommed .title {
+  margin-bottom: 10px;
+}
+</style>

pages/user-center/user-center.vue

@@ -124,7 +124,7 @@
 		},
 		onLoad() {
 		  this.navHeight = this.$navHeight - 2;
-		  this.u = wx.getStorageSync("userinfo");
+		  this.u = uni.getStorageSync("userinfo");
 		  if (!this.u) {
 		    this.u = {
 		      nickName: "未登录",
@@ -149,10 +149,10 @@
 			 
 			 let u = "/" + currentPages[currentPages.length - 1].route;
 			
-			 let pages = wx.getStorageSync("basedata")
-			   ? wx.getStorageSync("basedata").bar_title
+			 let pages = uni.getStorageSync("basedata")
+			   ? uni.getStorageSync("basedata").bar_title
 			   : [];
-			   console.log(wx.getStorageSync("basedata"))
+			   console.log(uni.getStorageSync("basedata"))
 			 pages.forEach((x) => {
 			   if (x.value == u) {
 			     this.pageTitle = x.new_name ? x.new_name : x.name;