From 44a40dd2d64782924de43353144b90c42ad33b4e Mon Sep 17 00:00:00 2001
From: yujialong <479214531@qq.com>
Date: Wed, 11 May 2022 14:06:11 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=A2=E6=88=B7=E8=81=94=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apis/modules/client.js                     |  16 +
 apis/request.js                            |   2 +-
 components/sl-filter/filter-view.vue       | 475 +++++++++++++++++++++
 components/sl-filter/iconfont/iconfont.css |  20 +
 components/sl-filter/popup-layer.vue       | 122 ++++++
 components/sl-filter/sl-filter.vue         | 302 +++++++++++++
 pages.json                                 |  29 +-
 pages/clientDetail/clientDetail.vue        | 179 ++++----
 pages/clients/clients.vue                  | 106 +++--
 pages/orderDetail/orderDetail.vue          | 231 ++++++++++
 pages/orders/orders.vue                    |  48 ++-
 styles/common.scss                         |   5 +
 12 files changed, 1416 insertions(+), 119 deletions(-)
 create mode 100644 components/sl-filter/filter-view.vue
 create mode 100644 components/sl-filter/iconfont/iconfont.css
 create mode 100644 components/sl-filter/popup-layer.vue
 create mode 100644 components/sl-filter/sl-filter.vue
 create mode 100644 pages/orderDetail/orderDetail.vue

diff --git a/apis/modules/client.js b/apis/modules/client.js
index 90d2a4e..24b6538 100644
--- a/apis/modules/client.js
+++ b/apis/modules/client.js
@@ -3,4 +3,20 @@ const { get, post } = request
 
 export const queryCustomer = (data) => {
   return post('nakadai/nakadai/customer/queryCustomer', data)
+}
+
+export const queryCustomerDetails = (data) => {
+  return get('nakadai/nakadai/customer/queryCustomerDetails', data)
+}
+
+export const querySchool = (data) => {
+  return get('nakadai/nakadai/school/querySchool', data)
+}
+
+export const queryIndustryClass = (data) => {
+  return get('nakadai/nakadai/hrIndustryClass/queryIndustryClass', data)
+}
+
+export const queryIndustry = (data) => {
+  return get('nakadai/nakadai/hrIndustry/queryIndustry', data)
 }
