商城列表

app.json

@@ -7,11 +7,13 @@
     {
       "root": "packageA",
       "pages": [
-        "market/index"
+        "market/index",
+        "market/detail"
       ]
     }
   ],
   "usingComponents": {
+    "Yl_Empty": "/components/Yl_Empty/index",
     "Yl_Filtrate": "/components/Yl_Filtrate/index",
     "Yl_FloatingButton": "/components/Yl_FloatingButton/index",
     "Yl_FunTabs": "/components/Yl_FunTabs/index",
@@ -26,6 +28,7 @@
     "van-checkbox": "@vant/weapp/checkbox/index",
     "van-checkbox-group": "@vant/weapp/checkbox-group/index",
     "van-image": "@vant/weapp/image/index",
+    "van-loading": "@vant/weapp/loading/index",
     "van-icon": "@vant/weapp/icon/index",
     "van-tab": "@vant/weapp/tab/index",
     "van-tabs": "@vant/weapp/tabs/index",

components/Yl_Empty/index.js

@@ -0,0 +1,42 @@
+// components/My_empty/index.js
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        text: {
+            type: String,
+            value: "暂无数据"
+        },
+        marTop: {
+            type: String,
+            value: "150rpx"
+        },
+        sonMarTop: {
+            type: String,
+            value: "20"
+        },
+        icon: {
+            type: String,
+            value: 'icon-zanwushuju'
+        }
+    },
+
+    options: {
+        addGlobalClass: true
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+
+    }
+})

components/Yl_Empty/index.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

components/Yl_Empty/index.scss

@@ -0,0 +1,9 @@
+.empty {
+    width: 100vw;
+    text-align: center;
+    color: #BBBBBB;
+
+    .i-1597 {
+        font-size: 150rpx;
+    }
+}

components/Yl_Empty/index.wxml

@@ -0,0 +1,4 @@
+<view class="empty" style="margin-top: {{marTop}};">
+    <view class="iconfont {{icon}} i-1597"></view>
+    <view style="margin-top: {{sonMarTop}}rpx;">{{text}}</view>
+</view>

packageA/market/detail.js

@@ -0,0 +1,13 @@
+const _Http = getApp().globalData.http;
+
+Page({
+  data: {
+
+  },
+  onLoad(options) {
+
+  },
+  onReady() {
+
+  }
+})

packageA/market/detail.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

packageA/market/detail.scss

@@ -0,0 +1 @@
+/* packageA/market/detail.wxss */

packageA/market/detail.wxml

@@ -0,0 +1,2 @@
+<!--packageA/market/detail.wxml-->
+<text>packageA/market/detail.wxml</text>

packageA/market/detail.wxss

@@ -0,0 +1 @@
+/* packageA/market/detail.wxss */

packageA/market/index.js

