公共产品选择

app.js

@@ -6,5 +6,7 @@ App({
 	onLaunch() {},
 	globalData: {
 		http: new ApiModel(), //接口文件
+		handleSelect: null, //处理选择结果  函数
+		savePage: null, //保存页面实例
 	}
 })

app.json

@@ -14,8 +14,23 @@
         "orderForm/detail",
         "orderForm/add"
       ]
+    },
+    {
+      "root": "select",
+      "pages": [
+        "product/index"
+      ]
     }
   ],
+  "preloadRule": {
+    "pages/home/index": {
+      "packages": [
+        "packageA",
+        "select"
+      ],
+      "network": "all"
+    }
+  },
   "usingComponents": {
     "Yl_Empty": "/components/Yl_Empty/index",
     "Yl_Filtrate": "/components/Yl_Filtrate/index",
@@ -38,14 +53,6 @@
     "van-tabs": "@vant/weapp/tabs/index",
     "van-search": "@vant/weapp/search/index"
   },
-  "preloadRule": {
-    "pages/home/index": {
-      "packages": [
-        "packageA"
-      ],
-      "network": "all"
-    }
-  },
   "window": {
     "backgroundTextStyle": "light",
     "navigationBarBackgroundColor": "#085CDF",

select/product/index.js

@@ -0,0 +1,138 @@
+const _Http = getApp().globalData.http,
+	file = require("../../utils/FormatTheAttachment");
+
+Page({
+	data: {
+		loading: true,
+		params: {}, //请求体
+		result: [], //返回结果
+		radio: false, //是否为单选
+		idname: "itemid", //idkey
+		showName: "itemname"
+	},
+	onLoad(options) {
+		if (options.item) {
+			let item = JSON.parse(options.item);
+			this.setData({
+				item,
+				params: item.params
+			});
+		}
+		if (options.params) this.setData({
+			params: JSON.parse(options.params)
+		});
+		this.setData({
+			radio: options.radio ? true : false,
+			idname: options.idname || this.data.idname,
+			showName: options.showName || this.data.showName,
+		});
+		this.getList()
+	},
+	getList(init = false) {
+		//init 用于初始化分页
+		if (init.detail != undefined) init = init.detail;
+		let params = this.data.params;
+		if (init) params.content.pageNumber = 1
+		if (params.content.pageNumber > params.content.pageTotal) return;
+
+		_Http.basic(params).then(res => {
+			console.log("选择产品列表", res)
+			this.selectComponent('#ListBox').RefreshToComplete();
+			if (res.msg != '成功') return wx.showToast({
+				title: res.data,
+				icon: "none"
+			})
+			res.data = res.data.map(value => {
+				if (value.attinfos.length == 0) return value;
+				value.attinfos = file.fileList(value.attinfos)
+				let image = value.attinfos.find(v => v.fileType == "image");
+				value.cover = image ? image.cover : "";
+				return value;
+			})
+
+			this.setData({
+				'params.content.pageNumber': res.pageNumber + 1,
+				'params.content.pageTotal': res.pageTotal,
+				'params.content.total': res.total,
+				list: res.pageNumber == 1 ? res.data : this.data.list.concat(res.data),
+				loading: false
+			})
+		})
+	},
+	/* 选中 */
+	changeResult(e) {
+		let {
+			id
+		} = e.currentTarget.dataset, result = this.data.result;
+		if (this.data.radio) {
+			result = [id];
+		} else {
+			result.some(v => v == id) ? result = result.filter(v => v != id) : result.push(id)
+		}
+		this.setData({
+			result
+		});
+		if (this.data.radio) this.submit();
+	},
+	/* 提交 */
+	submit() {
+		let result = this.data.result,
+			obj = this.data.radio ? {
+				id: result,
+				item: this.data.list.find(value => value[this.data.idname] == result),
+				value: [this.data.list.find(value => value[this.data.idname] == result), result]
+			} : {
+				result,
+				list: result.map(v => this.data.list.find(value => value[this.data.idname] == v)),
+				value: [result.map(v => {
+					let data = this.data.list.find(value => value[this.data.idname] == v);
+					return data ? data[this.data.showName] : ""
+				}), result]
+			}
+		getApp().globalData.handleSelect && getApp().globalData.handleSelect(obj)
+	},
+	/* 预览图片 */
+	viewImage(e) {
+		const {
+			file
+		} = e.currentTarget.dataset;
+		if (file.length) wx.previewMedia({
+			sources: file.filter(value => ['image', 'vadio'].includes(value.fileType)).map(v => {
+				return {
+					url: v.url,
+					type: v.fileType
+				}
+			}),
+			current: 0,
+			showmenu: true
+		})
+	},
+	/* 开始搜索 */
+	startSearch({
+		detail
+	}) {
+		let condition = this.data.content ? this.data.content.where.condition : this.data.params.content.where.condition;
+		if (detail == condition) return;
+		this.setData({
+			'content.where.condition': detail,
+			'params.content.where.condition': detail
+		});
+		this.getList(true);
+	},
+	/* 取消搜索 */
+	onClear() {
+		this.setData({
+			'content.where.condition': "",
+			'params.content.where.condition': ""
+		});
+		this.getList(true);
+	},
+	onReady() {
+		this.selectComponent("#ListBox").setHeight(".total", this);
+	},
+	onUnload() {
+		//回收数据
+		getApp().globalData.handleSelect = null;
+		getApp().globalData.savePage = null;
+	}
+})

select/product/index.json

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

select/product/index.scss

@@ -0,0 +1,145 @@
+@import "./index.skeleton.wxss";
+page {
+	height: 100vh;
+	overflow: hidden;
+}
+
+.total {
+	height: 60rpx;
+	line-height: 60rpx;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	color: #666666;
+	padding-left: 30rpx;
+}
+
+.setclient-list-item {
+	width: 100vw;
+	padding: 0 30rpx;
+	background-color: #FFFFFF;
+	box-sizing: border-box;
+	border-bottom: 1rpx solid #DDDDDD;
+	margin-bottom: 20rpx;
+
+	.mian {
+		display: flex;
+		align-items: center;
+		width: 100%;
+		border-bottom: 1rpx solid #DDDDDD;
+		box-sizing: border-box;
+		padding: 20rpx 0;
+
+		.img {
+			flex-shrink: 0;
+			width: 128rpx;
+			height: 128rpx;
+			border-radius: 16rpx;
+			margin-right: 30rpx;
+			overflow: hidden;
+
+			.err {
+				display: flex;
+				width: 100%;
+				height: 100%;
+				align-items: center;
+				justify-content: center;
+				font-size: 22rpx;
+				border: 1px solid #ddd;
+				box-sizing: border-box;
+				color: #666;
+			}
+		}
+
+		.dec {
+			flex: 1;
+			width: 0;
+			min-height: 128rpx;
+			height: 100%;
+			font-size: 24rpx;
+			font-family: PingFang SC-Regular, PingFang SC;
+			color: #999999;
+
+			.title {
+				height: 40rpx;
+				line-height: 40rpx;
+				font-size: 28rpx;
+				font-family: PingFang SC-Semibold, PingFang SC;
+				font-weight: 600;
+				color: #333333;
+			}
+
+			.subfield {
+				margin-top: 6rpx;
+				height: 34rpx;
+				line-height: 34rpx;
+
+
+				text {
+					display: inline-block;
+					max-width: 250rpx;
+					min-width: 150rpx;
+				}
+			}
+
+			.price {
+				height: 40rpx;
+				line-height: 40rpx;
+				margin-top: 8rpx;
+
+				.num {
+					font-size: 28rpx;
+					color: #FF3B30;
+					font-weight: 600;
+				}
+
+				text {
+					color: #333333;
+				}
+			}
+		}
+	}
+
+	.bot {
+		font-size: 24rpx;
+		font-family: PingFang SC-Regular, PingFang SC;
+		color: #999999;
+		height: 72rpx;
+		line-height: 72rpx;
+
+		text {
+			display: inline-block;
+			width: 50%;
+		}
+	}
+}
+
+.footer {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: 0 30rpx;
+	position: fixed;
+	width: 100vw;
+	height: 130rpx;
+	background: #FFFFFF;
+	box-shadow: 0px -4rpx 16rpx 2rpx rgba(150, 157, 165, 0.16);
+	bottom: 0;
+	box-sizing: border-box;
+
+	.count {
+		font-size: 28rpx;
+		font-family: PingFang SC-Regular, PingFang SC;
+		color: #333333;
+	}
+
+	.but {
+		width: 156rpx;
+		height: 90rpx;
+		background: #3874F6;
+		border-radius: 8rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC-Bold, PingFang SC;
+		font-weight: bold;
+		color: #FFFFFF;
+	}
+}

select/product/index.skeleton.wxml

@@ -0,0 +1,248 @@
+<!--
+此文件为开发者工具生成，生成时间: 2023/1/2下午1:51:52
+使用方法：
+在 E:\云链项目\e-wechat\select\product\index.wxml 引入模板
+
+```
+<import src="index.skeleton.wxml"/>
+<template is="skeleton" wx:if="{{loading}}" />
+```
+
+在 E:\云链项目\e-wechat\select\product\index.wxss 中引入样式
+```
+@import "./index.skeleton.wxss";
+```
+
+更多详细信息可以参考文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/skeleton.html
+-->
+<template name="skeleton">
+  <view class="sk-container">
+    <view is="miniprogram_npm/@vant/weapp/search/index" class="search">
+      <view class="van-search index--van-search " style="background: #ffffff">
+        <view class="van-search__content index--van-search__content van-search__content--round index--van-search__content--round">
+          <view is="miniprogram_npm/@vant/weapp/field/index" class="van-search__field index--van-search__field ">
+            <view is="miniprogram_npm/@vant/weapp/cell/index">
+              <view class="field-index--van-field van-cell cell-index--van-cell van-cell--borderless cell-index--van-cell--borderless sk-pseudo sk-pseudo-circle" hover-class="van-cell--hover hover-class" hover-stay-time="70" style="padding: 5px 10px 5px 0; background-color: transparent;">
+                <view is="miniprogram_npm/@vant/weapp/icon/index" class="van-cell__left-icon-wrap cell-index--van-cell__left-icon-wrap">
+                  <view class="cell-index--van-cell__left-icon van-icon icon-index--van-icon van-icon-search icon-index--van-icon-search sk-pseudo sk-pseudo-circle" style="true"></view>
+                </view>
+                <view class="van-cell__value cell-index--van-cell__value ">
+                  <view class="van-field__body field-index--van-field__body van-field__body--search field-index--van-field__body--search">
+                    <view class="van-field__control field-index--van-field__control sk-image" cursor="-1" maxlength="-1" placeholder="请输入搜索关键词" placeholder-class="van-field__placeholder" placeholder-style="true" selection-end="-1" selection-start="-1" type="search"
+                      value="true"></view>
+                  </view>
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="total sk-transparent sk-text-30-0000-532 sk-text">共6个</view>
+    <view is="components/Yl_ListBox/index" id="ListBox">
+      <scroll-view scroll-y="true" class="ListBox-index--scroll-view" refresher-enabled="true" style="height: 640px;">
+        <navigator class="setclient-list-item" data-id="4">
+          <view class="mian">
+            <view is="miniprogram_npm/@vant/weapp/checkbox/index">
+              <view class="van-checkbox checkbox-index--van-checkbox ">
+                <view class="van-checkbox__icon-wrap checkbox-index--van-checkbox__icon-wrap">
+                  <view is="miniprogram_npm/@vant/weapp/icon/index" class="van-checkbox__icon checkbox-index--van-checkbox__icon van-checkbox__icon--square checkbox-index--van-checkbox__icon--square" style="font-size:14px">
+                    <view class="van-icon icon-index--van-icon van-icon-success icon-index--van-icon-success sk-pseudo sk-pseudo-circle" style="font-size:0.8em;line-height: 1.25em;"></view>
+                  </view>
+                </view>
+                <view class=" van-checkbox__label checkbox-index--van-checkbox__label van-checkbox__label--right checkbox-index--van-checkbox__label--right"></view>
+              </view>
+            </view>
+            <view class="img" data-file="[object Object],[object Object]">
+              <view is="miniprogram_npm/@vant/weapp/image/index">
+                <view class=" van-image image-index--van-image" style="width:100%;height:100%">
+                  <image class="van-image__img image-index--van-image__img sk-image" mode="scaleToFill" lazy-load="true"></image>
+                </view>
+              </view>
+            </view>
+            <view class="dec">
+              <view class="title line-1 sk-transparent sk-text-15-0000-251 sk-text">
+                暖通复合管
+              </view>
+              <view class="subfield line-1 sk-transparent">
+                <text class="sk-transparent sk-text-14-7059-38 sk-text">品牌:</text> 产品类别:
+              </view>
+              <view class="price line-1 sk-transparent">
+                牌价：
+                <text class="num sk-transparent sk-opacity">￥</text>
+                <text class="sk-transparent sk-opacity">/</text>
+              </view>
+            </view>
+          </view>
+          <view class="bot">
+            <text class="sk-transparent sk-text-33-3333-214 sk-text">型号:DN20</text>
+            <text class="sk-transparent sk-text-33-3333-42 sk-text">规格: --</text>
+          </view>
+        </navigator>
+        <navigator class="setclient-list-item" data-id="125">
+          <view class="mian">
+            <view is="miniprogram_npm/@vant/weapp/checkbox/index">
+              <view class="van-checkbox checkbox-index--van-checkbox ">
+                <view class="van-checkbox__icon-wrap checkbox-index--van-checkbox__icon-wrap">
+                  <view is="miniprogram_npm/@vant/weapp/icon/index" class="van-checkbox__icon checkbox-index--van-checkbox__icon van-checkbox__icon--square checkbox-index--van-checkbox__icon--square" style="font-size:14px">
+                    <view class="van-icon icon-index--van-icon van-icon-success icon-index--van-icon-success sk-pseudo sk-pseudo-circle" style="font-size:0.8em;line-height: 1.25em;"></view>
+                  </view>
+                </view>
+                <view class=" van-checkbox__label checkbox-index--van-checkbox__label van-checkbox__label--right checkbox-index--van-checkbox__label--right"></view>
+              </view>
+            </view>
+            <view class="img" data-file="[object Object]">
+              <view is="miniprogram_npm/@vant/weapp/image/index">
+                <view class=" van-image image-index--van-image" style="width:100%;height:100%">
+                  <image class="van-image__img image-index--van-image__img sk-image" mode="scaleToFill" lazy-load="true"></image>
+                </view>
+              </view>
+            </view>
+            <view class="dec">
+              <view class="title line-1 sk-transparent sk-text-15-0000-814 sk-text">
+                紫铜管
+              </view>
+              <view class="subfield line-1 sk-transparent">
+                <text class="sk-transparent sk-text-14-7059-709 sk-text">品牌:</text> 产品类别:
+              </view>
+              <view class="price line-1 sk-transparent">
+                牌价：
+                <text class="num sk-transparent sk-opacity">￥</text>
+                <text class="sk-transparent sk-opacity">/</text>
+              </view>
+            </view>
+          </view>
+          <view class="bot">
+            <text class="sk-transparent sk-text-33-3333-429 sk-text">型号:QRDR-BRID-1100</text>
+            <text class="sk-transparent sk-text-33-3333-149 sk-text">规格: --</text>
+          </view>
+        </navigator>
+        <navigator class="setclient-list-item" data-id="8">
+          <view class="mian">
+            <view is="miniprogram_npm/@vant/weapp/checkbox/index">
+              <view class="van-checkbox checkbox-index--van-checkbox ">
+                <view class="van-checkbox__icon-wrap checkbox-index--van-checkbox__icon-wrap">
+                  <view is="miniprogram_npm/@vant/weapp/icon/index" class="van-checkbox__icon checkbox-index--van-checkbox__icon van-checkbox__icon--square checkbox-index--van-checkbox__icon--square" style="font-size:14px">
+                    <view class="van-icon icon-index--van-icon van-icon-success icon-index--van-icon-success sk-pseudo sk-pseudo-circle" style="font-size:0.8em;line-height: 1.25em;"></view>
+                  </view>
+                </view>
+                <view class=" van-checkbox__label checkbox-index--van-checkbox__label van-checkbox__label--right checkbox-index--van-checkbox__label--right"></view>
+              </view>
+            </view>
+            <view class="img" data-file="[object Object]">
+              <view is="miniprogram_npm/@vant/weapp/image/index">
+                <view class=" van-image image-index--van-image" style="width:100%;height:100%">
+                  <image class="van-image__img image-index--van-image__img sk-image" mode="scaleToFill" lazy-load="true"></image>
+                </view>
+              </view>
+            </view>
+            <view class="dec">
+              <view class="title line-1 sk-transparent sk-text-15-0000-145 sk-text">
+                紫铜覆塑管
+              </view>
+              <view class="subfield line-1 sk-transparent">
+                <text class="sk-transparent sk-text-14-7059-436 sk-text">品牌:</text> 产品类别:
+              </view>
+              <view class="price line-1 sk-transparent">
+                牌价：
+                <text class="num sk-transparent sk-opacity">￥</text>
+                <text class="sk-transparent sk-opacity">/</text>
+              </view>
+            </view>
+          </view>
+          <view class="bot">
+            <text class="sk-transparent sk-text-33-3333-902 sk-text">型号:CMCULP</text>
+            <text class="sk-transparent sk-text-33-3333-263 sk-text">规格: --</text>
+          </view>
+        </navigator>
+        <navigator class="setclient-list-item" data-id="7">
+          <view class="mian">
+            <view is="miniprogram_npm/@vant/weapp/checkbox/index">
+              <view class="van-checkbox checkbox-index--van-checkbox ">
+                <view class="van-checkbox__icon-wrap checkbox-index--van-checkbox__icon-wrap">
+                  <view is="miniprogram_npm/@vant/weapp/icon/index" class="van-checkbox__icon checkbox-index--van-checkbox__icon van-checkbox__icon--square checkbox-index--van-checkbox__icon--square" style="font-size:14px">
+                    <view class="van-icon icon-index--van-icon van-icon-success icon-index--van-icon-success sk-pseudo sk-pseudo-circle" style="font-size:0.8em;line-height: 1.25em;"></view>
+                  </view>
+                </view>
+                <view class=" van-checkbox__label checkbox-index--van-checkbox__label van-checkbox__label--right checkbox-index--van-checkbox__label--right"></view>
+              </view>
+            </view>
+            <view class="img" data-file="[object Object]">
+              <view is="miniprogram_npm/@vant/weapp/image/index">
+                <view class=" van-image image-index--van-image" style="width:100%;height:100%">
+                  <image class="van-image__img image-index--van-image__img sk-image" mode="scaleToFill" lazy-load="true"></image>
+                </view>
+              </view>
+            </view>
+            <view class="dec">
+              <view class="title line-1 sk-transparent sk-text-15-0000-32 sk-text">
+                铜本色等径直通
+              </view>
+              <view class="subfield line-1 sk-transparent">
+                <text class="sk-transparent sk-text-14-7059-663 sk-text">品牌:</text> 产品类别:
+              </view>
+              <view class="price line-1 sk-transparent">
+                牌价：
+                <text class="num sk-transparent sk-opacity">￥</text>
+                <text class="sk-transparent sk-opacity">/</text>
+              </view>
+            </view>
+          </view>
+          <view class="bot">
+            <text class="sk-transparent sk-text-33-3333-699 sk-text">型号:BM8270</text>
+            <text class="sk-transparent sk-text-33-3333-817 sk-text">规格: --</text>
+          </view>
+        </navigator>
+        <navigator class="setclient-list-item" data-id="38">
+          <view class="mian">
+            <view is="miniprogram_npm/@vant/weapp/checkbox/index">
+              <view class="van-checkbox checkbox-index--van-checkbox ">
+                <view class="van-checkbox__icon-wrap checkbox-index--van-checkbox__icon-wrap">
+                  <view is="miniprogram_npm/@vant/weapp/icon/index" class="van-checkbox__icon checkbox-index--van-checkbox__icon van-checkbox__icon--square checkbox-index--van-checkbox__icon--square" style="font-size:14px">
+                    <view class="van-icon icon-index--van-icon van-icon-success icon-index--van-icon-success sk-pseudo sk-pseudo-circle" style="font-size:0.8em;line-height: 1.25em;"></view>
+                  </view>
+                </view>
+                <view class=" van-checkbox__label checkbox-index--van-checkbox__label van-checkbox__label--right checkbox-index--van-checkbox__label--right"></view>
+              </view>
+            </view>
+            <view class="img" data-file="[object Object]">
+              <view is="miniprogram_npm/@vant/weapp/image/index">
+                <view class=" van-image image-index--van-image" style="width:100%;height:100%">
+                  <image class="van-image__img image-index--van-image__img sk-image" mode="scaleToFill" lazy-load="true"></image>
+                </view>
+              </view>
+            </view>
+            <view class="dec">
+              <view class="title line-1 sk-transparent sk-text-15-0000-428 sk-text">
+                变频节压器
+              </view>
+              <view class="subfield line-1 sk-transparent">
+                <text class="sk-transparent sk-text-14-7059-892 sk-text">品牌:</text> 产品类别:
+              </view>
+              <view class="price line-1 sk-transparent">
+                牌价：
+                <text class="num sk-transparent sk-opacity">￥</text>
+                <text class="sk-transparent sk-opacity">/</text>
+              </view>
+            </view>
+          </view>
+          <view class="bot">
+            <text class="sk-transparent sk-text-33-3333-449 sk-text">型号:S</text>
+            <text class="sk-transparent sk-text-33-3333-954 sk-text">规格: --</text>
+          </view>
+        </navigator>
+      </scroll-view>
+    </view>
+    <view class="footer">
+      <view class="count sk-transparent sk-text-14-2857-829 sk-text">
+        已选：0
+      </view>
+      <view is="miniprogram_npm/@vant/weapp/button/index">
+        <button app-parameter="true" business-id="true" class="but van-button button-index--van-button van-button--default button-index--van-button--default van-button--normal button-index--van-button--normal van-button--disabled button-index--van-button--disabled van-button--unclickable button-index--van-button--unclickable sk-button sk-pseudo sk-pseudo-circle"
+          data-detail="null" form-type="true" hover-class="true" lang="true" open-type="true" send-message-img="true" send-message-path="true" send-message-title="true" session-from="true" style="true">
+          <view class="van-button__text button-index--van-button__text sk-transparent sk-text-15-0000-706 sk-text" style="background-position-x: 50%;">确定</view>
+        </button>
+      </view>
+    </view>
+  </view>
+</template>

select/product/index.skeleton.wxss

@@ -0,0 +1,168 @@
+/*
+此文件为开发者工具生成，生成时间: 2023/1/2下午1:51:52
+
+在 E:\云链项目\e-wechat\select\product\index.wxss 中引入样式
+```
+@import "./index.skeleton.wxss";
+```
+
+更多详细信息可以参考文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/skeleton.html
+*/
+.sk-transparent {
+    color: transparent !important;
+  }
+.sk-text-30-0000-532 {
+    background-image: linear-gradient(transparent 30.0000%, #EEEEEE 0%, #EEEEEE 70.0000%, transparent 0%) !important;
+    background-size: 100% 60.0000rpx;
+    position: relative !important;
+  }
+.sk-text {
+    background-origin: content-box !important;
+    background-clip: content-box !important;
+    background-color: transparent !important;
+    color: transparent !important;
+    background-repeat: repeat-y !important;
+  }
+.sk-text-15-0000-251 {
+    background-image: linear-gradient(transparent 15.0000%, #EEEEEE 0%, #EEEEEE 85.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-38 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-opacity {
+    opacity: 0 !important;
+  }
+.sk-text-33-3333-214 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-33-3333-42 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-15-0000-814 {
+    background-image: linear-gradient(transparent 15.0000%, #EEEEEE 0%, #EEEEEE 85.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-709 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-33-3333-429 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-33-3333-149 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-15-0000-145 {
+    background-image: linear-gradient(transparent 15.0000%, #EEEEEE 0%, #EEEEEE 85.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-436 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-33-3333-902 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-33-3333-263 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-15-0000-32 {
+    background-image: linear-gradient(transparent 15.0000%, #EEEEEE 0%, #EEEEEE 85.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-663 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-33-3333-699 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-33-3333-817 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-15-0000-428 {
+    background-image: linear-gradient(transparent 15.0000%, #EEEEEE 0%, #EEEEEE 85.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-7059-892 {
+    background-image: linear-gradient(transparent 14.7059%, #EEEEEE 0%, #EEEEEE 85.2941%, transparent 0%) !important;
+    background-size: 100% 34.0000rpx;
+    position: relative !important;
+  }
+.sk-text-33-3333-449 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-33-3333-954 {
+    background-image: linear-gradient(transparent 33.3333%, #EEEEEE 0%, #EEEEEE 66.6667%, transparent 0%) !important;
+    background-size: 100% 72.0000rpx;
+    position: relative !important;
+  }
+.sk-text-14-2857-829 {
+    background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
+    background-size: 100% 39.2000rpx;
+    position: relative !important;
+  }
+.sk-text-15-0000-706 {
+    background-image: linear-gradient(transparent 15.0000%, #EEEEEE 0%, #EEEEEE 85.0000%, transparent 0%) !important;
+    background-size: 100% 40.0000rpx;
+    position: relative !important;
+  }
+.sk-button {
+    color: #EFEFEF !important;
+    background: #EFEFEF !important;
+    border: none !important;
+    box-shadow: none !important;
+  }
+.sk-image {
+    background: #EFEFEF !important;
+  }
+.sk-pseudo::before, .sk-pseudo::after {
+      background: #EFEFEF !important;
+      background-image: none !important;
+      color: transparent !important;
+      border-color: transparent !important;
+    }
+.sk-pseudo-rect::before, .sk-pseudo-rect::after {
+      border-radius: 0 !important;
+    }
+.sk-pseudo-circle::before, .sk-pseudo-circle::after {
+      border-radius: 50% !important;
+    }
+.sk-container {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    background-color: transparent;
+  }

select/product/index.wxml

@@ -0,0 +1,56 @@
+<import src="index.skeleton.wxml"/>
+<template is="skeleton" wx:if="{{loading}}" />
+
+<van-search class="search" value="{{ params.content.where.condition }}" shape="round" placeholder="请输入搜索关键词" bind:search='startSearch' bind:clear='onClear' />
+<view class="total">共{{params.content.total}}个</view>
+
+<Yl_ListBox id='ListBox' bind:getlist='getList'>
+	<navigator class="setclient-list-item" url="#" wx:for="{{list}}" wx:key="item.itemno" data-id="{{item[idname]}}" bindtap="changeResult">
+		<view class="mian">
+			<van-checkbox wx:if="{{!radio}}" value="{{ handle.isCheck(item[idname],result) }}" shape="square" icon-size='28rpx' />
+			<view class="img" data-file="{{item.attinfos}}" catchtap="viewImage">
+				<van-image width="100%" height="100%" wx:if="{{item.cover}}" src="{{item.cover}}" use-loading-slot use-error-slot lazy-load>
+					<van-loading slot="loading" type="spinner" size="20" vertical />
+					<text slot="error" style="font-size: 24rpx;">暂无图片</text>
+				</van-image>
+				<text wx:else class="err">暂无图片</text>
+			</view>
+			<view class="dec">
+				<view class="title line-1">
+					{{item.itemname}}
+				</view>
+				<view class="subfield line-1">
+					<text>品牌:{{item.brandName}}</text>
+					产品类别:{{item.className}}
+				</view>
+				<view class="price line-1">
+					牌价：<text class="num">￥{{item.marketprice}}</text><text>/{{item.axunitname}}</text>
+				</view>
+			</view>
+		</view>
+		<view class="bot">
+			<text>型号:{{item.model||' --'}}</text>
+			<text>规格:{{item.spec||' --'}}</text>
+		</view>
+	</navigator>
+	<view wx:if="{{!radio}}" style="height: 130rpx;" />
+	<Yl_Empty wx:if="{{list.length==0}}" />
+</Yl_ListBox>
+
+<block wx:if="{{!radio}}">
+	<view class="footer">
+		<view class="count">
+			已选：{{result.length}}
+		</view>
+		<van-button custom-class='but' disabled='{{result.length==0}}' bind:click="submit">确定</van-button>
+	</view>
+	<wxs module="handle">
+		module.exports = {
+			isCheck: function (id, list) {
+				return list.some(function (v) {
+					return v == id
+				});
+			},
+		}
+	</wxs>
+</block>

static/common-head.scss

@@ -0,0 +1,33 @@
+.head {
+  display: flex;
+  align-items: center;
+  width: 100vw;
+  height: 120rpx;
+  padding: 0 20rpx 0 30rpx;
+  box-sizing: border-box;
+
+  .count {
+      font-size: 28rpx;
+      font-family: PingFang SC-Regular, PingFang SC;
+      color: #333333;
+  }
+
+  .expand {
+      flex: 1;
+      display: flex;
+      justify-content: flex-end;
+
+      .but {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 80rpx;
+          height: 80rpx;
+          background: #FFFFFF;
+          border-radius: 8rpx;
+          border: 2rpx solid #CCCCCC;
+          margin-left: 20rpx;
+          color: #666666;
+      }
+  }
+}