\ No newline at end of file
diff --git a/apis/request.js b/apis/request.js
index 019b072..4ede338 100644
--- a/apis/request.js
+++ b/apis/request.js
@@ -12,7 +12,7 @@ const request = options => {
 		})
 	}
 	const header = Object.assign({}, config.headers, {
-		token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1c2VyIiwiaWF0IjoxNjUyMTQ5MDU1LCJleHAiOjE2NTIxOTIyNTUsImFjY291bnRJZCI6IjEifQ.VVjW9tgd0b7_My91VRGJncv62qkILLQGl9PqMkwU0v4'
+		token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1c2VyIiwiaWF0IjoxNjUyMjM0OTM2LCJleHAiOjE2NTIyNzgxMzYsImFjY291bnRJZCI6IjEifQ.QwmlBM6uDfRpW4xV8b0r3aBOqXQu5gWLj5Jbrlnrtcg'
 	})
 	return new Promise((resolve, reject)=>{
 		uni.request({
diff --git a/components/sl-filter/filter-view.vue b/components/sl-filter/filter-view.vue
new file mode 100644
index 0000000..0ca41f1
--- /dev/null
+++ b/components/sl-filter/filter-view.vue
@@ -0,0 +1,475 @@
+<template>
+
+	<view>
+		<view style="padding: 0px 0px;">
+			<view class="filter-content" v-for="(item, index) in menuList" :key="index" v-if="menuIndex == index">
+				<view v-if="item.isSort">
+					<view class="filter-content-list">
+						<view v-for="(detailItem,idx) in selectDetailList" :key="idx" :class="detailItem.isSelected?'filter-content-list-item-active':'filter-content-list-item-default'"
+						 :style="{'color': detailItem.isSelected?themeColor:'#666666'}" @tap="sortTap(idx,selectDetailList,item.key)">
+							<text>{{detailItem.title}}</text>
+						</view>
+					</view>
+				</view>
+				<view v-else>
+					<view class="filter-content-title" v-if="item.detailTitle && item.detailTitle.length">
+						<text>{{item.detailTitle}}</text>
+					</view>
+					<view class="filter-content-detail">
+						<text v-for="(detailItem,idx) in selectDetailList" :key="idx" class='filter-content-detail-item-default' :style="{'background-color':detailItem.isSelected?themeColor:'#FFFFFF','color':detailItem.isSelected?'#FFFFFF':'#666666'}"
+						 @tap="itemTap(idx,selectDetailList,item.isMutiple,item.key)">
+							{{detailItem.title}}
+						</text>
+					</view>
+					<view class="filter-content-footer">
+						<view class="filter-content-footer-item" style="color: #777777; background-color: #FFFFFF;" @tap="resetClick(selectDetailList,item.key)">
+							<text>重置</text>
+						</view>
+						<view class="filter-content-footer-item" :style="{'color': '#FFFFFF', 'background-color': themeColor}" @tap="sureClick">
+							<text>确定</text>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				selectArr: [],
+				result: {},
+				menuIndex: 0,
+				selectDetailList: [],
+				independenceObj: {},
+				selectedKey: '',
+				cacheSelectedObj: {},
+				defaultSelectedTitleObj: {}
+			};
+		},
+		props: {
+			themeColor: {
+				type: String,
+				default () {
+					return '#D1372C'
+				}
+			},
+			menuList: {
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			independence: {
+				type: Boolean,
+				default: false
+			}
+		},
+		computed: {
+			selectedTitleObj() {
+				let obj = {}
+				for (let i = 0; i < this.menuList.length; i++) {
+					let item = this.menuList[i];
+					obj[item.key] = item.title;
+				}
+				return obj;
+			},
+			defaultSelectedObj() { // 保存初始状态
+				return this.getSelectedObj()
+			},
+			selectedObj: {
+				get() {
+					return this.getSelectedObj()
+				},
+				set(newObj) {
+					return newObj;
+				}
+
+			}
+		},
+		methods: {
+			getSelectedObj() {
+				let obj = {}
+				for (let i = 0; i < this.menuList.length; i++) {
+					let item = this.menuList[i];
+					if (!this.independence && item.defaultSelectedIndex != null && item.defaultSelectedIndex.toString().length > 0) { // 处理并列菜单默认值
+
+						if (item.isMutiple) {
+							obj[item.key] = [];
+							item.detailList[0].isSelected = false;
+							if (!Array.isArray(item.defaultSelectedIndex)) { // 如果默认值不是数组
+								item.defaultSelectedIndex = [item.defaultSelectedIndex];
+							}
+							for (let j = 0; j < item.defaultSelectedIndex.length; j++) { // 将默认选中的值放入selectedObj
+								item.detailList[item.defaultSelectedIndex[j]].isSelected = true;
+								obj[item.key].push(item.detailList[item.defaultSelectedIndex[j]].value)
+							}
+
+						} else {
+							obj[item.key] = item.detailList[item.defaultSelectedIndex].value;
+							this.selectedTitleObj[item.key] = item.detailList[item.defaultSelectedIndex].title;
+							this.defaultSelectedTitleObj[item.key] = item.detailList[item.defaultSelectedIndex].title;
+							item.detailList[0].isSelected = false;
+							item.detailList[item.defaultSelectedIndex].isSelected = true;
+						}
+					} else {
+						if (item.isMutiple) {
+							obj[item.key] = [];
+						} else {
+							obj[item.key] = '';
+						}
+					}
+				}
+				this.result = obj;
+				return obj;
+			},
+			// 重置所有选项，包括默认选项，并更新result
+			resetAllSelect(callback) {
+				let titles = [];
+				for (let i = 0; i < this.menuList.length; i++) {
+					this.resetSelected(this.menuList[i].detailList,this.menuList[i].key);
+					titles[this.menuList[i].key] = this.menuList[i].title;
+				}
+				let obj = {
+					'result': this.result,
+					'titles': titles,
+					'isReset': true
+				}
+				this.$emit("confirm", obj);
+				callback(this.result);
+			},
+			// 重置选项为设置的默认值，并更新result
+			resetSelectToDefault(callback) {
+				for (let i = 0; i < this.menuList.length; i++) {
+					this.selectDetailList = this.menuList[i].detailList;
+
+					if (this.menuList[i].defaultSelectedIndex) {
+						if (Array.isArray(this.menuList[i].defaultSelectedIndex)) { // 把所有默认的为false的点为true
+							for (let j = 0; j < this.menuList[i].defaultSelectedIndex.length; j++) {
+								if (this.selectDetailList[this.menuList[i].defaultSelectedIndex[j]].isSelected == false) {
+									this.itemTap(this.menuList[i].defaultSelectedIndex[j], this.selectDetailList, this.menuList[i].isMutiple, this
+										.menuList[i].key)
+								}
+							}
+						} else {
+							this.itemTap(this.menuList[i].defaultSelectedIndex, this.selectDetailList, this.menuList[i].isMutiple, this.menuList[
+								i].key)
+						}
+
+						// 获取非默认项的下标
+						let unDefaultSelectedIndexArr = this.getUnDefaultSelectedIndex(this.menuList[i])
+						// 把所有不是默认的为true的点为false
+						for (let j = 0; j < unDefaultSelectedIndexArr.length; j++) {
+							if (this.selectDetailList[unDefaultSelectedIndexArr[j]].isSelected == true) {
+								this.itemTap(unDefaultSelectedIndexArr[j], this.selectDetailList, this.menuList[i].isMutiple, this
+										.menuList[i].key)
+							}
+						}
+					}
+
+
+				}
+
+				this.selectedObj = this.defaultSelectedObj;
+				this.result = this.defaultSelectedObj;
+				let obj = {
+					'result': this.result,
+					'titles': this.defaultSelectedTitleObj,
+					'isReset': true
+				}
+				this.$emit("confirm", obj);
+				callback(this.result)
+			},
+			getUnDefaultSelectedIndex(menuListItem) { // 获取非默认项
+				let tempDefault = menuListItem.defaultSelectedIndex;
+				if (!Array.isArray(tempDefault)) {
+					tempDefault = [tempDefault];
+				}
+				// 获取所有项的下标 组成新的数组
+				let all = [];
+				for (let i = 0; i < menuListItem.detailList.length; i++) {
+					all.push(i)
+				}
+				// 将默认选中的数组与所有项的数组的不同值合并为一个新数组
+				var unDefaultSelectedIndex = tempDefault.filter(function(v) {
+					return !(all.indexOf(v) > -1)
+				}).concat(all.filter(function(v) {
+					return !(tempDefault.indexOf(v) > -1)
+				}));
+				return unDefaultSelectedIndex;
+			},
+			resetMenuList(val) {
+				this.menuList = val;
+				this.$emit('update:menuList', val)
+			},
+			menuTabClick(index) {
+				this.menuIndex = index;
+				this.selectDetailList = this.menuList[index].detailList;
+				this.selectedKey = this.menuList[index].key;
+				// 如果是独立菜单
+				if (this.independence && !this.menuList[index].isSort) {
+					if (JSON.stringify(this.independenceObj) == '{}') {
+						this.initIndependenceObj(index);
+					} else {
+						for (let key in this.independenceObj) {
+							if (key != this.selectedKey) {
+								this.initIndependenceObj(index);
+								this.resetSelected(this.menuList[index].detailList, this.selectedKey);
+							}
+						}
+					}
+
+				}
+				if (this.independence && this.menuList[index].isSort) {
+
+					this.independenceObj = {};
+
+
+				}
+				if (this.independence) {
+					let idx = this.menuList[index].defaultSelectedIndex;
+					if (idx != null && idx.toString().length > 0) { // 处理独立菜单默认值
+						if (this.menuList[index].isMutiple) {
+							for (let i = 0; i < idx.length; i++) {
+								if (this.menuList[index].detailList[idx[i]].isSelected == false) {
+									this.itemTap(idx[i], this.menuList[index].detailList, true, this.selectedKey);
+								}
+
+							}
+						} else {
+							if (this.menuList[index].detailList[idx].isSelected == false) {
+
+								this.itemTap(idx, this.menuList[index].detailList, false, this.selectedKey);
+
+							}
+						}
+
+					}
+				}
+
+
+				// #ifdef H5
+				this.selectedObj = this.selectedObj;
+				this.$forceUpdate();
+				// #endif
+			},
+			initIndependenceObj(index) {
+				this.independenceObj = {};
+				if (this.menuList[index].isMutiple) {
+					this.independenceObj[this.selectedKey] = [];
+				} else {
+					this.independenceObj[this.selectedKey] = '';
+				}
+			},
+			itemTap(index, list, isMutiple, key) {
+				if (isMutiple == true) {
+					list[index].isSelected = !list[index].isSelected;
+					if (index == 0) {
+						this.resetSelected(list, key)
+						if (!this.independence) {
+							this.selectedTitleObj[key] = list[index].title;
+						}
+					} else {
+						list[0].isSelected = false
+						if (list[index].isSelected) {
+							if (this.independence) {
+								this.independenceObj[this.selectedKey].push(list[index].value);
+							} else {
+								this.selectedObj[key].push(list[index].value);
+							}
+						} else {
+							list[index].isSelected = false;
+							if (this.independence) {
+								var idx = this.independenceObj[this.selectedKey].indexOf(list[index].value);
+								this.independenceObj[this.selectedKey].splice(idx, 1);
+							} else {
+								var idx = this.selectedObj[key].indexOf(list[index].value);
+								this.selectedObj[key].splice(idx, 1);
+							}
+
+						}
+						if (this.independence) {
+							this.result = this.independenceObj;
+						} else {
+							this.result = this.selectedObj;
+						}
+
+					}
+				} else {
+					if (index == 0) {
+						this.resetSelected(list, key)
+						if (!this.independence) {
+							this.selectedTitleObj[key] = list[index].title;
+						}
+					} else {
+						list[0].isSelected = false
+						if (this.independence) {
+							this.independenceObj[this.selectedKey] = list[index].value;
+							this.result = this.independenceObj;
+						} else {
+							this.selectedObj[key] = list[index].value;
+							this.result = this.selectedObj;
+							this.selectedTitleObj[key] = list[index].title;
+						}
+
+						for (let i = 0; i < list.length; i++) {
+							if (index == i) {
+								list[i].isSelected = true
+							} else {
+								list[i].isSelected = false
+							}
+						}
+					}
+				}
+				// #ifdef H5
+				this.$forceUpdate();
+				// #endif
+			},
+			resetSelected(list, key) {
+				if (typeof this.result[key] == 'object') {
+					this.result[key] = [];
+					this.selectedTitleObj[key] = list[0].title;
+				} else {
+					this.result[key] = '';
+					this.selectedTitleObj[key] = list[0].title;
+				}
+				for (let i = 0; i < list.length; i++) {
+					if (i == 0) {
+						list[i].isSelected = true;
+					} else {
+						list[i].isSelected = false;
+					}
+				}
+				// #ifdef H5
+				this.$forceUpdate();
+				// #endif
+			},
+			sortTap(index, list, key) {
+				if (this.independence) {
+					this.independenceObj[this.selectedKey] = list[index].value;
+					this.result = this.independenceObj;
+				} else {
+					this.selectedObj[key] = list[index].value;
+					this.result = this.selectedObj;
+					this.selectedTitleObj[key] = list[index].title;
+				}
+
+				for (let i = 0; i < list.length; i++) {
+					if (index == i) {
+						list[i].isSelected = true;
+					} else {
+						list[i].isSelected = false;
+					}
+				}
+				let obj = {
+					'result': this.result,
+					'titles': this.selectedTitleObj,
+					'isReset': false
+				}
+				this.$emit("confirm", obj);
+			},
+			sureClick() {
+				let obj = {
+					'result': this.result,
+					'titles': this.selectedTitleObj,
+					'isReset': false
+				}
+				this.$emit("confirm", obj);
+			},
+			resetClick(list, key) {
+				this.resetSelected(list, key)
+			}
+		}
+	}
+</script>
+
+<style>
+	.filter-content {
+		background-color: #F6F7F8;
+	}
+
+	.filter-content-title {
+		border-bottom: #EEEEEE 1px solid;
+		padding: 10px 15px;
+		font-size: 13px;
+		color: #999999;
+	}
+
+	.filter-content-detail {
+		padding: 5px 15px;
+	}
+
+	.filter-content-detail-item-active {
+		background-color: #D1372C;
+		color: #FFFFFF;
+		padding: 5px 15px;
+		border-radius: 20px;
+		margin-right: 10px;
+		margin-top: 10px;
+		display: inline-block;
+		font-size: 14px;
+	}
+
+	.filter-content-detail-item-default {
+		background-color: #FFFFFF;
+		color: #666666;
+		padding: 5px 15px;
+		border-radius: 20px;
+		margin-right: 10px;
+		margin-top: 10px;
+		display: inline-block;
+		font-size: 14px;
+	}
+
+	.filter-content-footer {
+		display: flex;
+		justify-content: space-between;
+		width: 100%;
+		height: 45px;
+		margin-top: 10px;
+	}
+
+	.filter-content-footer-item {
+		width: 50%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		font-size: 16px;
+	}
+
+	.filter-content-list {
+
+		padding: 5px 15px;
+	}
+
+	.filter-content-list-item-default {
+		color: #666666;
+		width: 100%;
+		padding: 10px 0px;
+	}
+
+	.filter-content-list-item-default text {
+		width: 90%;
+		font-size: 14px;
+		display: inline-block;
+	}
+
+	.filter-content-list-item-active {
+		color: #D1372C;
+		width: 100%;
+		padding: 10px 0px;
+	}
+
+	.filter-content-list-item-active text {
+		font-size: 14px;
+		width: 90%;
+		display: inline-block;
+	}
+
+	.filter-content-list-item-active:after {
+		content: '✓';
+	}
+</style>
diff --git a/components/sl-filter/iconfont/iconfont.css b/components/sl-filter/iconfont/iconfont.css
new file mode 100644
index 0000000..a1b4344
--- /dev/null
+++ b/components/sl-filter/iconfont/iconfont.css
@@ -0,0 +1,20 @@
+@font-face {
+	font-family: 'sl-font';
+	src: url('data:font/truetype;charset=utf-8;base64,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') format('truetype');
+}
+
+.sl-font {
+	font-family: "sl-font" !important;
+	font-size: 16px;
+	font-style: normal;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+}
+
+.sl-down:before {
+	content: "\e61a";
+}
+
+.sl-up:before {
+	content: "\e61c";
+}
diff --git a/components/sl-filter/popup-layer.vue b/components/sl-filter/popup-layer.vue
new file mode 100644
index 0000000..63c5f1b
--- /dev/null
+++ b/components/sl-filter/popup-layer.vue
@@ -0,0 +1,122 @@
+<template>
+	<scroll-view scroll-y v-show="ifshow" @tap="ableClose" @touchmove.stop.prevent class="popup-layer">
+		<view ref="popRef" class="popup-content" @tap.stop="stopEvent" :style="_location">
+			<slot></slot>
+		</view>
+	</scroll-view>
+</template>
+
+<script>
+	export default {
+		name: 'popup-layer',
+		props: {
+			direction: {
+				type: String,
+				default: 'top', // 方向  top，bottom，left，right 
+			},
+			autoClose: {
+				type: Boolean,
+				default: true,
+			},
+			isTransNav: {
+				type: Boolean,
+				default: false
+			},
+			navHeight: {
+				type: Number,
+				default: 0
+			}
+		},
+		data() {
+			return {
+				ifshow: false, // 是否展示,
+				translateValue: -100, // 位移距离
+				timer: null,
+				iftoggle: false,
+			};
+		},
+		computed: {
+			_translate() {
+				if (this.isTransNav) {
+					const transformObj = {
+						'top': `transform:translateY(${-this.translateValue}%)`,
+						'bottom': `transform:translateY(calc(${this.translateValue}% + ${this.navHeight}px))`,
+						'left': `transform:translateX(${-this.translateValue}%)`,
+						'right': `transform:translateX(${this.translateValue}%)`
+					};
+					return transformObj[this.direction]
+				} else {
+					const transformObj = {
+						'top': `transform:translateY(${-this.translateValue}%)`,
+						'bottom': `transform:translateY(${this.translateValue}%)`,
+						'left': `transform:translateX(${-this.translateValue}%)`,
+						'right': `transform:translateX(${this.translateValue}%)`
+					};
+					return transformObj[this.direction]
+				}
+
+			},
+			_location() {
+				const positionValue = {
+					'top': 'bottom:0px;width:100%;',
+					'bottom': 'top:0px;width:100%;',
+					'left': 'right:0px;height:100%;',
+					'right': 'left:0px;height:100%;',
+				};
+				return positionValue[this.direction] + this._translate;
+			}
+		},
+		methods: {
+			show() {
+				let _this = this;
+				this.ifshow = true;
+				let _open = setTimeout(() => {
+					this.translateValue = 0;
+					_open = null;
+				}, 100)
+				let _toggle = setTimeout(() => {
+					this.iftoggle = true;
+					_toggle = null;
+				}, 300);
+			},
+			close() {
+				if (this.timer !== null || !this.iftoggle) {
+					return;
+				}
+				this.translateValue = -100 - this.navHeight;
+
+				this.timer = setTimeout(() => {
+					this.ifshow = false;
+					this.timer = null;
+					this.iftoggle = false;
+				}, 300);
+				this.$emit("close")
+			},
+			ableClose() {
+				if (this.autoClose) {
+					this.close();
+				}
+			},
+			stopEvent(event) {},
+		}
+	}
+</script>
+
+<style>
+	.popup-layer {
+		position: absolute;
+		z-index: 999999;
+		background: rgba(0, 0, 0, .3);
+		height: calc(100% - 50px);
+		width: 100%;
+		left: 0px;
+		overflow: hidden;
+	}
+
+	.popup-content {
+		position: absolute;
+		z-index: 1000000;
+		background: #FFFFFF;
+		transition: all .3s ease;
+	}
+</style>
diff --git a/components/sl-filter/sl-filter.vue b/components/sl-filter/sl-filter.vue
new file mode 100644
index 0000000..42b3118
--- /dev/null
+++ b/components/sl-filter/sl-filter.vue
@@ -0,0 +1,302 @@
+<template>
+	<view class="content">
+		<view :style="{height: tabHeight + 1 +'px'}">
+			<view :class="topFixed?'select-tab-fixed-top':'select-tab'" :style="{height: tabHeight+'px'}">
+				<view class="select-tab-item" :style="{width: itemWidth}" v-for="(item,index) in titleList" :key="index" @tap="showMenuClick(index)">
+					<text :style="{color:color}">{{item.title}}</text>
+					<text class="arrows sl-font" :class="statusList[index].isActive?up:down"></text>
+				</view>
+			</view>
+		</view>
+		<popup-layer ref="popupRef" :direction="'bottom'" @close="close" :isTransNav="isTransNav" :navHeight="navHeight"
+		 :tabHeight="tabHeight">
+			<sl-filter-view :ref="'slFilterView'" :independence="independence" :themeColor="themeColor" :menuList.sync="menuListTemp"
+			 ref="slFilterView" @confirm="filterResult"></sl-filter-view>
+		</popup-layer>
+	</view>
+
+</template>
+
+<script>
+	import popupLayer from '@/components/sl-filter/popup-layer.vue';
+	import slFilterView from '@/components/sl-filter/filter-view.vue';
+	export default {
+		components: {
+			popupLayer,
+			slFilterView
+		},
+		props: {
+			menuList: {
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			themeColor: {
+				type: String,
+				default () {
+					return '#000000'
+				}
+			},
+			color: {
+				type: String,
+				default () {
+					return '#666666'
+				}
+			},
+			independence: {
+				type: Boolean,
+				default: false
+			},
+			isTransNav: {
+				type: Boolean,
+				default: false
+			},
+			navHeight: {
+				type: Number,
+				default: 0
+			},
+			topFixed: {
+				type: Boolean,
+				default: false
+			}
+		},
+
+		computed: {
+			itemWidth() {
+				return 'calc(100%/2)'
+			},
+			menuListTemp: {
+				get() {
+					return this.getMenuListTemp();
+				},
+				set(newObj) {
+					return newObj;
+				}
+			}
+		},
+		// #ifndef H5
+		onReady: function() {
+			let arr = [];
+			let titleArr = [];
+			let r = {};
+			for (let i = 0; i < this.menuList.length; i++) {
+				arr.push({
+					'isActive': false
+				});
+				// titleArr.push({
+				// 	'title': this.menuList[i].title,
+				// 	'key': this.menuList[i].key
+				// })
+
+				r[this.menuList[i].key] = this.menuList[i].title;
+
+				if (this.menuList[i].reflexTitle && this.menuList[i].defaultSelectedIndex > -1) {
+					titleArr.push({
+						'title': this.menuList[i].detailList[this.menuList[i].defaultSelectedIndex].title,
+						'key': this.menuList[i].key
+					})
+				} else {
+					titleArr.push({
+						'title': this.menuList[i].title,
+						'key': this.menuList[i].key
+					})
+				}
+
+			}
+			this.statusList = arr;
+			this.titleList = titleArr;
+			this.tempTitleObj = r;
+		},
+		// #endif
+
+		// #ifdef H5
+		created: function() {
+			let arr = [];
+			let titleArr = [];
+			let r = {};
+			for (let i = 0; i < this.menuList.length; i++) {
+				arr.push({
+					'isActive': false
+				});
+				// titleArr.push({
+				// 	'title': this.menuList[i].title,
+				// 	'key': this.menuList[i].key
+				// });
+				r[this.menuList[i].key] = this.menuList[i].title;
+
+				if (this.menuList[i].reflexTitle && this.menuList[i].defaultSelectedIndex > -1) {
+					titleArr.push({
+						'title': this.menuList[i].detailList[this.menuList[i].defaultSelectedIndex].title,
+						'key': this.menuList[i].key
+					})
+				} else {
+					titleArr.push({
+						'title': this.menuList[i].title,
+						'key': this.menuList[i].key
+					})
+				}
+
+			}
+			this.statusList = arr;
+			this.titleList = titleArr;
+			this.tempTitleObj = r;
+		},
+		// #endif
+		data() {
+			return {
+				down: 'sl-down',
+				up: 'sl-up',
+				tabHeight: 50,
+				statusList: [],
+				selectedIndex: '',
+				titleList: [],
+				tempTitleObj: {}
+			};
+		},
+		methods: {
+			getMenuListTemp() {
+				let arr = this.menuList;
+				for (let i = 0; i < arr.length; i++) {
+					let item = arr[i];
+					for (let j = 0; j < item.detailList.length; j++) {
+						let d_item = item.detailList[j];
+						if (j == 0) {
+							d_item.isSelected = true
+						} else {
+							d_item.isSelected = false
+						}
+					}
+				}
+				return arr;
+			},
+			// 重置所有选项，包括默认选项，并更新result
+			resetAllSelect(callback) {
+				this.$refs.slFilterView.resetAllSelect(function(e){
+					callback(e);
+				});
+			},
+			// 重置选项为设置的默认值，并更新result
+			resetSelectToDefault(callback) {
+				this.$refs.slFilterView.resetSelectToDefault(function(e){
+					callback(e);
+				});
+			},
+			resetMenuList(val) {
+				this.menuList = val;
+				this.$emit('update:menuList', val)
+				this.$forceUpdate();
+				this.$refs.slFilterView.resetMenuList(val)
+			},
+			showMenuClick(index) {
+				this.selectedIndex = index;
+				if (this.statusList[index].isActive == true) {
+					this.$refs.popupRef.close();
+					this.statusList[index].isActive = false
+				} else {
+					this.menuTabClick(index);
+					this.$refs.popupRef.show()
+				}
+			},
+			menuTabClick(index) {
+				this.$refs.slFilterView.menuTabClick(index);
+				for (let i = 0; i < this.statusList.length; i++) {
+					if (index == i) {
+						this.statusList[i].isActive = true;
+					} else {
+						this.statusList[i].isActive = false;
+					}
+				}
+			},
+			filterResult(obj) {
+				let val = obj.result;
+				let titlesObj = obj.titles;
+				// 处理选项映射到菜单title
+				if (this.independence) {
+					if (!this.menuList[this.selectedIndex].isMutiple || this.menuList[this.selectedIndex].isSort) {
+						let tempTitle = '';
+						for (let i = 0; i < this.menuList[this.selectedIndex].detailList.length; i++) {
+							let item = this.menuList[this.selectedIndex].detailList[i];
+							if (item.value == val[this.menuList[this.selectedIndex].key]) {
+								tempTitle = item.title;
+							}
+						}
+						if (this.menuList[this.selectedIndex].reflexTitle) {
+							this.titleList[this.selectedIndex].title = tempTitle;
+						}
+					}
+				} else {
+					for (let key in titlesObj) {
+						if (!Array.isArray(titlesObj[key])) {
+							this.tempTitleObj[key] = titlesObj[key];
+						}
+
+					}
+					for (let key in this.tempTitleObj) {
+						for (let i = 0; i < this.titleList.length; i++) {
+							if (this.titleList[i].key == key) {
+								this.titleList[i].title = this.tempTitleObj[key];
+							}
+						}
+					}
+				}
+
+				this.$refs.popupRef.close()
+				if (obj.isReset) {
+					
+				} else{
+					this.$emit("result", val)
+				}
+				
+
+			},
+			close() {
+				for (let i = 0; i < this.statusList.length; i++) {
+					this.statusList[i].isActive = false;
+				}
+			}
+		}
+	}
+</script>
+
+<style>
+	@import 'iconfont/iconfont.css';
+
+	.select-tab {
+		border-bottom: #F7F7F7 1px solid;
+		background-color: #FFFFFF;
+		display: flex;
+		width: 100%;
+	}
+
+	.select-tab-fixed-top {
+		border-bottom: #F7F7F7 1px solid;
+		background-color: #FFFFFF;
+		display: flex;
+		width: 100%;
+		position: fixed;
+		/* #ifdef H5 */
+		top: 44px;
+		/* #endif */
+		/* #ifndef H5 */
+		top: 0;
+		/* #endif */
+	}
+
+	.arrows {
+		margin-left: 5px;
+	}
+
+	.select-tab .select-tab-item,
+	.select-tab-fixed-top .select-tab-item {
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.select-tab .select-tab-item text,
+	.select-tab-fixed-top .select-tab-item text {
+		color: #666666;
+		font-size: 14px;
+	}
+</style>
diff --git a/pages.json b/pages.json
index 0a0b121..f24623f 100644
--- a/pages.json
+++ b/pages.json
@@ -1,5 +1,21 @@
 {
 	"pages": [
+		{
+            "path" : "pages/clients/clients",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "客户列表",
+                "enablePullDownRefresh": true
+            }
+        },
+        {
+            "path" : "pages/orderDetail/orderDetail",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "订单详情",
+                "enablePullDownRefresh": false
+            }
+        },
         {
             "path" : "pages/orders/orders",
             "style" :                                                                                    
@@ -14,14 +30,6 @@
 				"navigationBarTitleText": "首页"
 			}
 		},
-		{
-            "path" : "pages/clients/clients",
-            "style" :                                                                                    
-            {
-                "navigationBarTitleText": "客户列表",
-                "enablePullDownRefresh": true
-            }
-        },
         {
             "path" : "pages/password/password",
             "style" :                                                                                    
@@ -122,15 +130,14 @@
                 "enablePullDownRefresh": false
             }
             
-        }
-        ,{
+        },
+        {
             "path" : "pages/detail/detail",
             "style" :                                                                                    
             {
                 "navigationBarTitleText": "详情",
                 "enablePullDownRefresh": false
             }
-            
         }
     ],
 	"condition": { //模式配置，仅开发期间生效
diff --git a/pages/clientDetail/clientDetail.vue b/pages/clientDetail/clientDetail.vue
index 4405a47..2c172f7 100644
--- a/pages/clientDetail/clientDetail.vue
+++ b/pages/clientDetail/clientDetail.vue
@@ -1,12 +1,11 @@
 <template>
 	<view class="page">
-		<uni-card :is-shadow="false" :border="false" is-full>
+		<uni-card v-if="customerId" :is-shadow="false" :border="false" is-full>
 			<view class="info">
-				<view class="name">华工大学</view>
+				<view class="name">{{ form.customerName }}</view>
 				<view class="text">客户编号：2124232</view>
-				<view class="text">客户类型：2124232</view>
-				<view class="text">商务经理：2124232</view>
-				<view class="text">产品到期时间：2124232</view>
+				<view class="text">客户类型：{{ customerType }}</view>
+				<view class="text">产品到期时间：{{ form.expireDate }}</view>
 			</view>
 		</uni-card>
 		
@@ -14,7 +13,9 @@
 			<view class="form">
 				<uni-forms ref="baseForm" :modelValue="form" label-width="100" disabled>
 					<uni-forms-item label="客户名称" name="name" required>
-						<uni-easyinput v-model="form.city" placeholder="请选择客户名称" disabled />
+						<uni-easyinput v-if="isDetail" v-model="form.schoolId" disabled />
+						<uni-data-picker v-else placeholder="请选择学校" popup-title="请选择学校" :localdata="schoolList" :map="{text: 'schoolName', value: 'schoolId'}" v-model="form.schoolId">
+						</uni-data-picker>
 					</uni-forms-item>
 					<uni-forms-item label="省份">
 						<uni-easyinput v-model="form.provience" disabled />
@@ -22,29 +23,36 @@
 					<uni-forms-item label="城市">
 						<uni-easyinput v-model="form.city" disabled />
 					</uni-forms-item>
+					<uni-forms-item label="行业类型" required>
+						<uni-easyinput v-if="isDetail" v-model="form.industryClassId" disabled />
+						<uni-data-picker v-else placeholder="请选择行业类型" popup-title="请选择行业类型" preload :clear-icon="false" :localdata="industryClassList" :map="{text: 'industryClassName', value: 'industryClassId'}" v-model="form.industryClassId" @change="industryClassChange">
+						</uni-data-picker>
+					</uni-forms-item>
 					<uni-forms-item label="行业" required>
-						<uni-easyinput v-model="form.city" placeholder="请选择班级" disabled />
+						<uni-easyinput v-if="isDetail" v-model="form.industryId" disabled />
+						<uni-data-picker v-else placeholder="请选择行业" popup-title="请选择行业" preload :clear-icon="false" :localdata="industryList" :map="{text: 'industryName', value: 'industryId'}" v-model="form.industryId" :readonly="form.industryClassId ? false : true">
+						</uni-data-picker>
 					</uni-forms-item>
-					<uni-forms-item label="联系人姓名" name="contact" required>
-						<uni-easyinput v-model="form.contact" placeholder="请输入联系人姓名" disabled />
+					<uni-forms-item label="联系人姓名" name="name" required>
+						<uni-easyinput v-model="form.name" placeholder="请输入联系人姓名" :disabled="isDetail" />
 					</uni-forms-item>
-					<uni-forms-item label="手机" name="contact">
-						<uni-easyinput v-model="form.contact" placeholder="请输入手机" disabled />
+					<uni-forms-item label="手机" name="phone">
+						<uni-easyinput v-model="form.phone" placeholder="请输入手机" :disabled="isDetail" />
 					</uni-forms-item>
-					<uni-forms-item label="账号" name="contact" required>
-						<uni-easyinput v-model="form.contact" placeholder="请以院校首字母+admin的格式来设置" disabled />
+					<uni-forms-item label="账号" name="account" required>
+						<uni-easyinput v-model="form.account" placeholder="请以院校首字母+admin的格式来设置" :disabled="isDetail" />
 					</uni-forms-item>
-					<uni-forms-item label="职务" name="contact">
-						<uni-easyinput v-model="form.contact" placeholder="请输入职务" disabled />
+					<uni-forms-item label="职务" name="position">
+						<uni-easyinput v-model="form.position" placeholder="请输入职务" :disabled="isDetail" />
 					</uni-forms-item>
-					<uni-forms-item label="邮箱" name="contact">
-						<uni-easyinput v-model="form.contact" placeholder="请输入邮箱" disabled />
+					<uni-forms-item label="邮箱" name="email">
+						<uni-easyinput v-model="form.email" placeholder="请输入邮箱" :disabled="isDetail" />
 					</uni-forms-item>
 					<uni-forms-item label="产品到期时间">
-						<uni-datetime-picker type="datetime" return-type="timestamp" v-model="form.datetimesingle" disabled />
+						<uni-datetime-picker type="datetime" return-type="timestamp" v-model="form.expireDate" disabled />
 					</uni-forms-item>
 					<uni-forms-item label="客户类型">
-						<uni-easyinput v-model="form.city" disabled />
+						<uni-easyinput v-model="customerType" disabled />
 					</uni-forms-item>
 				</uni-forms>
 			</view>
@@ -68,72 +76,96 @@
 </template>
 
 <script>
+	import { queryCustomerDetails, querySchool, queryIndustryClass, queryIndustry } from '@/apis/modules/client.js'
 	export default {
 		data() {
 			return {
-				candidates: ['北京', '南京', '东京', '武汉', '天津', '上海', '海口'],
-				dataTree: [{
-						text: "一年级",
-						value: "1-0",
-						children: [{
-								text: "1.1班",
-								value: "1-1"
-							},
-							{
-								text: "1.2班",
-								value: "1-2"
-							}
-						]
-					},
-					{
-						text: "二年级",
-						value: "2-0",
-						children: [{
-								text: "2.1班",
-								value: "2-1"
-							},
-							{
-								text: "2.2班",
-								value: "2-2"
-							}
-						]
-					},
-					{
-						text: "三年级",
-						value: "3-0",
-						disable: true
-					}
-				],
-				form: {
-					name: '',
-					provience: '',
-					city: '',
-					industryId: '',
-					age: '',
-					introduction: '',
-					sex: 2,
-					hobby: [5],
-					datetimesingle: 1627529992399
-				},
-				sexs: [{
-					text: '男',
-					value: 0
-				}, {
-					text: '女',
+				isDetail: false,
+				customerId: '',
+				// 客户类型
+				customerTypeList: [{
+					name: '正式',
 					value: 1
-				}, {
-					text: '保密',
+				},
+				{
+					name: '试用',
 					value: 2
+				},
+				{
+					name: '到期',
+					value: 3
 				}],
+				schoolList: [],
+				industryClassList: [],
+				industryList: [],
+				form: {
+					customerId: '',
+					customerName: '',
+					industryClassId: '',
+					industryId: '',
+					provinceId: '',
+					account: '',
+					name: '',
+					phone: '',
+					position: '',
+					cityId: '',
+					customerType: '',
+					expireDate: '',
+					email: '',
+					schoolId: ''
+				},
+				customerType: '',
 			}
 		},
-		onLoad() {
+		onLoad(option) {
+			this.customerId = option.customerId
+			this.isDetail = !!option.show
 			
+			option.customerId && this.getInfo()
+			this.getSchool()
+			this.getIndustryClass()
 		},
 		methods: {
-			onchange(e) {
-				console.log('---------onchange:', e);
+			// 获取详情
+			getInfo() {
+				queryCustomerDetails({
+					customerId: this.customerId
+				}).then(({ result }) => {
+					const { customer } = result
+					this.form = customer
+					this.customerType = this.customerTypeList.find(e => e.value === customer.customerType).name
+				}).catch(e => {})
+			},
+			// 获取学校列表
+			getSchool() {
+				querySchool({
+					schoolName: '',
+					provinceId: '',
+					cityId: ''
+				}).then(({ list }) => {
+					this.schoolList = list
+				}).catch(res => {})
+			},
+			// 获取行业类
+			getIndustryClass() {
+				queryIndustryClass().then(({ list }) => {
+					this.industryClassList = list
+				}).catch(res => {})
+			},
+			// 行业分类选择回调
+			industryClassChange() {
+				console.log(this.form.industryClassId)
+				this.getIndustry()
+			},
+			// 获取行业
+			getIndustry() {
+				queryIndustry({
+					industryClassId: this.form.industryClassId
+				}).then(({ list }) => {
+					this.industryList = list
+				}).catch(res => {})
 			},
+			// 跳转
 			toPage(path) {
 				this.$util.to(path)
 			}
@@ -156,6 +188,7 @@
 	background-color: #fff;
 }
 .action {
+	z-index: 2;
 	position: fixed;
 	bottom: 0;
 	display: flex;
diff --git a/pages/clients/clients.vue b/pages/clients/clients.vue
index ac1d9bd..538e815 100644
--- a/pages/clients/clients.vue
+++ b/pages/clients/clients.vue
@@ -1,16 +1,17 @@
 <template>
-	<view>
+	<view class="page">
 		<ul class="tab">
 			<li v-for="(tab, i) in tabs" :class="{active: curTab === tab.id}" @click="tabChange(tab)">{{ tab.name }}</li>
 		</ul>
 		
-		<view class="top">
-			<uni-search-bar class="search" radius="5" placeholder="请输入客户名称" clearButton="auto" cancelButton="none" @confirm="search" />
-			<uni-icons class="icon" custom-prefix="iconfont" type="icon-filter" size="18" color="#007eff"></uni-icons>
-		</view>
+		<sl-filter :independence="true" :menuList="menuList" @result="result"></sl-filter>
+
+		<uni-card :is-shadow="false" :border="false" padding="0" is-full>
+			<uni-search-bar class="search" radius="5" placeholder="请输入客户名称" v-model="keyword" clearButton="auto" cancelButton="none" @confirm="search" />
+		</uni-card>
 		
 		<ul class="list">
-			<li v-for="item in list" @click="toDetail">
+			<li v-for="item in list" @click="toDetail(item)">
 				<view class="name">{{ item.customerName }}</view>	
 				<view class="info">
 					<view class="left">
@@ -25,14 +26,39 @@
 				</view>
 			</li>
 		</ul>
+		<uni-load-more :status="status" />
+		<uni-icons class="plus" type="plus-filled" size="60" color="#007eff" @click="$util.to('../clientDetail/clientDetail')"></uni-icons>
 	</view>
 </template>
 
 <script>
 	import { queryCustomer } from '@/apis/modules/client.js'
+	import slFilter from '@/components/sl-filter/sl-filter.vue'
 	export default {
 		data() {
 			return {
+				menuList: [
+				    {
+				        'title': '客户类型',
+				        'detailTitle': '请选择客户类型',
+				        'key': 'customerType',
+				        'isMutiple': false,
+				        'detailList': [
+				            {
+				                'title': '正式',
+				                'value': 1
+				            },
+				            {
+				                'title': '试用',
+				                'value': 2
+				            },
+				            {
+				                'title': '到期',
+				                'value': 3
+				            }
+				        ]
+				    }
+				],
 				curTab: 0,
 				tabs: [
 					{
@@ -44,22 +70,41 @@
 						id: 1
 					}
 				],
-				reachBottom: 0,
+				reachBottom: 0, // 是否是上拉加载。0->否,1->是,-1->加载完所有数据
+				isFilter: 0, // 是否是在筛选。0->否,1->是
+				status: 'more', // 上拉加载状态 more|loading|noMore
+				searchTimer: null,
+				customerType: '',
+				keyword: '',
 				list: [],
 				page: 1,
 				pageSize: 10
 			}
 		},
+		components: {
+			slFilter
+		},
+		watch: {
+			keyword (newName, oldName) {
+				clearTimeout(this.searchTimer)
+				this.searchTimer = setTimeout(() => {
+					this.isFilter = 1
+					this.initList()
+				}, 500)
+			}
+		},
 		onPullDownRefresh() {
-			this.initPage()
+			this.initList()
 			setTimeout(() => {
 				uni.stopPullDownRefresh()
 			}, 1500)
 		},
 		onReachBottom() {
-			this.reachBottom = 1
-			uni.showNavigationBarLoading()
-			this.getList()
+			if (this.reachBottom >= 0) {
+				this.reachBottom = 1
+				this.status = 'loading'
+				this.getList()
+			}
 		},
 		onLoad() {
 			this.getList()
@@ -70,41 +115,43 @@
 					countries: '中国',
 					provinceId: '',
 					cityId: '',
-					searchContent: '',
+					searchContent: this.keyword,
 					page: this.page,
 					size: this.pageSize
 				}).then(({ message }) => {
-					this.list = this.reachBottom ? [...this.list, ...message.list] : message.list
-					this.reachBottom = 0
-					this.page++
-					uni.hideNavigationBarLoading()
-				}).catch(e => {
-					
-				})
+					// 未加载完所有数据，并且不是筛选，则拼接list，否则直接赋值
+					this.list = (this.reachBottom >= 0 && !this.isFilter) ? [...this.list, ...message.list] : message.list
+					this.page++ // 每次获取了数据后page+1
+					const noMore = this.list.length === message.totalCount // 是否加载完所有数据
+					this.status = noMore ? 'noMore' : 'more' // 加载完了则设置为noMore
+					this.reachBottom = noMore ? -1 : 0 // 加载完了则设置为-1
+					this.isFilter = 0 // 获取数据后筛选状态重置为0
+				}).catch(e => {})
 			},
-			initPage() {
+			initList() {
 				this.page = 1
 				this.getList()
 			},
+			// 筛选确定回调
+			result(val) {
+				this.customerType = val.customerType
+			},
 			// tab切换
 			tabChange(tab) {
 				this.curTab = tab.id
 			},
-			search(res) {
-				uni.showToast({
-					title: '搜索：' + res.value,
-					icon: 'none'
-				})
-			},
 			// 跳转详情
-			toDetail() {
-				this.$util.to('../clientDetail/clientDetail')
+			toDetail(item) {
+				this.$util.to(`../clientDetail/clientDetail?customerId=${item.customerId}&show=1`)
 			}
 		}
 	}
 </script>
 
 <style scoped lang="scss">
+.page {
+	padding-bottom: 90px;
+}
 .top {
 	display: flex;
 	align-items: center;
@@ -116,10 +163,11 @@
 	}
 }
 .list {
+	margin-top: 10px;
 	background-color: #fff;
 	li {
 		padding: 10px 20px;
-		border-bottom: 2px solid #f8f8f8;
+		border-bottom: 2px solid #f1f1f1;
 	}
 	.name {
 		font-size: 16px;
diff --git a/pages/orderDetail/orderDetail.vue b/pages/orderDetail/orderDetail.vue
new file mode 100644
index 0000000..745c983
--- /dev/null
+++ b/pages/orderDetail/orderDetail.vue
@@ -0,0 +1,231 @@
+<template>
+	<view class="container">
+		<uni-section title="基本信息" type="line">
+			<view class="form">
+				<uni-forms ref="baseForm" :modelValue="form" label-width="100">
+					<uni-forms-item label="商务经理">
+						<uni-easyinput v-model="form.provience" disabled />
+					</uni-forms-item>
+					<uni-forms-item label="客户名称" name="contact" required>
+						<uni-easyinput v-model="form.contact" placeholder="请选择" disabled />
+					</uni-forms-item>
+					<uni-forms-item label="省份">
+						<uni-easyinput v-model="form.provience" disabled />
+					</uni-forms-item>
+					<uni-forms-item label="城市">
+						<uni-easyinput v-model="form.city" disabled />
+					</uni-forms-item>
+					<uni-forms-item label="联系人">
+						<uni-easyinput v-model="form.provience" disabled />
+					</uni-forms-item>
+					<uni-forms-item label="电话">
+						<uni-easyinput v-model="form.city" disabled />
+					</uni-forms-item>
+					<uni-forms-item label="邮箱">
+						<uni-easyinput v-model="form.provience" disabled />
+					</uni-forms-item>
+					<uni-forms-item label="订单类型">
+						<uni-data-checkbox v-model="form.orderType" :localdata="orderTypes" disabled></uni-data-checkbox>
+					</uni-forms-item>
+					<uni-forms-item label="订单编号">
+						<uni-easyinput v-model="form.provience" disabled />
+					</uni-forms-item>
+					<uni-forms-item label="订单时间">
+						<uni-easyinput v-model="form.city" disabled />
+					</uni-forms-item>
+					<uni-forms-item label="订单金额(元)">
+						<uni-easyinput v-model="form.provience" disabled />
+					</uni-forms-item>
+				</uni-forms>
+			</view>
+		</uni-section>
+		
+		<uni-section title="实训课程" type="line">
+			<uni-card :is-shadow="false" :border="false" is-full>
+				<ul class="pro-list">
+					<li>
+						<view class="name">
+							程序设计
+						</view>
+						<view class="info">
+							<view class="line">
+								<view class="label">使用期限</view>
+								<view class="val">202323-34123</view>
+							</view>
+							<view class="line">
+								<view class="label">市场价（元）</view>
+								<view class="val">20232</view>
+							</view>
+							<view class="line">
+								<view class="label">结算价</view>
+								<view class="val">2023</view>
+							</view>
+							<view class="line">
+								<view class="label">折扣率</view>
+								<view class="val">23</view>
+							</view>
+							<view class="line">
+								<view class="label">平台服务费</view>
+								<view class="val">2123</view>
+							</view>
+							<view class="line done">
+								<view class="label">成交价格</view>
+								<view class="val">2123</view>
+							</view>
+						</view>
+					</li>
+				</ul>
+			</uni-card>
+		</uni-section>
+		<view class="product">
+			<view class="total">
+				<text>订单总成交价合计：231245元</text>
+			</view>
+			<view class="list">
+				<view class="line">总采购成本：</view>	
+				<view class="line">总产品利润：</view>	
+			</view>
+		</view>
+		<uni-card :is-shadow="false" :border="false" is-full>
+			<button type="primary" @click="submit('valiForm')">提交</button>
+		</uni-card>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				orderTypes: [{
+					text: '正式',
+					value: 0
+				}, {
+					text: '试用',
+					value: 1
+				}],
+				candidates: ['北京', '南京', '东京', '武汉', '天津', '上海', '海口'],
+				dataTree: [{
+						text: "一年级",
+						value: "1-0",
+						children: [{
+								text: "1.1班",
+								value: "1-1"
+							},
+							{
+								text: "1.2班",
+								value: "1-2"
+							}
+						]
+					},
+					{
+						text: "二年级",
+						value: "2-0",
+						children: [{
+								text: "2.1班",
+								value: "2-1"
+							},
+							{
+								text: "2.2班",
+								value: "2-2"
+							}
+						]
+					},
+					{
+						text: "三年级",
+						value: "3-0",
+						disable: true
+					}
+				],
+				form: {
+					orderType: 0,
+					provience: '',
+					city: '',
+					industryId: '',
+					age: '',
+					introduction: '',
+					sex: 2,
+					hobby: [5],
+					datetimesingle: 1627529992399
+				},
+				sexs: [{
+					text: '男',
+					value: 0
+				}, {
+					text: '女',
+					value: 1
+				}, {
+					text: '保密',
+					value: 2
+				}],
+			}
+		},
+		onLoad() {
+			console.log(getApp())
+		},
+		methods: {
+			bindPickerChange: function(e) {
+				console.log('picker发送选择改变，携带值为', e.detail.value)
+				this.index = e.detail.value
+			},
+			onchange(e) {
+				console.log('---------onchange:', e);
+			},
+			submit(ref) {
+				this.$refs[ref].validate().then(res => {
+					console.log('success', res);
+					uni.showToast({
+						title: `校验通过`
+					})
+				}).catch(err => {
+					console.log('err', err);
+				})
+			},
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+.form {
+	padding: 15px;
+	background-color: #fff;
+}
+.pro-list {
+	li {
+		padding: 10px 0;
+		border-bottom: 1px solid #f1f1f1;
+	}
+	.name {
+		margin-bottom: 5px;
+		font-size: 16px;
+		color: #666;
+	}
+	.line {
+		display: flex;
+		margin: 5px 0;
+		font-size: 12px;
+	}
+	.done {
+		font-size: 13px;
+		color: #333;
+	}
+	.label {
+		width: 100px;
+	}
+}
+.product {
+	margin: 10px 0;
+	background-color: #fff;
+	.total {
+		padding: 10px 15px;
+		font-size: 13px;
+		border-bottom: 1px solid #ddd;
+	}
+	.list {
+		padding: 10px 15px;
+		.line {
+			line-height: 30px;
+			font-size: 12px;
+		}
+	}
+}
+</style>
diff --git a/pages/orders/orders.vue b/pages/orders/orders.vue
index 5ae73c1..72fef9f 100644
--- a/pages/orders/orders.vue
+++ b/pages/orders/orders.vue
@@ -36,6 +36,49 @@
 	export default {
 		data() {
 			return {
+				menuList: [
+				    {
+				        'title': '客户类型',
+				        'detailTitle': '请选择客户类型',
+				        'key': 'customerType',
+				        'isMutiple': false,
+				        'detailList': [
+				            {
+				                'title': '正式',
+				                'value': 1
+				            },
+				            {
+				                'title': '试用',
+				                'value': 2
+				            },
+				            {
+				                'title': '到期',
+				                'value': 3
+				            }
+				        ]
+				    },
+				    {
+				        'title': '菜单3',
+				        'detailTitle': '子标题3',
+				        'key': 'key_3',
+				        'isSort': true,
+				        'isMutiple': false,
+				        'detailList': [
+				            {
+				                'title': '条件_3_1',
+				                'value': 'val_3_1'
+				            },
+				            {
+				                'title': '条件_3_2',
+				                'value': 'val_3_2'
+				            },
+				            {
+				                'title': '条件_3_3',
+				                'value': 'val_3_3'
+				            }
+				        ]
+				    }
+				],
 				curTab: 0,
 				tabs: [
 					{
@@ -94,9 +137,4 @@
 		color: #ff7b2d;
 	}
 }
-.plus {
-	position: fixed;
-	bottom: 20px;
-	right: 20px;
-}
 </style>
diff --git a/styles/common.scss b/styles/common.scss
index 5039078..e377bbd 100644
--- a/styles/common.scss
+++ b/styles/common.scss
@@ -18,4 +18,9 @@ button[type=primary] {
 		color: $uni-primary;
 		border-bottom-color: $uni-primary;
 	}
+}
+.plus {
+	position: fixed;
+	bottom: 20px;
+	right: 20px;
 }
\ No newline at end of file