@@ -1,140 +1,92 @@
 const _Http = getApp().globalData.http;
 
 Page({
-    data: {
-        classShow: false,
-        classActions: [{
-                name: '全部',
-                index: 0
-            }, {
-                name: '我负责的',
-                index: 1
-            },
-            {
-                name: '我参与的',
-                index: 2
-            },
-            {
-                name: "我下属负责的",
-                index: 3
-            }, {
-                name: "我下属参与的",
-                index: 4
-            }
-        ],
-        content: {
-            nocache: true,
-            "type": 0,
-            "pageNumber": 1,
-            "pageSize": 20,
-            "where": {
-                "condition": "", //模糊搜索
-            },
-            "sort": []
-        }
-    },
-    onLoad(options) {
-        this.getList();
-    },
-    /* 获取列表 */
-    getList(init = false) {
-        if (init.detail != undefined) init = init.detail;
-        let content = this.data.content;
-        if (init) content.pageNumber = 1;
-        if (content.pageNumber > content.pageTotal) return;
-        _Http.basic({
-            "id": 20221020143502,
-            content
-        }).then(res => {
-            console.log("客户商机列表", res)
-            this.selectComponent('#ListBox').RefreshToComplete();
-            if (res.msg != '成功') return wx.showToast({
-                title: res.data,
-                icon: "none"
-            })
-            this.setData({
-                'content.pageNumber': res.pageNumber + 1,
-                'content.pageTotal': res.pageTotal,
-                'content.total': res.total,
-                'content.sort': res.sort,
-                list: res.pageNumber == 1 ? res.data : this.data.list.concat(res.data)
-            });
-            this.getTags();
-        })
-    },
-    /* 获取列表标签 */
-    getTags() {
-        let list = this.data.list,
-            ownerids = list.map(v => v.sa_projectid);
-        _Http.basic({
-            "id": 20221018102001,
-            "content": {
-                nocache: true,
-                "ownertable": "sa_project",
-                ownerids
-            }
-        }).then(res => {
-            console.log("标签", res)
-            for (let key in res.data) {
-                let index = list.findIndex(v => v.sa_projectid == key);
-                list[index].tags = res.data[key]
-            };
-            console.log(list)
-            this.setData({
-                list
-            })
-        })
-    },
-    /* 处理筛选 */
-    handleFilter({
-        detail
-    }) {
-        console.log(detail)
-    },
-    /* 处理搜索 */
-    onSearch({
-        detail
-    }) {
-        this.setData({
-            "content.where.condition": detail
-        });
-        this.getList(true);
-    },
-    /* 顶部条件导航回调 */
-    navClick({
-        detail
-    }) {
-        switch (detail.id) {
-            case '1':
-                this.setData({
-                    classShow: true
-                })
-                break;
-        }
-    },
-    /* 选择分类 */
-    classSelect({
-        detail
-    }) {
-        if (this.data.content.type == detail.index) return this.classClose();
-        this.setData({
-            "content.type": detail.index,
-            'navList[0].label': detail.name
-        })
-        this.classClose();
-        this.getList(true)
-    },
-    classClose() {
-        this.setData({
-            classShow: false
-        })
-    },
-    onReady() {
-        this.setListHeight()
-    },
-    /* 设置页面高度 */
-    setListHeight() {
-        this.selectComponent("#ListBox").setHeight(".total", this);
-    },
-    onShareAppMessage() {}
+	data: {
+		"content": {
+			"brandids": [1],
+			"itemclassids": [1],
+			"pageNumber": 1,
+			"pageTotal": 1,
+			"where": {
+				"condition": ""
+			}
+		},
+	},
+	getList(init) {
+		if (init.detail != undefined) init = init.detail;
+		let content = this.data.content;
+		if (init) content.pageNumber = 1;
+		if (content.pageNumber > content.pageTotal) return;
+		_Http.basic({
+			"id": 20220924163802,
+			content
+		}).then(res => {
+			this.selectComponent('#ListBox').RefreshToComplete();
+			console.log("商品列表", res)
+		})
+	},
+
+	onInput(e) {
+		this.setData({
+			"content.where.condition": e.detail.value
+		})
+	},
+	onClear() {
+		this.setData({
+			"content.where.condition": ""
+		})
+	},
+
+	onLoad(options) {
+	},
+
+	onReady() {
+		this.setListHeight()
+	},
+	/* 设置页面高度 */
+	setListHeight() {
+		this.selectComponent("#ListBox").setHeight(".head", this);
+	},
+
+	/**
+	 * 生命周期函数--监听页面显示
+	 */
+	onShow() {
+
+	},
+
+	/**
+	 * 生命周期函数--监听页面隐藏
+	 */
+	onHide() {
+
+	},
+
+	/**
+	 * 生命周期函数--监听页面卸载
+	 */
+	onUnload() {
+
+	},
+
+	/**
+	 * 页面相关事件处理函数--监听用户下拉动作
+	 */
+	onPullDownRefresh() {
+
+	},
+
+	/**
+	 * 页面上拉触底事件的处理函数
+	 */
+	onReachBottom() {
+
+	},
+
+	/**
+	 * 用户点击右上角分享
+	 */
+	onShareAppMessage() {
+
+	}
 })

packageA/market/index.json

@@ -1,3 +1,5 @@
 {
-  "usingComponents": {}
+  "usingComponents": {
+    "List":"./modules/list/index"
+  }
 }

packageA/market/index.scss

@@ -0,0 +1,48 @@
+.head {
+	display: flex;
+	height: 100rpx;
+	width: 100vw;
+	background-color: #fff;
+	box-sizing: border-box;
+	padding: 20rpx 0 20rpx 30rpx;
+
+	.search {
+		display: flex;
+		align-items: center;
+		font-size: 28rpx;
+		width: 438rpx;
+		height: 58rpx;
+		border-radius: 29rpx;
+		background: #F4F5F7;
+		color: #BBBBBB;
+		overflow: hidden;
+		margin-right: 10rpx;
+
+		.input {
+			color: #333;
+		}
+
+		navigator {
+			display: flex;
+			height: 100%;
+			align-items: center;
+			padding-left: 10rpx;
+			padding-right: 15rpx;
+		}
+	}
+
+	>navigator {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 130rpx;
+		height: 100%;
+		font-size: 28rpx;
+		color: #666666;
+
+		>text {
+			margin-right: 6rpx;
+		}
+	}
+}
+

packageA/market/index.wxml

@@ -1,13 +1,14 @@
-<Yl_HeadNav search sort='{{content.sort}}' bind:onClick='navClick' bindonSearch="onSearch" />
-<!-- 显示类型 -->
-<van-action-sheet show="{{ classShow }}" actions="{{ classActions }}" cancel-text="取消" bind:cancel="classClose" bind:click-overlay='classClose' bind:cancel="classClose" bind:select="classSelect" />
-<view class="total">共{{content.total}}个</view>
+<!-- 骨架屏 -->
+<view class="head">
+	<view class="search">
+		<view class="iconfont icon-a-sousuolansousuo" style="padding-left:20rpx;margin-right: 10rpx;" />
+		<input class="input" value="{{content.where.condition}}" bindinput="onInput" type="text" placeholder="搜索商品" style="flex: 1;" />
+		<navigator wx:if="{{content.where.condition}}" bindtap="onClear" url="#" class="iconfont icon-quxiao" />
+	</view>
+	<navigator url="#" class="but"><text class="iconfont icon-shengxu"></text>排序</navigator>
+	<navigator url="#" class="but"><text class="iconfont icon-shaixuan"></text>筛选</navigator>
+</view>
 
