1111

pages.json

@@ -36,6 +36,18 @@
 				"navigationStyle": "custom"
 			}
 		},
+		{
+			"path": "pages/search/index",
+			"style": {
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/loadingdetails/index",
+			"style": {
+				"navigationStyle": "custom"
+			}
+		},
 		{
 			"path": "pages/individual/index",
 			"style": {

pages/loadingdetails/index.vue

@@ -0,0 +1,229 @@
+<template>
+  <view class="app-content">
+    <view class="header"><view class="log" @tap="fall"></view>{{ navname }}<view class="up"></view></view>
+    <view class="navdetails">
+      <p>航班信息</p>
+      <span>{{ information }}</span>
+    </view>
+    <liu-goods-swiper  :goodsList="goodsList" :imgWidth="192" :imgHeight="152" @="chooseItem"></liu-goods-swiper>
+    <view class="content">
+      <view class="list" v-for="(item, index) in detailedTable" :key="index">
+        {{ item.name }}
+        <p>{{item.state == 0 ? '完好': '完好'}}</p>
+        <!-- <view class="listup"></view> -->
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+	import Nav from '../../components/header/nav.vue'
+	export default {
+		data() {
+			return {
+				navname: '装车详情',
+        action:0,
+        information: 'HU7410 CKG - CSX 离港',
+        goodsList:[
+          {
+            id: 1,
+            name: '拖车CKG3UCKRT00007',
+            descr: '10件',
+          },
+          {
+            id: 2,
+            name: '拖车CKG3UCKRT00007',
+            descr: '10件',
+          },
+          {
+            id: 3,
+            name: '拖车CKG3UCKRT00007',
+            descr: '10件',
+          },
+          {
+            id: 4,
+            name: '拖车CKG3UCKRT00007',
+            descr: '10件',
+          }
+        ],
+        detailedTable: [
+          {
+            name: '行李编号  3880324451111',
+            state: 0
+          },
+          {
+            name: '行李编号  3880324451111',
+            state: 0
+          },
+          {
+            name: '行李编号  3880324451111',
+            state: 0
+          },
+          {
+            name: '行李编号  3880324451111',
+            state: 0
+          },
+          {
+            name: '行李编号  3880324451111',
+            state: 1
+          }
+        ]
+			}
+		},
+		created(option) {
+		},
+		onLoad(){
+		},
+		onUnload() {
+		},
+		onShow() {
+		},
+		mounted() {
+		},
+		components: {
+			Nav
+		},
+		methods: {
+      lop(index) {
+        this.action = index
+      },
+			seach () {
+				uni.redirectTo({
+					url: "/pages/search/index"
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+.app-content{
+  >.header{
+    width: 100%;
+    height: 4.375rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    // background: rgba(49,85,99,1);
+    color: rgb(16, 17, 22);
+    font-family: Noto Sans SC;
+    font-size: 1rem;
+    position: relative;
+    >.log{
+      width: .375rem;
+      height: .75rem;
+      font-size: .75rem;
+      position: absolute;
+      left: 1.5rem;
+      background: url('../../static/ico@1x.png') no-repeat;
+      background-size: 100% 100%;
+    }
+    >.up{
+      width: .8456rem;
+      height: .8456rem;
+      position: absolute;
+      right: 1.5rem;
+      // background: url('../../static/search.png') no-repeat;
+      // background-size: 100% 100%;
+      // color: rgb(37, 121, 160);
+      // font-family: Noto Sans SC;
+      // font-size: .875rem;
+      // font-weight: 500;
+    }
+  }
+  >.navdetails{
+    width: 100%;
+    height: 5.1875rem;
+    display: flex;
+    flex-direction: column;
+    align-content: start;
+    justify-content: center;
+    padding: 0 1.5rem 0 1.5rem;
+    background: linear-gradient(180.00deg, rgba(49,85,99,1.00),rgba(25.37,45.98,53.94,1.00) 100%);
+    >p{
+      color: rgb(255, 255, 255);
+      font-family: Noto Sans SC;
+      font-size: 16px;
+      font-weight: 700;
+      margin-bottom: .25rem;
+    }
+    >span{
+      color: rgb(255, 255, 255);
+      font-family: Noto Sans SC;
+      font-size: 14px;
+      font-weight: 700;
+    }
+  }
+  >.select{
+    height: 5.1875rem;
+    >.list{
+      float: left;
+      width: 10rem;
+      height: 4.125rem;
+      box-sizing: border-box;
+      background: rgb(234, 241, 245);
+      border: 1px solid rgb(37, 121, 160);
+      box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.1);
+      border-radius:.125rem;
+    }
+  }
+  >.content{
+    margin-left: 1.5rem;
+    >.list{
+      height: 3.375rem;
+      display: flex;
+      align-items: center;
+      border-bottom: 1px solid rgb(238, 238, 238);
+      position: relative;
+      color: rgb(0, 0, 0);
+      font-family: Noto Sans SC;
+      font-size: 13px;
+      font-weight: 400;
+      >p{
+        color: rgb(50, 182, 117);
+        font-family: Noto Sans SC;
+        font-size: 13px;
+        font-weight: 700;
+        position: absolute;
+        right: 1.5rem;
+      }
+      // >.listup{
+      //   width: .25rem;
+      //   height: .5rem;
+      //   background: url('../../static/icos.png') no-repeat;
+      //   background-size: 100% 100%;
+      //   position: absolute;
+      //   right: 1.5rem;
+      // }
+    }
+    >.picturearea{
+      margin-top: 1.875rem;
+      >.name{
+        color: rgb(0, 0, 0);
+        font-family: Noto Sans SC;
+        font-size: .8125rem;
+        font-weight: 500;
+      }
+      >.content_list{
+        width: 100%;
+        display: flex;
+        margin-top: 1.25rem;
+        >.mg{
+          width: 5.5rem;
+          height: 5.5rem;
+          background: rgb(197, 207, 211);
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          margin-right: .625rem;
+          >.mg_lg{
+            width: 1.75rem;
+            height: 1.75rem;
+            background: url('../../static/shi.png') no-repeat;
+            background-size: 100% 100%;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

pages/mypage/index.vue

@@ -33,7 +33,7 @@
 				</view>
 			</view>
 			<view class="detail_type">
-				<view class="list_child">
+				<view class="list_child" @tap="recup">
 					<view class="log"></view>
 					<p>我的记录</p>
 				</view>
@@ -111,6 +111,11 @@
 			Nav
 		},
 		methods: {
+			recup () {
+				uni.redirectTo({
+					url: "/pages/myrecords/index"
+				})
+			},
 			fall () {
 				uni.switchTab({
 					url: "/pages/index/index"

pages/myrecords/index.vue

@@ -1,40 +1,13 @@
 <template>
   <view class="app-content">
-    <view class="header"><view class="log" @tap="fall"></view>{{ navname }}<view class="up"></view></view>
+    <view class="header"><view class="log" @tap="fall"></view>{{ navname }}<view class="up" @tap="seach"></view></view>
+    <view class="nav">
+      <view :class="action === index ? 'nav_lists': 'nav_list'" v-for="(item, index) in list" :key="index" @tap="lop(index)">{{item.name}}</view>
+    </view>
     <view class="content">
-      <view class="list">
-        <p>行李编号</p>
-        <input  class="input"  name="yonghuming"  type="text" value=""  placeholder-style="font-size:.8125rem;color:rgb(197, 197, 197);" placeholder="请输入行李编号" />
-      </view>
-      <view class="list">
-        <p>当前位置</p>
-        <input  class="input"  name="yonghuming"  type="text" value=""  placeholder-style="font-size:.8125rem;color:rgb(197, 197, 197);" placeholder="请输入当前位置" />
-      </view>
-      <view class="list">
-        <p>当前状态</p>
-        <input  class="input"  name="yonghuming"  type="text" value=""  placeholder-style="font-size:.8125rem;color:rgb(197, 197, 197);" placeholder="请输入当前状态" />
-      </view>
-      <view class="list">
-        <p>航班信息</p>
-        <input  class="input"  name="yonghuming"  type="text" value=""  placeholder-style="font-size:.8125rem;color:rgb(197, 197, 197);" placeholder="请输入航班信息" />
-      </view>
-      <view class="list">
-        <p>异常原因</p>
-        <input  class="input"  name="yonghuming"  type="text" value=""  placeholder-style="font-size:.8125rem;color:rgb(197, 197, 197);" placeholder="请输入异常原因" />
-      </view>
-      <view class="picturearea">
-        <view class="name">图片上传</view>
-        <view class="content_list">
-          <view class="mg">
-            <view class="mg_lg"></view>
-          </view>
-          <view class="mg">
-            <view class="mg_lg"></view>
-          </view>
-          <view class="mg">
-            <view class="mg_lg"></view>
-          </view>
-        </view>
+      <view class="list" v-for="(item, index) in detailedTable" :key="index">
+        {{ item.name }}
+        <view class="listup"></view>
       </view>
     </view>
   </view>
@@ -44,20 +17,36 @@
 	export default {
 		data() {
 			return {
-				isShow: true,
-				dataheight: '20.75rem',
-				scrollTop: 0,
-				old: {
-					scrollTop: 0
-				},
-				input: '',
-				main: null,
-				poll: null,
-				filter:null,
-				pusher:null,
-				intentServer:null,
-				arr: [],
 				navname: '我的记录',
+        action:0,
+        list: [{
+          name: '分拣'
+        },{
+          name: '装车'
+        },{
+          name: '上机'
+        },{
+          name: '卸机'
+        },{
+          name: '卸车'
+        }],
+        detailedTable: [
+          {
+            name: '离港：HU7410   CKG-CSX (113/171)'
+          },
+          {
+            name: '离港：HU7410   CKG-CSX (113/171)'
+          },
+          {
+            name: '离港：HU7410   CKG-CSX (113/171)'
+          },
+          {
+            name: '离港：HU7410   CKG-CSX (113/171)'
+          },
+          {
+            name: '离港：HU7410   CKG-CSX (113/171)'
+          }
+        ]
 			}
 		},
 		created(option) {
@@ -74,9 +63,12 @@
 			Nav
 		},
 		methods: {
-			fall () {
+      lop(index) {
+        this.action = index
+      },
+			seach () {
 				uni.redirectTo({
-					url: "/pages/sorting/index"
+					url: "/pages/search/index"
 				})
 			},
 		},
@@ -106,12 +98,38 @@
       background-size: 100% 100%;
     }
     >.up{
+      width: .8456rem;
+      height: .8456rem;
       position: absolute;
       right: 1.5rem;
+      background: url('../../static/search.png') no-repeat;
+      background-size: 100% 100%;
+      // color: rgb(37, 121, 160);
+      // font-family: Noto Sans SC;
+      // font-size: .875rem;
+      // font-weight: 500;
+    }
+  }
+  >.nav{
+    height: 2rem;
+    display: flex;
+    align-items: center;
+    padding: 0 .75rem 0 .75rem;
+    >.nav_list{
+      margin: 0 .75rem 0 .75rem;
+      color: rgb(16, 17, 22);
+      font-family: Noto Sans SC;
+      font-size: 14px;
+      height: 100%;
+    }
+    >.nav_lists{
+      margin: 0 .75rem 0 .75rem;
       color: rgb(37, 121, 160);
       font-family: Noto Sans SC;
-      font-size: .875rem;
-      font-weight: 500;
+      font-size: 14px;
+      font-size: 14px;
+      height: 100%;
+      border-bottom: 2px solid rgb(37, 121, 160);
     }
   }
   >.content{
@@ -121,13 +139,26 @@
       display: flex;
       align-items: center;
       border-bottom: 1px solid rgb(238, 238, 238);
+      position: relative;
+      color: rgb(0, 0, 0);
+      font-family: Noto Sans SC;
+      font-size: 13px;
+      font-weight: 400;
       >p{
         color: rgb(0, 0, 0);
         font-family: Noto Sans SC;
-        font-size: .8125rem;
-        font-weight: 500;
+        font-size: 13px;
+        font-weight: 400;
         margin-right: 2.1875rem;
       }
+      >.listup{
+        width: .25rem;
+        height: .5rem;
+        background: url('../../static/icos.png') no-repeat;
+        background-size: 100% 100%;
+        position: absolute;
+        right: 1.5rem;
+      }
     }
     >.picturearea{
       margin-top: 1.875rem;

pages/search/index.vue

@@ -0,0 +1,159 @@
+<template>
+  <view class="app-content">
+    <!-- <view class="header"><liu-search :hotList="hotList" @input="input" @change="change"></liu-search><view class="up"></view></view> -->
+    <liu-search :hotList="hotList" :historyList="historyList" @input="input" @change="change"></liu-search>
+  </view>
+</template>
+<script>
+	import Nav from '../../components/header/nav.vue'
+	export default {
+		data() {
+			return {
+				navname: '我的记录',
+        hotList: ['HU7410', 'HU7410', 'HU7410', 'HU7410', 'HU7410', 'HU7410', 'HU7410'],//热门搜索
+        historyList: ['HU7410','HU7410','HU7410','HU7410']
+			}
+		},
+		created(option) {
+		},
+		onLoad(){
+		},
+		onUnload() {
+		},
+		onShow() {
+		},
+		mounted() {
+		},
+		components: {
+			Nav
+		},
+		methods: {
+           //搜索内容
+    change(e) {
+      console.log('搜索内容：' + e)
+    },
+    //input事件
+    input(e){
+        console.log('搜索框输入的内容：' + e)
+    },
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+.app-content{
+  >.header{
+    width: 100%;
+    height: 4.375rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    // background: rgba(49,85,99,1);
+    color: rgb(16, 17, 22);
+    font-family: Noto Sans SC;
+    font-size: 1rem;
+    position: relative;
+    >.log{
+      width: .375rem;
+      height: .75rem;
+      font-size: .75rem;
+      position: absolute;
+      left: 1.5rem;
+      background: url('../../static/ico@1x.png') no-repeat;
+      background-size: 100% 100%;
+    }
+    >.up{
+      width: .8456rem;
+      height: .8456rem;
+      position: absolute;
+      right: 1.5rem;
+      background: url('../../static/search.png') no-repeat;
+      background-size: 100% 100%;
+      // color: rgb(37, 121, 160);
+      // font-family: Noto Sans SC;
+      // font-size: .875rem;
+      // font-weight: 500;
+    }
+  }
+  >.nav{
+    height: 2rem;
+    display: flex;
+    align-items: center;
+    padding: 0 .75rem 0 .75rem;
+    >.nav_list{
+      margin: 0 .75rem 0 .75rem;
+      color: rgb(16, 17, 22);
+      font-family: Noto Sans SC;
+      font-size: 14px;
+      height: 100%;
+    }
+    >.nav_lists{
+      margin: 0 .75rem 0 .75rem;
+      color: rgb(37, 121, 160);
+      font-family: Noto Sans SC;
+      font-size: 14px;
+      font-size: 14px;
+      height: 100%;
+      border-bottom: 2px solid rgb(37, 121, 160);
+    }
+  }
+  >.content{
+    margin-left: 1.5rem;
+    >.list{
+      height: 3.375rem;
+      display: flex;
+      align-items: center;
+      border-bottom: 1px solid rgb(238, 238, 238);
+      position: relative;
+      color: rgb(0, 0, 0);
+      font-family: Noto Sans SC;
+      font-size: 13px;
+      font-weight: 400;
+      >p{
+        color: rgb(0, 0, 0);
+        font-family: Noto Sans SC;
+        font-size: 13px;
+        font-weight: 400;
+        margin-right: 2.1875rem;
+      }
+      >.listup{
+        width: .25rem;
+        height: .5rem;
+        background: url('../../static/icos.png') no-repeat;
+        background-size: 100% 100%;
+        position: absolute;
+        right: 1.5rem;
+      }
+    }
+    >.picturearea{
+      margin-top: 1.875rem;
+      >.name{
+        color: rgb(0, 0, 0);
+        font-family: Noto Sans SC;
+        font-size: .8125rem;
+        font-weight: 500;
+      }
+      >.content_list{
+        width: 100%;
+        display: flex;
+        margin-top: 1.25rem;
+        >.mg{
+          width: 5.5rem;
+          height: 5.5rem;
+          background: rgb(197, 207, 211);
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          margin-right: .625rem;
+          >.mg_lg{
+            width: 1.75rem;
+            height: 1.75rem;
+            background: url('../../static/shi.png') no-repeat;
+            background-size: 100% 100%;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

uni_modules/liu-goods-swiper/changelog.md

@@ -0,0 +1,6 @@
+## 1.0.2（2023-04-14）
+增加示例
+## 1.0.1（2023-04-11）
+增加示例图片
+## 1.0.0（2023-03-31）
+初始发布

uni_modules/liu-goods-swiper/components/liu-goods-swiper/liu-goods-swiper.vue

@@ -0,0 +1,190 @@
+<template>
+	<view>
+		<view class="subtitle">{{listTitle}}</view>
+		<scroll-view scroll-x="true" class="scroll-box">
+			<view :class="action === index? 'item-box': 'item-boxs'" v-for="(item,index) in goodsList"
+				:key="index" @click="chooseItem(item,index)">
+				<!-- <image :src="item.icon" :style="'width:'+imgWidth+'rpx;'+'height:'+imgHeight+'rpx;'" mode=""></image> -->
+				<view class="item-name">{{item.name}}</view>
+				<view class="item-descr">{{item.descr}}</view>
+				<view class="item-isfi" v-if="action === index"></view>
+			</view>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			listTitle: {
+				type: String,
+				default: ''
+			},
+			goodsList: {
+				type: Array,
+				default: () => []
+			},
+			imgWidth: {
+				type: Number,
+				default: 128
+			},
+			imgHeight: {
+				type: Number,
+				default: 128
+			}
+		},
+		data() {
+			return {
+				action: 0
+			}
+		},
+		mounted() {},
+		methods: {
+			//点击某个item
+			chooseItem(item,index){
+				this.action = index
+				this.$emit("onClick", item)
+			}
+		}
+	}
+</script>
+
+<style>
+	::-webkit-scrollbar {
+		width: 0;
+		height: 0;
+		color: transparent;
+		display: none;
+	}
+</style>
+<style scoped>
+	.subtitle {
+		padding: 16rpx 32rpx;
+		font-size: 32rpx;
+		font-weight: bold;
+		color: #333333;
+		line-height: 48rpx;
+	}
+
+	.scroll-box {
+		display: flex;
+		white-space: nowrap;
+		width: 100%;
+		min-height: 5.1875rem;
+	}
+
+	.item-box {
+		display: inline-block;
+		width: 10rem;
+		height: 4.125rem;
+		padding: 16rpx;
+		margin-right: 8rpx;
+		border-radius: 12rpx;
+		border: 4rpx solid #FFFFFF;
+		box-shadow: 0px 4rpx 8rpx 0px rgba(0, 0, 0, 0.1);
+		text-align: center;
+		position: relative;
+		box-sizing: border-box;
+
+		background: rgb(234, 241, 245);
+		border: 1px solid rgb(37, 121, 160);
+		box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.1);
+		border-radius:
+		2px;
+		position: relative;
+	}
+
+	.item-boxs {
+		display: inline-block;
+		width: 10rem;
+		height: 4.125rem;
+		padding: 16rpx;
+		margin-right: 8rpx;
+		border-radius: 12rpx;
+		border: 4rpx solid #FFFFFF;
+		box-shadow: 0px 4rpx 8rpx 0px rgba(0, 0, 0, 0.1);
+		text-align: center;
+		position: relative;
+		box-sizing: border-box;
+    
+		background: rgb(255, 255, 255);
+    border: 1px solid rgb(239, 239, 239);
+		/* background: rgb(234, 241, 245);
+		border: 1px solid rgb(37, 121, 160);
+		box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.1);
+		border-radius:
+		2px; */
+		position: relative;
+	}
+
+	.item-name {
+		width: 100%;
+		font-weight: bold;
+		/* white-space: pre-wrap; */
+		color: rgb(16, 17, 22);
+		font-family: Noto Sans SC;
+		font-size: .8125rem;
+		font-weight: 700;
+		margin-top: 8rpx;
+		/* display: -webkit-box;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 1;
+		overflow: hidden; */
+		display: flex;
+	}
+	
+	.item-descr {
+		width: 100%;
+		line-height: 24rpx;
+		white-space: pre-wrap;
+		color: rgb(16, 17, 22);
+		font-family: Noto Sans SC;
+		font-size: 16px;
+		font-weight: 700;
+		margin-top: 12rpx;
+		display: -webkit-box;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 1;
+		overflow: hidden;
+		display: flex;
+		position: absolute;
+		bottom: .725rem;
+	}
+  .item-isfi{
+		width: 1rem;
+    height: 1rem;
+		background: url('../../../../static/radio.png') no-repeat;
+		background-size: 100% 100%;
+		position: absolute;
+		right: .625rem;
+		bottom: .625rem;
+
+	}
+	.bg0 {
+		background: linear-gradient(180deg, #FFE8C2 0%, #FFFFFF 100%);
+	}
+	
+	.bg1 {
+		background: linear-gradient(180deg, #D3DBFF 0%, #FFFFFF 100%);
+	}
+	
+	.bg2 {
+		background: linear-gradient(360deg, #FFFFFF 0%, #D7C4FF 100%);
+	}
+
+	.bg3 {
+		background: linear-gradient(180deg, #FFD3D3 0%, #FFFFFF 100%);
+	}
+
+	.bg4 {
+		background: linear-gradient(180deg, #D3FFFB 0%, #FFFFFF 100%);
+	}
+
+	.bg5 {
+		background: linear-gradient(180deg, #D3FFE7 0%, #FFFFFF 100%);
+	}
+
+	.bg6 {
+		background: linear-gradient(180deg, #FFD3FB 0%, #FFFFFF 100%);
+	}
+</style>

uni_modules/liu-goods-swiper/package.json

@@ -0,0 +1,85 @@
+{
+  "id": "liu-goods-swiper",
+  "displayName": "横向滑动、左右滑动商品列表模版",
+  "version": "1.0.2",
+  "description": "简单好用的左右滑动商品列表，支持各类样式自定义，简单易修改",
+  "keywords": [
+    "列表",
+    "商品",
+    "滑动",
+    "商品展示",
+    "分类"
+],
+  "repository": "",
+  "engines": {
+    "HBuilderX": "^3.1.0"
+  },
+  "dcloudext": {
+    "type": "component-vue",
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": "2364518038"
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": ""
+  },
+  "uni_modules": {
+    "dependencies": [],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "Vue": {
+          "vue2": "y",
+          "vue3": "u"
+        },
+        "App": {
+          "app-vue": "u",
+          "app-nvue": "u"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "u",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "u",
+          "百度": "u",
+          "字节跳动": "u",
+          "QQ": "u",
+          "钉钉": "u",
+          "快手": "u",
+          "飞书": "u",
+          "京东": "u"
+        },
+        "快应用": {
+          "华为": "u",
+          "联盟": "u"
+        }
+      }
+    }
+  }
+}

uni_modules/liu-goods-swiper/readme.md

@@ -0,0 +1,64 @@
+### liu-goods-swiper适用于uni-app项目的横向滑动、左右滑动商品列表模版
+### 本组件目前兼容微信小程序、H5
+### 本组件是简单好用的左右滑动商品列表，支持各类样式自定义，简单易修改
+### 如使用过程中有问题或有一些好的建议，欢迎qq联系：2364518038
+
+``` html
+<liu-goods-swiper :listTitle="listTitle" :goodsList="goodsList" :imgWidth="192" :imgHeight="152" @onClick="chooseItem"></liu-goods-swiper>
+```
+``` javascript
+export default {
+	data() {
+		return {
+			//列表标题
+			listTitle: '应季热销',
+			//列表数据
+			goodsList: [{
+				id: 1,
+				name: '大甜梨',
+				descr: '又大又甜又脆巨好吃',
+				icon: '/pagesB/static/fruit/img1.png'
+			},{
+				id: 2,
+				name: '猕猴桃',
+				descr: '口感甜酸、可口',
+				icon: '/pagesB/static/fruit/img2.png'
+			},{
+				id: 3,
+				name: '樱桃',
+				descr: '又大又甜水还多',
+				icon: '/pagesB/static/fruit/img3.png'
+			},{
+				id: 4,
+				name: '牛油果',
+				descr: '果肉柔软、细腻',
+				icon: '/pagesB/static/fruit/img4.png'
+			},{
+				id: 5,
+				name: '提子',
+				descr: '又大又甜水还多',
+				icon: '/pagesB/static/fruit/img5.png'
+			},{
+				id: 6,
+				name: '奶油草莓',
+				descr: '酸酸甜甜很好吃',
+				icon: '/pagesB/static/fruit/img6.png'
+			}]
+		};
+	},
+	methods: {
+		//点击某一个item
+		chooseItem(item){
+			// 点击拿到整个当前点击的item 执行业务逻辑 
+		}
+	}
+}
+```
+
+### 属性说明
+| 名称                         | 类型            | 默认值               | 描述            |
+| ----------------------------|--------------- | -------------------- | ---------------|
+| goodsList             			| Array          | []             			| 列表数据
+| listTitle            				| String         | ''           				| 默认卡片标题
+| imgWidth              			| Number         | 128(rpx)            	| 图片宽度
+| imgHeight              			| Number         | 128(rpx)            	| 图片高度

uni_modules/liu-search/changelog.md

@@ -0,0 +1,6 @@
+## 1.0.2（2023-04-15）
+增加历史搜索单个删除功能
+## 1.0.1（2023-04-14）
+增加示例
+## 1.0.0（2023-03-31）
+初始发布

uni_modules/liu-search/components/liu-search/liu-search.vue

@@ -0,0 +1,257 @@
+<template>
+	<view class="page-main">
+		<view class="search-header">
+			<image class="search-img" :src="searchImg"></image>
+			<input class="search-input" :placeholder="placeholder" type="text" v-model.trim="searchText"
+				@confirm="confirmSearch" @input="inputSearch" placeholder-class="placeholder-name" />
+			<view class="search-name" @click="confirmSearch">搜索</view>
+		</view>
+		<view class="search-history" v-if="historyList.length">
+			<view class="history-title">
+				<view class="title-name">搜索历史</view>
+				<view class="history-delete" v-if="isDelete">
+					<view class="delete-all" @click="deleteAll">全部删除</view>
+					<view class="delete-line"></view>
+					<view class="delete-complete" @click="deleteHistory">完成</view>
+				</view>
+				<image v-else class="title-img" :src="deleteImg" @click="deleteHistory"></image>
+			</view>
+			<view class="history-list">
+				<view class="history-name" :style="isDelete?'padding:0 32rpx 0 16rpx;':''"
+					v-for="(item,index) in historyList" :key="index" @click="clickHis(item,index)">
+					{{item}}
+					<span class="delete-icon" v-if="isDelete">x</span>
+				</view>
+			</view>
+		</view>
+		<view class="search-history" v-if="hotList.length">
+			<view class="history-title">
+				<view class="title-name">热门搜索</view>
+				<image class="title-img" :src="seeMore?seeImg:noSeeImg" @click="seeMore=!seeMore"></image>
+			</view>
+			<view class="history-list" v-if="seeMore">
+				<view class="history-name" v-for="(item,index) in hotList" :key="index" @click="clickHis(item)">
+					{{item}}
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+	import see from '../../static/see.png'
+	import nosee from '../../static/nosee.png'
+	import deleteSrc from '../../static/delete.png'
+	import searchSrc from '../../static/search.png'
+	export default {
+		props: {
+			//输入框placeholder
+			placeholder: {
+				type: String,
+				default: '请输入',
+			},
+			//热门搜索
+			hotList: {
+				type: Array,
+				default () {
+					return []
+				}
+			},
+		},
+		data() {
+			return {
+				seeImg: '',
+				noSeeImg: '',
+				deleteImg: '',
+				searchImg: '',
+				historyList: [],
+				searchText: '', //搜索内容
+				seeMore: true,
+				isDelete: false
+			}
+		},
+		mounted() {
+			this.seeImg = see
+			this.noSeeImg = nosee
+			this.deleteImg = deleteSrc
+			this.searchImg = searchSrc
+			this.historyList = uni.getStorageSync('liu-search-name-list') || []
+		},
+		methods: {
+			//删除历史或者完成
+			deleteHistory() {
+				this.isDelete = !this.isDelete
+			},
+			//全部删除
+			deleteAll() {
+				uni.setStorageSync('liu-search-name-list', '')
+				this.historyList = []
+			},
+			//点击热门搜索
+			clickHis(name, index) {
+				if (this.isDelete) {
+					this.historyList.splice(index, 1)
+					uni.setStorageSync('liu-search-name-list', this.historyList)
+				} else {
+					this.searchText = name
+					this.confirmSearch()
+				}
+			},
+			//搜索框输入事件
+			inputSearch() {
+				this.$emit('input', this.searchText)
+			},
+			//搜索
+			confirmSearch() {
+				let oldList = uni.getStorageSync('liu-search-name-list') || []
+				let hasName = false
+				oldList.forEach(res => {
+					if (res == this.searchText) hasName = true
+				})
+				if (!hasName && this.searchText) {
+					oldList.push(this.searchText)
+					uni.setStorageSync('liu-search-name-list', oldList)
+					this.historyList = uni.getStorageSync('liu-search-name-list') || []
+				}
+				this.$emit('change', this.searchText)
+			}
+		}
+	}
+</script>
+<style lang="scss" scoped>
+	page {
+		background-color: #f8f8f8;
+	}
+
+	.page-main {
+		width: 100%;
+		height: 100vh;
+		display: inline-block;
+
+		.search-header {
+			width: calc(100%-64rpx);
+			padding: 0 32rpx;
+			height: 112rpx;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			position: relative;
+
+			.search-img {
+				position: absolute;
+				left: 64rpx;
+				width: 32rpx;
+				height: 32rpx;
+			}
+
+			.search-input {
+				padding: 0 32rpx 0 76rpx;
+				width: calc(90% - 108rpx);
+				height: 1.875rem;
+				line-height: 1.875rem;
+				background-color: #F2F3F5;
+				border: solid #e4e4e5 1rpx;
+				border-radius: .25rem;
+				font-size: 30rpx;
+				color: #666666;
+				background: rgb(234, 241, 245);
+			}
+
+			.placeholder-name {
+				font-size: 30rpx;
+				color: #999999;
+			}
+
+			.search-name {
+				width: 80rpx;
+				text-align: right;
+				font-size: 30rpx;
+				color: #666666;
+			}
+		}
+
+		.search-history {
+			padding: 0 20rpx;
+			margin-top: 24rpx;
+
+			.history-title {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+
+				.title-name {
+					font-size: 30rpx;
+					color: #666666;
+					font-weight: bold;
+					margin-left: 12rpx;
+				}
+
+				.title-img {
+					width: 34rpx;
+					height: 34rpx;
+					margin-right: 12rpx;
+				}
+
+				.history-delete {
+					height: auto;
+					display: flex;
+					align-items: center;
+					justify-content: flex-end;
+
+					.delete-all {
+						font-size: 26rpx;
+						color: #666666;
+					}
+
+					.delete-line {
+						width: 1px;
+						height: 20rpx;
+						background-color: #999999;
+						margin: 0 12rpx;
+					}
+
+					.delete-complete {
+						font-size: 26rpx;
+						color: #F71E1E;
+					}
+				}
+			}
+
+			.history-list {
+				width: 100%;
+				display: flex;
+				align-items: flex-start;
+				justify-content: flex-start;
+				flex-wrap: wrap;
+				padding: 12rpx 0;
+
+				.history-name {
+					height: 48rpx;
+					line-height: 48rpx;
+					padding: 0 24rpx;
+					background-color: #FFFFFF;
+					border-radius: 25rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					margin: 10rpx 12rpx;
+					font-size: 26rpx;
+					color: #666666;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					display: -webkit-box;
+					-webkit-box-orient: vertical;
+					-webkit-line-clamp: 1; //控制显示的行数
+					position: relative;
+
+					.delete-icon {
+						position: absolute;
+						font-size: 26rpx;
+						color: #e4e4e5;
+						right: 12rpx;
+						bottom: 2rpx;
+					}
+				}
+			}
+		}
+	}
+</style>

uni_modules/liu-search/package.json

@@ -0,0 +1,85 @@
+{
+  "id": "liu-search",
+  "displayName": "搜索模版",
+  "version": "1.0.2",
+  "description": "简单好用的搜索模版，自带历史搜索、热门搜索，历史搜索自带缓存，源码简单易修改",
+  "keywords": [
+    "搜索",
+    "搜索页面",
+    "搜索模版",
+    "search",
+    "搜索历史"
+],
+  "repository": "",
+  "engines": {
+    "HBuilderX": "^3.1.0"
+  },
+  "dcloudext": {
+    "type": "component-vue",
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": ""
+  },
+  "uni_modules": {
+    "dependencies": [],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "Vue": {
+          "vue2": "y",
+          "vue3": "u"
+        },
+        "App": {
+          "app-vue": "u",
+          "app-nvue": "u"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "u",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "u",
+          "百度": "u",
+          "字节跳动": "u",
+          "QQ": "u",
+          "钉钉": "u",
+          "快手": "u",
+          "飞书": "u",
+          "京东": "u"
+        },
+        "快应用": {
+          "华为": "u",
+          "联盟": "u"
+        }
+      }
+    }
+  }
+}

uni_modules/liu-search/readme.md

@@ -0,0 +1,37 @@
+### liu-search适用于uni-app项目的搜索模版
+### 本组件目前兼容微信小程序、H5
+### 本组件是简单好用的搜索模版，自带历史搜索、热门搜索，历史搜索自带缓存，源码简单易修改
+### 如使用过程中有问题或有一些好的建议，欢迎qq联系：2364518038
+
+### 使用方式
+``` html
+<liu-search :hotList="hotList" @input="input" @change="change"></liu-search>
+```
+``` javascript
+export default {
+	data() {
+		return {
+			hotList: ['白酒', '苹果醋', '红酒', '笔记本', '洗衣液', '平板电脑', '电视机'],//热门搜索
+		};
+	},
+	methods: {
+		//搜索内容
+		change(e) {
+			console.log('搜索内容：' + e)
+		},
+		//input事件
+		input(e){
+			console.log('搜索框输入的内容：' + e)
+		}
+	}
+}
+```
+
+### 属性说明
+| 名称                         | 类型           | 默认值                  | 描述             |
+| ----------------------------|--------------- | ---------------------- | ---------------|
+| hotList                     | Array          | []                     | 热门搜索数据
+| placeholder                 | String         | '请输入'                | 输入框placeholder
+
+
+