-<Yl_ListBox id='ListBox' height="{{listHeight}}" bind:getlist='getList'>
-    <List list='{{list}}' />
-</Yl_ListBox>
-
-<!-- 筛选条件 -->
-<Yl_Filtrate id='Filtrate' bind:handle="handleFilter" />
-<!-- 浮动按钮 -->
-<Yl_FloatingButton wx:if="{{insert}}" bindtap="toAdd" />
+<Yl_ListBox id='ListBox' bind:getlist='getList'>
+	<List />
+</Yl_ListBox>

packageA/market/modules/list/index.js

@@ -0,0 +1,5 @@
+Component({
+  properties: {
+    list: Array
+  }
+})

packageA/market/modules/list/index.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

packageA/market/modules/list/index.scss

@@ -0,0 +1,85 @@
+.product {
+	display: flex;
+	width: 100vw;
+	padding: 20rpx 30rpx;
+	background: #fff;
+	border-bottom: 1rpx solid #ddd;
+	box-sizing: border-box;
+	overflow: hidden;
+
+	.image-box {
+		font-size: 0;
+		width: 176rpx;
+		height: 176rpx;
+		border-radius: 16rpx;
+		overflow: hidden;
+		margin-right: 30rpx;
+		flex-shrink: 0;
+	}
+
+	.right-box {
+		width: 480rpx;
+
+		.title {
+			height: 40rpx;
+			line-height: 40rpx;
+			font-size: 28rpx;
+			font-weight: 600;
+			color: #333333;
+		}
+
+		.type {
+			height: 34rpx;
+			line-height: 34rpx;
+			font-size: 24rpx;
+			color: #888888;
+			margin-top: 8rpx;
+		}
+
+		.tags {
+			display: flex;
+			height: 32rpx;
+			margin-top: 8rpx;
+			width: 100%;
+
+			>view {
+				flex-shrink: 0;
+				height: 32rpx;
+				line-height: 32rpx;
+				padding: 0 10rpx;
+				font-size: 20rpx;
+				color: #FFFFFF;
+				margin-right: 8rpx;
+				border-radius: 6rpx;
+			}
+		}
+
+		.price {
+			display: flex;
+			width: 100%;
+			height: 40rpx;
+			align-items: center;
+			justify-content: space-between;
+			margin-top: 14rpx;
+
+			view {
+				font-size: 28rpx;
+				font-family: PingFang SC-Medium, PingFang SC;
+				font-weight: 550;
+				color: #3874F6;
+			}
+
+			text {
+				font-size: 24rpx;
+				color: #888888;
+			}
+		}
+	}
+}
+
+.line-1 {
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	word-break: break-all;
+}

packageA/market/modules/list/index.wxml

@@ -0,0 +1,31 @@
+<navigator class="product" url="/packageA/market/detail" wx:for="{{5}}" wx:key="index">
+	<view class="image-box">
+		<van-image width="100%" height="100%" fit="cover" src="https://img.yzcdn.cn/vant/cat.jpeg" use-loading-slot use-error-slot lazy-load>
+			<van-loading slot="loading" type="spinner" size="20" vertical />
+			<text slot="error">加载失败</text>
+		</van-image>
+	</view>
+	<view class="right-box">
+		<view class="title line-1">煞风景撒化肥的萨达萨达阿斯蒂芬阿斯蒂芬奥斯蒂芬萨达asdf23423423lkj4ho2i34j2io3423o423423uihb</view>
+		<view class="type line-1">煞风景撒化肥的萨达萨达阿斯蒂芬阿斯蒂芬奥斯蒂芬萨达asdf23423423lkj4ho2i34j2io3423o423423uihb</view>
+		<view class="tags">
+			<view style="background: #FF3B30;">
+				欧标
+			</view>
+			<view style="background: #FA8C16;">
+				班尼戈
+			</view>
+		</view>
+		<view class="price">
+			<view>
+				￥ 1100.00~2356.12
+			</view>
+			<text>× 根</text>
+		</view>
+	</view>
+</navigator>
+
+
+
+
+<!-- <Yl_Empty /> -->

project.private.config.json

@@ -9,6 +9,13 @@
   "condition": {
     "miniprogram": {
       "list": [
+        {
+          "name": "商城",
+          "pathName": "packageA/market/index",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
+        },
         {
           "name": "商城",
           "pathName": "packageA/market/index",