4.12页面

.hbuilderx/launch.json

@@ -0,0 +1,16 @@
+{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
+  // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
+    "version": "0.0",
+    "configurations": [{
+     	"default" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"mp-weixin" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"type" : "uniCloud"
+     }
+    ]
+}

App.vue

@@ -0,0 +1,21 @@
+<script>
+	export default {
+		onLaunch: function() {
+			console.log('App Launch')
+		},
+		onShow: function() {
+			console.log('App Show')
+		},
+		onHide: function() {
+			console.log('App Hide')
+		}
+	}
+</script>
+
+<style lang="scss">
+	/*每个页面公共css */
+	@import "uview-ui/index.scss";
+	page{
+		background-color: #E3F7F0;
+	}
+</style>

common/amap-wx.js

@@ -0,0 +1,659 @@
+function AMapWX(a) {
+	this.key = a.key;
+	this.requestConfig = {
+		key: a.key,
+		s: "rsx",
+		platform: "WXJS",
+		appname: a.key,
+		sdkversion: "1.2.0",
+		logversion: "2.0"
+	};
+	this.MeRequestConfig = {
+		key: a.key,
+		serviceName: "https://restapi.amap.com/rest/me"
+	}
+}
+AMapWX.prototype.getWxLocation = function(a, b) {
+	wx.getLocation({
+		type: "gcj02",
+		success: function(c) {
+			c = c.longitude + "," + c.latitude;
+			wx.setStorage({
+				key: "userLocation",
+				data: c
+			});
+			b(c)
+		},
+		fail: function(c) {
+			wx.getStorage({
+				key: "userLocation",
+				success: function(d) {
+					d.data && b(d.data)
+				}
+			});
+			a.fail({
+				errCode: "0",
+				errMsg: c.errMsg || ""
+			})
+		}
+	})
+};
+AMapWX.prototype.getMEKeywordsSearch = function(a) {
+	if (!a.options) return a.fail({
+		errCode: "0",
+		errMsg: "\u7f3a\u5c11\u5fc5\u8981\u53c2\u6570"
+	});
+	var b = a.options,
+		c = this.MeRequestConfig,
+		d = {
+			key: c.key,
+			s: "rsx",
+			platform: "WXJS",
+			appname: a.key,
+			sdkversion: "1.2.0",
+			logversion: "2.0"
+		};
+	b.layerId && (d.layerId = b.layerId);
+	b.keywords && (d.keywords = b.keywords);
+	b.city && (d.city = b.city);
+	b.filter && (d.filter = b.filter);
+	b.sortrule && (d.sortrule = b.sortrule);
+	b.pageNum && (d.pageNum = b.pageNum);
+	b.pageSize && (d.pageSize = b.pageSize);
+	b.sig && (d.sig =
+		b.sig);
+	wx.request({
+		url: c.serviceName + "/cpoint/datasearch/local",
+		data: d,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(e) {
+			(e = e.data) && e.status && "1" === e.status && 0 === e.code ? a.success(e.data) : a.fail({
+				errCode: "0",
+				errMsg: e
+			})
+		},
+		fail: function(e) {
+			a.fail({
+				errCode: "0",
+				errMsg: e.errMsg || ""
+			})
+		}
+	})
+};
+AMapWX.prototype.getMEIdSearch = function(a) {
+	if (!a.options) return a.fail({
+		errCode: "0",
+		errMsg: "\u7f3a\u5c11\u5fc5\u8981\u53c2\u6570"
+	});
+	var b = a.options,
+		c = this.MeRequestConfig,
+		d = {
+			key: c.key,
+			s: "rsx",
+			platform: "WXJS",
+			appname: a.key,
+			sdkversion: "1.2.0",
+			logversion: "2.0"
+		};
+	b.layerId && (d.layerId = b.layerId);
+	b.id && (d.id = b.id);
+	b.sig && (d.sig = b.sig);
+	wx.request({
+		url: c.serviceName + "/cpoint/datasearch/id",
+		data: d,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(e) {
+			(e = e.data) && e.status && "1" === e.status &&
+				0 === e.code ? a.success(e.data) : a.fail({
+					errCode: "0",
+					errMsg: e
+				})
+		},
+		fail: function(e) {
+			a.fail({
+				errCode: "0",
+				errMsg: e.errMsg || ""
+			})
+		}
+	})
+};
+AMapWX.prototype.getMEPolygonSearch = function(a) {
+	if (!a.options) return a.fail({
+		errCode: "0",
+		errMsg: "\u7f3a\u5c11\u5fc5\u8981\u53c2\u6570"
+	});
+	var b = a.options,
+		c = this.MeRequestConfig,
+		d = {
+			key: c.key,
+			s: "rsx",
+			platform: "WXJS",
+			appname: a.key,
+			sdkversion: "1.2.0",
+			logversion: "2.0"
+		};
+	b.layerId && (d.layerId = b.layerId);
+	b.keywords && (d.keywords = b.keywords);
+	b.polygon && (d.polygon = b.polygon);
+	b.filter && (d.filter = b.filter);
+	b.sortrule && (d.sortrule = b.sortrule);
+	b.pageNum && (d.pageNum = b.pageNum);
+	b.pageSize && (d.pageSize = b.pageSize);
+	b.sig && (d.sig = b.sig);
+	wx.request({
+		url: c.serviceName + "/cpoint/datasearch/polygon",
+		data: d,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(e) {
+			(e = e.data) && e.status && "1" === e.status && 0 === e.code ? a.success(e.data) : a.fail({
+				errCode: "0",
+				errMsg: e
+			})
+		},
+		fail: function(e) {
+			a.fail({
+				errCode: "0",
+				errMsg: e.errMsg || ""
+			})
+		}
+	})
+};
+AMapWX.prototype.getMEaroundSearch = function(a) {
+	if (!a.options) return a.fail({
+		errCode: "0",
+		errMsg: "\u7f3a\u5c11\u5fc5\u8981\u53c2\u6570"
+	});
+	var b = a.options,
+		c = this.MeRequestConfig,
+		d = {
+			key: c.key,
+			s: "rsx",
+			platform: "WXJS",
+			appname: a.key,
+			sdkversion: "1.2.0",
+			logversion: "2.0"
+		};
+	b.layerId && (d.layerId = b.layerId);
+	b.keywords && (d.keywords = b.keywords);
+	b.center && (d.center = b.center);
+	b.radius && (d.radius = b.radius);
+	b.filter && (d.filter = b.filter);
+	b.sortrule && (d.sortrule = b.sortrule);
+	b.pageNum && (d.pageNum = b.pageNum);
+	b.pageSize &&
+		(d.pageSize = b.pageSize);
+	b.sig && (d.sig = b.sig);
+	wx.request({
+		url: c.serviceName + "/cpoint/datasearch/around",
+		data: d,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(e) {
+			(e = e.data) && e.status && "1" === e.status && 0 === e.code ? a.success(e.data) : a.fail({
+				errCode: "0",
+				errMsg: e
+			})
+		},
+		fail: function(e) {
+			a.fail({
+				errCode: "0",
+				errMsg: e.errMsg || ""
+			})
+		}
+	})
+};
+AMapWX.prototype.getGeo = function(a) {
+	var b = this.requestConfig,
+		c = a.options;
+	b = {
+		key: this.key,
+		extensions: "all",
+		s: b.s,
+		platform: b.platform,
+		appname: this.key,
+		sdkversion: b.sdkversion,
+		logversion: b.logversion
+	};
+	c.address && (b.address = c.address);
+	c.city && (b.city = c.city);
+	c.batch && (b.batch = c.batch);
+	c.sig && (b.sig = c.sig);
+	wx.request({
+		url: "https://restapi.amap.com/v3/geocode/geo",
+		data: b,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(d) {
+			(d = d.data) && d.status && "1" === d.status ? a.success(d) : a.fail({
+				errCode: "0",
+				errMsg: d
+			})
+		},
+		fail: function(d) {
+			a.fail({
+				errCode: "0",
+				errMsg: d.errMsg || ""
+			})
+		}
+	})
+};
+AMapWX.prototype.getRegeo = function(a) {
+	function b(d) {
+		var e = c.requestConfig;
+		wx.request({
+			url: "https://restapi.amap.com/v3/geocode/regeo",
+			data: {
+				key: c.key,
+				location: d,
+				extensions: "all",
+				s: e.s,
+				platform: e.platform,
+				appname: c.key,
+				sdkversion: e.sdkversion,
+				logversion: e.logversion
+			},
+			method: "GET",
+			header: {
+				"content-type": "application/json"
+			},
+			success: function(g) {
+				if (g.data.status && "1" == g.data.status) {
+					g = g.data.regeocode;
+					var h = g.addressComponent,
+						f = [],
+						k = g.roads[0].name + "\u9644\u8fd1",
+						m = d.split(",")[0],
+						n = d.split(",")[1];
+					if (g.pois &&
+						g.pois[0]) {
+						k = g.pois[0].name + "\u9644\u8fd1";
+						var l = g.pois[0].location;
+						l && (m = parseFloat(l.split(",")[0]), n = parseFloat(l.split(",")[1]))
+					}
+					h.provice && f.push(h.provice);
+					h.city && f.push(h.city);
+					h.district && f.push(h.district);
+					h.streetNumber && h.streetNumber.street && h.streetNumber.number ? (f.push(h
+						.streetNumber.street), f.push(h.streetNumber.number)) : f.push(g.roads[0]
+						.name);
+					f = f.join("");
+					a.success([{
+						iconPath: a.iconPath,
+						width: a.iconWidth,
+						height: a.iconHeight,
+						name: f,
+						desc: k,
+						longitude: m,
+						latitude: n,
+						id: 0,
+						regeocodeData: g
+					}])
+				} else a.fail({
+					errCode: g.data.infocode,
+					errMsg: g.data.info
+				})
+			},
+			fail: function(g) {
+				a.fail({
+					errCode: "0",
+					errMsg: g.errMsg || ""
+				})
+			}
+		})
+	}
+	var c = this;
+	console.log(a);
+	a.location ? b(a.location) : c.getWxLocation(a, function(d) {
+		b(d)
+	})
+};
+AMapWX.prototype.getWeather = function(a) {
+	function b(g) {
+		var h = "base";
+		a.type && "forecast" == a.type && (h = "all");
+		wx.request({
+			url: "https://restapi.amap.com/v3/weather/weatherInfo",
+			data: {
+				key: d.key,
+				city: g,
+				extensions: h,
+				s: e.s,
+				platform: e.platform,
+				appname: d.key,
+				sdkversion: e.sdkversion,
+				logversion: e.logversion
+			},
+			method: "GET",
+			header: {
+				"content-type": "application/json"
+			},
+			success: function(f) {
+				if (f.data.status && "1" == f.data.status)
+					if (f.data.lives) {
+						if ((f = f.data.lives) && 0 < f.length) {
+							f = f[0];
+							var k = {
+								city: {
+									text: "\u57ce\u5e02",
+									data: f.city
+								},
+								weather: {
+									text: "\u5929\u6c14",
+									data: f.weather
+								},
+								temperature: {
+									text: "\u6e29\u5ea6",
+									data: f.temperature
+								},
+								winddirection: {
+									text: "\u98ce\u5411",
+									data: f.winddirection + "\u98ce"
+								},
+								windpower: {
+									text: "\u98ce\u529b",
+									data: f.windpower + "\u7ea7"
+								},
+								humidity: {
+									text: "\u6e7f\u5ea6",
+									data: f.humidity + "%"
+								}
+							};
+							k.liveData = f;
+							a.success(k)
+						}
+					} else f.data.forecasts && f.data.forecasts[0] && a.success({
+						forecast: f.data.forecasts[0]
+					});
+				else a.fail({
+					errCode: f.data.infocode,
+					errMsg: f.data.info
+				})
+			},
+			fail: function(f) {
+				a.fail({
+					errCode: "0",
+					errMsg: f.errMsg || ""
+				})
+			}
+		})
+	}
+
+	function c(g) {
+		wx.request({
+			url: "https://restapi.amap.com/v3/geocode/regeo",
+			data: {
+				key: d.key,
+				location: g,
+				extensions: "all",
+				s: e.s,
+				platform: e.platform,
+				appname: d.key,
+				sdkversion: e.sdkversion,
+				logversion: e.logversion
+			},
+			method: "GET",
+			header: {
+				"content-type": "application/json"
+			},
+			success: function(h) {
+				if (h.data.status && "1" == h.data.status) {
+					h = h.data.regeocode;
+					if (h.addressComponent) var f = h.addressComponent.adcode;
+					else h.aois && 0 < h.aois.length && (f = h.aois[0].adcode);
+					b(f)
+				} else a.fail({
+					errCode: h.data.infocode,
+					errMsg: h.data.info
+				})
+			},
+			fail: function(h) {
+				a.fail({
+					errCode: "0",
+					errMsg: h.errMsg || ""
+				})
+			}
+		})
+	}
+	var d = this,
+		e = d.requestConfig;
+	a.city ? b(a.city) : d.getWxLocation(a, function(g) {
+		c(g)
+	})
+};
+AMapWX.prototype.getPoiAround = function(a) {
+	function b(e) {
+		e = {
+			key: c.key,
+			location: e,
+			s: d.s,
+			platform: d.platform,
+			appname: c.key,
+			sdkversion: d.sdkversion,
+			logversion: d.logversion
+		};
+		a.querytypes && (e.types = a.querytypes);
+		a.querykeywords && (e.keywords = a.querykeywords);
+		wx.request({
+			url: "https://restapi.amap.com/v3/place/around",
+			data: e,
+			method: "GET",
+			header: {
+				"content-type": "application/json"
+			},
+			success: function(g) {
+				if (g.data.status && "1" == g.data.status) {
+					if ((g = g.data) && g.pois) {
+						for (var h = [], f = 0; f < g.pois.length; f++) {
+							var k = 0 ==
+								f ? a.iconPathSelected : a.iconPath;
+							h.push({
+								latitude: parseFloat(g.pois[f].location.split(",")[1]),
+								longitude: parseFloat(g.pois[f].location.split(",")[0]),
+								iconPath: k,
+								width: 22,
+								height: 32,
+								id: f,
+								name: g.pois[f].name,
+								address: g.pois[f].address
+							})
+						}
+						a.success({
+							markers: h,
+							poisData: g.pois
+						})
+					}
+				} else a.fail({
+					errCode: g.data.infocode,
+					errMsg: g.data.info
+				})
+			},
+			fail: function(g) {
+				a.fail({
+					errCode: "0",
+					errMsg: g.errMsg || ""
+				})
+			}
+		})
+	}
+	var c = this,
+		d = c.requestConfig;
+	a.location ? b(a.location) : c.getWxLocation(a, function(e) {
+		b(e)
+	})
+};
+AMapWX.prototype.getStaticmap = function(a) {
+	function b(e) {
+		c.push("location=" + e);
+		a.zoom && c.push("zoom=" + a.zoom);
+		a.size && c.push("size=" + a.size);
+		a.scale && c.push("scale=" + a.scale);
+		a.markers && c.push("markers=" + a.markers);
+		a.labels && c.push("labels=" + a.labels);
+		a.paths && c.push("paths=" + a.paths);
+		a.traffic && c.push("traffic=" + a.traffic);
+		e = "https://restapi.amap.com/v3/staticmap?" + c.join("&");
+		a.success({
+			url: e
+		})
+	}
+	var c = [];
+	c.push("key=" + this.key);
+	var d = this.requestConfig;
+	c.push("s=" + d.s);
+	c.push("platform=" + d.platform);
+	c.push("appname=" + d.appname);
+	c.push("sdkversion=" + d.sdkversion);
+	c.push("logversion=" + d.logversion);
+	a.location ? b(a.location) : this.getWxLocation(a, function(e) {
+		b(e)
+	})
+};
+AMapWX.prototype.getInputtips = function(a) {
+	var b = Object.assign({}, this.requestConfig);
+	a.location && (b.location = a.location);
+	a.keywords && (b.keywords = a.keywords);
+	a.type && (b.type = a.type);
+	a.city && (b.city = a.city);
+	a.citylimit && (b.citylimit = a.citylimit);
+	wx.request({
+		url: "https://restapi.amap.com/v3/assistant/inputtips",
+		data: b,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(c) {
+			c && c.data && c.data.tips && a.success({
+				tips: c.data.tips
+			})
+		},
+		fail: function(c) {
+			a.fail({
+				errCode: "0",
+				errMsg: c.errMsg ||
+					""
+			})
+		}
+	})
+};
+AMapWX.prototype.getDrivingRoute = function(a) {
+	var b = Object.assign({}, this.requestConfig);
+	a.origin && (b.origin = a.origin);
+	a.destination && (b.destination = a.destination);
+	a.strategy && (b.strategy = a.strategy);
+	a.waypoints && (b.waypoints = a.waypoints);
+	a.avoidpolygons && (b.avoidpolygons = a.avoidpolygons);
+	a.avoidroad && (b.avoidroad = a.avoidroad);
+	wx.request({
+		url: "https://restapi.amap.com/v3/direction/driving",
+		data: b,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(c) {
+			c && c.data && c.data.route && a.success({
+				paths: c.data.route.paths,
+				taxi_cost: c.data.route.taxi_cost || ""
+			})
+		},
+		fail: function(c) {
+			a.fail({
+				errCode: "0",
+				errMsg: c.errMsg || ""
+			})
+		}
+	})
+};
+AMapWX.prototype.getWalkingRoute = function(a) {
+	var b = Object.assign({}, this.requestConfig);
+	a.origin && (b.origin = a.origin);
+	a.destination && (b.destination = a.destination);
+	wx.request({
+		url: "https://restapi.amap.com/v3/direction/walking",
+		data: b,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(c) {
+			c && c.data && c.data.route && a.success({
+				paths: c.data.route.paths
+			})
+		},
+		fail: function(c) {
+			a.fail({
+				errCode: "0",
+				errMsg: c.errMsg || ""
+			})
+		}
+	})
+};
+AMapWX.prototype.getTransitRoute = function(a) {
+	var b = Object.assign({}, this.requestConfig);
+	a.origin && (b.origin = a.origin);
+	a.destination && (b.destination = a.destination);
+	a.strategy && (b.strategy = a.strategy);
+	a.city && (b.city = a.city);
+	a.cityd && (b.cityd = a.cityd);
+	wx.request({
+		url: "https://restapi.amap.com/v3/direction/transit/integrated",
+		data: b,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(c) {
+			c && c.data && c.data.route && (c = c.data.route, a.success({
+				distance: c.distance || "",
+				taxi_cost: c.taxi_cost ||
+					"",
+				transits: c.transits
+			}))
+		},
+		fail: function(c) {
+			a.fail({
+				errCode: "0",
+				errMsg: c.errMsg || ""
+			})
+		}
+	})
+};
+AMapWX.prototype.getRidingRoute = function(a) {
+	var b = Object.assign({}, this.requestConfig);
+	a.origin && (b.origin = a.origin);
+	a.destination && (b.destination = a.destination);
+	wx.request({
+		url: "https://restapi.amap.com/v3/direction/riding",
+		data: b,
+		method: "GET",
+		header: {
+			"content-type": "application/json"
+		},
+		success: function(c) {
+			c && c.data && c.data.route && a.success({
+				paths: c.data.route.paths
+			})
+		},
+		fail: function(c) {
+			a.fail({
+				errCode: "0",
+				errMsg: c.errMsg || ""
+			})
+		}
+	})
+};
+module.exports.AMapWX = AMapWX;

common/http.interceptor.js

@@ -0,0 +1,71 @@
+// common/http.interceptor.js
+import url from "./url.js"
+import md5Libs from "../uview-ui/libs/function/md5.js"
+// console.log(url);
+// 这里的Vue为Vue对象(非创建出来的实例)，vm为main.js中“Vue.use(httpInterceptor, app)”这一句的第二个参数，
+// 为一个Vue的实例，也即每个页面的"this"
+// 如果需要了解这个install方法是什么，请移步：https://uviewui.com/components/vueUse.html
+const install = (Vue, vm) => {
+	// 此为自定义配置参数，具体参数见上方说明
+	Vue.prototype.$u.http.setConfig({
+		baseUrl: url,
+		loadingText: '努力加载中~',
+		loadingTime: 800,
+		// 设置自定义头部content-type
+		// header: {
+		// 	'content-type': 'application/x-www-form-urlencoded'
+		// }
+		// ......
+	});
+	// 请求拦截部分，如配置，每次请求前都会执行
+	Vue.prototype.$u.http.interceptor.request = (config) => {
+		// 引用token
+		// 方式一，存放在vuex的token，假设使用了uView封装的vuex方式
+		// 见：https://uviewui.com/components/globalVariable.html
+		// config.header.token = vm.token;
+
+		// 方式二，如果没有使用uView封装的vuex方法，那么需要使用$store.state获取
+		// config.header.token = vm.$store.state.token;
+
+		// 方式三，如果token放在了globalData，通过getApp().globalData获取
+		// config.header.token = getApp().globalData.username;
+
+		// 方式四，如果token放在了Storage本地存储中，拦截是每次请求都执行的
+		// 所以哪怕您重新登录修改了Storage，下一次的请求将会是最新值
+		if (config.method == "POST") {
+			var timestamp = parseInt(new Date().getTime() / 1000)
+			var secret_key = 'cXab5HR4pfBjdDryr2JjwbreieKVjA'
+			var params = config.data.content
+			var str = '';
+			for (var Key in params) {
+				str += Key + '=' + params[Key] + '&';
+			}
+			var sign = md5Libs.md5(`${str}timestamp=${timestamp}&secret_key=${secret_key}`)
+			console.log(`${str}timestamp=${timestamp}&secret_key=${secret_key}`);
+			var phonetype = uni.getSystemInfoSync().model
+			config.data.header = config.data.header || {}
+			config.data.header.sign = sign
+			config.data.header.timestamp = timestamp
+			config.data.header.phonetype = phonetype
+			config.data.header.category = 3
+			config.data.header.secret_key = secret_key
+			config.data.header.debug = "5CDAC27A0F89C916553DE870F3C55181"//默认登录
+		}
+		const token = uni.getStorageSync('token');
+		config.data.header.token = token;
+		config.header.token = token;
+		config.data = {
+			request: JSON.stringify(config.data) //config.data
+		}
+		// 可以对某个url进行特别处理，此url参数为this.$u.get(url)中的url值
+		// if (config.url == '/user/login') config.header.noToken = true;
+		// 最后需要将config进行return
+		return config;
+		// 如果return一个false值，则会取消本次请求
+		// if(config.url == '/user/rest') return false; // 取消某次请求
+	}
+}
+
+export default {
+	install
+}

common/url.js

@@ -0,0 +1,2 @@
+var url = 'http://app.dd.ponyinfo.net/'
+export default url

components/x-button.vue

@@ -0,0 +1,119 @@
+<template>
+	<view class="x-button" :style="[buttonstyle]">
+		<view class="child-button" :style="[childstyle]"></view>
+		<view class="content-button" :style="[contentstyle]" @tap="dianji">
+			<slot></slot>
+		</view>
+	</view>
+</template>
+
+<script>
+	/**
+	 * button 按钮
+	 * @description Button 按钮
+	 * @property {String} font-size 文字的大小
+	 * @property {Number} width 宽度
+	 * @property {Number} height 高度
+	 * @property {String} borderRadius 圆角
+	 * @property {String} color 文字颜色
+	 * @event {Function} click 按钮点击
+	 * @example <x-button>按钮</x-button>
+	 */
+	export default {
+		props: {
+			width: {
+				type: Number,
+				default: 303
+			},
+			height: {
+				type: Number,
+				default: 104
+			},
+			borderRadius: {
+				type: String,
+				default: "30rpx"
+			},
+			fontSize: {
+				type: String,
+				default: "33rpx"
+			},
+			color: {
+				type: String,
+				default: "#08AA8C"
+			}
+		},
+		created() {
+
+		},
+		computed: {
+			buttonstyle() {
+				return {
+					width: this.width + 'rpx',
+					height: this.height + 'rpx',
+					borderRadius: this.borderRadius,
+				}
+			},
+			childstyle() {
+				return {
+					width: this.width + 'rpx',
+					height: this.height + 'rpx',
+					borderRadius: this.borderRadius,
+				}
+			},
+			contentstyle() {
+				return {
+					width: this.width - 4 + 'rpx',
+					height: this.height - 4 + 'rpx',
+					borderRadius: this.borderRadius,
+					lineHeight: this.height - 4 + 'rpx',
+					fontSize: this.fontSize,
+					color: this.color
+				}
+			}
+		},
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			dianji() {
+				this.$emit('click')
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.x-button {
+		position: relative;
+		border: 2rpx solid transparent;
+		background-color: transparent;
+		border-radius: 100rpx;
+		background-clip: padding-box;
+		margin: 0 auto;
+
+		.content-button {
+			position: relative;
+			z-index: 1;
+			text-align: center;
+			background-color: #E5F7F2;
+			font-family: SimHei;
+			font-weight: 400;
+		}
+
+		.child-button {
+			position: absolute;
+			top: -2rpx;
+			right: -2rpx;
+			bottom: -2rpx;
+			left: -2rpx;
+			background: linear-gradient(90deg, #08AA8C, #FDCE1C);
+			box-shadow: 0rpx 0rpx 9rpx 0rpx rgba(0, 0, 0, 0.75);
+
+		}
+	}
+</style>

components/x-navbar.vue

@@ -0,0 +1,210 @@
+<template>
+	<view class="x-navbar">
+		<u-navbar :background="{background:'#2AA47F'}" :is-back="false" :title="title" :borderBottom="false"
+			title-color="#fff">
+			<view class="left-box u-flex u-col-center" slot="left">
+				<image src="/static/images/index1-1.png" @tap="show = true" style="width: 47rpx;height: 43rpx;" mode=""></image>
+				<view style="width: 47rpx;height: 43rpx;position: relative;margin-right: 25rpx;" @tap="toxiaoxi">
+					<image src="/static/images/index1-2.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
+					<text
+						style="position: absolute;top: -20rpx;right: -10rpx;font-size: 22rpx;width: 30rpx;height: 30rpx;text-align: center;line-height: 30rpx;border-radius: 100rpx;color: #fff;background-color: red;">{{count}}</text>
+				</view>
+				<image src="/static/images/index1-3.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
+			</view>
+			<slot></slot>
+		</u-navbar>
+		<u-popup v-model="show" mode="left">
+			<view class="popup-left">
+				<view :style="{height:statusheight + 'px'}"></view>
+				<view class="popup-user">
+					<image class="img-bg" src="../static/images/userBG.png" mode=""></image>
+					<image src="../static/images/mine1-2.png" class="user-code" @tap="tocode" mode=""></image>
+					<view class="user-box u-flex u-col-center">
+						<image src="../static/images/mine1-1.png" mode=""></image>
+						<text>小马哟哦难怪乎</text>
+					</view>
+				</view>
+				<view :class="active == 0 ? 'tabbar-item tabbar-item1' : 'tabbar-item'" @tap="totabbar(0)">
+					<image v-if="active == 0" src="../static/images/index.png" mode=""></image>
+					<image v-else src="../static/images/index1.png" mode=""></image>
+					<text>首页</text>
+				</view>
+				<view :class="active == 1 ? 'tabbar-item tabbar-item1' : 'tabbar-item'" @tap="totabbar(1)">
+					<image v-if="active == 1" src="../static/images/order.png" mode=""></image>
+					<image v-else src="../static/images/order1.png" mode=""></image>
+					<text>订单</text>
+				</view>
+				<view :class="active == 2 ? 'tabbar-item tabbar-item1' : 'tabbar-item'" @tap="totabbar(2)">
+					<image v-if="active == 2" src="../static/images/shop.png" mode=""></image>
+					<image v-else src="../static/images/shop.png" mode=""></image>
+					<text>商城</text>
+				</view>
+				<view :class="active == 3 ? 'tabbar-item tabbar-item1' : 'tabbar-item'" @tap="totabbar(3)">
+					<image v-if="active == 2" src="../static/images/mine.png" mode=""></image>
+					<image v-else src="../static/images/mine1.png" mode=""></image>
+					<text>我的</text>
+				</view>
+				<!-- <view class="out-login u-flex u-col-center" @tap="toout">
+					<image src="../static/images/mine1-4.png" mode=""></image>
+					<text>退出应用</text>
+				</view> -->
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	/**
+	 * navber 自定义导航栏
+	 * @description navber 自定义导航栏
+	 * @property {String} title 标题
+	 * @property {Number} count 通知数量
+	 * @example <x-navber title="首页"></x-navber>
+	 */
+	export default {
+		props: {
+			title: {
+				type: String,
+				default: ''
+			},
+			count: {
+				type: Number,
+				default: 0
+			},
+			active:{
+				type:Number,
+				default:0
+			}
+		},
+		data() {
+			return {
+				show:false,
+				statusheight:0
+			}
+		},
+		created() {
+			this.statusheight = uni.getSystemInfoSync().statusBarHeight
+		},
+		methods: {
+			tocode(){
+				uni.navigateTo({
+					url:"/pages/mine/yaoqing"
+				})
+			},
+			totabbar(num){
+				this.show = false
+				if(this.active == num){
+					return
+				}
+				if(num == 0){
+					uni.switchTab({
+						url:"/pages/index/home"
+					})
+				}
+				if(num == 1){
+					uni.switchTab({
+						url:"/pages/order/order"
+					})
+				}
+				if(num == 2){
+					uni.switchTab({
+						url:"/pages/shop/shop"
+					})
+				}
+				if(num == 3){
+					uni.switchTab({
+						url:"/pages/mine/mine"
+					})
+				}
+			},
+			toxiaoxi() {
+				uni.navigateTo({
+					url: "/pages/mine/xiaoxi"
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.x-navbar {
+		.popup-left{
+			width: 450rpx;
+			.out-login{
+				padding: 20rpx 0;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				margin-top: 200rpx;
+				image{
+					width: 34rpx;
+					height: 34rpx;
+					margin: 0 40rpx;
+				}
+				text{
+					flex: 1;
+					font-size: 24rpx;
+				}
+			}
+			.tabbar-item{
+				padding: 20rpx 0;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				image{
+					width: 44rpx;
+					height: 44rpx;
+					margin: 0 40rpx;
+				}
+				text{
+					flex: 1;
+					font-size: 24rpx;
+				}
+			}
+			.tabbar-item1{
+				background-color: #2AA47F;
+				text{
+					color: #fff;
+				}
+			}
+			.popup-user{
+				width: 450rpx;
+				height: 300rpx;
+				position: relative;
+				.user-box{
+					width: 380rpx;
+					left: 30rpx;
+					bottom: 20rpx;
+					position: absolute;
+					image{
+						width: 120rpx;
+						height: 120rpx;
+						border-radius: 100rpx;
+						margin-right: 20rpx;
+					}
+					text{
+						color: #fff;
+					}
+				}
+				.user-code{
+					position: absolute;
+					top: 10rpx;
+					right: 10rpx;
+					width: 50rpx;
+					height: 50rpx;
+				}
+				.img-bg{
+					width: 450rpx;
+					height: 300rpx;
+				}
+			}
+		}
+		.left-box {
+			padding: 0 25rpx;
+
+			image {
+				margin-right: 25rpx;
+			}
+		}
+	}
+</style>

index.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <script>
+      var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
+        CSS.supports('top: constant(a)'))
+      document.write(
+        '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
+        (coverSupport ? ', viewport-fit=cover' : '') + '" />')
+    </script>
+    <title></title>
+    <!--preload-links-->
+    <!--app-context-->
+  </head>
+  <body>
+    <div id="app"><!--app-html--></div>
+    <script type="module" src="/main.js"></script>
+  </body>
+</html>

main.js

@@ -0,0 +1,41 @@
+import App from './App'
+
+// #ifndef VUE3
+import Vue from 'vue'
+
+var amapFile = require('./common/amap-wx.js');
+Vue.prototype.myAmapFun = new amapFile.AMapWX({
+	key: 'daba801a5b8eb18e2aee6d0838ea4c61'
+});
+// main.js
+import uView from 'uview-ui';
+Vue.use(uView);
+
+Vue.config.productionTip = false
+App.mpType = 'app'
+const app = new Vue({
+	...App
+})
+
+// http拦截器，此为需要加入的内容，如果不是写在common目录，请自行修改引入路径
+import httpInterceptor from '@/common/http.interceptor.js'
+// 这里需要写在最后，是为了等Vue创建对象完成，引入"app"对象(也即页面的"this"实例)
+Vue.use(httpInterceptor, app)
+
+app.$mount()
+// #endif
+
+
+
+
+// #ifdef VUE3
+import {
+	createSSRApp
+} from 'vue'
+export function createApp() {
+	const app = createSSRApp(App)
+	return {
+		app
+	}
+}
+// #endif

manifest.json

@@ -0,0 +1,82 @@
+{
+    "name" : "小马叮叮",
+    "appid" : "__UNI__AA38392",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    /* 5+App特有相关 */
+    "app-plus" : {
+        "usingComponents" : true,
+        "nvueStyleCompiler" : "uni-app",
+        "compilerVersion" : 3,
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        /* 模块配置 */
+        "modules" : {},
+        /* 应用发布信息 */
+        "distribute" : {
+            /* android打包配置 */
+            "android" : {
+                "permissions" : [
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+                ]
+            },
+            /* ios打包配置 */
+            "ios" : {},
+            /* SDK配置 */
+            "sdkConfigs" : {
+                "payment" : {
+                    "weixin" : {
+                        "__platform__" : [ "ios", "android" ],
+                        "appid" : "",
+                        "UniversalLinks" : ""
+                    }
+                },
+                "share" : {},
+                "oauth" : {}
+            }
+        }
+    },
+    /* 快应用特有相关 */
+    "quickapp" : {},
+    /* 小程序特有相关 */
+    "mp-weixin" : {
+        "appid" : "wx37fa2b690a4cf983",
+        "setting" : {
+            "urlCheck" : false
+        },
+        "usingComponents" : true
+    },
+    "mp-alipay" : {
+        "usingComponents" : true
+    },
+    "mp-baidu" : {
+        "usingComponents" : true
+    },
+    "mp-toutiao" : {
+        "usingComponents" : true
+    },
+    "uniStatistics" : {
+        "enable" : false
+    },
+    "vueVersion" : "2"
+}

pages.json

@@ -0,0 +1,378 @@
+{
+	"easycom": {
+		// 下载安装的方式需要前面的"@/"，npm安装的方式无需"@/"
+		// 下载安装方式
+		"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue",
+		// npm安装方式
+		// "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
+		"^x-(.*)": "@/components/x-$1.vue"
+	},
+	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
+		{
+			"path": "pages/index/index",
+			"style": {
+				"navigationBarTitleText": "广告页",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/index/home",
+			"style": {
+				"navigationBarTitleText": "首页",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/index/paotui",
+			"style": {
+				"navigationBarTitleText": "跑腿服务",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/index/daijia",
+			"style": {
+				"navigationBarTitleText": "代驾服务",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/order/order-info",
+			"style": {
+				"navigationBarTitleText": "",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/order/jindu",
+			"style": {
+				"navigationBarTitleText": "",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/order/fuwu-orderinfo",
+			"style": {
+				"navigationBarTitleText": "",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/index/change-address",
+			"style": {
+				"navigationBarTitleText": "选择地址",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/index/weixiu",
+			"style": {
+				"navigationBarTitleText": "水电服务",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/index/other-tabs",
+			"style": {
+				"navigationBarTitleText": "其他服务",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/forget",
+			"style": {
+				"navigationBarTitleText": "找回密码",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/order/order",
+			"style": {
+				"navigationBarTitleText": "订单",
+				"navigationStyle": "custom",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/fuwu/fuwu",
+			"style": {
+				"navigationBarTitleText": "小马服务商",
+				"navigationStyle": "custom",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/more-fuwu",
+			"style": {
+				"navigationBarTitleText": "开通服务",
+				"navigationBarTextStyle": "white",
+				"navigationBarBackgroundColor": "#2AA47F"
+			}
+		},
+		{
+			"path": "pages/mine/kaitong-fuwu",
+			"style": {
+				"navigationBarTitleText": "开通服务",
+				"navigationBarTextStyle": "white",
+				"navigationBarBackgroundColor": "#2AA47F"
+			}
+		},
+		{
+			"path": "pages/mine/mine",
+			"style": {
+				"navigationBarTitleText": "我的",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/shop/shop-orderinfo",
+			"style": {
+				"navigationBarTitleText": "订单",
+				"navigationBarTextStyle":"white",
+				"navigationBarBackgroundColor": "#2AA47F"
+			}
+		},
+		{
+			"path": "pages/shop/shop-order",
+			"style": {
+				"navigationBarTitleText": "店铺订单",
+				"navigationStyle": "custom",
+				"navigationBarTextStyle":"white"
+			}
+		},
+		{
+			"path": "pages/shop/myshop",
+			"style": {
+				"navigationBarTitleText": "我的店铺",
+				"navigationStyle": "custom",
+				"navigationBarTextStyle":"white"
+			}
+		},
+		{
+			"path": "pages/shop/shop",
+			"style": {
+				"navigationBarTitleText": "商城",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/shop/search",
+			"style": {
+				"navigationBarTitleText": "商品搜索",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/shop/xiadan",
+			"style": {
+				"navigationBarTitleText": "确定下单",
+				"navigationBarBackgroundColor": "#2AA47F",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/shop/goods-info",
+			"style": {
+				"navigationBarTitleText": "商品详情",
+				"navigationBarTextStyle": "white",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/mine/login",
+			"style": {
+				"navigationBarTitleText": "登录",
+				"navigationBarBackgroundColor": "#E3F7F0"
+			}
+		},
+		{
+			"path": "pages/mine/address-list",
+			"style": {
+				"navigationBarTitleText": "地址管理",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/address-set",
+			"style": {
+				"navigationBarTitleText": "地址管理",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/setting",
+			"style": {
+				"navigationBarTitleText": "应用设置",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/change-tel",
+			"style": {
+				"navigationBarTitleText": "更换手机绑定",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/change-pwd",
+			"style": {
+				"navigationBarTitleText": "设置密码",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/anquan",
+			"style": {
+				"navigationBarTitleText": "帐号安全",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/tel-list",
+			"style": {
+				"navigationBarTitleText": "设置手机号密码",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/tel-add",
+			"style": {
+				"navigationBarTitleText": "设置手机号",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/wenda-list",
+			"style": {
+				"navigationBarTitleText": "设置找回密码问答",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/wenda-add",
+			"style": {
+				"navigationBarTitleText": "设置问答",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/forget-tel",
+			"style": {
+				"navigationBarTitleText": "找回密码",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/xiaoxi",
+			"style": {
+				"navigationBarTitleText": "消息管理",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/yaoqing",
+			"style": {
+				"navigationBarTitleText": "用户邀请码",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/yaoqing-user",
+			"style": {
+				"navigationBarTitleText": "已邀请用户",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/userinfo",
+			"style": {
+				"navigationBarTitleText": "个人资料",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/forget-wen",
+			"style": {
+				"navigationBarTitleText": "找回密码",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/forget-wen1",
+			"style": {
+				"navigationBarTitleText": "找回密码",
+				"navigationBarBackgroundColor": "#09AA8C",
+				"navigationBarTextStyle": "white"
+			}
+		},
+		{
+			"path": "pages/mine/login-code",
+			"style": {
+				"navigationBarTitleText": "短信注册/登录",
+				"navigationBarBackgroundColor": "#E3F7F0"
+			}
+		}
+	],
+	"globalStyle": {
+		"navigationBarTextStyle": "black",
+		"navigationBarTitleText": "uni-app",
+		"navigationBarBackgroundColor": "#F8F8F8",
+		"backgroundColor": "#F8F8F8"
+	},
+	"tabBar": {
+		"color": "#D7D7D7",
+		"selectedColor": "#FFFFFF",
+		"backgroundColor": "#2AA47F",
+		"list": [{
+				"iconPath": "static/images/index1.png",
+				"selectedIconPath": "static/images/index.png",
+				"pagePath": "pages/index/home",
+				"text": "主页"
+			},
+			{
+				"iconPath": "static/images/order1.png",
+				"selectedIconPath": "static/images/order.png",
+				"pagePath": "pages/order/order",
+				"text": "订单"
+			},
+			{
+				"iconPath": "static/images/shop.png",
+				"selectedIconPath": "static/images/shop.png",
+				"pagePath": "pages/shop/shop",
+				"text": "商城"
+			},
+			{
+				"iconPath": "static/images/mine1.png",
+				"selectedIconPath": "static/images/mine.png",
+				"pagePath": "pages/mine/mine",
+				"text": "我的"
+			}
+		]
+	}
+}

pages/fuwu/fuwu.vue

@@ -0,0 +1,310 @@
+<template>
+	<view class="fuwu">
+		<u-navbar :background="{background:'#2AA47F'}" title="小马服务商" :borderBottom="false"
+			title-color="#fff" back-icon-color="#fff">
+			<view class="left-box u-flex u-col-center" slot="left">
+				<view style="width: 47rpx;height: 43rpx;position: relative;margin-right: 25rpx;">
+					<image src="../../static/images/index1-2.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
+					<text style="position: absolute;top: -20rpx;right: -10rpx;font-size: 22rpx;width: 30rpx;height: 30rpx;text-align: center;line-height: 30rpx;border-radius: 100rpx;color: #fff;background-color: red;">99</text>
+				</view>
+				<image src="../../static/images/fuwu1-1.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
+			</view>
+		</u-navbar>
+		<view class="row-box1 u-flex u-col-center u-row-between">
+			<text class="text1">您已是服务提供者</text>
+		</view>
+		<view class="row-box2 u-flex u-col-center">
+			<text class="text1">在线接单状态</text>
+			<u-switch v-model="checked" size="35" active-color="#08AA8C"></u-switch>
+		</view>
+		<view class="row-box3 u-flex u-col-center">
+			<text class="text1">接单时间：9:00 至 23：30</text>
+			<!-- <view class="text2">
+				<text>设置时间</text>
+			</view> -->
+			<x-button :width="178" :height="46" color="#000" fontSize="30rpx">设置时间</x-button>
+		</view>
+		<view class="order-box">
+			<view class="fuwu-tabs u-flex u-col-center u-row-between">
+				<text :class="fuwutype == 1 ? 'text' : ''">已开通项目</text>
+				<text :class="fuwutype == 2 ? 'text' : ''">申请中项目</text>
+			</view>
+			<view class="fuwu-list u-flex u-col-center">
+				<view class="item u-flex-col u-col-center">
+					<view class="image u-flex u-col-center u-row-center">
+						<image src="../../static/images/t1.png" mode=""></image>
+						<text class="text2">已通过</text>
+					</view>
+					<view class="name">
+						代驾
+					</view>
+				</view>
+				<view class="item u-flex-col u-col-center">
+					<view class="image u-flex u-col-center u-row-center">
+						<image src="../../static/images/t2.png" mode=""></image>
+						<text class="text2">已通过</text>
+					</view>
+					<view class="name">
+						跑腿
+					</view>
+				</view>
+				<view class="item u-flex-col u-col-center">
+					<view class="image u-flex u-col-center u-row-center">
+						<image src="../../static/images/t3.png" mode=""></image>
+						<text class="text2">已通过</text>
+					</view>
+					<view class="name">
+						电工
+					</view>
+				</view>
+				<view class="item u-flex-col u-col-center">
+					<view class="image u-flex u-col-center u-row-center">
+						<image src="../../static/images/t4.png" mode=""></image>
+						<text class="text2">已通过</text>
+					</view>
+					<view class="name">
+						水工
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="down-box-list">
+			<view class="down-title">
+				可申请开通项目
+			</view>
+			<view class="list-box">
+				<view class="item-box u-flex u-col-center u-row-between">
+					<image src="../../static/images/t1.png" mode=""></image>
+					<view class="item-right">
+						
+					</view>
+				</view>
+				<view class="item-box u-flex u-col-center u-row-between">
+					<image src="../../static/images/t2.png" mode=""></image>
+					<view class="item-right">
+						
+					</view>
+				</view>
+				<view class="item-box u-flex u-col-center u-row-between">
+					<image src="../../static/images/t3.png" mode=""></image>
+					<view class="item-right">
+						
+					</view>
+				</view>
+				<view class="item-box u-flex u-col-center u-row-between">
+					<image src="../../static/images/t4.png" mode=""></image>
+					<view class="item-right">
+						
+					</view>
+				</view>
+			</view>
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				fuwutype:1,
+				checked:false
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.fuwu{
+		.down-box-list{
+			padding: 0 24rpx;
+			.list-box{
+				.item-box{
+					margin-bottom: 20rpx;
+					image{
+						width: 126rpx;
+						height: 126rpx;
+						margin-right: 33rpx;
+					}
+					.item-right{
+						flex: 1;
+						height: 126rpx;
+						border-radius: 20rpx;
+						border: 4rpx solid #09AA8C;
+					}
+				}
+				
+			}
+			.down-title{
+				font-size: 31rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				padding: 40rpx 14rpx 20rpx 14rpx;
+			}
+		}
+		.order-box {
+			border: 1rpx solid #A0A0A0;
+			padding: 0 16rpx;
+			border-radius: 20rpx;
+			background-color: #fff;
+			margin: 0 22rpx;
+			padding-bottom: 20rpx;
+		
+			.fuwu-list {
+				.item {
+					width: 25%;
+					margin-top: 10rpx;
+		
+					.name {
+						font-size: 29rpx;
+						font-family: SimHei;
+					}
+		
+					.image {
+						width: 124rpx;
+						height: 124rpx;
+						border-radius: 20rpx;
+						// background-color: #08AA8C;
+						position: relative;
+						margin-bottom: 10rpx;
+		
+						image {
+							width: 124rpx;
+							height: 124rpx;
+						}
+		
+						text {
+							position: absolute;
+							top: 50%;
+							left: 50%;
+							transform: translate(-50%, -50%);
+							padding: 8rpx 17rpx;
+							border-radius: 100rpx;
+							font-size: 19rpx;
+							font-family: SimHei;
+							font-weight: 400;
+							
+							background-color: rgba(256, 256, 256, 0.8);
+							white-space: nowrap;
+						}
+						.text1{
+							color: #E60012;
+						}
+						.text2{
+							color: rgba(8, 170, 140, 1);
+						}
+					}
+				}
+			}
+		
+			.fuwu-tabs {
+				text {
+					width: 50%;
+					text-align: center;
+					padding: 21rpx 0;
+					border-bottom: 7rpx solid #fff;
+					font-size: 29rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #707070;
+				}
+		
+				.text {
+					color: #08AA8C;
+					border-bottom: 7rpx solid #08AA8C;
+				}
+			}
+		
+			.order-tabs {
+				.item {
+					width: 20%;
+					position: relative;
+		
+					image {
+						width: 52rpx;
+						height: 52rpx;
+						margin-bottom: 20rpx;
+					}
+		
+					.text1 {
+						font-size: 28rpx;
+					}
+		
+					.text2 {
+						position: absolute;
+						top: -10rpx;
+						right: 5rpx;
+						width: 39rpx;
+						height: 39rpx;
+						text-align: center;
+						line-height: 39rpx;
+						color: #fff;
+						border-radius: 100rpx;
+						font-size: 24rpx;
+						background-color: red;
+					}
+				}
+			}
+		
+			.box-title {
+				padding: 24rpx 0;
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #707070;
+			}
+		}
+		.left-box {
+			padding: 0 25rpx;
+
+			image {
+				margin-right: 25rpx;
+			}
+		}
+		.row-box3 {
+			padding: 32rpx;
+		
+			.text1 {
+				margin-right: 40rpx;
+				color: #707070;
+				font-size: 25rpx;
+			}
+		
+		}
+		
+		.row-box2 {
+			padding: 0 32rpx;
+		
+			.text1 {
+				font-size: 25rpx;
+				margin-right: 60rpx;
+			}
+		}
+		
+		.row-box1 {
+			padding: 32rpx;
+		
+			.text1 {
+				color: #707070;
+				font-size: 31rpx;
+				flex: 1;
+			}
+		
+			.text2 {
+				font-size: 25rpx;
+				margin-right: 10rpx;
+			}
+		
+			.image1 {
+				width: 27rpx;
+				height: 27rpx;
+			}
+		}
+	}
+</style>

pages/index/change-address.vue

@@ -0,0 +1,162 @@
+<template>
+	<view class="change-address">
+		<view class="address-form">
+			<view class="form-row u-flex u-col-center">
+				<text>联系人:</text>
+				<input type="text" placeholder="请输入姓名" />
+			</view>
+			<view class="form-row u-flex u-col-center">
+				<text>联系电话:</text>
+				<input type="number" placeholder="请输入联系电话" />
+			</view>
+			<view class="form-row u-flex u-col-center">
+				<text>定位地址:</text>
+				<input type="text" placeholder="定位到的地址信息" />
+			</view>
+			<view class="address-text">
+				<textarea placeholder="定位后可修改或填写的地址信息" />
+			</view>
+			<view class="save-address u-flex u-col-center u-row-right">
+				<text class="text1">同时保存到我的地址</text>
+				<u-switch v-model="checked" active-color="#09AA8C" size="40"></u-switch>
+			</view>
+			<x-button :width="180" :height="49" fontSize="27rpx">确认地址</x-button>
+		</view>
+		<view class="address-list">
+			<view class="title">
+				选择已存地址
+			</view>
+			<view class="address-item" v-for="(item,index) in 2" :key="index">
+				<view class="header u-flex u-col-center u-row-right">
+					<text>修改</text>
+					<text>删除</text>
+				</view>
+				<view class="user-box">
+					<text>天赋品策§鹏</text>
+					<text>15916663977</text>
+				</view>
+				<view class="add-text">
+					广东省汕头市龙湖区广东省汕头市龙湖区广东省汕头市龙湖区
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				checked: false
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.change-address {
+		.address-list{
+			width: 691rpx;
+			border-radius: 10rpx;
+			padding: 25rpx;
+			border: 1rpx solid #3DBDA5;
+			margin: 0 auto;
+			.address-item{
+				border: 1rpx solid #FAD445;
+				padding: 0 23rpx 20rpx 23rpx;
+				border-radius: 10rpx;
+				margin-bottom: 20rpx;
+				background-color: #EEEEEE;
+				.add-text{
+					font-size: 27rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #707070;
+				}
+				.user-box{
+					font-size: 27rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #707070;
+					text{
+						margin-right: 20rpx;
+					}
+				}
+				.header{
+					padding: 10rpx 0;
+					font-size: 27rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #08AA8C;
+					border-bottom: 1rpx solid #FAD445;
+					margin-bottom: 20rpx;
+					text{
+						margin-left: 30rpx;
+					}
+				}
+			}
+			.title{
+				padding: 22rpx 0;
+				font-size: 27rpx;
+				font-family: SimHei;
+				font-weight: 400;
+			}
+		}
+		.address-form {
+			width: 691rpx;
+			// height: 533rpx;
+			border: 2rpx solid #DCDCDC;
+			margin: 20rpx auto;
+			background-color: #fff;
+			border-radius: 10rpx;
+			padding: 0 18rpx;
+			padding-bottom: 30rpx;
+			margin-bottom: 40rpx;
+			.save-address{
+				margin-bottom: 20rpx;
+				.text1{
+					margin-right: 32rpx;
+					font-size: 27rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #959595;
+				}
+			}
+			.address-text {
+				margin-top: 20rpx;
+				width: 656rpx;
+				padding: 15rpx 21rpx;
+				background-color: #EEEEEE;
+				border-radius: 10rpx;
+				margin-bottom: 20rpx;
+				textarea {
+					height: 117rpx;
+				}
+			}
+
+			.form-row {
+				height: 68rpx;
+				border-bottom: 1rpx solid #FDD023;
+
+				text {
+					font-size: 27rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #959595;
+					margin-right: 30rpx;
+				}
+
+				input {
+					flex: 1;
+					font-size: 27rpx;
+				}
+			}
+		}
+	}
+</style>

pages/index/daijia.vue

@@ -0,0 +1,187 @@
+<template>
+	<view class="daijia">
+		<map :latitude="latitude" :longitude="longitude" :scale="18" class="mymap" @regionchange="regionchange">
+			<cover-image src="/static/images/map-icon.png" class="map-icon"></cover-image>
+		</map>
+		<view class="map-down">
+			<view class="tel-box u-flex u-col-center u-row-center">
+				<image class="image1" src="../../static/images/map1-1.png" mode=""></image>
+				<input class="input" type="number" placeholder="请输入手机号" />
+				<image class="image2" src="../../static/images/mine1-4.png" mode=""></image>
+			</view>
+			<view class="qidian-box u-flex u-col-top">
+				<text>起</text>
+				<text>{{addresstext}}</text>
+			</view>
+			<view class="add-text">
+				(填写或选择出发位置)
+			</view>
+			<view style="margin: 20rpx 0;">
+				<x-button>呼叫代驾</x-button>
+			</view>
+			<view class="tips">
+				计价方法和计价介绍
+			</view>
+		</view>
+
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				latitude: '',
+				longitude: '',
+				latitude1: '',
+				longitude1: '',
+				markers: [],
+				addresstext: ''
+			}
+		},
+		onLoad() {
+			this.myAmapFun.getRegeo({
+				success: (res) => {
+					this.latitude = res[0].latitude
+					this.longitude = res[0].longitude
+					this.latitude1 = res[0].latitude
+					this.longitude1 = res[0].longitude
+					this.markers.push({
+						id: 1,
+						latitude: res[0].latitude,
+						longitude: res[0].longitude
+					})
+				}
+			})
+			// uni.getLocation({
+			// 	altitude: true,
+			// 	type: "gcj02",
+			// 	success: (res) => {
+			// 		this.latitude = res.latitude
+			// 		this.longitude = res.longitude
+			// 		this.latitude1 = res.latitude
+			// 		this.longitude1 = res.longitude
+			// 		this.markers.push({
+			// 			id: 2,
+			// 			latitude: res.latitude,
+			// 			longitude: res.longitude
+			// 		})
+			// 		console.log(this.markers);
+			// 	}
+			// })
+		},
+		methods: {
+			regionchange(e) {
+				if (e.type == 'end' && e.detail.centerLocation.longitude > 0) {
+					this.latitude1 = e.detail.centerLocation.latitude
+					this.longitude1 = e.detail.centerLocation.longitude
+
+					var num = this.markers.length - 1
+					this.markers.push({
+						id: this.markers[num].id + 1,
+						latitude: e.detail.centerLocation.latitude,
+						longitude: e.detail.centerLocation.longitude
+					})
+
+					this.myAmapFun.getRegeo({
+						location: this.longitude1 + "," + this.latitude1,
+						success: (res) => {
+							this.addresstext = res[0].name + res[0].desc
+							console.log(res[0].name + res[0].desc);
+						},
+						fail: (err) => {
+							console.log(err);
+						}
+					})
+					// console.log(this.markers);
+					// console.log(e.detail.centerLocation);
+				}
+
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.daijia {
+		min-height: 100vh;
+		background-color: #fff;
+
+		.map-down {
+			padding: 0 30rpx;
+			.tips{
+				text-align: center;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+			.add-text{
+				text-align: center;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #707070;
+				padding-bottom: 20rpx;
+				border-bottom: 1rpx solid #E0E0E0;
+			}
+			.qidian-box {
+				margin-top: 20rpx;
+				margin-bottom: 10rpx;
+				text:first-child{
+					width: 40rpx;
+					height: 40rpx;
+					border-radius: 100rpx;
+					background-color: #049FE8;
+					text-align: center;
+					line-height: 40rpx;
+					
+					color: #fff;
+					margin-right: 20rpx;
+				}
+				text:last-child{
+					flex: 1;
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+			}
+
+			.tel-box {
+				padding: 20rpx 0;
+				border-bottom: 1rpx solid #E0E0E0;
+
+				.image1 {
+					width: 44rpx;
+					height: 40rpx;
+				}
+
+				.input {
+					width: 250rpx;
+					text-align: center;
+					margin: 0 20rpx;
+				}
+
+				.image2 {
+					width: 27rpx;
+					height: 27rpx;
+				}
+			}
+		}
+
+		.mymap {
+			width: 750rpx;
+			height: 60vh;
+			position: relative;
+
+			.map-icon {
+				position: absolute;
+				top: calc(50% - 17px);
+				left: 50%;
+				transform: translate(-50%, -50%);
+				width: 80rpx;
+				height: 80rpx;
+			}
+		}
+	}
+</style>

pages/index/home.vue

@@ -0,0 +1,357 @@
+<template>
+	<view class="home">
+		<x-navbar title="首页" :active="0"></x-navbar>
+		<view class="notice-box">
+			<u-notice-bar mode="horizontal" :list="list" bg-color="#fff" color="#000"></u-notice-bar>
+		</view>
+		<view class="swiper">
+			<u-swiper :list="swiper" height="417" mode="none"></u-swiper>
+		</view>
+		<view class="tips-box u-flex u-col-center u-flex-wrap u-row-between">
+			<view class="item u-flex u-col-center u-row-center" @tap="totabs(index)" v-for="(item,index) in tabslist" :key='index'>
+				<image :src="item.img" mode="aspectFit"></image>
+				<view class="text">{{item.name}}</view>
+			</view>
+			<view style="width: 158rpx;"></view>
+			<view style="width: 158rpx;"></view>
+		</view>
+		<view class="u-flex u-col-center u-row-center">
+			<image src="../../static/images/index1-5.png" style="width: 340rpx;height: 100rpx;" mode="aspectFit">
+			</image>
+		</view>
+		<view class="hot-box">
+			<view class="item" v-for="(item,index) in 2" :key='index'>
+				<view class="image">
+					<image src="" mode=""></image>
+					<text>水电维修</text>
+				</view>
+				<view class="u-flex text">
+					<text>城市居家及办公的各种供水、供电维护维修及各类杂修便民服务。服务范畴:用水设备，电器设备，更换……</text>
+				</view>
+			</view>
+		</view>
+		<view class="u-flex u-col-center u-row-center">
+			<image src="../../static/images/index1-6.png" style="width: 340rpx;height: 100rpx;" mode="aspectFit">
+			</image>
+		</view>
+		<view class="pubu-box">
+			<u-waterfall v-model="flowList">
+				<template v-slot:left="{leftList}">
+					<view class="u-flex-col u-col-center">
+						<view v-for="(item, index) in leftList" :key="index" class="item">
+							<!-- 这里编写您的内容，item为您传递给v-model的数组元素 -->
+							<view class="image">
+								<image :src="item" mode="widthFix"></image>
+								<view class="time u-flex u-col-center">
+									<text>外卖</text>
+									<text>30分钟送达</text>
+								</view>
+							</view>
+							<view class="name">
+								这里是商品标题(这里是商品标题)
+							</view>
+							<view class="label u-flex u-col-center u-flex-wrap">
+								<text>限购2份</text>
+							</view>
+							<view class="tips">
+								活动优惠价
+							</view>
+							<view class="price">
+								<text>¥10.00</text>
+								<text>加入购物车</text>
+							</view>
+						</view>
+					</view>
+				</template>
+				<template v-slot:right="{rightList}">
+					<view class="u-flex-col u-col-center">
+						<view v-for="(item, index) in rightList" :key="index" class="item">
+							<!-- 这里编写您的内容，item为您传递给v-model的数组元素 -->
+							<view class="image">
+								<image :src="item" mode="widthFix"></image>
+								<view class="time u-flex u-col-center">
+									<text>外卖</text>
+									<text>30分钟送达</text>
+								</view>
+							</view>
+							<view class="name">
+								这里是商品标题(这里是商品标题)
+							</view>
+							<view class="label">
+								<text>限购2份</text>
+							</view>
+							<view class="tips">
+								活动优惠价
+							</view>
+							<view class="price u-flex u-col-center u-row-between">
+								<text>¥10.00</text>
+								<text>加入购物车</text>
+							</view>
+						</view>
+					</view>
+				</template>
+			</u-waterfall>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				list: [
+					'寒雨连江夜入吴',
+					'平明送客楚山孤',
+					'洛阳亲友如相问',
+					'一片冰心在玉壶'
+				],
+				swiper: [{
+						image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
+						title: '昨夜星辰昨夜风，画楼西畔桂堂东'
+					},
+					{
+						image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
+						title: '身无彩凤双飞翼，心有灵犀一点通'
+					},
+					{
+						image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
+						title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
+					}
+				],
+				tabslist: [{
+					img: require("../../static/images/t-tools.png"),
+					name: '维修'
+				}, {
+					img: require("../../static/images/t-daijia.png"),
+					name: '代驾'
+				}, {
+					img: require("../../static/images/t-paotui.png"),
+					name: '跑腿'
+				}, {
+					img: require("../../static/images/t-shandian.png"),
+					name: '商店'
+				}, {
+					img: require("../../static/images/t-baojie.png"),
+					name: '家政'
+				}, {
+					img: require("../../static/images/t-yiliao.png"),
+					name: '医护'
+				}, {
+					img: require("../../static/images/t-bangjia.png"),
+					name: '搬家'
+				}, {
+					img: require("../../static/images/t-jipin.png"),
+					name: '祭品'
+				}],
+				flowList: [],
+			}
+		},
+		onLoad() {
+			setTimeout(() => {
+				this.getlist()
+			}, 200)
+
+		},
+		methods: {
+			totabs(index){
+				if(index == 0){
+					uni.navigateTo({
+						url:"./weixiu"
+					})
+				}else if(index == 1){
+					uni.navigateTo({
+						url:"./daijia"
+					})
+				}else if(index == 2){
+					uni.navigateTo({
+						url:"./paotui"
+					})
+				}else if(index == 3){
+					uni.switchTab({
+						url:"../shop/shop"
+					})
+				}else{
+					uni.navigateTo({
+						url:"./other-tabs"
+					})
+				}
+			},
+			getlist() {
+				for (let i = 0; i < 10; i++) {
+					if (i % 3 == 0) {
+						this.flowList.push('https://dss1.bdstatic.com/lvoZeXSm1A5BphGlnYG/skin/1020.jpg?2');
+					} else {
+						this.flowList.push('https://cdn.uviewui.com/uview/swiper/2.jpg');
+					}
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.home {
+		.pubu-box {
+			padding: 0 20rpx;
+
+			.item {
+				width: 340rpx;
+				border-radius: 20rpx;
+				overflow: hidden;
+				background-color: #fff;
+				margin-bottom: 27rpx;
+
+				.price {
+					padding: 0 20rpx 20rpx 20rpx;
+
+					text:first-child {
+						color: #E8380D;
+						font-size: 27rpx;
+					}
+
+					text:last-child {
+						width: 157rpx;
+						height: 42rpx;
+						text-align: center;
+						line-height: 42rpx;
+						border-radius: 100rpx;
+						background-color: #F4CC14;
+						font-size: 24rpx;
+					}
+				}
+
+				.tips {
+					color: #8C8C8C;
+					font-size: 24rpx;
+					padding: 0 20rpx;
+				}
+
+				.label {
+					padding: 0 20rpx;
+					margin-bottom: 10rpx;
+
+					text {
+						padding: 1rpx 10rpx;
+						border-radius: 100rpx;
+						background-color: #E1E1E1;
+						color: #8C8C8C;
+						font-size: 24rpx;
+						margin: 0 10rpx 10rpx 0;
+					}
+				}
+
+				.name {
+					padding: 10rpx 20rpx;
+					font-size: 28rpx;
+				}
+
+				.image {
+					width: 340rpx;
+					position: relative;
+					font-size: 0;
+
+					.time {
+						position: absolute;
+						bottom: 0;
+						left: 0;
+						font-size: 24rpx;
+
+						text:first-child {
+							background-color: #F6BC00;
+							padding: 4rpx 8rpx;
+						}
+
+						text:last-child {
+							background-color: rgba(0, 0, 0, 0.8);
+							color: #fff;
+							padding: 4rpx 8rpx;
+							border-radius: 0 10rpx 0 0;
+						}
+					}
+
+					image {
+						width: 344rpx;
+						height: 344rpx;
+						background-color: #2AA47F;
+					}
+				}
+			}
+		}
+
+		.hot-box {
+			padding: 0 22rpx;
+
+			.item {
+				margin-bottom: 24rpx;
+				border-radius: 20rpx;
+				overflow: hidden;
+
+				.text {
+					background-color: #F4CC14;
+					padding: 18rpx 30rpx;
+
+					text {
+						width: 100%;
+						display: -webkit-box;
+						-webkit-box-orient: vertical;
+						-webkit-line-clamp: 2;
+						overflow: hidden;
+					}
+				}
+
+				.image {
+					width: 100%;
+					height: 347rpx;
+					background-color: #2AA47F;
+					position: relative;
+
+					image {
+						width: 100%;
+						height: 347rpx;
+					}
+
+					text {
+						position: absolute;
+						bottom: 2rpx;
+						left: 0;
+						border-radius: 10rpx 10rpx 0 0;
+						background-color: #F4CC14;
+						padding: 5rpx 30rpx;
+					}
+				}
+			}
+		}
+
+		.tips-box {
+			padding: 32rpx 22rpx 1rpx 32rpx;
+
+			.item {
+				width: 158rpx;
+				height: 158rpx;
+				border-radius: 100rpx;
+				// border: 5rpx solid #4AC885;
+				margin-bottom: 32rpx;
+				position: relative;
+
+				.text {
+					position: absolute;
+					top: 50%;
+					left: 50%;
+					transform: translate(-50%, -50%);
+					width: 75rpx;
+					height: 47rpx;
+					text-align: center;
+					line-height: 47rpx;
+					border-radius: 8rpx;
+					background-color: #F4CC17;
+				}
+
+				image {
+					width: 158rpx;
+					height: 158rpx;
+				}
+			}
+		}
+
+	}
+</style>

pages/index/index.vue

@@ -0,0 +1,43 @@
+<template>
+	<view class="index">
+		<image src="../../static/images/guanggao.jpeg" mode=""></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				s: 1
+			}
+		},
+		onLoad() {
+			this.start()
+		},
+		methods: {
+			start() {
+				var time = setInterval(() => {
+					if (this.s == 0) {
+						clearInterval(time)
+						uni.switchTab({
+							url: "./home"
+						})
+					} else {
+						this.s--
+					}
+				}, 1000)
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.index {
+		font-size: 0;
+
+		image {
+			width: 750rpx;
+			height: 100vh;
+		}
+	}
+</style>

pages/index/other-tabs.vue

@@ -0,0 +1,63 @@
+<template>
+	<view class="other-tabs u-flex-col u-col-center u-row-center">
+		<image src="../../static/images/xiaoma.png" mode=""></image>
+		<text class="text1">您好，我是小马</text>
+		<text class="text1">抱歉 家政服务 正加紧上线中</text>
+		<text class="text1">敬请期待！</text>
+		<text class="text2">{{s}}秒后自动返回。</text>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				s:5,
+				time:null
+			}
+		},
+		onLoad() {
+			this.time = setInterval(() => {
+				if(this.s == 0){
+					clearInterval(this.time)
+					uni.navigateBack()
+				}else{
+					this.s--
+				}
+			},1000)
+		},
+		onUnload() {
+			clearInterval(this.time)
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.other-tabs {
+		height: 100vh;
+		background-color: #fff;
+		image {
+			width: 280rpx;
+			height: 295rpx;
+			margin-bottom: 70rpx;
+		}
+		.text1{
+			margin-bottom: 10rpx;
+			font-size: 42rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			color: #000000;
+		}
+		.text2{
+			margin-top: 30rpx;
+			font-size: 42rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			color: rgba(8, 170, 140, 1);
+			margin-bottom: 150rpx;
+		}
+	}
+</style>

pages/index/paotui.vue

@@ -0,0 +1,414 @@
+<template>
+	<view class="paotui">
+		<map :latitude="latitude" :longitude="longitude" :scale="18" class="mymap" @regionchange="regionchange">
+			<cover-image src="/static/images/map-icon.png" class="map-icon"></cover-image>
+		</map>
+		<view class="paotui-box">
+			<view class="tabs-box u-flex u-col-center u-row-between">
+				<text :class="type == 1 ? 'text' : ''" @tap="type = 1">帮我送</text>
+				<text :class="type == 2 ? 'text' : ''" @tap="type = 2">帮我取</text>
+				<text :class="type == 3 ? 'text' : ''" @tap="type = 3">帮我买</text>
+			</view>
+			<view v-if="type == 3">
+				<view class="textarea-box">
+					<view class="text1">
+						描述要买的商品
+					</view>
+					<view class="form-box">
+						<textarea placeholder="填写想要代购的商品，如【充电器一个，矿泉水两瓶】，代购金额不得超过200元。" />
+						<view class="goods-tabs u-flex u-col-center">
+							<text v-for="(item,index) in 4" :key="index">文件</text>
+						</view>
+						<image class="image" src="../../static/images/648.png" mode=""></image>
+					</view>
+				</view>
+				<view class="feiyong-box u-flex u-col-center">
+					<text class="text1">商品费用:</text>
+					<input type="digit" placeholder="预计商品费用，用于骑手参考" />
+				</view>
+				<view class="isfapiao">
+					<u-radio-group v-model="isfapiao" active-color="#0DA98C">
+						<u-radio :name="1">不需要发票</u-radio>
+						<u-radio :name="2">需要发票</u-radio>
+					</u-radio-group>
+				</view>
+				<view class="feiyong-box u-flex u-col-center" v-if="isfapiao == 2">
+					<text class="text1">发票抬头:</text>
+					<input type="digit" placeholder="填写发票抬头" />
+				</view>
+				<view class="isfapiao">
+					<u-radio-group v-model="isjiujin" active-color="#0DA98C">
+						<u-radio :name="1">指定地址购买</u-radio>
+						<u-radio :name="2">骑手就近购买</u-radio>
+					</u-radio-group>
+				</view>
+				<view class="address-box">
+					<view class="address-item" @tap="toaddress(1)">
+						<view class="top u-flex u-col-center">
+							<text class="text1" style="background-color: #029FE9;">起</text>
+							<text class="text2">汕头市龙胡区新津街道长江路39号2栋123房</text>
+							<input type="text" class="text3" placeholder="填写联系电话" :disabled="true" />
+							<u-icon name="arrow-right"></u-icon>
+						</view>
+						<view class="down">
+							(购买地址)
+						</view>
+					</view>
+					<view class="address-item" @tap="toaddress(2)">
+						<view class="top u-flex u-col-center">
+							<text class="text1" style="background-color: #E8380A;">终</text>
+							<text class="text2">汕头市龙胡区新津街道长江路39号2栋123房</text>
+							<input type="text" class="text3" placeholder="填写联系电话" :disabled="true" />
+							<u-icon name="arrow-right"></u-icon>
+						</view>
+						<view class="down">
+							(送货地址)
+						</view>
+					</view>
+				</view>
+				<view class="qujian-time u-flex u-col-center u-row-between">
+					<text class="text1">送达时间：</text>
+					<input type="text" placeholder="选择时间" />
+					<u-icon name="arrow-right"></u-icon>
+				</view>
+				<view class="xieyi-box u-flex u-col-center u-row-right">
+					<u-checkbox v-model="checked" active-color="#09AA8C"></u-checkbox>
+					<text @tap="checked = !checked">同意</text>
+					<text style="color: #3BBBA3;">《跑腿协议》</text>
+				</view>
+				<view>
+					<x-button>确认下单</x-button>
+				</view>
+			</view>
+			<view v-else>
+				<view class="address-box">
+					<view class="address-item" @tap="toaddress(1)">
+						<view class="top u-flex u-col-center">
+							<text class="text1" style="background-color: #029FE9;">起</text>
+							<text class="text2">汕头市龙胡区新津街道长江路39号2栋123房</text>
+							<input type="text" class="text3" placeholder="填写联系电话" :disabled="true" />
+							<u-icon name="arrow-right"></u-icon>
+						</view>
+						<view class="down">
+							(取件地址)
+						</view>
+					</view>
+					<view class="address-item" @tap="toaddress(2)">
+						<view class="top u-flex u-col-center">
+							<text class="text1" style="background-color: #E8380A;">终</text>
+							<text class="text2">汕头市龙胡区新津街道长江路39号2栋123房</text>
+							<input type="text" class="text3" placeholder="填写联系电话" :disabled="true" />
+							<u-icon name="arrow-right"></u-icon>
+						</view>
+						<view class="down">
+							(送件地址)
+						</view>
+					</view>
+				</view>
+				<view class="qujian-time u-flex u-col-center u-row-between">
+					<text class="text1">取件时间：</text>
+					<input type="text" placeholder="选择时间" />
+					<u-icon name="arrow-right"></u-icon>
+				</view>
+				<view class="wupin-name u-flex u-col-center u-row-between">
+					<text class="text1">物品名称:</text>
+					<view class="wupin-right u-flex u-col-center">
+						<input type="text" placeholder="文件、蛋糕、鲜花、餐饮等" />
+						<u-icon name="arrow-down-fill"></u-icon>
+					</view>
+				</view>
+				<view class="zhongliang u-flex u-col-center u-row-between">
+					<text class="text1">物品名称:</text>
+					<view style="flex: 1;padding: 0 20rpx;">
+						<u-slider v-model="value" activeColor="#09AA8C" height="15" :step="5"></u-slider>
+					</view>
+					<view class="text2" v-if="value / 5 <= 5">(5公斤以下)</view>
+					<view class="text2" v-else>({{value / 5}}公斤)</view>
+				</view>
+				<view class="xieyi-box u-flex u-col-center u-row-right">
+					<u-checkbox v-model="checked" active-color="#09AA8C"></u-checkbox>
+					<text @tap="checked = !checked">同意</text>
+					<text style="color: #3BBBA3;">《跑腿协议》</text>
+				</view>
+				<view>
+					<x-button>确认下单</x-button>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				latitude: '',
+				longitude: '',
+				latitude1: '',
+				longitude1: '',
+				markers: [],
+				addresstext: '',
+				type: 3,
+				value: '',
+				checked: false,
+				isfapiao: 1,
+				isjiujin:1
+			}
+		},
+		onLoad() {
+			this.myAmapFun.getRegeo({
+				success: (res) => {
+					this.latitude = res[0].latitude
+					this.longitude = res[0].longitude
+					this.latitude1 = res[0].latitude
+					this.longitude1 = res[0].longitude
+					this.markers.push({
+						id: 1,
+						latitude: res[0].latitude,
+						longitude: res[0].longitude
+					})
+				}
+			})
+			// uni.getLocation({
+			// 	altitude: true,
+			// 	type: "gcj02",
+			// 	success: (res) => {
+			// 		this.latitude = res.latitude
+			// 		this.longitude = res.longitude
+			// 		this.latitude1 = res.latitude
+			// 		this.longitude1 = res.longitude
+			// 		this.markers.push({
+			// 			id: 2,
+			// 			latitude: res.latitude,
+			// 			longitude: res.longitude
+			// 		})
+			// 		console.log(this.markers);
+			// 	}
+			// })
+		},
+		methods: {
+			toaddress(){
+				uni.navigateTo({
+					url:"./change-address"
+				})
+			},
+			regionchange(e) {
+				if (e.type == 'end' && e.detail.centerLocation.longitude > 0) {
+					this.latitude1 = e.detail.centerLocation.latitude
+					this.longitude1 = e.detail.centerLocation.longitude
+
+					var num = this.markers.length - 1
+					this.markers.push({
+						id: this.markers[num].id + 1,
+						latitude: e.detail.centerLocation.latitude,
+						longitude: e.detail.centerLocation.longitude
+					})
+
+					this.myAmapFun.getRegeo({
+						location: this.longitude1 + "," + this.latitude1,
+						success: (res) => {
+							this.addresstext = res[0].name + res[0].desc
+							console.log(res[0].name + res[0].desc);
+						},
+						fail: (err) => {
+							console.log(err);
+						}
+					})
+					// console.log(this.markers);
+					// console.log(e.detail.centerLocation);
+				}
+
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.paotui {
+		.paotui-box {
+			padding: 10rpx 30rpx 30rpx 30rpx;
+			background-color: #fff;
+
+			.feiyong-box {
+				padding: 20rpx 0;
+
+				.text1 {
+					color: #737373;
+					margin-right: 20rpx;
+				}
+
+				input {
+					flex: 1;
+					border-bottom: 4rpx solid #09AA8C;
+				}
+			}
+
+			.textarea-box {
+				margin-top: 20rpx;
+
+				.text1 {
+					color: #8E8E8E;
+					font-size: 34rpx;
+					margin-bottom: 10rpx;
+				}
+
+				.form-box {
+					padding: 20rpx;
+					border-radius: 20rpx;
+					border: 1rpx solid rgba(0, 0, 0, 0.05);
+
+					textarea {
+						width: 100%;
+						margin-bottom: 20rpx;
+						height: 200rpx;
+					}
+
+					.image {
+						width: 160rpx;
+						height: 160rpx;
+					}
+
+					.goods-tabs {
+						margin-bottom: 20rpx;
+
+						text {
+							padding: 10rpx 20rpx;
+							border-radius: 10rpx;
+							border: 1rpx solid #269075;
+							font-size: 24rpx;
+							color: #269075;
+							margin-right: 20rpx;
+						}
+					}
+				}
+
+
+			}
+
+			.xieyi-box {
+				padding: 30rpx 0;
+			}
+
+			.zhongliang {
+				.text1 {
+					color: #8B8B8B;
+					margin-right: 20rpx;
+				}
+
+				.text2 {
+					color: #8B8B8B;
+					margin-left: 20rpx;
+					width: 150rpx;
+				}
+			}
+
+			.wupin-name {
+				padding: 35rpx 0;
+
+				.text1 {
+					color: #8B8B8B;
+					margin-right: 20rpx;
+				}
+
+				.wupin-right {
+					height: 58rpx;
+					flex: 1;
+					border-radius: 10rpx;
+					border: 1rpx solid #D5D5D5;
+					padding: 0 20rpx;
+
+					input {
+						margin-right: 20rpx;
+						flex: 1;
+					}
+				}
+			}
+
+			.qujian-time {
+				height: 80rpx;
+				border-bottom: 1rpx solid #E5E5E5;
+
+				input {
+					margin: 0 20rpx;
+					text-align: right;
+					flex: 1;
+				}
+
+				.text1 {
+					color: #8B8B8B;
+				}
+			}
+
+			.address-box {
+				.address-item {
+					padding: 24rpx 0;
+					border-bottom: 1rpx solid #E5E5E5;
+
+					.down {
+						font-size: 26rpx;
+						color: #BABABA;
+					}
+
+					.top {
+						margin-bottom: 10rpx;
+
+						.text1 {
+							width: 40rpx;
+							height: 40rpx;
+							line-height: 40rpx;
+							text-align: center;
+							border-radius: 100rpx;
+							color: #fff;
+							font-size: 22rpx;
+						}
+
+						.text2 {
+							flex: 1;
+							margin: 0 20rpx;
+							color: #8B8B8B;
+						}
+
+						.text3 {
+							color: #C0C0C0;
+							margin-right: 10rpx;
+							width: 160rpx;
+							font-size: 24rpx;
+						}
+					}
+				}
+			}
+
+			.tabs-box {
+				height: 67rpx;
+				border-bottom: 2rpx solid #09AA8C;
+
+				text {
+					flex: 1;
+					text-align: center;
+					line-height: 65rpx;
+					border-radius: 10rpx 10rpx 0 0;
+				}
+
+				.text {
+					background-color: #09AA8C;
+					color: #fff;
+				}
+			}
+		}
+
+		.mymap {
+			width: 750rpx;
+			height: 60vh;
+			position: relative;
+
+			.map-icon {
+				position: absolute;
+				top: calc(50% - 17px);
+				left: 50%;
+				transform: translate(-50%, -50%);
+				width: 80rpx;
+				height: 80rpx;
+			}
+		}
+	}
+</style>

pages/index/weixiu.vue

@@ -0,0 +1,214 @@
+<template>
+	<view class="weixiu">
+		<view class="qiehuan-box u-flex u-col-center u-row-right">
+			<text @tap="tochange">切换地址</text>
+		</view>
+		<view class="address-box">
+			<view class="user-top u-flex u-col-center">
+				<text>用户姓名</text>
+				<text>15916663977</text>
+			</view>
+			<view class="address-text">
+				广东省汕头市龙湖区地址广东省汕头市龙湖区地址广东省汕头市龙湖区地址
+			</view>
+		</view>
+		<view class="yuyue-time u-flex u-col-center u-row-between">
+			<text class="text1">预约上门时间</text>
+			<view class="right u-flex u-col-center">
+				<text>选择时间</text>
+				<image src="../../static/images/fuwu-time.png" mode=""></image>
+			</view>
+		</view>
+		<view class="title-text">需求描述</view>
+		<view class="type-box u-flex u-col-center">
+			<text :class="type == 1 ? 'text' : ''" @click="type = 1">水</text>
+			<text :class="type == 2 ? 'text' : ''" @click="type = 2">电</text>
+		</view>
+		<view class="change-type u-flex u-col-center u-row-between">
+			<text class="text">水管</text>
+			<u-icon name="arrow-down-fill"></u-icon>
+		</view>
+		<view class="upload-img u-flex u-col-center u-flex-wrap">
+			<image src="../../static/images/648.png" mode=""></image>
+		</view>
+		<view class="upload-tips">
+			*您可以提供故障器件或故障现象的照片(选填)
+		</view>
+		<view class="textarea">
+			<textarea placeholder="您可以选择或填写故障的具体情况" />
+		</view>
+		<view class="upload-tips">
+			*您可以选择或填写故障的具体情况(选填)
+		</view>
+		<view class="type-box u-flex u-col-center">
+			<text :class="type == 1 ? 'text' : ''" @click="type = 1">漏水</text>
+			<text :class="type == 2 ? 'text' : ''" @click="type = 2">漏水</text>
+		</view>
+		<view style="margin: 56rpx 0;">
+			<x-button color="#000">确认预约</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				type: 1
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			tochange(){
+				uni.navigateTo({
+					url:"../mine/address-list"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.weixiu {
+		.textarea{
+			width: 685rpx;
+			border: 1rpx solid #A0A0A0;
+			background-color: #fff;
+			border-radius: 20rpx;
+			padding: 22rpx;
+			margin: 0 auto;
+			textarea{
+				width: 100%;
+			}
+		}
+		.upload-tips {
+			padding: 30rpx;
+			font-size: 25rpx;
+			font-family: SimHei;
+			font-weight: 400;
+		}
+
+		.upload-img {
+			padding: 0 30rpx;
+
+			image {
+				width: 154rpx;
+				height: 154rpx;
+				border-radius: 20rpx;
+				margin-right: 10rpx;
+			}
+		}
+
+		.change-type {
+			width: 478rpx;
+			height: 56rpx;
+			border-radius: 10rpx;
+			padding: 0 10rpx;
+			border: 1rpx solid #979D9B;
+			margin: 30rpx;
+		}
+
+		.type-box {
+			padding: 0 30rpx;
+
+			text {
+				padding: 20rpx 26rpx;
+				border-radius: 10rpx;
+				border: 1rpx solid #09AA8C;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+				margin-right: 20rpx;
+			}
+
+			.text {
+				background-color: #09AA8C;
+				color: #fff;
+			}
+		}
+
+		.title-text {
+			font-size: 31rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			padding: 0 34rpx 44rpx 34rpx;
+		}
+
+		.yuyue-time {
+			width: 684rpx;
+			height: 61rpx;
+			border: 1rpx solid #A0A0A0;
+			border-radius: 100rpx;
+			margin: 0 auto;
+			background-color: #fff;
+			overflow: hidden;
+			margin-bottom: 44rpx;
+
+			.right {
+				height: 61rpx;
+				background-color: #09AA8C;
+				padding: 0 10rpx;
+
+				image {
+					width: 28rpx;
+					height: 29rpx;
+					margin-top: 4rpx;
+				}
+
+				text {
+					color: #fff;
+					font-size: 25rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					margin-right: 15rpx;
+				}
+			}
+
+			.text1 {
+				flex: 1;
+				padding: 0 20rpx;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #959595;
+			}
+		}
+
+		.address-box {
+			padding: 0 34rpx;
+			margin-bottom: 70rpx;
+
+			.address-text {
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #707070;
+			}
+
+			.user-top {
+				font-size: 31rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				margin-bottom: 14rpx;
+
+				text {
+					margin-right: 20rpx;
+				}
+			}
+		}
+
+		.qiehuan-box {
+			padding: 24rpx 34rpx;
+
+			text {
+				font-size: 31rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+		}
+	}
+</style>

pages/mine/address-list.vue

@@ -0,0 +1,96 @@
+<template>
+	<view class="address-list">
+		<view class="address-item" v-for="(item,index) in 2" :key="index">
+			<view class="header u-flex u-col-center u-row-right">
+				<text>删除</text>
+				<text>修改</text>
+			</view>
+			<view class="moren">设为默认地址</view>
+			<view class="name">
+				啦啦啦
+			</view>
+			<view class="tel">
+				18888888888
+			</view>
+			<view class="address-text">
+				啦啦啦
+			</view>
+		</view>
+		<view style="height: 120rpx;"></view>
+		<view class="add" @tap="toadd">
+			添加
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			toadd() {
+				uni.navigateTo({
+					url:"./address-set"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.address-list {
+
+		.add {
+			position: fixed;
+			left: 24rpx;
+			width: 702rpx;
+			border-radius: 10rpx;
+			text-align: center;
+			line-height: 80rpx;
+			height: 80rpx;
+			color: #fff;
+			background-color: #09AA8C;
+			bottom: 20rpx;
+		}
+
+		.address-item {
+			width: 683rpx;
+			// height: 291rpx;
+			margin: 20rpx auto;
+			background-color: #fff;
+			border-radius: 20rpx;
+			padding: 0 30rpx;
+
+			.address-text {
+				padding-bottom: 20rpx;
+			}
+
+			.moren {
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+				margin: 19rpx 0;
+				text-align: right;
+			}
+
+			.header {
+				padding: 24rpx 0;
+				border-bottom: 2rpx solid #E6E6E6;
+
+				text {
+					margin-left: 30rpx;
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+			}
+		}
+	}
+</style>

pages/mine/address-set.vue

@@ -0,0 +1,109 @@
+<template>
+	<view class="address-set">
+		<view class="form-box">
+			<view class="row-input u-flex u-col-center">
+				<text class="text">联系人：</text>
+				<input type="text" placeholder="请输入联系人" />
+			</view>
+			<view class="row-input u-flex u-col-center">
+				<text class="text">联系电话：</text>
+				<input type="text" placeholder="请输入联系电话" />
+			</view>
+			<view class="row-input u-flex u-col-center" @tap="openmap">
+				<text class="text">定位地址：</text>
+				<input type="text" placeholder="请选择地址" :disabled="true"/>
+				<u-icon name="arrow-right" color="#09AA8C"></u-icon>
+			</view>
+		</view>
+		<view class="textarea">
+			<textarea></textarea>
+		</view>
+		<view class="moren-box u-flex u-col-center u-row-right">
+			<text class="text">默认地址</text>
+			<u-switch v-model="checked" active-color="#09AA8C"></u-switch>
+		</view>
+		<view class="text2">
+			<x-button>修改地址</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				checked: false
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			openmap(){
+				uni.chooseLocation({
+					success: (res) => {
+						console.log(res);
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.address-set {
+		min-height: 100vh;
+		padding: 1rpx 0;
+		background-color: #fff;
+
+		.text2 {
+			width: 303rpx;
+			height: 104rpx;
+			margin: 0 auto;
+			
+		}
+
+
+		.moren-box {
+			padding: 0 30rpx;
+			margin-bottom: 20rpx;
+
+			.text {
+				margin-right: 22rpx;
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+		}
+
+		.textarea {
+			margin: 0 30rpx;
+			border-radius: 20rpx;
+			border: 1rpx solid rgba(0, 0, 0, 0.3);
+			padding: 20rpx;
+			margin-bottom: 10rpx;
+		}
+
+		.form-box {
+			padding: 0 30rpx;
+
+			.row-input {
+				height: 100rpx;
+
+				.text {
+					width: 160rpx;
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+
+				input {
+					flex: 1;
+					margin-left: 10rpx;
+					color: #09AA8C;
+				}
+			}
+		}
+	}
+</style>

pages/mine/anquan.vue

@@ -0,0 +1,79 @@
+<template>
+	<view class="anquan">
+		<view class="top">
+			<view class="title">
+				设置找回密码方式：
+			</view>
+			<view class="type u-flex u-col-center u-row-right" @tap="totel">
+				<text>使用绑定手机号找回密码</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view>
+			<view class="type u-flex u-col-center u-row-right" @tap="towen">
+				<text>使用问答方式找回密码</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view>
+		</view>
+		<view class="other u-flex u-col-center u-row-right">
+			<u-icon name="question-circle" color="#56AC9B" size="38"></u-icon>
+			<text class="text2">安全设置介绍</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			towen(){
+				uni.navigateTo({
+					url:"./wenda-list"
+				})
+			},
+			totel(){
+				uni.navigateTo({
+					url:"./tel-list"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.anquan {
+		.other{
+			padding: 0  20rpx;
+			.text1{
+				color: rgba(0,0,0,0.5);
+			}
+			.text2{
+				margin: 0;
+				padding: 0;
+				background-color: rgba(0,0,0,0);
+				border: none;
+				font-size: 30rpx;
+				color: #56AC9B;
+				margin-right: 10rpx;
+			}
+		}
+		.top {
+			padding: 20rpx 30rpx 1rpx 30rpx;
+			// border-bottom: 2rpx solid #56AC9B;
+			margin-bottom: 30rpx;
+			.title{
+				font-size: 34rpx;
+				margin-bottom: 20rpx;
+			}
+			.type{
+				color: #56AC9B;
+				margin-bottom: 20rpx;
+			}
+		}
+	}
+</style>

pages/mine/change-pwd.vue

@@ -0,0 +1,104 @@
+<template>
+	<view class="change-pwd">
+		<view class="header u-flex u-col-center">
+			<text>手机号：</text>
+			<text>12f23f23(已绑定)</text>
+		</view>
+		<view class="form-box">
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">验证码</text>
+				<input type="number" placeholder="请输入短信验证码"/>
+				<text class="text1">获取验证码</text>
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">密码</text>
+				<input type="number" placeholder="请输入账号密码"/>
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">重复密码</text>
+				<input type="number" placeholder="请输入账号密码"/>
+			</view>
+		</view>
+		<view class="form-box">
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">原密码</text>
+				<input type="number" placeholder="请输入账号密码"/>
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">新密码</text>
+				<input type="number" placeholder="请输入账号密码"/>
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">重复密码</text>
+				<input type="number" placeholder="请输入账号密码"/>
+			</view>
+		</view>
+		<view class="tijiao">
+			<x-button>设置密码</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.change-pwd {
+		.header{
+			font-size: 33rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			padding: 42rpx 33rpx 21rpx 33rpx;
+			border-bottom: 4rpx solid #08AA8C;
+			text:last-child{
+				color: #08AA8C;
+			}
+		}
+		.tijiao {
+			width: 303rpx;
+			height: 104rpx;
+			margin: 200rpx auto;
+			
+		}
+
+
+		.form-box {
+			padding: 36rpx;
+
+			.form-item {
+				height: 100rpx;
+				
+				.text1 {
+					width:180rpx;
+					text-align: right;
+				}
+
+				.text {
+					width: 150rpx;
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+
+				input {
+					padding: 0 10rpx;
+					flex: 1;
+					border-bottom: 4rpx solid #56C5B1;
+				}
+			}
+		}
+	}
+</style>

pages/mine/change-tel.vue

@@ -0,0 +1,90 @@
+<template>
+	<view class="change-tel">
+		<view class="header u-flex u-col-center">
+			<text>手机号：</text>
+			<text>12f23f23(已绑定)</text>
+		</view>
+		<view class="form-box">
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">新手机号</text>
+				<input type="number" placeholder="请输入手机号"/>
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">验证码</text>
+				<input type="number" placeholder="请输入短信验证码"/>
+				<text class="text1">获取验证码</text>
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">密码</text>
+				<input type="number" placeholder="请输入账号密码"/>
+			</view>
+		</view>
+		<view class="tijiao">
+			<x-button>确定更换</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.change-tel {
+		.header{
+			font-size: 33rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			padding: 42rpx 33rpx 21rpx 33rpx;
+			border-bottom: 4rpx solid #08AA8C;
+			text:last-child{
+				color: #08AA8C;
+			}
+		}
+		.tijiao {
+			width: 303rpx;
+			height: 104rpx;
+			margin: 200rpx auto;
+			
+		}
+
+
+		.form-box {
+			padding: 36rpx;
+
+			.form-item {
+				height: 100rpx;
+				
+				.text1 {
+					width:180rpx;
+					text-align: right;
+				}
+
+				.text {
+					width: 150rpx;
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+
+				input {
+					padding: 0 10rpx;
+					flex: 1;
+					border-bottom: 4rpx solid #56C5B1;
+				}
+			}
+		}
+	}
+</style>

pages/mine/forget-tel.vue

@@ -0,0 +1,82 @@
+<template>
+	<view class="forget-tel">
+		<view class="form-box">
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">手机号</text>
+				<input type="number" />
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">验证码</text>
+				<input type="number" />
+				<text class="text2">获取验证码</text>
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">新密码</text>
+				<input type="number" />
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">重复密码</text>
+				<input type="number" />
+			</view>
+		</view>
+		<view class="tijiao">
+			<x-button>确认提交</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.forget-tel {
+		min-height: 100vh;
+		background-color: #FFFFFF;
+
+		.tijiao {
+			width: 303rpx;
+			height: 104rpx;
+			margin: 200rpx auto;
+			
+		}
+
+
+		.form-box {
+			padding: 36rpx;
+
+			.form-item {
+				height: 100rpx;
+
+				.text2 {
+					width: 180rpx;
+					text-align: right;
+				}
+
+				.text {
+					width: 150rpx;
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+
+				input {
+					flex: 1;
+					border-bottom: 4rpx solid #56C5B1;
+				}
+			}
+		}
+	}
+</style>

pages/mine/forget-wen.vue

@@ -0,0 +1,103 @@
+<template>
+	<view class="forget-wen">
+		<view class="title">
+			请选择您设置的问题 
+		</view>
+		<view class="wenda-box">
+			<view class="text1">
+				你明白什么叫牛逼吗？
+			</view>
+			<view class="text2">
+				换一个问题
+			</view>
+			<view class="input-box u-flex u-col-center u-row-between">
+				<text>答案</text>
+				<input type="text" placeholder="请输入您设置的问题答案" />
+			</view>
+			<view class="tijiao">
+				<x-button @click="tonext">下一步</x-button>
+				<!-- <text @tap="tonext"></text> -->
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			tonext(){
+				uni.navigateTo({
+					url:"./forget-wen1"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.forget-wen{
+		min-height: 100vh;
+		background-color: #fff;
+		.wenda-box{
+			padding: 0 33rpx;
+			.tijiao {
+				width: 303rpx;
+				height: 104rpx;
+				margin: 200rpx auto;
+				position: relative;
+				
+			}
+			
+			.input-box{
+				height: 100rpx;
+				margin-bottom: 72rpx;
+				text{
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					margin-right: 20rpx;
+				}
+				input{
+					flex: 1;
+					font-size: 33rpx;
+					border-bottom: 4rpx solid #1DB196;
+					padding: 10rpx 0;
+				}
+			}
+			.text1{
+				padding: 34rpx 0 40rpx 0;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+			}
+			.text2{
+				width: 181rpx;
+				height: 65rpx;
+				text-align: center;
+				line-height: 65rpx;
+				border-radius: 20rpx;
+				border: 2rpx solid #1DB196;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+		}
+		.title{
+			font-size: 33rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			color: #000000;
+			padding: 41rpx 33rpx 21rpx 33rpx;
+			border-bottom: 4rpx solid #57C5B0;
+		}
+	}
+</style>

pages/mine/forget-wen1.vue

@@ -0,0 +1,86 @@
+<template>
+	<view class="forget-wen1">
+		<view class="header u-flex u-col-center">
+			<text>手机号：</text>
+			<text>12f23f23</text>
+		</view>
+		<view class="form-box">
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">新密码</text>
+				<input type="number" />
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">重复密码</text>
+				<input type="number" />
+			</view>
+		</view>
+		<view class="tijiao">
+			<x-button>确认提交</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.forget-wen1 {
+		min-height: 100vh;
+		background-color: #FFFFFF;
+		.header{
+			font-size: 33rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			padding: 42rpx 33rpx 21rpx 33rpx;
+			border-bottom: 4rpx solid #08AA8C;
+			text:last-child{
+				color: #08AA8C;
+			}
+		}
+		.tijiao {
+			width: 303rpx;
+			height: 104rpx;
+			margin: 200rpx auto;
+			
+		}
+
+
+		.form-box {
+			padding: 36rpx;
+
+			.form-item {
+				height: 100rpx;
+
+				.text2 {
+					width: 180rpx;
+					text-align: right;
+				}
+
+				.text {
+					width: 150rpx;
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+
+				input {
+					flex: 1;
+					border-bottom: 4rpx solid #56C5B1;
+				}
+			}
+		}
+	}
+</style>

pages/mine/forget.vue

@@ -0,0 +1,82 @@
+<template>
+	<view class="forget">
+		<view class="top">
+			<view class="title">
+				选择找回密码方式：
+			</view>
+			<view class="type u-flex u-col-center u-row-right" @tap="totel">
+				<text>使用绑定手机号找回密码</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view>
+			<view class="type u-flex u-col-center u-row-right" @tap="towen">
+				<text>使用问答方式找回密码</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view>
+		</view>
+		<view class="other u-flex u-col-center u-row-right">
+			<text class="text1">以上方式均无法找回密码：</text>
+			<button class="text2">联系客服</button>
+			<u-icon name="arrow-right" color="#56AC9B"></u-icon>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			towen(){
+				uni.navigateTo({
+					url:"./forget-wen"
+				})
+			},
+			totel(){
+				uni.navigateTo({
+					url:"./forget-tel"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.forget {
+		.other{
+			padding: 0  20rpx;
+			.text1{
+				color: rgba(0,0,0,0.5);
+			}
+			.text2{
+				margin: 0;
+				padding: 0;
+				background-color: rgba(0,0,0,0);
+				border: none;
+				font-size: 30rpx;
+				color: #56AC9B;
+			}
+			.text2:after{
+				border: 0;
+			}
+		}
+		.top {
+			padding: 20rpx 30rpx 1rpx 30rpx;
+			border-bottom: 2rpx solid #56AC9B;
+			margin-bottom: 30rpx;
+			.title{
+				font-size: 34rpx;
+				margin-bottom: 20rpx;
+			}
+			.type{
+				color: #56AC9B;
+				margin-bottom: 20rpx;
+			}
+		}
+	}
+</style>

pages/mine/kaitong-fuwu.vue

@@ -0,0 +1,364 @@
+<template>
+	<view class="kaitong-fuwu">
+		<view class="header-box">
+			<view class="status-box">
+				资质审核:审核通过
+			</view>
+			<view class="status-box">
+				开通服务审核:审核通过
+			</view>
+			<view class="status-title">
+				预开通服务
+			</view>
+			<view class="item-box u-flex u-col-center u-row-between">
+				<image src="../../static/images/t4.png" mode=""></image>
+				<view class="item-right">
+					<view class="top u-flex u-col-center u-row-between">
+						<text>代驾</text>
+						<text></text>
+					</view>
+					<view class="content">
+						   水道工程维修申请
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="title">
+			个人资料
+		</view>
+		<view class="user-box u-flex u-col-center">
+			<view class="user-left u-flex-col u-col-center">
+				<image src="../../static/images/648.png" mode=""></image>
+				<text>头像</text>
+			</view>
+			<view class="user-right">
+				<view class="input-box u-flex u-col-center">
+					<text class="text">真实姓名</text>
+					<input type="text" placeholder="请输入姓名" />
+				</view>
+				<view class="input-box u-flex u-col-center">
+					<text class="text">联系电话</text>
+					<input type="number" placeholder="请输入联系电话" />
+				</view>
+				<view class="input-box u-flex u-col-center">
+					<text class="text">性别:</text>
+					<u-radio-group v-model="value" active-color="#08AA8C">
+						<u-radio :name="1">
+							<text style="color: #08AA8C;">男</text>
+						</u-radio>
+						<u-radio :name="2">
+							<text style="color: #08AA8C;">女</text>
+						</u-radio>
+					</u-radio-group>
+				</view>
+			</view>
+		</view>
+		<view class="jianjie-box">
+			<textarea placeholder="个人技能简介填写" />
+		</view>
+		<view class="title">
+			身份证信息
+		</view>
+		<view class="card-input u-flex u-col-center u-row-between">
+			<text>身份证号</text>
+			<input type="text" placeholder="请输入身份证号" />
+		</view>
+		<view class="upload-card u-flex u-col-center">
+			<view class="card-item u-flex-col u-col-center">
+				<view class="upload u-flex u-col-center u-row-center">
+					<u-icon name="plus" size="50" color="#AAAAAA"></u-icon>
+				</view>
+				<text class="text1">身份证正面</text>
+			</view>
+			<view class="card-item u-flex-col u-col-center">
+				<view class="upload u-flex u-col-center u-row-center">
+					<u-icon name="plus" size="50" color="#AAAAAA"></u-icon>
+				</view>
+				<text class="text1">身份证背面</text>
+			</view>
+		</view>
+		<view class="baoxian-box">
+			<view class="baoxian-title">
+				人身意外险信息
+			</view>
+			<view class="baoxian-input u-flex u-col-center">
+				<text>保险公司名称:</text>
+				<input type="text" />
+			</view>
+			<view class="baoxian-input u-flex u-col-center">
+				<text>保险合同编号:</text>
+				<input type="text" />
+			</view>
+			<view class="baoxian-input u-flex u-col-center">
+				<text>保险有效时间:</text>
+			</view>
+			<view class="change-time u-flex u-col-center">
+				<image src="../../static/images/1150.png" mode=""></image>
+				<text class="text1">请选择时间</text>
+				<text class="text2">至</text>
+				<image src="../../static/images/1150.png" mode=""></image>
+				<text class="text1">请选择时间</text>
+			</view>
+		</view>
+		<view class="upload-image u-flex-col">
+			<view class="upload u-flex u-col-center u-row-center">
+				<u-icon name="plus" size="50" color="#AAAAAA"></u-icon>
+			</view>
+			<text class="text1">*保险合同图片，请拍摄完整图片</text>
+		</view>
+		<view class="jineng-box">
+			<view class="jineng-title">
+				擅长技能
+			</view>
+			<view class="jineng-label u-flex u-col-center u-flex-wrap">
+				<text>水管道</text>
+				<text>水龙头</text>
+			</view>
+		</view>
+		<view class="xieyi-box u-flex u-col-center u-row-right">
+			<u-checkbox v-model="xieyi" active-color="rgba(8, 170, 140, 1)">同意开通</u-checkbox>
+			<text class="text1">《服务协议》</text>
+		</view>
+		<view>
+			<x-button :width="385" :height="132">服务审核已通过</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				value:1,
+				xieyi:false
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.kaitong-fuwu{
+		padding-bottom: 40rpx;
+		.xieyi-box{
+			padding: 0 24rpx;
+			margin-bottom: 35rpx;
+			.text1{
+				color: rgba(8, 170, 140, 1);
+			}
+		}
+		.jineng-box{
+			padding: 0 24rpx;
+			margin-bottom: 30rpx;
+			.jineng-title{
+				margin-bottom: 13rpx;
+				
+			}
+			.jineng-label{
+				text{
+					padding: 15rpx  20rpx;
+					border-radius: 10rpx;
+					background-color: #09AA8C;
+					font-size: 25rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #FFFFFF;
+					margin-right: 10rpx;
+				}
+			}
+		}
+		.upload-image{
+			padding: 0 24rpx;
+			.upload{
+				width: 177rpx;
+				height: 177rpx;
+				border: 1rpx solid #AAAAAA;
+				background-color: #D7D7D7;
+				border-radius: 10rpx;
+				margin-bottom: 10rpx;
+			}
+			.text1{
+				margin-bottom: 26rpx;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+		}
+		.baoxian-box{
+			margin: 20rpx auto;
+			width: 707rpx;
+			// height: 374rpx;
+			padding: 20rpx;
+			background-color: #fff;
+			border-radius: 10rpx;
+			.change-time{
+				image{
+					width: 42rpx;
+					height: 42rpx;
+				}
+				.text1{
+					color: rgba(170, 170, 170, 1);
+					font-size: 31rpx;
+					margin: 0 10rpx;
+				}
+				.text2{
+					color: rgba(170, 170, 170, 1);
+					font-size: 31rpx;
+					margin-right: 10rpx;
+				}
+			}
+			.baoxian-input{
+				height: 80rpx;
+				text{
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+				input{
+					padding: 10rpx 0;
+					border-bottom: 1rpx solid #B6B6B6;
+					flex: 1;
+					margin-left: 20rpx;
+				}
+			}
+			.baoxian-title{
+				font-size: 31rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				margin-bottom: 20rpx;
+			}
+		}
+		.upload-card{
+			margin: 24rpx;
+			padding-bottom: 20rpx;
+			border-bottom: 1rpx solid #B3B6B5;
+			.card-item{
+				margin-right: 20rpx;
+				.upload{
+					width: 220rpx;
+					height: 139rpx;
+					border-radius: 10rpx;
+					background-color: #D7D7D7;
+					border: 1rpx solid #B9BCBB;
+					margin-bottom: 10rpx;
+				}
+				.text1{
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #707070;
+				}
+			}
+		}
+		.card-input{
+			margin: 0 24rpx;
+			text{
+				margin-right: 20rpx;
+			}
+			input{
+				flex: 1;
+				border-bottom: 2rpx solid #BAC0BE;
+				padding: 20rpx 0;
+			}
+		}
+		.jianjie-box{
+			width: 711rpx;
+			border: 1rpx solid #ADADAD;
+			border-radius: 20rpx;
+			padding: 20rpx;
+			margin: 20rpx auto;
+		}
+		.user-box{
+			padding: 0 24rpx;
+			.user-right{
+				flex: 1;
+				.input-box{
+					padding: 22rpx 0;
+					border-bottom: 2rpx solid #BEC4C2;
+					.text{
+						margin-right: 10rpx;
+					}
+				}
+			}
+			.user-left{
+				margin-right: 30rpx;
+				image{
+					width: 189rpx;
+					height: 189rpx;
+					margin-bottom: 10rpx;
+				}
+				text{
+					font-size: 25rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #AAAAAA;
+				}
+			}
+		}
+		.title{
+			font-size: 31rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			padding: 10rpx 24rpx;
+		}
+		.header-box{
+			padding: 0 18rpx;
+			width: 707rpx;
+			// height: 352rpx;
+			margin: 20rpx auto;
+			background-color: #fff;
+			border-radius: 20rpx;
+			.item-box{
+				margin-bottom: 20rpx;
+				padding-bottom: 20rpx;
+				image{
+					width: 126rpx;
+					height: 126rpx;
+					margin-right: 33rpx;
+				}
+				.item-right{
+					flex: 1;
+					height: 126rpx;
+					border-radius: 20rpx;
+					border: 4rpx solid #09AA8C;
+					padding: 14rpx;
+					.content{
+						font-size: 25rpx;
+						font-family: SimHei;
+						font-weight: 400;
+						color: rgba(112, 112, 112, 1);
+					}
+					.top{
+						margin-bottom: 10rpx;
+						font-size: 25rpx;
+						font-family: SimHei;
+						font-weight: 400;
+						text:last-child{
+							color: rgba(8, 170, 140, 1);
+						}
+					}
+				}
+			}
+			.status-title{
+				padding: 24rpx 0;
+				font-size: 31rpx;
+				font-family: SimHei;
+				font-weight: 400;
+			}
+			.status-box{
+				padding: 16rpx 0;
+				border-bottom: 1rpx solid #E3E3E3;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+		}
+	}
+</style>

pages/mine/login-code.vue

@@ -0,0 +1,203 @@
+<template>
+	<view class="login-code">
+		<view class="header u-flex-col u-col-center u-row-center">
+			<image src="../../static/images/login1-1.png" mode=""></image>
+			<text>小马叮叮</text>
+		</view>
+		<view class="login-box">
+			<view class="input u-flex u-col-center u-row-between">
+				<text class="text1">手机号</text>
+				<input type="number" placeholder="请输入您的手机号" v-model="tel" />
+			</view>
+			<view class="input u-flex u-col-center u-row-between">
+				<text class="text1">验证码</text>
+				<input type="number" placeholder="请输入您收到的验证码" v-model="code" />
+				<text class="text2" @click="getCode">{{tips}}</text>
+			</view>
+		</view>
+		<view class="login-butt u-flex u-col-center u-row-center">
+			<image class="image1" src="../../static/images/login1-2.png" mode=""></image>
+			<view class="butt u-flex u-col-center u-row-center" @tap="login">
+				<image class="image2" src="../../static/images/login1-3.png" mode=""></image>
+				<text>登 录</text>
+			</view>
+		</view>
+		<view class="xieyi u-flex u-col-center u-row-center">
+			<u-checkbox v-model="checked" active-color="#08AA8C;"></u-checkbox>
+			<view>
+				<text @tap="checked = !checked">阅读并同意</text>
+				<text style="color: #08AA8C;">《注册/注册协议》</text>
+			</view>
+		</view>
+		<u-verification-code :seconds="seconds" ref="uCode" @change="codeChange">
+		</u-verification-code>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				tel:'',
+				code:'',
+				checked: false,
+				tips: '获取验证码',
+				// refCode: null,
+				seconds: 60,
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			login(){
+				if(!this.tel){
+					this.$u.toast("请输入手机号")
+					return
+				}
+				if(!this.code){
+					this.$u.toast("请输入验证码")
+					return
+				}
+				if(!this.checked){
+					this.$u.toast("请勾选协议")
+					return
+				}
+				this.$u.post('/Auth/phoneCaptchaLoginRegister',{
+					content:{
+						code:this.code,
+						phone:this.tel,
+					}
+				}).then(res => {
+					this.$u.toast(res.msg)
+					if(res.code == 0){
+						uni.setStorageSync("token",res.response.token)
+						setTimeout(() => {
+							uni.switchTab({
+								url:"./mine"
+							})
+						},800)
+					}
+				})
+			},
+			codeChange(text) {
+				this.tips = text;
+			},
+			getCode() {
+				if (this.$refs.uCode.canGetCode) {
+					// 模拟向后端请求验证码
+					this.$u.post('/Auth/smsMobileCaptcha',{
+						content:{
+							account_phone:this.tel,
+							captcha_type:0,
+							phone:this.tel,
+						}
+					}).then(res => {
+						this.$u.toast(res.msg)
+						if(res.code == 0){
+								this.$refs.uCode.start();
+						}
+					})
+				} else {
+					this.$u.toast('倒计时结束后再发送');
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.login-code {
+		.xieyi {
+			margin-top: 28rpx;
+		}
+
+		.login-butt {
+			width: 750rpx;
+			height: 254rpx;
+			position: relative;
+
+			.image1 {
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 750rpx;
+				height: 254rpx;
+			}
+
+			.butt {
+				position: relative;
+				z-index: 1;
+				width: 385rpx;
+				height: 132rpx;
+
+				.image2 {
+					width: 385rpx;
+					height: 132rpx;
+					position: absolute;
+					top: 0;
+					left: 0;
+				}
+
+				text {
+					text-align: center;
+					line-height: 132rpx;
+					font-size: 38rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #08AA8C;
+					position: relative;
+					z-index: 10;
+				}
+			}
+		}
+
+		.login-box {
+			padding: 0 28rpx;
+			margin-bottom: 80rpx;
+
+			.input {
+				margin-bottom: 20rpx;
+
+				.text1 {
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					margin-right: 17rpx;
+				}
+
+				input {
+					flex: 1;
+					padding: 10rpx 16rpx;
+					border-bottom: 4rpx solid #08AA8C;
+				}
+
+				.text2 {
+					width: 180rpx;
+					text-align: center;
+					font-size: 25rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+			}
+		}
+
+		.header {
+			margin-bottom: 50rpx;
+			padding-top: 50rpx;
+
+			image {
+				width: 206rpx;
+				height: 205rpx;
+				margin-bottom: 24rpx;
+			}
+
+			text {
+				font-size: 81rpx;
+				font-family: AliHYAiHei;
+				font-weight: 900;
+				color: #08AA8C;
+			}
+		}
+	}
+</style>

pages/mine/login.vue

@@ -0,0 +1,217 @@
+<template>
+	<view class="login">
+		<view class="header u-flex-col u-col-center u-row-center">
+			<image src="../../static/images/login1-1.png" mode=""></image>
+			<text>小马叮叮</text>
+		</view>
+		<view class="login-box">
+			<view class="input u-flex u-col-center u-row-between">
+				<text class="text1">手机号</text>
+				<input type="number" placeholder="请输入您的手机号" v-model="tel" />
+			</view>
+			<view class="input u-flex u-col-center u-row-between">
+				<text class="text1">密&nbsp;&nbsp;&nbsp;码</text>
+				<input type="text" password placeholder="请输入您的密码" v-model="pwd" />
+			</view>
+		</view>
+		<view class="other-login u-flex u-col-center u-row-between">
+			<text @tap="tologin">短信注册/登录</text>
+			<text @tap="toforget">忘记密码</text>
+		</view>
+		<view class="login-butt u-flex u-col-center u-row-center">
+			<image class="image1" src="../../static/images/login1-2.png" mode=""></image>
+			<view class="butt u-flex u-col-center u-row-center" @click="login">
+				<image class="image2" src="../../static/images/login1-3.png" mode=""></image>
+				<text>登 录</text>
+			</view>
+		</view>
+		<view class="xieyi u-flex u-col-center u-row-center">
+			<u-checkbox v-model="checked" active-color="#08AA8C;"></u-checkbox>
+			<view>
+				<text @tap="checked = !checked">阅读并同意</text>
+				<text style="color: #08AA8C;">《注册/注册协议》</text>
+			</view>
+		</view>
+		<view class="u-flex u-col-center u-row-center" style="margin-top: 20rpx;">
+			<image src="../../static/images/wxpic.webp" style="width: 100rpx;height: 100rpx;" @tap="wxlogin" mode="">
+			</image>
+		</view>
+	</view>
+</template>
+
+<script>
+	import md5Libs from "../../uview-ui/libs/function/md5.js";
+	export default {
+		data() {
+			return {
+				checked: false,
+				tel: '',
+				pwd: '',
+				code:''
+			}
+		},
+		onLoad() {
+			uni.login({
+				provider: "weixin",
+				success: (code) => {
+					console.log(code);
+					this.code = code.code
+				}
+			})
+		},
+
+		methods: {
+			wxlogin() {
+				uni.getUserProfile({
+					desc: "授权登录",
+					success: (res) => {
+						console.log(res);
+					},
+					fail: (err) => {
+						console.log(err);
+					}
+				})
+			},
+			login() {
+				if (!this.tel) {
+					this.$u.toast("请输入手机号")
+					return
+				}
+				if (!this.pwd) {
+					this.$u.toast("请输入密码")
+					return
+				}
+				if (!this.checked) {
+					this.$u.toast("请勾选协议")
+					return
+				}
+				this.$u.post('/Auth/phonePasswordLogin', {
+					content: {
+						password: md5Libs.md5(this.pwd),
+						phone: this.tel
+					}
+				}).then(res => {
+					this.$u.toast(res.msg)
+					uni.setStorageSync("token", res.response.token)
+					if (res.code == 0) {
+						setTimeout(() => {
+							uni.navigateBack()
+						}, 800)
+					}
+				})
+			},
+			tologin() {
+				uni.navigateTo({
+					url: "./login-code"
+				})
+			},
+			toforget() {
+				uni.navigateTo({
+					url: "./forget"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.login {
+		.xieyi {
+			margin-top: 28rpx;
+		}
+
+		.other-login {
+			margin-bottom: 30rpx;
+			padding: 0 24rpx;
+			color: #08AA8C;
+		}
+
+		.login-butt {
+			width: 750rpx;
+			height: 254rpx;
+			position: relative;
+
+			.image1 {
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 750rpx;
+				height: 254rpx;
+			}
+
+			.butt {
+				position: relative;
+				z-index: 1;
+				width: 385rpx;
+				height: 132rpx;
+
+				.image2 {
+					width: 385rpx;
+					height: 132rpx;
+					position: absolute;
+					top: 0;
+					left: 0;
+				}
+
+				text {
+					text-align: center;
+					line-height: 132rpx;
+					font-size: 38rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #08AA8C;
+					position: relative;
+					z-index: 10;
+				}
+			}
+		}
+
+		.login-box {
+			padding: 0 28rpx;
+			margin-bottom: 30rpx;
+
+			.input {
+				margin-bottom: 20rpx;
+
+				.text1 {
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					margin-right: 17rpx;
+				}
+
+				input {
+					flex: 1;
+					padding: 10rpx 16rpx;
+					border-bottom: 4rpx solid #08AA8C;
+				}
+
+				.text2 {
+					width: 180rpx;
+					text-align: center;
+					font-size: 25rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+			}
+		}
+
+		.header {
+			margin-bottom: 40rpx;
+			padding-top: 40rpx;
+
+			image {
+				width: 206rpx;
+				height: 205rpx;
+				margin-bottom: 24rpx;
+			}
+
+			text {
+				font-size: 81rpx;
+				font-family: AliHYAiHei;
+				font-weight: 900;
+				color: #08AA8C;
+			}
+		}
+	}
+</style>

pages/mine/mine.vue

@@ -0,0 +1,436 @@
+<template>
+	<view class="mine">
+		<x-navbar title="我的" :active="3"></x-navbar>
+		<view class="header-box u-flex u-col-center u-row-between">
+			<image v-if="userdata.id" :src="userdata.detail.headimgurl_image_src || '../../static/images/head-img.png'" class="head" mode="" @tap="touser"></image>
+			<image v-else src="../../static/images/mine1-1.png" class="head" mode="" @tap="touser"></image>
+			<view class="name" @tap="touser" v-if="userdata.id">
+				{{userdata.detail.nickname}}
+			</view>
+			<view class="name1" @tap="tologin" v-else>
+				点击登录
+			</view>
+			<image @tap="toyaoqing" src="../../static/images/mine1-2.png" class="code" mode=""></image>
+		</view>
+		<view style="padding: 0 26rpx;">
+			<u-gap height="7" bg-color="#08AA8C"></u-gap>
+		</view>
+		<!-- <view class="price-box u-flex u-col-center u-row-between">
+			<text class="text1">我的钱包:</text>
+			<image class="image1" src="../../static/images/mine1-3.png" mode=""></image>
+			<text class="text2">0.00</text>
+			<text class="text3">查看详情</text>
+			<u-icon name="arrow-right" color="#707070"></u-icon>
+		</view> -->
+		<view v-if="userdata.id">
+			<view class="row-box1 u-flex u-col-center u-row-between">
+				<text class="text1">您已是服务提供者</text>
+				<text class="text2" @tap="tofuwu">进入服务中心</text>
+				<image class="image1" src="../../static/images/mine1-4.png" mode=""></image>
+			</view>
+			<view class="row-box2 u-flex u-col-center">
+				<text class="text1">在线接单状态</text>
+				<u-switch v-model="checked" size="35" active-color="#08AA8C"></u-switch>
+			</view>
+			<view class="row-box3 u-flex u-col-center">
+				<text class="text1">接单时间：9:00 至 23：30</text>
+				<x-button :width="178" :height="46" color="#000" fontSize="30rpx">设置时间</x-button>
+			</view>
+			<view class="order-box">
+				<view class="box-title">
+					服务订单
+				</view>
+				<view class="order-tabs u-flex u-col-center">
+					<view class="item u-flex-col u-col-center">
+						<image src="../../static/images/mine1-5.png" mode=""></image>
+						<text class="text1">接新单</text>
+						<text class="text2">2</text>
+					</view>
+					<view class="item u-flex-col u-col-center">
+						<image src="../../static/images/mine1-5.png" mode=""></image>
+						<text class="text1">进行中</text>
+						<text class="text2">2</text>
+					</view>
+					<view class="item u-flex-col u-col-center">
+						<image src="../../static/images/mine1-5.png" mode=""></image>
+						<text class="text1">已完成</text>
+						<text class="text2">2</text>
+					</view>
+				</view>
+			</view>
+			<view class="row-box1 u-flex u-col-center u-row-between">
+				<text class="text1">开通服务项</text>
+				<text class="text2" @tap="tomorefuwu">更多服务</text>
+				<image class="image1" src="../../static/images/mine1-4.png" mode=""></image>
+			</view>
+			<view class="order-box">
+				<view class="fuwu-tabs u-flex u-col-center u-row-between">
+					<text :class="fuwutype == 1 ? 'text' : ''">已开通项目</text>
+					<text :class="fuwutype == 2 ? 'text' : ''">申请中项目</text>
+				</view>
+				<view class="fuwu-list u-flex u-col-center">
+					<view class="item u-flex-col u-col-center">
+						<view class="image u-flex u-col-center u-row-center">
+							<image src="../../static/images/t1.png" mode=""></image>
+							<text class="text2">已通过</text>
+						</view>
+						<view class="name">
+							代驾
+						</view>
+					</view>
+					<view class="item u-flex-col u-col-center">
+						<view class="image u-flex u-col-center u-row-center">
+							<image src="../../static/images/t2.png" mode=""></image>
+							<text class="text2">已通过</text>
+						</view>
+						<view class="name">
+							跑腿
+						</view>
+					</view>
+					<view class="item u-flex-col u-col-center">
+						<view class="image u-flex u-col-center u-row-center">
+							<image src="../../static/images/t3.png" mode=""></image>
+							<text class="text2">已通过</text>
+						</view>
+						<view class="name">
+							电工
+						</view>
+					</view>
+					<view class="item u-flex-col u-col-center">
+						<view class="image u-flex u-col-center u-row-center">
+							<image src="../../static/images/t4.png" mode=""></image>
+							<text class="text2">已通过</text>
+						</view>
+						<view class="name">
+							水工
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+
+		<view class="list-box">
+			<view class="item" @tap="toshop" v-if="userdata.is_business == 1">
+				<text>我的店铺</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view>
+			<view class="item" @tap="toaddress">
+				<text>地址管理</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view>
+			<view class="item" @tap="touser">
+				<text>个人资料</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view>
+			<view class="item" @tap="tosetting">
+				<text>应用设置</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view>
+			<view class="item">
+				<text>关于我们</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view>
+			<!-- <view class="item">
+				<text>意见建议</text>
+				<u-icon name="arrow-right"></u-icon>
+			</view> -->
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				checked: true,
+				fuwutype: 1,
+				userdata:{}
+			}
+		},
+		onLoad() {
+
+		},
+		onShow() {
+			if(uni.getStorageSync("token")){
+				this.getuser()
+			}else{
+				this.userdata = {}
+			}
+		},
+		methods: {
+			getuser(){
+				this.$u.post('/User/getDetail').then(res => {
+					if(res.code == 0){
+						this.userdata = res.response
+					}else{
+						this.userdata = {}
+					}
+				})
+			},
+			tologin(){
+				uni.navigateTo({
+					url:"./login"
+				})
+			},
+			toshop() {
+				uni.navigateTo({
+					url: "../shop/myshop"
+				})
+			},
+			tomorefuwu() {
+				uni.navigateTo({
+					url: "./more-fuwu"
+				})
+			},
+			toyaoqing() {
+				uni.navigateTo({
+					url: "./yaoqing"
+				})
+			},
+			tosetting() {
+				uni.navigateTo({
+					url: "./setting"
+				})
+			},
+			toaddress() {
+				uni.navigateTo({
+					url: "./address-list"
+				})
+			},
+			tofuwu() {
+				uni.navigateTo({
+					url: "../fuwu/fuwu"
+				})
+			},
+			touser() {
+				uni.navigateTo({
+					url: "./userinfo"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.mine {
+		.list-box {
+			margin-top: 40rpx;
+			background-color: #fff;
+
+			.item {
+				height: 89rpx;
+				border-top: 1rpx solid #ABB1AF;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				padding: 0 32rpx;
+			}
+		}
+
+		.order-box {
+			border: 1rpx solid #A0A0A0;
+			padding: 0 16rpx;
+			border-radius: 20rpx;
+			background-color: #fff;
+			margin: 0 22rpx;
+			padding-bottom: 20rpx;
+
+			.fuwu-list {
+				.item {
+					width: 25%;
+					margin-top: 10rpx;
+
+					.name {
+						font-size: 29rpx;
+						font-family: SimHei;
+					}
+
+					.image {
+						width: 124rpx;
+						height: 124rpx;
+						border-radius: 20rpx;
+						// background-color: #08AA8C;
+						position: relative;
+						margin-bottom: 10rpx;
+
+						image {
+							width: 124rpx;
+							height: 124rpx;
+						}
+
+						text {
+							position: absolute;
+							top: 50%;
+							left: 50%;
+							transform: translate(-50%, -50%);
+							padding: 8rpx 17rpx;
+							border-radius: 100rpx;
+							font-size: 19rpx;
+							font-family: SimHei;
+							font-weight: 400;
+							color: #E60012;
+							background-color: rgba(256, 256, 256, 0.8);
+							white-space: nowrap;
+						}
+
+					}
+				}
+			}
+
+			.fuwu-tabs {
+				text {
+					width: 50%;
+					text-align: center;
+					padding: 21rpx 0;
+					border-bottom: 7rpx solid #fff;
+					font-size: 29rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #707070;
+				}
+
+				.text {
+					color: #08AA8C;
+					border-bottom: 7rpx solid #08AA8C;
+				}
+			}
+
+			.order-tabs {
+				.item {
+					width: 20%;
+					position: relative;
+
+					image {
+						width: 52rpx;
+						height: 52rpx;
+						margin-bottom: 20rpx;
+					}
+
+					.text1 {
+						font-size: 28rpx;
+					}
+
+					.text2 {
+						position: absolute;
+						top: -10rpx;
+						right: 5rpx;
+						width: 39rpx;
+						height: 39rpx;
+						text-align: center;
+						line-height: 39rpx;
+						color: #fff;
+						border-radius: 100rpx;
+						font-size: 24rpx;
+						background-color: red;
+					}
+				}
+			}
+
+			.box-title {
+				padding: 24rpx 0;
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #707070;
+			}
+		}
+
+		.row-box3 {
+			padding: 32rpx;
+
+			.text1 {
+				margin-right: 40rpx;
+				color: #707070;
+				font-size: 25rpx;
+			}
+
+		}
+
+		.row-box2 {
+			padding: 0 32rpx;
+
+			.text1 {
+				font-size: 25rpx;
+				margin-right: 60rpx;
+			}
+		}
+
+		.row-box1 {
+			padding: 32rpx;
+
+			.text1 {
+				color: #707070;
+				font-size: 31rpx;
+				flex: 1;
+			}
+
+			.text2 {
+				font-size: 25rpx;
+				margin-right: 10rpx;
+			}
+
+			.image1 {
+				width: 27rpx;
+				height: 27rpx;
+			}
+		}
+
+		.price-box {
+			background-color: #fff;
+			padding: 25rpx 40rpx;
+			border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+
+			.text1 {
+				color: #707070;
+				font-size: 36rpx;
+			}
+
+			.image1 {
+				width: 34rpx;
+				height: 34rpx;
+				margin: 0 20rpx;
+			}
+
+			.text2 {
+				flex: 1;
+				color: #707070;
+				font-size: 36rpx;
+
+			}
+
+			.text3 {
+				color: #707070;
+				font-size: 25rpx;
+				margin-right: 10rpx;
+			}
+		}
+
+		.header-box {
+			background-color: #fff;
+			padding: 40rpx 26rpx 20rpx 26rpx;
+
+			.head {
+				width: 132rpx;
+				height: 133rpx;
+				border-radius: 100rpx;
+			}
+			.name1{
+				color: #2AA47F;
+				text-align: left;
+				flex: 1;
+				margin: 0 28rpx;
+			}
+			.name {
+				flex: 1;
+				margin: 0 28rpx;
+				color: #707070;
+				font-size: 36rpx;
+			}
+
+			.code {
+				width: 67rpx;
+				height: 65rpx;
+			}
+		}
+	}
+</style>

pages/mine/more-fuwu.vue

@@ -0,0 +1,113 @@
+<template>
+	<view class="more-fuwu">
+		<view class="list-box">
+			<view class="item-box u-flex u-col-center u-row-between">
+				<image src="../../static/images/t1.png" mode=""></image>
+				<view class="item-right">
+					<view class="top u-flex u-col-center u-row-between">
+						<text>代驾</text>
+						<text>已通过</text>
+					</view>
+					<view class="content">
+						   代驾申请须知
+					</view>
+				</view>
+			</view>
+			<view class="item-box u-flex u-col-center u-row-between">
+				<image src="../../static/images/t2.png" mode=""></image>
+				<view class="item-right">
+					<view class="top u-flex u-col-center u-row-between">
+						<text>跑腿</text>
+						<text>已通过</text>
+					</view>
+					<view class="content">
+						   跑腿申请
+					</view>
+				</view>
+			</view>
+			<view class="item-box u-flex u-col-center u-row-between">
+				<image src="../../static/images/t3.png" mode=""></image>
+				<view class="item-right">
+					<view class="top u-flex u-col-center u-row-between">
+						<text>电</text>
+						<text>已通过</text>
+					</view>
+					<view class="content">
+						   电申请
+					</view>
+				</view>
+			</view>
+			<view class="item-box u-flex u-col-center u-row-between">
+				<image src="../../static/images/t4.png" mode=""></image>
+				<view class="item-right">
+					<view class="top u-flex u-col-center u-row-between">
+						<text>水</text>
+						<text>已通过</text>
+					</view>
+					<view class="content">
+						   水申请
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			tokaitong(){
+				uni.navigateTo({
+					url:"./kaitong-fuwu"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.more-fuwu{
+		padding: 24rpx;
+		.list-box{
+			.item-box{
+				margin-bottom: 20rpx;
+				image{
+					width: 126rpx;
+					height: 126rpx;
+					margin-right: 33rpx;
+				}
+				.item-right{
+					flex: 1;
+					height: 126rpx;
+					border-radius: 20rpx;
+					border: 4rpx solid #09AA8C;
+					padding: 14rpx;
+					.content{
+						font-size: 25rpx;
+						font-family: SimHei;
+						font-weight: 400;
+						color: rgba(112, 112, 112, 1);
+					}
+					.top{
+						margin-bottom: 10rpx;
+						font-size: 25rpx;
+						font-family: SimHei;
+						font-weight: 400;
+						text:last-child{
+							color: rgba(8, 170, 140, 1);
+						}
+					}
+				}
+			}
+			
+		}
+	}
+</style>

pages/mine/setting.vue

@@ -0,0 +1,97 @@
+<template>
+	<view class="setting">
+		<view class="form-box">
+			<view class="row-box u-flex u-col-center u-row-between" @tap="totel">
+				<text class="text1">手机号</text>
+				<text class="text2">设置</text>
+				<u-icon name="arrow-right" color="#08AA8C"></u-icon>
+			</view>
+			<view class="row-box u-flex u-col-center u-row-between" @tap="topwd">
+				<text class="text1">密码设置</text>
+				<text class="text2">未设置</text>
+				<u-icon name="arrow-right" color="#08AA8C"></u-icon>
+			</view>
+			<view class="row-box u-flex u-col-center u-row-between" @tap="toanquan">
+				<text class="text1">帐号安全</text>
+				<text class="text2">未设置</text>
+				<u-icon name="arrow-right" color="#08AA8C"></u-icon>
+			</view>
+		</view>
+		<view class="button-down">
+			<x-button @click="toout">退出登录</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			toout(){
+				uni.showModal({
+					content:"确认退出登录？",
+					success: (res) => {
+						if(res.confirm){
+							uni.removeStorageSync("token")
+							this.$u.toast("退出成功")
+							setTimeout(() => {
+								uni.navigateBack()
+							},800)
+						}
+					}
+				})
+			},
+			toanquan(){
+				uni.navigateTo({
+					url:'./anquan'
+				})
+			},
+			totel(){
+				uni.navigateTo({
+					url:"./change-tel"
+				})
+			},
+			topwd(){
+				uni.navigateTo({
+					url:"./change-pwd"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.setting {
+		.form-box{
+			padding: 0 30rpx;
+			margin-bottom: 86rpx;
+			.row-box{
+				height: 100rpx;
+				border-bottom: 2rpx solid #DADADA;
+				.text1{
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #08AA8C;
+				}
+				.text2{
+					text-align: right;
+					flex: 1;
+					margin: 0 20rpx;
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #08AA8C;
+					
+				}
+			}
+		}
+	}
+</style>

pages/mine/tel-add.vue

@@ -0,0 +1,90 @@
+<template>
+	<view class="tel-add">
+		<view class="header u-flex u-col-center">
+			<text>账号：</text>
+			<text>12f23f23(已绑定)</text>
+		</view>
+		<view class="form-box">
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">手机号</text>
+				<input type="number" placeholder="请输入手机号"/>
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">验证码</text>
+				<input type="number" placeholder="请输入短信验证码"/>
+				<text class="text1">获取验证码</text>
+			</view>
+			<view class="form-item u-flex u-col-center u-row-between">
+				<text class="text">密码</text>
+				<input type="number" placeholder="请输入账号密码"/>
+			</view>
+		</view>
+		<view class="tijiao">
+			<x-button>确认设置</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.tel-add {
+		.header{
+			font-size: 33rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			padding: 42rpx 33rpx 21rpx 33rpx;
+			border-bottom: 4rpx solid #08AA8C;
+			text:last-child{
+				color: #08AA8C;
+			}
+		}
+		.tijiao {
+			width: 303rpx;
+			height: 104rpx;
+			margin: 200rpx auto;
+			
+		}
+
+
+		.form-box {
+			padding: 36rpx;
+
+			.form-item {
+				height: 100rpx;
+				
+				.text1 {
+					width:180rpx;
+					text-align: right;
+				}
+
+				.text {
+					width: 150rpx;
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+
+				input {
+					padding: 0 10rpx;
+					flex: 1;
+					border-bottom: 4rpx solid #56C5B1;
+				}
+			}
+		}
+	}
+</style>

pages/mine/tel-list.vue

@@ -0,0 +1,92 @@
+<template>
+	<view class="tel-list">
+		<view class="header u-flex u-col-center u-row-right">
+			<u-icon name="info-circle" size="33" color="#08AA8C"></u-icon>
+			<text class="text">说明</text>
+		</view>
+		<view class="item" v-for="(item,index) in 2" :key="index">
+			<view class="top u-flex u-col-center u-row-right">
+				<text>删除</text>
+			</view>
+			<view class="text2">
+				手机号1  159****3977
+			</view>
+			<view class="text2">
+				2022-03-15 14:20:11 
+			</view>
+		</view>
+		<view style="height: 120rpx;"></view>
+		<view class="down-botton" @tap="toadd">
+			添加
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			toadd(){
+				uni.navigateTo({
+					url:"./tel-add"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.tel-list{
+		padding: 0 33rpx;
+		.down-botton{
+			position: fixed;
+			bottom: 20rpx;
+			left: 24rpx;
+			width: 702rpx;
+			height: 80rpx;
+			line-height: 80rpx;
+			border-radius: 10rpx;
+			color: #fff;
+			background-color: #08AA8C;
+			text-align: center;
+		}
+		.item{
+			margin-bottom: 20rpx;
+			border-radius: 20rpx;
+			background-color: #fff;
+			padding:0 24rpx;
+			.text2{
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+				padding: 0 0 20rpx 0;
+			}
+			.top{
+				margin-bottom: 20rpx;
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				padding: 20rpx 0;
+				border-bottom: 2rpx solid rgba(0,0,0,0.2);
+			}
+		}
+		.header{
+			padding: 28rpx 0;
+			.text{
+				margin-left: 6rpx;
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+		}
+	}
+</style>

pages/mine/userinfo.vue

@@ -0,0 +1,92 @@
+<template>
+	<view class="userinfo">
+		<view class="user-box">
+			<view class="yaoqing">
+				邀请码：
+			</view>
+			<view class="input-box u-flex u-col-bottom u-row-between">
+				<text class="text">昵称：</text>
+				<input type="text" />
+				<image src="../../static/images/mine1-1.png" class="image" mode=""></image>
+			</view>
+			<view class="input-box u-flex u-col-bottom u-row-between" style="width: 300rpx;">
+				<text class="text">性别：</text>
+				<u-radio-group v-model="value" active-color="#08AA8C">
+					<u-radio :name="1">
+						<text style="color: #08AA8C;">男</text>
+					</u-radio>
+					<u-radio :name="2">
+						<text style="color: #08AA8C;">女</text>
+					</u-radio>
+				</u-radio-group>
+			</view>
+			<view class="tel-box u-flex u-col-center u-row-right">
+				<text style="margin-right: 20rpx;">手机号：159****3977</text>
+				<text style="color: #08AA8C;" @tap="tochange">更换绑定</text>
+			</view>
+			<view class="tijiao">
+				<x-button>确认修改</x-button>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				value: ''
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			tochange(){
+				uni.navigateTo({
+					url:"./change-tel"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.userinfo {
+		.user-box {
+			padding: 42rpx 34rpx;
+			.tijiao {
+				margin: 200rpx auto;
+			}
+			.input-box {
+				margin-bottom: 40rpx;
+				padding-bottom: 10rpx;
+				border-bottom: 4rpx solid #69CCBA;
+
+				.text {
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #08AA8C;
+				}
+
+				input {
+					flex: 1;
+					margin: 0 10rpx;
+				}
+
+				.image {
+					width: 130rpx;
+					height: 130rpx;
+					border-radius: 100rpx;
+				}
+			}
+
+			.yaoqing {
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+			}
+		}
+	}
+</style>

pages/mine/wenda-add.vue

@@ -0,0 +1,111 @@
+<template>
+	<view class="wenda-add">
+		<view class="title u-flex u-col-center">
+			<text>帐号:</text>
+			<text>159****3977</text>
+		</view>
+		<view class="wenda-box">
+			<view class="text1">
+				你明白什么叫牛逼吗？
+			</view>
+			<view class="text2">
+				换一个问题
+			</view>
+			<view class="input-box u-flex u-col-center u-row-between">
+				<text>答案</text>
+				<input type="text" placeholder="请输入您设置的问题答案" />
+			</view>
+			<view class="input-box u-flex u-col-center u-row-between">
+				<text>密码</text>
+				<input type="text" placeholder="请输入密码" />
+			</view>
+			<view class="tijiao">
+				<x-button @click="tonext">下一步</x-button>
+				<!-- <text @tap="tonext"></text> -->
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			tonext(){
+				uni.navigateTo({
+					url:"./forget-wen1"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.wenda-add{
+		min-height: 100vh;
+		background-color: #fff;
+		.wenda-box{
+			padding: 0 33rpx;
+			.tijiao {
+				width: 303rpx;
+				height: 104rpx;
+				margin: 200rpx auto;
+				position: relative;
+				
+			}
+			
+			.input-box{
+				height: 100rpx;
+				// margin-bottom: 22rpx;
+				text{
+					font-size: 33rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					margin-right: 20rpx;
+				}
+				input{
+					flex: 1;
+					font-size: 33rpx;
+					border-bottom: 4rpx solid #1DB196;
+					padding: 10rpx 0;
+				}
+			}
+			.text1{
+				padding: 34rpx 0 40rpx 0;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+			}
+			.text2{
+				width: 181rpx;
+				height: 65rpx;
+				text-align: center;
+				line-height: 65rpx;
+				border-radius: 20rpx;
+				border: 2rpx solid #1DB196;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+		}
+		.title{
+			font-size: 33rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			color: #000000;
+			padding: 41rpx 33rpx 21rpx 33rpx;
+			border-bottom: 4rpx solid #57C5B0;
+			text:last-child{
+				color: #08AA8C;
+			}
+		}
+	}
+</style>

pages/mine/wenda-list.vue

@@ -0,0 +1,92 @@
+<template>
+	<view class="wenda-list">
+		<view class="header u-flex u-col-center u-row-right">
+			<u-icon name="info-circle" size="33" color="#08AA8C"></u-icon>
+			<text class="text">说明</text>
+		</view>
+		<view class="item" v-for="(item,index) in 2" :key="index">
+			<view class="top u-flex u-col-center u-row-right">
+				<text>删除</text>
+			</view>
+			<view class="text2">
+				问题1  你明白什么叫牛逼吗？
+			</view>
+			<view class="text2">
+				2022-03-15 14:20:11 
+			</view>
+		</view>
+		<view style="height: 120rpx;"></view>
+		<view class="down-botton" @tap="toadd">
+			添加
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			toadd(){
+				uni.navigateTo({
+					url:"./wenda-add"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.wenda-list{
+		padding: 0 33rpx;
+		.down-botton{
+			position: fixed;
+			bottom: 20rpx;
+			left: 24rpx;
+			width: 702rpx;
+			height: 80rpx;
+			line-height: 80rpx;
+			border-radius: 10rpx;
+			color: #fff;
+			background-color: #08AA8C;
+			text-align: center;
+		}
+		.item{
+			margin-bottom: 20rpx;
+			border-radius: 20rpx;
+			background-color: #fff;
+			padding:0 24rpx;
+			.text2{
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+				padding: 0 0 20rpx 0;
+			}
+			.top{
+				margin-bottom: 20rpx;
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				padding: 20rpx 0;
+				border-bottom: 2rpx solid rgba(0,0,0,0.2);
+			}
+		}
+		.header{
+			padding: 28rpx 0;
+			.text{
+				margin-left: 6rpx;
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+		}
+	}
+</style>

pages/mine/xiaoxi.vue

@@ -0,0 +1,90 @@
+<template>
+	<view class="xiaoxi">
+		<view class="header u-flex u-col-center u-row-right">
+			<image src="../../static/images/xiaoxi.png" mode=""></image>
+			<text>一键已读</text>
+		</view>
+		<view class="item" v-for="(item,index) in 2" :key="index">
+			<view class="top u-flex u-col-center u-row-between">
+				<text>2020-02-02 20:20:20</text>
+				<text :style="{color: index % 2 == 0 ? '#08AA8C' : '#FDCE1C'}">未读信息</text>
+			</view>
+			<view class="item-content u-flex-col">
+				<text>下单成功</text>
+				<text>下单成功</text>
+			</view>
+			<view class="down-text">
+				<text>维修信息</text>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.xiaoxi {
+		padding: 0 33rpx;
+
+		.item {
+			border-radius: 10rpx;
+			background-color: #fff;
+			padding: 0 30rpx;
+			margin-bottom: 20rpx;
+			.top {
+				border-bottom: 2rpx solid rgba(0, 0, 0, 0.3);
+				padding: 12rpx 0;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+			}
+			.item-content{
+				text:first-child{
+					font-size: 26rpx;
+				}
+				text:last-child{
+					font-size: 24rpx;
+				}
+			}
+			.down-text{
+				text-align: right;
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+				padding:10rpx 0 20rpx 0;
+			}
+		}
+
+		.header {
+			padding: 28rpx 0;
+
+			image {
+				width: 31rpx;
+				height: 30rpx;
+				margin-right: 10rpx;
+			}
+
+			text {
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+			}
+		}
+	}
+</style>

pages/mine/yaoqing-user.vue

@@ -0,0 +1,45 @@
+<template>
+	<view class="yaoqing-user">
+		<view class="notdata u-flex-col u-col-center u-row-center">
+			<image class="image" src="../../static/images/yaoqing1-1.png" mode=""></image>
+			<text class="text1">暂时没有您邀请的用户</text>
+			<text class="text1" style="margin-bottom: 55rpx;">稍后请刷新再试</text>
+			<x-button>点击刷新</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.yaoqing-user{
+		.notdata{
+			height: 70vh;
+			.image{
+				width: 146rpx;
+				height: 146rpx;
+				margin-bottom: 70rpx;
+			}
+			.text1{
+				font-size: 33rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #AAAAAA;
+			}
+		}
+	}
+</style>

pages/mine/yaoqing.vue

@@ -0,0 +1,63 @@
+<template>
+	<view class="yaoqing">
+		<view class="header u-flex u-col-center u-row-right">
+			<text>分享邀请新用户</text>
+			<text>|</text>
+			<text @tap="touser">查看团队</text>
+		</view>
+		<view class="body-box u-flex-col u-col-center">
+			<image src="../../static/images/mine1-2.png" mode=""></image>
+			<text>邀请码：123123123</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			touser(){
+				uni.navigateTo({
+					url:"./yaoqing-user"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.yaoqing{
+		padding: 36rpx 39rpx;
+		.body-box{
+			margin-top: 270rpx;
+			image{
+				width: 320rpx;
+				height: 320rpx;
+				margin-bottom: 30rpx;
+			}
+			text{
+				font-size: 33rpx;
+				color: rgba(8, 170, 140, 1);
+			}
+		}
+		.header{
+			font-size: 33rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			text:nth-child(2){
+				margin: 0 10rpx;
+				color: rgba(0,0,0,0.3);
+			}
+			text:last-child{
+				color: rgba(8, 170, 140, 1);
+			}
+		}
+	}
+</style>

pages/order/fuwu-orderinfo.vue

@@ -0,0 +1,557 @@
+<template>
+	<view class="fuwu-order-info1">
+		<view class="item1-header">
+			<view class="top u-flex u-col-center">
+				<image src="../../static/images/t-tools.png" mode="" v-if="type == 0"></image>
+				<image src="../../static/images/t-daijia.png" mode="" v-if="type == 1"></image>
+				<image src="../../static/images/t-paotui.png" mode="" v-if="type == 2"></image>
+				<text class="text1">WX164843242876885</text>
+				<text class="text2">己取消</text>
+			</view>
+			<view class="down u-flex u-col-center u-row-right">
+				<image src="../../static/images/order1-1.png" mode=""></image>
+				<text>1282.32km</text>
+			</view>
+		</view>
+		<view class="order-status u-flex u-col-center" @tap="tojindu()">
+			<u-icon name="car" size="32"></u-icon>
+			<view class="status-right u-flex-col">
+				<text>下单成功，等待接单中</text>
+				<text>2022-04-02 10:52:56</text>
+			</view>
+		</view>
+		<view class="weixiu-box" v-if="type == 0">
+			<view class="weixiu-goods u-flex u-col-center">
+				<image src="../../static/images/t4.png" mode=""></image>
+				<view class="goods-right u-flex-col">
+					<text>维修类型：水 水管</text>
+					<text>备注：123456</text>
+				</view>
+			</view>
+			<view class="goods-tips">
+				故障器件或故障现象图(无）
+			</view>
+			<view class="u-flex u-col-center u-flex-wrap" style="margin-bottom: 20rpx;">
+				<image src="../../static/images/648.png" style="width: 150rpx;height: 150rpx;margin-right: 20rpx;"
+					mode=""></image>
+			</view>
+			<view class="shangmen-time">
+				上门时间：2022-04-02 10:52:00
+			</view>
+			<view>地址信息：</view>
+			<view>了 15816171622</view>
+			<view>广东省潮州市湘桥区凤东路(潮州 •恒大城东侧约100米)潮州
+				市黄金塘科目二考场 广东省潮州市湘桥区桥东街道黄金塘
+				小学西北茂源混凝士</view>
+			<view class="price-box u-flex-col">
+				<text>需付金额：10.00元 ＋ 师傅维修费 ＋材料费</text>
+				<text>价格说明：上门费用10.00元,扣除优惠费0.00元,需支付10.00</text>
+			</view>
+		</view>
+		<view class="daijia-box" v-if="type == 1">
+			<view class="qidian u-flex u-col-center">
+				<text>起</text>
+				<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+			</view>
+			<view class="tel-box">
+				15816171622
+			</view>
+			<view class="dj-text">
+				（出发位置）
+			</view>
+			<view class="qidian u-flex u-col-center">
+				<text style="background-color: #EE3709;">终</text>
+				<text>上车后告知司机位置</text>
+			</view>
+			<view class="dj-text">
+				（终点位置）
+			</view>
+			<view class="qibu-price">
+				须付金额：¥10.0元
+			</view>
+			<view class="price-tips u-flex-col">
+				<text>价格说明：起步价15.00元＋路程费＋超程返程费＋等待超时费用</text>
+				<text>送达位置：啦啦啦</text>
+			</view>
+		</view>
+		<view class="paotui-box" v-if="type == 2">
+			<view class="order-goods">
+				<view class="order-goods-box u-flex u-col-center">
+					<image src="../../static/images/t2.png" class="goods-img" mode=""></image>
+					<view class="goods-right">
+						<view class="goods-name">
+							跑腿类型：帮我买
+						</view>
+						<view class="goods-jieshao">
+							物品信息：文件 预计商品费用：1.0元
+						</view>
+						<view class="goods-price">
+							<text>预约送达时间：2022-04-04 09:49:00</text>
+						</view>
+					</view>
+				</view>
+				<view class="taocan-box">
+					商品图（无）
+				</view>
+				<view class="u-flex u-col-center u-flex-wrap" style="margin-bottom: 20rpx;">
+					<image src="../../static/images/648.png" style="width: 150rpx;height: 150rpx;margin-right: 20rpx;"
+						mode=""></image>
+				</view>
+			</view>
+			<view class="qidian u-flex u-col-center">
+				<text>起</text>
+				<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+			</view>
+			<view class="tel-box u-flex u-col-center">
+				<text class="text1">了</text>
+				<text class="text2">15816171622</text>
+			</view>
+			<view class="dj-text">
+				（取件地址）
+			</view>
+			<view class="qidian u-flex u-col-center">
+				<text style="background-color: #EE3709;">终</text>
+				<text>上车后告知司机位置</text>
+			</view>
+			<view class="tel-box u-flex u-col-center">
+				<text class="text1">了</text>
+				<text class="text2">15816171622</text>
+			</view>
+			<view class="dj-text">
+				（送件地址）
+			</view>
+			<view class="price-box u-flex-col u-col-top">
+				<text>需付金额：0.00元＋实际商品费用</text>
+				<text>
+					价格说明：价格说明：起步价14.00元,预计距离0.0600公里,距离附加费19998.00元,重量附加费0.00元,特殊时段附加费0.00元,实际商品费用N元,扣除优惠费0.00元,需支付20012.00元+实际商品费用
+				</text>
+			</view>
+		</view>
+		<view class="jiedan-box">
+			<view class="jiedan-top u-flex u-col-center u-row-between">
+				<text>接单人信息</text>
+				<text>已完成</text>
+			</view>
+			<view class="jiedan-user u-flex u-col-center">
+				<image src="../../static/images/order1-2.png" mode=""></image>
+				<view class="user-right u-flex-col">
+					<text>姓名：1</text>
+					<view class="u-flex u-col-center">
+						<text>联系电话：</text>
+						<u-icon name="phone-fill" color="#0DA98C"></u-icon>
+						<text style="color: #0DA98C;">15816171622</text>
+					</view>
+					<text>工号：1A7700A9572694E5A6D12DBAB2B99A02</text>
+				</view>
+			</view>
+			<view class="jiedan-time">
+				接单时间：2022-02-17 14:58:17
+			</view>
+		</view>
+		<view class="order-down u-flex-col">
+			<text v-if="type == 0">维修服务</text>
+			<text v-if="type == 1">代驾服务</text>
+			<text v-if="type == 2">跑腿服务</text>
+			<text>下单时间：2022-04-02 10:52:56</text>
+			<text>接单时间：2022-04-02 10:52:56</text>
+			<text>发货时间：2022-04-02 10:52:56</text>
+			<text>完成时间：2022-04-02 10:52:56</text>
+		</view>
+		<view style="height: 120rpx;"></view>
+		<view class="down-box u-flex u-col-center u-row-right">
+			<x-button style="margin-right: 20rpx;" :width="180" :height="60" fontSize="24rpx" borderRadius="20rpx">确认接单
+			</x-button>
+			<x-button style="margin-right: 20rpx;" :width="180" :height="60" fontSize="24rpx" borderRadius="20rpx">确认出发
+			</x-button>
+			<x-button :width="180" :height="60" fontSize="24rpx" borderRadius="20rpx">取消订单</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				type: ''
+			}
+		},
+		onLoad(option) {
+			this.type = option.index
+		},
+		onShow() {
+			if (this.type == 0) {
+				uni.setNavigationBarTitle({
+					title: "维修服务订单"
+				})
+			}
+			if (this.type == 1) {
+				uni.setNavigationBarTitle({
+					title: "代驾服务订单"
+				})
+			}
+			if (this.type == 2) {
+				uni.setNavigationBarTitle({
+					title: "跑腿服务订单"
+				})
+			}
+			if (this.type == 3) {
+				uni.setNavigationBarTitle({
+					title: "商品订单"
+				})
+			}
+		},
+		methods: {
+			tojindu() {
+				uni.navigateTo({
+					url: "./jindu"
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.fuwu-order-info1 {
+		padding: 1rpx 20rpx;
+		background-color: #fff;
+
+		.paotui-box {
+			padding: 10rpx 10rpx 20rpx 10rpx;
+			font-size: 26rpx;
+			color: #908E90;
+
+			.price-tips {
+				text-align: right;
+				font-size: 22rpx;
+				margin: 10rpx 0;
+				border-bottom: 1rpx solid #E8E6E8;
+
+				padding-bottom: 20rpx;
+
+			}
+
+			.price-box {
+				padding: 20rpx 0;
+				border-bottom: 1rpx solid #DCDADC;
+				border-top: 1rpx solid #DCDADC;
+
+				text:first-child {
+					color: #CA847E;
+				}
+			}
+
+			.qibu-price {
+				text-align: right;
+				font-size: 22rpx;
+				margin: 10rpx 0;
+			}
+
+			.dj-text {
+				margin-bottom: 15rpx;
+			}
+
+			.tel-box {
+				padding: 0 30rpx;
+			}
+
+			.weixiu-time {
+				margin-bottom: 10rpx;
+
+				text:first-child {
+					color: #28B59B;
+					font-size: 30rpx;
+					margin: 10rpx 0;
+				}
+			}
+
+			.qidian {
+				text:first-child {
+					display: inline-block;
+					width: 30rpx;
+					height: 30rpx;
+					text-align: center;
+					line-height: 30rpx;
+					border-radius: 100rpx;
+					background-color: #00A1EF;
+					font-size: 20rpx;
+					color: #fff;
+				}
+
+				text:last-child {
+					flex: 1;
+					margin-left: 10rpx;
+					color: #908E90;
+				}
+			}
+
+			.order-goods {
+				// border-bottom: 1rpx solid #E7E5E7;
+				padding-bottom: 10rpx;
+
+				// padding: 20rpx;
+				.taocan-box {
+					padding-top: 10rpx;
+					padding-bottom: 10rpx;
+					// border-bottom: 1rpx solid #C0C0C0;
+					color: rgba(0, 0, 0, 0.4);
+				}
+
+				.order-goods-box {
+
+					.goods-img {
+						width: 150rpx;
+						height: 150rpx;
+						border-radius: 10rpx;
+						margin-right: 20rpx;
+					}
+
+					.goods-right {
+						flex: 1;
+
+						.goods-name {
+							font-size: 26rpx;
+							margin-bottom: 10rpx;
+							color: rgba(0, 0, 0, 0.4);
+						}
+
+						.goods-jieshao {
+							color: rgba(0, 0, 0, 0.4);
+							margin-bottom: 10rpx;
+							font-size: 26rpx;
+						}
+
+						.goods-price {
+							color: rgba(0, 0, 0, 0.3);
+							font-size: 26rpx;
+						}
+					}
+				}
+			}
+		}
+
+		.daijia-box {
+			padding: 0 10rpx 20rpx 10rpx;
+			font-size: 26rpx;
+			color: #908E90;
+
+			.price-box {
+				padding: 20rpx 0;
+				border-bottom: 1rpx solid #DCDADC;
+				border-top: 1rpx solid #DCDADC;
+
+				text:first-child {
+					color: #CA847E;
+				}
+			}
+
+			.dj-text {
+				margin-bottom: 15rpx;
+			}
+
+			.tel-box {
+				padding: 0 30rpx;
+
+				.text1 {}
+
+				.text2 {
+					color: #29B08A;
+				}
+			}
+
+			.weixiu-time {
+				margin-bottom: 10rpx;
+
+				text:first-child {
+					color: #28B59B;
+					font-size: 30rpx;
+					margin: 10rpx 0;
+				}
+			}
+
+			.qidian {
+				text:first-child {
+					display: inline-block;
+					width: 30rpx;
+					height: 30rpx;
+					text-align: center;
+					line-height: 30rpx;
+					border-radius: 100rpx;
+					background-color: #00A1EF;
+					font-size: 20rpx;
+					color: #fff;
+				}
+
+				text:last-child {
+					flex: 1;
+					margin-left: 10rpx;
+					color: #908E90;
+				}
+			}
+
+			.price-tips {
+				font-size: 22rpx;
+				// margin: 10rpx 0;
+				padding-bottom: 20rpx;
+				border-bottom: 1rpx solid #DCDADC;
+
+				text:last-child {
+					color: #2AA47F;
+				}
+			}
+
+			.qibu-price {
+				font-size: 22rpx;
+				padding-top: 20rpx;
+				border-top: 1rpx solid #DCDADC;
+				color: #C04C31;
+				// margin: 10rpx 0;
+			}
+		}
+
+		.jiedan-box {
+			.jiedan-time {
+				font-size: 26rpx;
+				color: #545454;
+				padding: 20rpx 10rpx;
+				border-bottom: 1rpx solid #DCDADC;
+				margin-bottom: 20rpx;
+			}
+
+			.jiedan-top {
+				padding: 20rpx 10rpx;
+
+				text:last-child {
+					color: #C4C4C4;
+					font-size: 24rpx;
+				}
+			}
+
+			.jiedan-user {
+				image {
+					width: 150rpx;
+					height: 150rpx;
+					margin-right: 10rpx;
+				}
+
+				.user-right {
+					flex: 1;
+					font-size: 26rpx;
+					color: #545454;
+				}
+			}
+		}
+
+		.down-box {
+			position: fixed;
+			bottom: 0rpx;
+			background-color: #E3F7F0;
+			left: 0;
+			width: 750rpx;
+			padding: 20rpx 24rpx 30rpx 24rpx;
+		}
+
+		.order-down {
+			padding: 20rpx 0;
+			color: #829191;
+
+			text:first-child {
+				color: #00A47A;
+			}
+		}
+
+		.fapiao {
+			padding: 20rpx 0;
+			border-bottom: 1rpx solid #CBD7D5;
+			color: #829191;
+		}
+
+		.weixiu-box {
+			padding: 20rpx 0 0 0;
+			border-top: 1rpx solid #CBD7D5;
+			color: #829191;
+
+
+
+			.price-box {
+				padding: 20rpx 0;
+				border-bottom: 1rpx solid #CBD7D5;
+				border-top: 1rpx solid #CBD7D5;
+				font-size: 24rpx;
+				margin-top: 20rpx;
+
+				text:first-child {
+					color: #C04C31;
+				}
+
+				text:nth-child(2) {}
+			}
+
+			.goods-tips {
+				color: #829191;
+				padding: 10rpx 0;
+				margin-bottom: 10rpx;
+			}
+
+			.weixiu-goods {
+				image {
+					width: 150rpx;
+					height: 150rpx;
+					margin-right: 20rpx;
+				}
+
+				.goods-right {
+					color: #829191;
+				}
+			}
+		}
+
+		.order-status {
+			margin-bottom: 20rpx;
+			border: 1rpx solid #69BFAF;
+			border-radius: 20rpx;
+			padding: 20rpx;
+			background-color: #fff;
+
+			.status-right {
+				font-size: 26rpx;
+				margin-left: 10rpx;
+				color: #828282;
+			}
+		}
+
+		.item1-header {
+			padding: 10rpx;
+
+			.down {
+				padding-bottom: 10rpx;
+				border-bottom: 1rpx solid #D5D5D5;
+
+				image {
+					width: 42rpx;
+					height: 42rpx;
+				}
+
+				text {
+					color: #2FA284;
+					font-size: 26rpx;
+				}
+			}
+
+			.top {
+				image {
+					width: 30rpx;
+					height: 30rpx;
+				}
+
+				.text1 {
+					flex: 1;
+					margin: 0 10rpx;
+				}
+
+				.text2 {
+					color: #CD854E;
+				}
+			}
+		}
+	}
+</style>

pages/order/jindu.vue

@@ -0,0 +1,216 @@
+<template>
+	<view class="jindu">
+		<view class="order-header u-flex u-col-center">
+			<image src="../../static/images/t-tools.png" mode="" v-if="type == 0"></image>
+			<image src="../../static/images/t-daijia.png" mode="" v-if="type == 1"></image>
+			<image src="../../static/images/t-paotui.png" mode="" v-if="type == 2"></image>
+			<image src="../../static/images/t-jipin.png" mode="" v-if="type == 3"></image>
+			<text class="text1">WX164843242876885</text>
+			<text class="text2"></text>
+		</view>
+		<view class="image-box u-flex u-col-center" v-if="type == 0">
+			<image src="../../static/images/t4.png" mode=""></image>
+			<view class="image-right u-flex-col">
+				<text>维修类型水 水管</text>
+				<text>备注：</text>
+			</view>
+		</view>
+		<view v-if="type == 1">
+			<view class="qidian u-flex u-col-center">
+				<text>起</text>
+				<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+			</view>
+			<view class="tel-box">
+				15816171622
+			</view>
+			<view class="dj-text">
+				（出发位置）
+			</view>
+			<view class="qidian u-flex u-col-center">
+				<text style="background-color: #EE3709;">终</text>
+				<text>上车后告知司机位置</text>
+			</view>
+			<view class="dj-text">
+				（终点位置）
+			</view>
+		</view>
+		<view class="order-goods-box u-flex u-col-center" v-if="type == 2">
+			<image src="../../static/images/t2.png" class="goods-img" mode=""></image>
+			<view class="goods-right">
+				<view class="goods-name">
+					跑腿类型：帮我买
+				</view>
+				<view class="goods-jieshao">
+					物品信息：文件 预计商品费用：1.0元
+				</view>
+				<view class="goods-price">
+					<text>预约送达时间：2022-04-04 09:49:00</text>
+				</view>
+			</view>
+		</view>
+		<view class="jindu-box">
+			<view class="item u-flex-col" v-for="(item,index) in 2" :key="index">
+				<text>2020-02-02 12:12:12</text>
+				<text>下单成功</text>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				type:''
+			}
+		},
+		onLoad(option) {
+			this.type = option.index || 0
+		},
+		onShow() {
+			if (this.type == 0) {
+				uni.setNavigationBarTitle({
+					title: "维修服务订单"
+				})
+			}
+			if (this.type == 1) {
+				uni.setNavigationBarTitle({
+					title: "代驾服务订单"
+				})
+			}
+			if (this.type == 2) {
+				uni.setNavigationBarTitle({
+					title: "跑腿服务订单"
+				})
+			}
+			if (this.type == 3) {
+				uni.setNavigationBarTitle({
+					title: "商品订单"
+				})
+			}
+		},
+		methods:{
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.jindu{
+		padding: 0 24rpx;
+		.jindu-box{
+			padding: 30rpx 24rpx;
+			background-color: #fff;
+			margin: 20rpx 0;
+			border-radius: 20rpx;
+			.item{
+				margin-bottom: 20rpx;
+				text{
+					margin-bottom: 10rpx;
+				}
+				text:last-child{
+					font-size: 26rpx;
+					color: rgba(0,0,0,0.7);
+				}
+			}
+		}
+		.image-box{
+			margin-bottom: 10rpx;
+			image{
+				width: 100rpx;
+				height: 100rpx;
+				margin-right: 10rpx;
+			}
+			.image-right{
+				flex: 1;
+				font-size: 24rpx;
+				color: #797879;
+			}
+		}
+		.dj-text{
+			margin-bottom: 15rpx;
+			font-size: 28rpx;
+			color: #908E90;
+		}
+		.tel-box{
+			padding: 0 30rpx;
+			font-size: 28rpx;
+			color: #908E90;
+			.text1{
+				
+			}
+			.text2{
+				color: #29B08A;
+			}
+		}
+		.weixiu-time{
+			margin-bottom: 10rpx;
+			text:first-child{
+				color: #28B59B;
+				font-size: 30rpx;
+				margin: 10rpx 0;
+			}
+		}
+		.order-goods-box{
+			
+			.goods-img{
+				width: 100rpx;
+				height: 100rpx;
+				border-radius: 10rpx;
+				margin-right: 20rpx;
+			}
+			.goods-right{
+				flex: 1;
+				.goods-name{
+					font-size: 24rpx;
+					margin-bottom: 6rpx;
+					color: rgba(0,0,0,0.4);
+				}
+				.goods-jieshao{
+					color: rgba(0,0,0,0.4);
+					margin-bottom: 6rpx;
+					font-size: 24rpx;
+				}
+				.goods-price{
+					color: rgba(0,0,0,0.3);
+					font-size: 24rpx;
+				}
+			}
+		}
+		.qidian{
+			text:first-child{
+				display: inline-block;
+				width: 30rpx;
+				height: 30rpx;
+				text-align: center;
+				line-height: 30rpx;
+				border-radius: 100rpx;
+				background-color: #00A1EF;
+				font-size: 20rpx;
+				color: #fff;
+			}
+			text:last-child{
+				flex: 1;
+				margin-left: 10rpx;
+				color: #908E90;
+			}
+		}
+		.order-header {
+			padding: 12rpx 0;
+		
+			image {
+				width: 30rpx;
+				height: 30rpx;
+			}
+		
+			.text1 {
+				flex: 1;
+				margin: 0 10rpx;
+			}
+		
+			.text2 {
+				color: #B77A43;
+			}
+		}
+	}
+</style>

pages/order/order-info.vue

@@ -0,0 +1,713 @@
+<template>
+	<view class="order-info1">
+		<view class="order-header u-flex u-col-center">
+			<image src="../../static/images/t-tools.png" mode="" v-if="type == 0"></image>
+			<image src="../../static/images/t-daijia.png" mode="" v-if="type == 1"></image>
+			<image src="../../static/images/t-paotui.png" mode="" v-if="type == 2"></image>
+			<image src="../../static/images/t-jipin.png" mode="" v-if="type == 3"></image>
+			<text class="text1">WX164843242876885</text>
+			<text class="text2">己取消</text>
+		</view>
+		<view class="order-status u-flex u-col-center" v-if="type != 3" @tap="tojindu()">
+			<u-icon name="car" size="32"></u-icon>
+			<view class="status-right u-flex-col">
+				<text>下单成功，等待接单中</text>
+				<text>2022-04-02 10:52:56</text>
+			</view>
+		</view>
+		<view class="weixiu-box" v-if="type == 0">
+			<view class="weixiu-goods u-flex u-col-center">
+				<image src="../../static/images/t4.png" mode=""></image>
+				<view class="goods-right u-flex-col">
+					<text>维修类型：水 水管</text>
+					<text>备注：123456</text>
+				</view>
+			</view>
+			<view class="goods-tips">
+				故障器件或故障现象图(无）
+			</view>
+			<view class="u-flex u-col-center u-flex-wrap" style="margin-bottom: 20rpx;">
+				<image src="../../static/images/648.png" style="width: 150rpx;height: 150rpx;margin-right: 20rpx;"
+					mode=""></image>
+			</view>
+			<view class="shangmen-time">
+				上门时间：2022-04-02 10:52:00
+			</view>
+			<view>地址信息：</view>
+			<view>了 15816171622</view>
+			<view>广东省潮州市湘桥区凤东路(潮州 •恒大城东侧约100米)潮州
+				市黄金塘科目二考场 广东省潮州市湘桥区桥东街道黄金塘
+				小学西北茂源混凝士</view>
+			<view class="price-box u-flex-col">
+				<text>需付金额：10.00元 ＋ 师傅维修费 ＋材料费</text>
+				<text>价格说明：上门费用10.00元,扣除优惠费0.00元,需支付10.00</text>
+			</view>
+		</view>
+		<view class="daijia-box" v-if="type == 1">
+			<view class="qidian u-flex u-col-center">
+				<text>起</text>
+				<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+			</view>
+			<view class="tel-box">
+				15816171622
+			</view>
+			<view class="dj-text">
+				（出发位置）
+			</view>
+			<view class="qidian u-flex u-col-center">
+				<text style="background-color: #EE3709;">终</text>
+				<text>上车后告知司机位置</text>
+			</view>
+			<view class="dj-text">
+				（终点位置）
+			</view>
+			<view class="qibu-price">
+				须付金额：¥10.0元
+			</view>
+			<view class="price-tips">
+				价格说明：起步价15.00元＋路程费＋超程返程费＋等待超时费用
+			</view>
+		</view>
+		<view class="paotui-box" v-if="type == 2">
+			<view class="order-goods">
+				<view class="order-goods-box u-flex u-col-center">
+					<image src="../../static/images/t2.png" class="goods-img" mode=""></image>
+					<view class="goods-right">
+						<view class="goods-name">
+							跑腿类型：帮我买
+						</view>
+						<view class="goods-jieshao">
+							物品信息：文件 预计商品费用：1.0元
+						</view>
+						<view class="goods-price">
+							<text>预约送达时间：2022-04-04 09:49:00</text>
+						</view>
+					</view>
+				</view>
+				<view class="taocan-box">
+					商品图（无）
+				</view>
+				<view class="u-flex u-col-center u-flex-wrap" style="margin-bottom: 20rpx;">
+					<image src="../../static/images/648.png" style="width: 150rpx;height: 150rpx;margin-right: 20rpx;"
+						mode=""></image>
+				</view>
+			</view>
+			<view class="qidian u-flex u-col-center">
+				<text>起</text>
+				<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+			</view>
+			<view class="tel-box u-flex u-col-center">
+				<text class="text1">了</text>
+				<text class="text2">15816171622</text>
+			</view>
+			<view class="dj-text">
+				（取件地址）
+			</view>
+			<view class="qidian u-flex u-col-center">
+				<text style="background-color: #EE3709;">终</text>
+				<text>上车后告知司机位置</text>
+			</view>
+			<view class="tel-box u-flex u-col-center">
+				<text class="text1">了</text>
+				<text class="text2">15816171622</text>
+			</view>
+			<view class="dj-text">
+				（送件地址）
+			</view>
+			<view class="price-box u-flex-col u-col-top">
+				<text>需付金额：0.00元＋实际商品费用</text>
+				<text>
+					价格说明：价格说明：起步价14.00元,预计距离0.0600公里,距离附加费19998.00元,重量附加费0.00元,特殊时段附加费0.00元,实际商品费用N元,扣除优惠费0.00元,需支付20012.00元+实际商品费用
+				</text>
+			</view>
+		</view>
+		<view class="shop-box" v-if="type == 3">
+			<view class="address-box">
+				<view class="address-title">
+					收货信息
+				</view>
+				<view class="address-text">了 15816171622</view>
+				<view class="address-text">广东省潮州市湘桥区凤东路(潮州 •恒大城东侧约100米)潮州
+					市黄金塘科目二考场 广东省潮州市湘桥区桥东街道黄金塘
+					小学西北茂源混凝士</view>
+			</view>
+			<view class="goods-title">
+				商品信息
+			</view>
+			<view class="order-goods">
+				<view class="order-goods-box u-flex u-col-center">
+					<image src="../../static/images/shop-order.png" class="goods-img" mode=""></image>
+					<view class="goods-right">
+						<view class="goods-name">
+							这是名字这是名字这是名字
+						</view>
+						<view class="goods-jieshao">
+							这是名字这是名字这是名字
+						</view>
+						<view class="goods-price">
+							<text>¥50.0</text>
+							<text>门市价：¥100</text>
+						</view>
+					</view>
+				</view>
+				<view class="taocan-box">
+					套餐1:鸡翅+鸡翅
+				</view>
+			</view>
+			<view class="taocan-count u-flex u-col-center">
+				<text>套餐1</text>
+				<text>x1</text>
+				<text>¥50</text>
+			</view>
+			<view class="price-box u-flex u-col-center u-row-right">
+				<text>商品原价：¥100</text>
+				<text>优惠：¥100</text>
+				<text>配送费：¥100</text>
+			</view>
+			<view class="shuoming-title">
+				快递费用说明：123
+			</view>
+			<view class="shuoming-title">
+				优惠金额说明：23
+			</view>
+			<view class="peisong-type">
+				配送方式：到家
+			</view>
+			<view class="goods-title" style="padding-bottom: 0;">
+				商家信息
+			</view>
+			<view class="fapiao">
+				商家信息：测试商家
+			</view>
+			<view class="fapiao">
+				购买须知：购买该商品需要在2020-12-12前使用
+			</view>
+		</view>
+		<view class="jiedan-box" v-if="type != 3">
+			<view class="jiedan-top u-flex u-col-center u-row-between">
+				<text>接单人信息</text>
+				<text>已完成</text>
+			</view>
+			<view class="jiedan-user u-flex u-col-center">
+				<image src="../../static/images/order1-2.png" mode=""></image>
+				<view class="user-right u-flex-col">
+					<text>姓名：1</text>
+					<view class="u-flex u-col-center">
+						<text>联系电话：</text>
+						<u-icon name="phone-fill" color="#0DA98C"></u-icon>
+						<text style="color: #0DA98C;">15816171622</text>
+					</view>
+					<text>工号：1A7700A9572694E5A6D12DBAB2B99A02</text>
+				</view>
+			</view>
+			<view class="jiedan-time">
+				接单时间：2022-02-17 14:58:17
+			</view>
+		</view>
+		<view class="fapiao">
+			是否需要发票：否
+		</view>
+		<view class="order-down u-flex-col">
+			<text v-if="type == 0">维修服务</text>
+			<text v-if="type == 1">代驾服务</text>
+			<text v-if="type == 2">跑腿服务</text>
+			<text v-if="type == 3">购买商品</text>
+			<text>下单时间：2022-04-02 10:52:56</text>
+			<text>接单时间：2022-04-02 10:52:56</text>
+			<text>发货时间：2022-04-02 10:52:56</text>
+		</view>
+		<view style="height: 120rpx;"></view>
+		<view class="down-box u-flex u-col-center u-row-right">
+			<x-button style="margin-right: 20rpx;" :width="180" :height="60" fontSize="24rpx" borderRadius="20rpx">取消订单
+			</x-button>
+			<x-button style="margin-right: 20rpx;" :width="180" :height="60" fontSize="24rpx" borderRadius="20rpx">评价订单
+			</x-button>
+			<x-button :width="180" :height="60" fontSize="24rpx" borderRadius="20rpx" @click="tojindu">服务进度</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				type: ''
+			}
+		},
+		onLoad(option) {
+			this.type = option.index
+		},
+		onShow() {
+			if (this.type == 0) {
+				uni.setNavigationBarTitle({
+					title: "维修服务订单"
+				})
+			}
+			if (this.type == 1) {
+				uni.setNavigationBarTitle({
+					title: "代驾服务订单"
+				})
+			}
+			if (this.type == 2) {
+				uni.setNavigationBarTitle({
+					title: "跑腿服务订单"
+				})
+			}
+			if (this.type == 3) {
+				uni.setNavigationBarTitle({
+					title: "商品订单"
+				})
+			}
+		},
+		methods: {
+			tojindu() {
+				uni.navigateTo({
+					url: "./jindu"
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.order-info1 {
+		padding: 0 20rpx;
+
+		.shop-box {
+			.peisong-type {
+				color: rgba(0, 0, 0, 0.5);
+				text-align: right;
+				font-size: 26rpx;
+				margin-top: 6rpx;
+				border-top: 1rpx solid #E8E6E8;
+				padding-top: 10rpx;
+			}
+
+			.shuoming-title {
+				text-align: right;
+				font-size: 22rpx;
+				color: rgba(0, 0, 0, 0.3);
+				margin-top: 6rpx;
+			}
+
+			.price-box {
+				font-size: 26rpx;
+				color: rgba(0, 0, 0, 0.5);
+
+				text {
+					margin-right: 6rpx;
+				}
+
+				text:first-child {
+					text-decoration: line-through;
+				}
+			}
+
+			.taocan-count {
+				margin-bottom: 4rpx;
+				padding: 20rpx 10rpx 4rpx 10rpx;
+
+				text:first-child {
+					color: rgba(0, 0, 0, 0.4);
+				}
+
+				text:nth-child(2) {
+					flex: 1;
+					margin: 0 10rpx;
+					font-size: 24rpx;
+					text-align: right;
+				}
+
+				text:last-child {
+					color: #f00;
+				}
+			}
+
+			.order-goods {
+				border-bottom: 1rpx solid #E8E6E8;
+				padding-bottom: 10rpx;
+
+				// padding: 20rpx;
+				.taocan-box {
+					padding-top: 10rpx;
+					padding-bottom: 10rpx;
+					// border-bottom: 1rpx solid #C0C0C0;
+					color: rgba(0, 0, 0, 0.4);
+				}
+
+				.order-goods-box {
+
+					.goods-img {
+						width: 150rpx;
+						height: 150rpx;
+						border-radius: 10rpx;
+						margin-right: 20rpx;
+					}
+
+					.goods-right {
+						flex: 1;
+
+						.goods-name {
+							font-size: 26rpx;
+							margin-bottom: 10rpx;
+							color: rgba(0, 0, 0, 0.6);
+						}
+
+						.goods-jieshao {
+							color: rgba(0, 0, 0, 0.4);
+							margin-bottom: 10rpx;
+							font-size: 24rpx;
+						}
+
+						.goods-price {
+							color: rgba(0, 0, 0, 0.5);
+							font-size: 22rpx;
+
+							text:last-child {
+								text-decoration: line-through;
+								color: rgba(0, 0, 0, 0.3);
+							}
+						}
+					}
+				}
+			}
+
+			.goods-title {
+				color: #00A47A;
+				padding: 20rpx 0;
+			}
+
+			.address-box {
+				padding: 20rpx 0;
+				border-top: 1rpx solid #E8E6E8;
+				border-bottom: 1rpx solid #CBD7D5;
+
+				.address-title {
+					color: #00A47A;
+				}
+
+				.address-text {
+					font-size: 28rpx;
+					color: #829191;
+				}
+			}
+		}
+
+		.paotui-box {
+			padding: 10rpx 10rpx 20rpx 10rpx;
+			font-size: 26rpx;
+			color: #908E90;
+
+			.price-tips {
+				text-align: right;
+				font-size: 22rpx;
+				margin: 10rpx 0;
+				border-bottom: 1rpx solid #E8E6E8;
+
+				padding-bottom: 20rpx;
+			}
+
+			.price-box {
+				padding: 20rpx 0;
+				border-bottom: 1rpx solid #DCDADC;
+				border-top: 1rpx solid #DCDADC;
+
+				text:first-child {
+					color: #CA847E;
+				}
+			}
+
+			.qibu-price {
+				text-align: right;
+				font-size: 22rpx;
+				margin: 10rpx 0;
+			}
+
+			.dj-text {
+				margin-bottom: 15rpx;
+			}
+
+			.tel-box {
+				padding: 0 30rpx;
+			}
+
+			.weixiu-time {
+				margin-bottom: 10rpx;
+
+				text:first-child {
+					color: #28B59B;
+					font-size: 30rpx;
+					margin: 10rpx 0;
+				}
+			}
+
+			.qidian {
+				text:first-child {
+					display: inline-block;
+					width: 30rpx;
+					height: 30rpx;
+					text-align: center;
+					line-height: 30rpx;
+					border-radius: 100rpx;
+					background-color: #00A1EF;
+					font-size: 20rpx;
+					color: #fff;
+				}
+
+				text:last-child {
+					flex: 1;
+					margin-left: 10rpx;
+					color: #908E90;
+				}
+			}
+
+			.order-goods {
+				// border-bottom: 1rpx solid #E7E5E7;
+				padding-bottom: 10rpx;
+
+				// padding: 20rpx;
+				.taocan-box {
+					padding-top: 10rpx;
+					padding-bottom: 10rpx;
+					// border-bottom: 1rpx solid #C0C0C0;
+					color: rgba(0, 0, 0, 0.4);
+				}
+
+				.order-goods-box {
+
+					.goods-img {
+						width: 150rpx;
+						height: 150rpx;
+						border-radius: 10rpx;
+						margin-right: 20rpx;
+					}
+
+					.goods-right {
+						flex: 1;
+
+						.goods-name {
+							font-size: 26rpx;
+							margin-bottom: 10rpx;
+							color: rgba(0, 0, 0, 0.4);
+						}
+
+						.goods-jieshao {
+							color: rgba(0, 0, 0, 0.4);
+							margin-bottom: 10rpx;
+							font-size: 26rpx;
+						}
+
+						.goods-price {
+							color: rgba(0, 0, 0, 0.3);
+							font-size: 26rpx;
+						}
+					}
+				}
+			}
+		}
+
+		.daijia-box {
+			padding: 0 10rpx 20rpx 10rpx;
+			font-size: 26rpx;
+			color: #908E90;
+
+			.price-box {
+				padding: 20rpx 0;
+				border-bottom: 1rpx solid #DCDADC;
+				border-top: 1rpx solid #DCDADC;
+
+				text:first-child {
+					color: #CA847E;
+				}
+			}
+
+			.dj-text {
+				margin-bottom: 15rpx;
+			}
+
+			.tel-box {
+				padding: 0 30rpx;
+
+				.text1 {}
+
+				.text2 {
+					color: #29B08A;
+				}
+			}
+
+			.weixiu-time {
+				margin-bottom: 10rpx;
+
+				text:first-child {
+					color: #28B59B;
+					font-size: 30rpx;
+					margin: 10rpx 0;
+				}
+			}
+
+			.qidian {
+				text:first-child {
+					display: inline-block;
+					width: 30rpx;
+					height: 30rpx;
+					text-align: center;
+					line-height: 30rpx;
+					border-radius: 100rpx;
+					background-color: #00A1EF;
+					font-size: 20rpx;
+					color: #fff;
+				}
+
+				text:last-child {
+					flex: 1;
+					margin-left: 10rpx;
+					color: #908E90;
+				}
+			}
+
+			.price-tips {
+				font-size: 22rpx;
+				// margin: 10rpx 0;
+				padding-bottom: 20rpx;
+				border-bottom: 1rpx solid #DCDADC;
+			}
+
+			.qibu-price {
+				font-size: 22rpx;
+				padding-top: 20rpx;
+				border-top: 1rpx solid #DCDADC;
+				color: #C04C31;
+				// margin: 10rpx 0;
+			}
+		}
+
+		.jiedan-box {
+			.jiedan-time {
+				font-size: 26rpx;
+				color: #545454;
+				padding: 20rpx 10rpx;
+				border-bottom: 1rpx solid #DCDADC;
+				margin-bottom: 20rpx;
+			}
+
+			.jiedan-top {
+				padding: 20rpx 10rpx;
+
+				text:last-child {
+					color: #C4C4C4;
+					font-size: 24rpx;
+				}
+			}
+
+			.jiedan-user {
+				image {
+					width: 150rpx;
+					height: 150rpx;
+					margin-right: 10rpx;
+				}
+
+				.user-right {
+					flex: 1;
+					font-size: 26rpx;
+					color: #545454;
+				}
+			}
+		}
+
+		.down-box {
+			position: fixed;
+			bottom: 0rpx;
+			background-color: #E3F7F0;
+			left: 0;
+			width: 750rpx;
+			padding: 20rpx 24rpx 30rpx 24rpx;
+		}
+
+		.order-down {
+			padding: 20rpx 0;
+			color: #829191;
+
+			text:first-child {
+				color: #00A47A;
+			}
+		}
+
+		.fapiao {
+			padding: 20rpx 0;
+			border-bottom: 1rpx solid #CBD7D5;
+			color: #829191;
+		}
+
+		.weixiu-box {
+			padding: 20rpx 0 0 0;
+			border-top: 1rpx solid #CBD7D5;
+			color: #829191;
+
+
+
+			.price-box {
+				padding: 20rpx 0;
+				border-bottom: 1rpx solid #CBD7D5;
+				border-top: 1rpx solid #CBD7D5;
+				font-size: 24rpx;
+				margin-top: 20rpx;
+
+				text:first-child {
+					color: #C04C31;
+				}
+
+				text:nth-child(2) {}
+			}
+
+			.goods-tips {
+				color: #829191;
+				padding: 10rpx 0;
+				margin-bottom: 10rpx;
+			}
+
+			.weixiu-goods {
+				image {
+					width: 150rpx;
+					height: 150rpx;
+					margin-right: 20rpx;
+				}
+
+				.goods-right {
+					color: #829191;
+				}
+			}
+		}
+
+		.order-status {
+			margin-bottom: 20rpx;
+			border: 1rpx solid #69BFAF;
+			border-radius: 20rpx;
+			padding: 20rpx;
+			background-color: #fff;
+
+			.status-right {
+				font-size: 26rpx;
+				margin-left: 10rpx;
+				color: #828282;
+			}
+		}
+
+		.order-header {
+			padding: 12rpx 0;
+
+			image {
+				width: 30rpx;
+				height: 30rpx;
+			}
+
+			.text1 {
+				flex: 1;
+				margin: 0 10rpx;
+			}
+
+			.text2 {
+				color: #B77A43;
+			}
+		}
+	}
+</style>

pages/order/order.vue

@@ -0,0 +1,1131 @@
+<template>
+	<view class="order">
+		<view style="position: sticky;top: 0;left: 0;z-index: 10;">
+			<x-navbar title="订单" :active="1"></x-navbar>
+			<view class="header-box u-flex-col u-row-between">
+				<view class="top-tabs u-flex u-col-center u-row-center">
+					<text :class="type == 1 ? 'text' : ''" @tap="changetype(1)">我的订单(2)</text>
+					<text :class="type == 2 ? 'text' : ''" @tap="changetype(2)">服务接单(0)</text>
+				</view>
+				<view class="down-tabs u-flex u-col-center u-row-between" v-if="type == 1">
+					<view :class="num == 1 ? 'view text' : 'view'" @tap="changenum(1)">
+						<text>全部</text>
+					</view>
+					<view :class="num == 2 ? 'view text' : 'view'" @tap="changenum(2)">
+						<text>待接单</text>
+						<text class="text1">1</text>
+					</view>
+					<view :class="num == 3 ? 'view text' : 'view'" @tap="changenum(3)">
+						<text>已接单</text>
+						<text class="text1">1</text>
+					</view>
+					<view :class="num == 4 ? 'view text' : 'view'" @tap="changenum(4)">
+						<text>待评价</text>
+						<text class="text1">1</text>
+					</view>
+				</view>
+				<view class="down-tabs u-flex u-col-center u-row-between" v-if="type == 2">
+					<view :class="num == 5 ? 'view text' : 'view'" @tap="changenum(5)">
+						<text>新接单</text>
+					</view>
+					<view :class="num == 6 ? 'view text' : 'view'" @tap="changenum(6)">
+						<text>已接单</text>
+						<text class="text1">1</text>
+					</view>
+					<view :class="num == 7 ? 'view text' : 'view'" @tap="changenum(7)">
+						<text>已完成</text>
+						<text class="text1">1</text>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="order-list" v-if="type == 1">
+			<view class="item" v-for="(item,index) in 4" :key="index" @tap="toorder(index)">
+				<view class="order-header u-flex u-col-center u-row-between">
+					<image src="../../static/images/t-tools.png" mode="" v-if="index == 0"></image>
+					<image src="../../static/images/t-daijia.png" mode="" v-if="index == 1"></image>
+					<image src="../../static/images/t-paotui.png" mode="" v-if="index == 2"></image>
+					<image src="../../static/images/t-jipin.png" mode="" v-if="index == 3"></image>
+					<text class="text1">WX164843242876885</text>
+					<text class="text2">己取消</text>
+				</view>
+				<view class="weixiu-box" v-if="index == 0">
+					<view class="image-box u-flex u-col-center">
+						<image src="../../static/images/t4.png" mode=""></image>
+						<view class="image-right u-flex-col">
+							<text>维修类型水 水管</text>
+							<text>备注：</text>
+						</view>
+					</view>
+					<view class="weixiu-tips">
+						故障器件或故障现象图（无）
+					</view>
+					<view class="shangmen-time">
+						上门时间：2022-03-2809:53:00
+					</view>
+					<view class="address-box">
+						<view class="user-box">
+							<text>了</text>
+							<text>15816171622</text>
+						</view>
+						<view class="address-text">
+							广东省潮州市湘桥区凤东路(潮州-恒大城东侧约100米)潮州
+							市黄金塘科目
+							考场 广东省潮州市湘桥区桥东街道黄金塘小
+							学西北茂源混凝主
+						</view>
+					</view>
+					<view class="qibu-price">
+						起步价：¥10.0元
+					</view>
+					<view class="price-tips">
+						价格说明：上门费用10.00元,师傅维修费另算,材料费另算
+					</view>
+					<view class="jijia-tips">
+						计价说明：上门价(10元)+师傅维條费＋材料费
+					</view>
+					<view class="weixiu-time u-flex-col">
+						<text>维修服务</text>
+						<text>下单时间：2022-03-28 09:53:48</text>
+					</view>
+				</view>
+				<view class="daijia-box" v-if="index == 1">
+					<view class="qidian u-flex u-col-center">
+						<text>起</text>
+						<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+					</view>
+					<view class="tel-box">
+						15816171622
+					</view>
+					<view class="dj-text">
+						（出发位置）
+					</view>
+					<view class="qidian u-flex u-col-center">
+						<text style="background-color: #EE3709;">终</text>
+						<text>上车后告知司机位置</text>
+					</view>
+					<view class="dj-text">
+						（终点位置）
+					</view>
+					<view class="qibu-price">
+						起步价：¥10.0元
+					</view>
+					<view class="price-tips">
+						价格说明：上门费用10.00元,师傅维修费另算,材料费另算
+					</view>
+					<view class="weixiu-time u-flex-col">
+						<text>代驾服务</text>
+						<text>下单时间：2022-03-28 09:53:48</text>
+					</view>
+				</view>
+				<view class="paotui-box" v-if="index == 2">
+					<view class="order-goods">
+						<view class="order-goods-box u-flex u-col-center">
+							<image src="../../static/images/t2.png" class="goods-img" mode=""></image>
+							<view class="goods-right">
+								<view class="goods-name">
+									跑腿类型：帮我买
+								</view>
+								<view class="goods-jieshao">
+									物品信息：文件 预计商品费用：1.0元
+								</view>
+								<view class="goods-price">
+									<text>预约送达时间：2022-04-04 09:49:00</text>
+								</view>
+							</view>
+						</view>
+						<view class="taocan-box">
+							商品图（无）
+						</view>
+					</view>
+					<view class="qidian u-flex u-col-center">
+						<text>起</text>
+						<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+					</view>
+					<view class="tel-box">
+						15816171622
+					</view>
+					<view class="dj-text">
+						（取件地址）
+					</view>
+					<view class="qidian u-flex u-col-center">
+						<text style="background-color: #EE3709;">终</text>
+						<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+					</view>
+					<view class="dj-text">
+						（送件地址）
+					</view>
+					<view class="qibu-price">
+						起步价：¥10.0元
+					</view>
+					<view class="price-tips">
+						价格说明：价格说明：起步价14.00元,预计距离0.0600公里,距离附加费19998.00元,重量附加费0.00元,特殊时段附加费0.00元,实际商品费用N元,扣除优惠费0.00元,需支付20012.00元+实际商品费用
+					</view>
+					<view class="weixiu-time u-flex-col">
+						<text>跑腿服务</text>
+						<text>下单时间：2022-03-28 09:53:48</text>
+					</view>
+				</view>
+				<view class="shop-box" v-if="index == 3">
+					<view class="order-goods">
+						<view class="order-goods-box u-flex u-col-center">
+							<image src="../../static/images/shop-order.png" class="goods-img" mode=""></image>
+							<view class="goods-right">
+								<view class="goods-name">
+									这是名字这是名字这是名字
+								</view>
+								<view class="goods-jieshao">
+									这是名字这是名字这是名字
+								</view>
+								<view class="goods-price">
+									<text>¥50.0</text>
+									<text>门市价：¥100</text>
+								</view>
+							</view>
+						</view>
+						<view class="taocan-box">
+							套餐1:鸡翅+鸡翅
+						</view>
+					</view>
+					<view class="taocan-count u-flex u-col-center">
+						<text>套餐1</text>
+						<text>x1</text>
+						<text>¥50</text>
+					</view>
+					<view class="price-box u-flex u-col-center u-row-right">
+						<text>商品原价：¥100</text>
+						<text>优惠：¥100</text>
+						<text>配送费：¥100</text>
+					</view>
+					<view class="shuoming-title">
+						快递费用说明：123
+					</view>
+					<view class="shuoming-title">
+						优惠金额说明：23
+					</view>
+					<view class="peisong-type">
+						配送方式：到家
+					</view>
+					<view class="pay-xuzhi">
+						购买须知：购买该商品需要在2020-02-02前使用
+					</view>
+					<view class="pay-title u-flex u-col-center">
+						<!-- <u-icon name="bag-fill" color="#429EFE" size="40"></u-icon> -->
+						<text class="text">购买商品</text>
+					</view>
+					<view class="order-text">
+						下单时间：2022-02-02 11:11:11
+					</view>
+					<view class="order-text">
+						付款时间：2022-02-02 11:11:11
+					</view>
+					<view class="order-text">
+						核销时间：2022-02-02 11:11:11
+					</view>
+				</view>
+				<view class="butt-view u-flex u-col-center u-row-right">
+					<view class="text2">
+						<x-button :width="110" :height="53" borderRadius="20rpx" fontSize="19rpx">取消订单</x-button>
+					</view>
+					<view class="text2">
+						<x-button :width="110" :height="53" borderRadius="20rpx" fontSize="19rpx">评价订单</x-button>
+					</view>
+					<view class="text2">
+						<x-button :width="110" :height="53" borderRadius="20rpx" fontSize="19rpx" @click="tojindu">服务进度</x-button>
+					</view>
+					<view class="text2">
+						<x-button :width="110" :height="53" borderRadius="20rpx" fontSize="19rpx">删除订单</x-button>
+					</view>
+					<view class="text2">
+						<x-button :width="110" :height="53" borderRadius="20rpx" fontSize="19rpx">核销码</x-button>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="order-list1" v-if="type == 2">
+			<view class="item1" v-for="(item,index) in 3" :key="index" @tap="tofuwu(index)">
+				<view class="item1-header">
+					<view class="top u-flex u-col-center">
+						<image src="../../static/images/t-tools.png" mode="" v-if="index == 0"></image>
+						<image src="../../static/images/t-daijia.png" mode="" v-if="index == 1"></image>
+						<image src="../../static/images/t-paotui.png" mode="" v-if="index == 2"></image>
+						<text class="text1">WX164843242876885</text>
+						<text class="text2">己取消</text>
+					</view>
+					<view class="down u-flex u-col-center u-row-right">
+						<image src="../../static/images/order1-1.png" mode=""></image>
+						<text>1282.32km</text>
+					</view>
+				</view>
+				<view class="weixiu-box" v-if="index == 0">
+					<view class="image-box u-flex u-col-center">
+						<image src="../../static/images/t4.png" mode=""></image>
+						<view class="image-right u-flex-col">
+							<text>维修类型水 水管</text>
+							<text>备注：</text>
+						</view>
+					</view>
+					<view class="weixiu-tips">
+						故障器件或故障现象图（无）
+					</view>
+					<view class="shangmen-time">
+						上门时间：2022-03-2809:53:00
+					</view>
+					<view class="address-box">
+						<view class="user-box">
+							<text>了</text>
+							<text></text>
+						</view>
+						<view class="address-text">
+							广东省潮州市湘桥区凤东路(潮州-恒大城东侧约100米)潮州
+							市黄金塘科目
+							考场 广东省潮州市湘桥区桥东街道黄金塘小
+							学西北茂源混凝主
+						</view>
+					</view>
+					<view class="tel-box u-flex u-col-center">
+						<text class="text1">联系电话：</text>
+						<u-icon name="phone-fill" color="#0AAE87"></u-icon>
+						<text class="text2">15816171622</text>
+					</view>
+					<view class="price-box u-flex-col u-col-top">
+						<text>需付金额：0.00元＋师傅维修费＋材料费</text>
+						<text>价格说明：上门费用0.00元,扣除优惠费0.00元,需支付0.00</text>
+					</view>
+				</view>
+				<view class="daijia-box" v-if="index == 1">
+					<view class="qidian u-flex u-col-center">
+						<text>起</text>
+						<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+					</view>
+					<view class="tel-box u-flex u-col-center">
+						<text class="text1">联系电话：</text>
+						<u-icon name="phone-fill" color="#29B08A"></u-icon>
+						<text class="text2">15816171622</text>
+					</view>
+					<view class="dj-text">
+						（出发位置）
+					</view>
+					<view class="qidian u-flex u-col-center">
+						<text style="background-color: #EE3709;">终</text>
+						<text>上车后告知司机位置</text>
+					</view>
+					<view class="dj-text">
+						（终点位置）
+					</view>
+					<view class="price-box u-flex-col u-col-top">
+						<text>需付金额：15.00元起</text>
+						<text>价格说明：起步价15.00元＋路程费＋超程返程费＋等待超时费用</text>
+						<text>送达位置：茂源混凝士</text>
+					</view>
+				</view>
+				<view class="paotui-box" v-if="index == 2">
+					<view class="order-goods">
+						<view class="order-goods-box u-flex u-col-center">
+							<image src="../../static/images/t2.png" class="goods-img" mode=""></image>
+							<view class="goods-right">
+								<view class="goods-name">
+									跑腿类型：帮我买
+								</view>
+								<view class="goods-jieshao">
+									物品信息：文件 预计商品费用：1.0元
+								</view>
+								<view class="goods-price">
+									<text>预约送达时间：2022-04-04 09:49:00</text>
+								</view>
+							</view>
+						</view>
+						<view class="taocan-box">
+							商品图（无）
+						</view>
+					</view>
+					<view class="qidian u-flex u-col-center">
+						<text>起</text>
+						<text>广东省汕头市龙湖区汕头高新区科技东路9号超声科技大厦</text>
+					</view>
+					<view class="tel-box u-flex u-col-center">
+						<text class="text1">联系电话：</text>
+						<u-icon name="phone-fill" color="#29B08A"></u-icon>
+						<text class="text2">15816171622</text>
+					</view>
+					<view class="dj-text">
+						（取件地址）
+					</view>
+					<view class="qidian u-flex u-col-center">
+						<text style="background-color: #EE3709;">终</text>
+						<text>上车后告知司机位置</text>
+					</view>
+					<view class="tel-box u-flex u-col-center">
+						<text class="text1">联系电话：</text>
+						<u-icon name="phone-fill" color="#29B08A"></u-icon>
+						<text class="text2">15816171622</text>
+					</view>
+					<view class="dj-text">
+						（送件地址）
+					</view>
+					<view class="price-box u-flex-col u-col-top">
+						<text>需付金额：0.00元＋师傅维修费＋材料费</text>
+						<text>价格说明：上门费用0.00元,扣除优惠费0.00元,需支付0.00</text>
+					</view>
+				</view>
+				<view class="jiedan-box">
+					<view class="jiedan-top u-flex u-col-center u-row-between">
+						<text>接单人信息</text>
+						<text>已完成</text>
+					</view>
+					<view class="jiedan-user u-flex u-col-center">
+						<image src="../../static/images/order1-2.png" mode=""></image>
+						<view class="user-right u-flex-col">
+							<text>姓名：1</text>
+							<text>联系电话：15816171622</text>
+							<text>工号：1A7700A9572694E5A6D12DBAB2B99A02</text>
+						</view>
+					</view>
+					<view class="jiedan-time">
+						接单时间：2022-02-17 14:58:17
+					</view>
+				</view>
+				<view class="order-down">
+					<view class="down-title" v-if="index == 0">
+						维修服务
+					</view>
+					<view class="down-title" v-if="index == 1">
+						代驾服务
+					</view>
+					<view class="down-title" v-if="index == 2">
+						跑腿服务
+					</view>
+					<view class="down-time">
+						下单时间：2022-01-24 16:22:18
+					</view>
+					<view class="down-time">
+						发货时间：2022-02-17 15:00:11
+					</view>
+					<view class="u-flex u-col-center u-row-right">
+						<x-button :width="180" :height="60" fontSize="24rpx" borderRadius="20rpx" @click="tojindu">服务进度</x-button>
+						<x-button :width="180" :height="60" fontSize="24rpx" borderRadius="20rpx">确认接单</x-button>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				type: 1,
+				num: 1
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			tojindu(){
+				uni.navigateTo({
+					url:"./jindu"
+				})
+			},
+			tofuwu(index){
+				uni.navigateTo({
+					url:"./fuwu-orderinfo?index=" + index
+				})
+			},
+			toorder(index){
+				uni.navigateTo({
+					url:"./order-info?index=" + index
+				})
+			},
+			changenum(num){
+				this.num = num
+			},
+			changetype(type){
+				if(this.type == type){
+					return false
+				}
+				this.type = type
+				if(this.type == 1){
+					this.num = 1
+				}else{
+					this.num = 5
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.order {
+		.order-list1{
+			.item1{
+				width: 706rpx;
+				// height: 603rpx;
+				// border: 1rpx solid #A0A0A0;
+				margin: 20rpx auto;
+				border-radius: 10rpx;
+				background-color: #fff;
+				padding-bottom: 20rpx;
+				.paotui-box{
+					padding: 0 10rpx;
+					.price-box{
+						padding: 20rpx 0;
+						border-bottom: 1rpx solid #DCDADC;
+						border-top: 1rpx solid #DCDADC;
+						color: #908E90;
+						font-size: 26rpx;
+						text:first-child{
+							color: #CA847E;
+						}
+					}
+					.dj-text{
+						margin-bottom: 15rpx;
+						color: #908E90;
+						font-size: 26rpx;
+					}
+					.tel-box{
+						padding: 0 30rpx;
+						
+						.text1{
+							font-size: 26rpx;
+							color: #908E90;
+						}
+						.text2{
+							color: #29B08A;
+						}
+					}
+					.qidian{
+						text:first-child{
+							display: inline-block;
+							width: 30rpx;
+							height: 30rpx;
+							text-align: center;
+							line-height: 30rpx;
+							border-radius: 100rpx;
+							background-color: #00A1EF;
+							font-size: 20rpx;
+							color: #fff;
+						}
+						text:last-child{
+							flex: 1;
+							margin-left: 10rpx;
+							color: #908E90;
+							font-size: 26rpx;
+						}
+					}
+					.order-goods{
+						// border-bottom: 1rpx solid #E7E5E7;
+						padding-bottom: 10rpx;
+						// padding: 20rpx;
+						.taocan-box{
+							padding-top: 10rpx;
+							padding-bottom: 10rpx;
+							// border-bottom: 1rpx solid #C0C0C0;
+							color: rgba(0,0,0,0.4);
+						}
+						.order-goods-box{
+							
+							.goods-img{
+								width: 150rpx;
+								height: 150rpx;
+								border-radius: 10rpx;
+								margin-right: 20rpx;
+							}
+							.goods-right{
+								flex: 1;
+								.goods-name{
+									font-size: 26rpx;
+									margin-bottom: 10rpx;
+									color: rgba(0,0,0,0.4);
+								}
+								.goods-jieshao{
+									color: rgba(0,0,0,0.4);
+									margin-bottom: 10rpx;
+									font-size: 26rpx;
+								}
+								.goods-price{
+									color: rgba(0,0,0,0.3);
+									font-size: 26rpx;
+								}
+							}
+						}
+					}
+				}
+				.order-down{
+					padding: 0 10rpx;
+					.down-title{
+						color: #2D9982;
+					}
+					.down-time{
+						font-size: 26rpx;
+						color: #757575;
+					}
+				}
+				.daijia-box{
+					padding: 0 10rpx 20rpx 10rpx;
+					font-size: 26rpx;
+					color: #908E90;
+					.price-box{
+						padding: 20rpx 0;
+						border-bottom: 1rpx solid #DCDADC;
+						border-top: 1rpx solid #DCDADC;
+						text:first-child{
+							color: #CA847E;
+						}
+					}
+					.dj-text{
+						margin-bottom: 15rpx;
+					}
+					.tel-box{
+						padding: 0 30rpx;
+						.text1{
+							
+						}
+						.text2{
+							color: #29B08A;
+						}
+					}
+					.weixiu-time{
+						margin-bottom: 10rpx;
+						text:first-child{
+							color: #28B59B;
+							font-size: 30rpx;
+							margin: 10rpx 0;
+						}
+					}
+					.qidian{
+						text:first-child{
+							display: inline-block;
+							width: 30rpx;
+							height: 30rpx;
+							text-align: center;
+							line-height: 30rpx;
+							border-radius: 100rpx;
+							background-color: #00A1EF;
+							font-size: 20rpx;
+							color: #fff;
+						}
+						text:last-child{
+							flex: 1;
+							margin-left: 10rpx;
+							color: #908E90;
+						}
+					}
+					.price-tips{
+						text-align: right;
+						font-size: 22rpx;
+						margin: 10rpx 0;
+					}
+					.qibu-price{
+						text-align: right;
+						font-size: 22rpx;
+						margin: 10rpx 0;
+					}
+				}
+				
+				.jiedan-box{
+					.jiedan-time{
+						font-size: 26rpx;
+						color: #545454;
+						padding: 20rpx 10rpx;
+						border-bottom: 1rpx solid #DCDADC;
+						margin-bottom: 20rpx;
+					}
+					.jiedan-top{
+						padding: 20rpx 10rpx;
+						text:last-child{
+							color: #C4C4C4;
+							font-size: 24rpx;
+						}
+					}
+					.jiedan-user{
+						image{
+							width: 150rpx;
+							height: 150rpx;
+							margin-right: 10rpx;
+						}
+						.user-right{
+							flex: 1;
+							font-size: 26rpx;
+							color: #545454;
+						}
+					}
+				}
+				.weixiu-box{
+					padding: 10rpx;
+					font-size: 24rpx;
+					color: #797879;
+					.price-box{
+						padding: 20rpx 0;
+						border-bottom: 1rpx solid #DCDADC;
+						text:first-child{
+							color: #CA847E;
+						}
+					}
+					.tel-box{
+						padding-bottom: 10rpx;
+						border-bottom: 1rpx solid #DCDADC;
+						.text2{
+							color: #12B187;
+						}
+					}
+					.address-box{
+						.address-text{
+							margin: 10rpx 0;
+						}
+						.user-box{
+							margin: 10rpx 0;
+							text{
+								margin-right: 10rpx;
+							}
+						}
+						
+					}
+					.shangmen-time{
+						margin: 10rpx 0;
+					}
+					.weixiu-tips{
+						font-size: 24rpx;
+						color: #797879;
+						margin: 10rpx 0;
+					}
+					.image-box{
+						margin-bottom: 10rpx;
+						image{
+							width: 150rpx;
+							height: 150rpx;
+							margin-right: 10rpx;
+						}
+						.image-right{
+							flex: 1;
+							font-size: 24rpx;
+							color: #797879;
+						}
+					}
+				}
+				.item1-header{
+					padding: 10rpx;
+					.down{
+						padding-bottom: 10rpx;
+						border-bottom: 1rpx solid #D5D5D5;
+						image{
+							width: 42rpx;
+							height: 42rpx;
+						}
+						text{
+							color: #2FA284;
+							font-size: 26rpx;
+						}
+					}
+					.top{
+						image{
+							width: 30rpx;
+							height: 30rpx;
+						}
+						.text1{
+							flex: 1;
+							margin: 0 10rpx;
+						}
+						.text2{
+							color: #CD854E;
+						}
+					}
+				}
+			}
+		}
+		.order-list {
+			.item {
+				width: 706rpx;
+				// height: 603rpx;
+				// border: 1rpx solid #A0A0A0;
+				margin: 20rpx auto;
+				border-radius: 10rpx;
+				background-color: #fff;
+				padding-bottom: 20rpx;
+				.paotui-box{
+					padding: 10rpx 10rpx 20rpx 10rpx;
+					font-size: 26rpx;
+					color: #908E90;
+					.price-tips{
+						text-align: right;
+						font-size: 22rpx;
+						margin: 10rpx 0;
+						border-bottom: 1rpx solid #E8E6E8;
+						padding-bottom: 20rpx;
+					}
+					.qibu-price{
+						text-align: right;
+						font-size: 22rpx;
+						margin: 10rpx 0;
+					}
+					.dj-text{
+						margin-bottom: 15rpx;
+					}
+					.tel-box{
+						padding: 0 30rpx;
+					}
+					.weixiu-time{
+						margin-bottom: 10rpx;
+						text:first-child{
+							color: #28B59B;
+							font-size: 30rpx;
+							margin: 10rpx 0;
+						}
+					}
+					.qidian{
+						text:first-child{
+							display: inline-block;
+							width: 30rpx;
+							height: 30rpx;
+							text-align: center;
+							line-height: 30rpx;
+							border-radius: 100rpx;
+							background-color: #00A1EF;
+							font-size: 20rpx;
+							color: #fff;
+						}
+						text:last-child{
+							flex: 1;
+							margin-left: 10rpx;
+							color: #908E90;
+						}
+					}
+					.order-goods{
+						// border-bottom: 1rpx solid #E7E5E7;
+						padding-bottom: 10rpx;
+						// padding: 20rpx;
+						.taocan-box{
+							padding-top: 10rpx;
+							padding-bottom: 10rpx;
+							// border-bottom: 1rpx solid #C0C0C0;
+							color: rgba(0,0,0,0.4);
+						}
+						.order-goods-box{
+							
+							.goods-img{
+								width: 150rpx;
+								height: 150rpx;
+								border-radius: 10rpx;
+								margin-right: 20rpx;
+							}
+							.goods-right{
+								flex: 1;
+								.goods-name{
+									font-size: 26rpx;
+									margin-bottom: 10rpx;
+									color: rgba(0,0,0,0.4);
+								}
+								.goods-jieshao{
+									color: rgba(0,0,0,0.4);
+									margin-bottom: 10rpx;
+									font-size: 26rpx;
+								}
+								.goods-price{
+									color: rgba(0,0,0,0.3);
+									font-size: 26rpx;
+								}
+							}
+						}
+					}
+				}
+				.daijia-box{
+					padding: 0 10rpx 20rpx 10rpx;
+					font-size: 26rpx;
+					color: #908E90;
+					.dj-text{
+						margin-bottom: 15rpx;
+					}
+					.tel-box{
+						padding: 0 30rpx;
+					}
+					.weixiu-time{
+						margin-bottom: 10rpx;
+						text:first-child{
+							color: #28B59B;
+							font-size: 30rpx;
+							margin: 10rpx 0;
+						}
+					}
+					.qidian{
+						text:first-child{
+							display: inline-block;
+							width: 30rpx;
+							height: 30rpx;
+							text-align: center;
+							line-height: 30rpx;
+							border-radius: 100rpx;
+							background-color: #00A1EF;
+							font-size: 20rpx;
+							color: #fff;
+						}
+						text:last-child{
+							flex: 1;
+							margin-left: 10rpx;
+							color: #908E90;
+						}
+					}
+					.price-tips{
+						text-align: right;
+						font-size: 22rpx;
+						margin: 10rpx 0;
+					}
+					.qibu-price{
+						text-align: right;
+						font-size: 22rpx;
+						margin: 10rpx 0;
+					}
+				}
+				.shop-box{
+					padding: 0 10rpx 20rpx 10rpx;
+					.order-text{
+						font-size: 24rpx;
+						color: #A5A2A5;
+					}
+					.pay-title{
+						.text{
+							color: #2EBD9B;
+							font-size: 28rpx;
+						}
+					}
+					.pay-xuzhi{
+						padding: 10rpx 0 10rpx 0;
+						color: rgba(0,0,0,0.4);
+						border-bottom: 1rpx solid #E8E6E8;
+						margin-bottom: 20rpx;
+					}
+					.peisong-type{
+						color: rgba(0,0,0,0.5);
+						text-align: right;
+						font-size: 26rpx;
+						margin-top: 6rpx;
+					}
+					.shuoming-title{
+						text-align: right;
+						font-size: 22rpx;
+						color: rgba(0,0,0,0.3);
+						margin-top: 6rpx;
+					}
+					.price-box{
+						font-size: 26rpx;
+						color: rgba(0,0,0,0.5);
+						text{
+							margin-right: 6rpx;
+						}
+						text:first-child{
+							text-decoration: line-through;
+						}
+					}
+					.taocan-count{
+						margin-bottom: 4rpx;
+						padding: 20rpx 10rpx 4rpx 10rpx;
+						text:first-child{
+							font-size: 33rpx;
+						}
+						text:nth-child(2){
+							flex: 1;
+							margin: 0 10rpx;
+							font-size: 24rpx;
+							text-align: right;
+						}
+						text:last-child{
+							color: #f00;
+						}
+					}
+					.order-goods{
+						border-bottom: 1rpx solid #E7E5E7;
+						// padding: 20rpx;
+						.taocan-box{
+							padding-top: 10rpx;
+							padding-bottom: 10rpx;
+							// border-bottom: 1rpx solid #C0C0C0;
+						}
+						
+						.order-goods-box{
+							.goods-img{
+								width: 150rpx;
+								height: 150rpx;
+								border-radius: 10rpx;
+								margin-right: 20rpx;
+							}
+							.goods-right{
+								flex: 1;
+								.goods-name{
+									font-size: 28rpx;
+									margin-bottom: 10rpx;
+								}
+								.goods-jieshao{
+									color: rgba(0,0,0,0.4);
+									margin-bottom: 10rpx;
+									font-size: 24rpx;
+								}
+								.goods-price{
+									color: rgba(0,0,0,0.3);
+									font-size: 22rpx;
+									text:last-child{
+										text-decoration: line-through;
+									}
+								}
+							}
+						}
+					}
+				}
+				.weixiu-box{
+					padding: 10rpx;
+					font-size: 24rpx;
+					color: #797879;
+					.weixiu-time{
+						margin-bottom: 10rpx;
+						text:first-child{
+							color: #28B59B;
+							font-size: 30rpx;
+							margin: 10rpx 0;
+						}
+					}
+					.jijia-tips{
+						font-size: 20rpx;
+						color: #C6C3C6;
+						margin: 10rpx 0;
+						text-align: right;
+						padding-bottom: 20rpx;
+						border-bottom: 1rpx solid #DCDADC;
+					}
+					.price-tips{
+						text-align: right;
+						font-size: 22rpx;
+						margin: 10rpx 0;
+					}
+					.qibu-price{
+						text-align: right;
+						font-size: 22rpx;
+						margin: 10rpx 0;
+					}
+					.address-box{
+						.address-text{
+							margin: 10rpx 0;
+						}
+						.user-box{
+							margin: 10rpx 0;
+							text{
+								margin-right: 10rpx;
+							}
+						}
+					}
+					.shangmen-time{
+						margin: 10rpx 0;
+					}
+					.weixiu-tips{
+						font-size: 24rpx;
+						color: #797879;
+						margin: 10rpx 0;
+					}
+					.image-box{
+						margin-bottom: 10rpx;
+						image{
+							width: 150rpx;
+							height: 150rpx;
+							margin-right: 10rpx;
+						}
+						.image-right{
+							flex: 1;
+							font-size: 24rpx;
+							color: #797879;
+						}
+					}
+				}
+				.order-header{
+					margin:0 10rpx;
+					padding: 10rpx 0;
+					border-bottom: 1rpx solid #DDDBDD;
+					image{
+						width: 30rpx;
+						height: 30rpx;
+					}
+					.text1{
+						flex: 1;
+						margin: 0 10rpx;
+					}
+					.text2{
+						color: #CD854E;
+					}
+				}
+				.butt-view {
+					.text2 {
+						width: 110rpx;
+						height: 53rpx;
+						margin-right: 20rpx;
+
+					}
+				}
+			}
+		}
+
+		.header-box {
+			width: 750rpx;
+			height: 213rpx;
+			background-color: #fff;
+			border-bottom: 1rpx solid rgba(0, 0, 0, 0.3);
+			padding: 1rpx 0;
+
+			.down-tabs {
+				.view {
+					flex: 1;
+					text-align: center;
+					height: 57rpx;
+					border-radius: 10rpx 10rpx 0 0;
+					text-align: center;
+					line-height: 57rpx;
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #626262;
+					position: relative;
+					.text1{
+						position: absolute;
+						width: 30rpx;
+						height: 30rpx;
+						border-radius: 100rpx;
+						background-color: red;
+						text-align: center;
+						line-height: 30rpx;
+						color: #fff;
+						font-size: 24rpx;
+						top: 0rpx;
+						right: 0rpx;
+					}
+				}
+				
+				.text {
+					background-color: #09AA8C;
+					color: #fff;
+				}
+			}
+
+			.top-tabs {
+				margin: 40rpx auto;
+				width: 404rpx;
+				height: 57rpx;
+				border: 4rpx solid #26B49A;
+				border-radius: 20rpx;
+				overflow: hidden;
+
+				text {
+					width: 202rpx;
+					height: 57rpx;
+					text-align: center;
+					line-height: 57rpx;
+					font-size: 25rpx;
+					font-family: SimHei;
+					font-weight: 400;
+
+				}
+
+				.text {
+					background-color: #26B49A;
+					color: #fff;
+				}
+			}
+		}
+
+	}
+</style>

pages/shop/goods-info.vue

@@ -0,0 +1,234 @@
+<template>
+	<view class="goods-info">
+		<u-navbar :background="{background:`rgba(42, 164, 127,${opacity})`}" :borderBottom="false" :immersive="true"
+			:is-back="false">
+			<view solt="left" class="navbar-body u-flex u-col-center">
+				<view class="item" style="background-color: rgba(0,0,0,0.16);" @tap="toback">
+					<u-icon name="arrow-left" size="36" color="#fff"></u-icon>
+				</view>
+				<view class="item" @tap="tosearch">
+					<image src="../../static/images/info1-1.png" mode=""></image>
+				</view>
+				<button class="item">
+					<image src="../../static/images/info1-2.png" mode=""></image>
+				</button>
+			</view>
+			<view class="nav-bar-title" :style="{color:`rgba(256, 256, 256,${opacity})`}">
+				商品详情
+			</view>
+		</u-navbar>
+		<view class="swiper">
+			<u-swiper :list="list" height="750" indicator-pos="bottomRight"></u-swiper>
+		</view>
+		<view class="goods-name">
+			这里是商品标题(这里是商品标题)
+		</view>
+		<view class="jieshao">
+			这里商品介绍
+		</view>
+		<view class="price u-flex u-col-center">
+			<text>¥10.00</text>
+			<text>门市价 </text>
+		</view>
+		<view class="count u-flex u-col-center">
+			<text>销量 0</text>
+			<text>库存 9999</text>
+		</view>
+		<view class="content-text">
+
+		</view>
+		<view style="height: 130rpx;"></view>
+		<view class="down-tabs u-flex u-col-center u-row-between">
+			<view class="icon-item u-flex-col u-col-center" @tap="tohome">
+				<image src="../../static/images/info1-3.png" mode=""></image>
+				<text>主页</text>
+			</view>
+			<view style="height: 72rpx;width: 2rpx;background-color: #EEEEEE;"></view>
+			<button class="icon-item u-flex-col u-col-center">
+				<image src="../../static/images/info1-4.png" mode=""></image>
+				<text>客服</text>
+			</button>
+			<view class="tobuy" @tap="topay">
+				立即购买
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				opacity: 0,
+				list: [{
+						image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
+						title: '昨夜星辰昨夜风，画楼西畔桂堂东'
+					},
+					{
+						image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
+						title: '身无彩凤双飞翼，心有灵犀一点通'
+					},
+					{
+						image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
+						title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
+					}
+				],
+			}
+		},
+		onLoad() {
+
+		},
+		onPageScroll(e) {
+			var a = e.scrollTop / 200
+			if (a > 1) {
+				this.opacity = 1
+			} else {
+				this.opacity = a
+			}
+		},
+		methods: {
+			topay(){
+				uni.navigateTo({
+					url:"./xiadan"
+				})
+			},
+			tohome(){
+				uni.switchTab({
+					url:"../index/index"
+				})
+			},
+			toback() {
+				uni.navigateBack()
+			},
+			tosearch() {
+				uni.navigateTo({
+					url: "./search"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.goods-info {
+		.down-tabs {
+			position: fixed;
+			bottom: 0;
+			left: 0;
+			width: 750rpx;
+			height: 126rpx;
+			background-color: #09AA8C;
+			.tobuy{
+				width: 433rpx;
+				border-radius: 10rpx;
+				text-align: center;
+				line-height: 79rpx;
+				font-size: 42rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				background-color: #FDCE1C;
+				height: 79rpx;
+				margin: 0 54rpx;
+			}
+			.icon-item{
+				padding: 0 22rpx;
+				background-color: rgba(0,0,0,0);
+				border: none;
+				image{
+					width: 55rpx;
+					height: 55rpx;
+					margin-bottom:10rpx;
+				}
+				text{
+					font-size: 22rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #EEEEEE;
+					line-height: 1;
+				}
+			}
+			.icon-item:after{
+				border: none;
+			}
+		}
+
+		.content-text {
+			margin: 20rpx auto;
+			width: 709rpx;
+			height: 584rpx;
+			background-color: #fff;
+			border-radius: 20rpx;
+			padding: 24rpx;
+		}
+
+		.count {
+			padding: 0 23rpx 20rpx 23rpx;
+			font-size: 25rpx;
+			font-family: SourceHanSansCN;
+			font-weight: 400;
+
+			text {
+				margin-right: 20rpx;
+			}
+		}
+
+		.price {
+			padding: 0 23rpx 20rpx 23rpx;
+
+			text:first-child {
+				font-size: 36rpx;
+				font-family: SourceHanSansCN;
+				font-weight: 400;
+				color: #E8380D;
+				margin-right: 20rpx;
+			}
+
+			text:last-child {
+				font-size: 20rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #AAAAAA;
+			}
+		}
+
+		.jieshao {
+			font-size: 22rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			color: #AAAAAA;
+			padding: 0 23rpx 20rpx 23rpx;
+		}
+
+		.goods-name {
+			font-size: 33rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			padding: 20rpx 23rpx;
+		}
+
+		.nav-bar-title {
+			text-align: center;
+			margin-left: 34rpx;
+		}
+
+		.navbar-body {
+			padding-left: 25rpx;
+
+			.item {
+				margin-right: 20rpx;
+				width: 65rpx;
+				height: 65rpx;
+				border-radius: 100rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				padding: 0;
+				background-color: rgba(0,0,0,0);
+				image {
+					width: 65rpx;
+					height: 65rpx;
+				}
+			}
+		}
+	}
+</style>

pages/shop/myshop.vue

@@ -0,0 +1,97 @@
+<template>
+	<view class="myshop">
+		<u-navbar :background="{background:'#2AA47F'}" title="我的店铺" :borderBottom="false"
+			title-color="#fff" back-icon-color="#fff">
+			<view class="left-box u-flex u-col-center" slot="left">
+				<view style="width: 47rpx;height: 43rpx;position: relative;margin-right: 25rpx;">
+					<image src="../../static/images/index1-2.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
+					<text style="position: absolute;top: -20rpx;right: -10rpx;font-size: 22rpx;width: 30rpx;height: 30rpx;text-align: center;line-height: 30rpx;border-radius: 100rpx;color: #fff;background-color: red;">99</text>
+				</view>
+				<image src="../../static/images/index1-3.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
+			</view>
+		</u-navbar>
+		<view class="shop-item">
+			<view class="top u-flex u-col-top u-row-between">
+				<text>西湖总店[总店]</text>
+				<text>正常</text>
+			</view>
+			<view class="jianjie">
+				商家店铺简介商家店铺简介
+			</view>
+			<view class="name">
+				商家用户名1
+			</view>
+			<view class="u-flex u-col-center u-row-right">
+				<x-button :width="221" :height="76" color="#000" fontSize="25rpx" borderRadius="20rpx" @click="toorder">查看订单</x-button>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			toorder(){
+				uni.navigateTo({
+					url:"./shop-order"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.myshop{
+		.shop-item{
+			width: 707rpx;
+			// height: 257rpx;
+			margin: 20rpx auto;
+			border-radius: 20rpx;
+			padding: 23rpx 32rpx;
+			background-color: #fff;
+			.name{
+				margin-bottom: 9rpx;
+				text-align: right;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #959595;
+			}
+			.jianjie{
+				font-size: 31rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				margin-bottom: 32rpx;
+			}
+			.top{
+				margin-bottom: 18rpx;
+				text:first-child{
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+				text:last-child{
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #08AA8C;
+				}
+			}
+		}
+		.left-box {
+			padding: 0 25rpx;
+		
+			image {
+				margin-right: 25rpx;
+			}
+		}
+	}
+</style>

pages/shop/search.vue

@@ -0,0 +1,394 @@
+<template>
+	<view class="search">
+		<view class="header u-flex u-col-center u-row-between">
+			<view class="left u-flex u-col-center">
+				<image src="../../static/images/search1-2.png" mode=""></image>
+				<input type="text" placeholder="请输入搜索关键词" />
+			</view>
+			<view class="right">
+				搜索
+			</view>
+		</view>
+		<view class="lishi-box" v-if="0">
+			<view class="top u-flex u-col-center u-row-between">
+				<text>搜索历史记录</text>
+				<image src="../../static/images/search1-1.png" mode=""></image>
+			</view>
+			<view class="down u-flex u-col-center u-flex-wrap">
+				<text v-for="(item,index) in 3" :key="index">手机</text>
+			</view>
+		</view>
+		<view class="goods-box" v-else>
+			<view class="shaixuan-box u-flex u-col-center u-row-between">
+				<view class="itme">
+					<view class="u-flex u-col-center u-row-center" @tap="show1 = true">
+						<text>综合</text>
+						<view class="image">
+							<image src="../../static/images/search1-3.png" mode=""></image>
+						</view>
+					</view>
+					<view class="xiala-box" @tap="show1 = false" v-if="show1">
+						<view class="xiala-body u-flex-col u-col-center" @tap.stop>
+							<view class="jiantou"></view>
+							<view class="body u-flex-col u-col-center">
+								<text>综合</text>
+								<text>距离</text>
+								<text>售价</text>
+								<text>销量</text>
+							</view>
+						</view>
+					</view>
+				</view>
+				<view class="itme u-flex u-col-center u-row-center">
+					<text>排序</text>
+					<view class="image">
+						<image style="left: -234rpx;" src="../../static/images/search1-3.png" mode=""></image>
+					</view>
+				</view>
+				<view class="itme">
+					<view class="u-flex u-col-center u-row-center" @tap="show2 = true">
+						<text>筛选</text>
+						<view class="image">
+							<image style="right: 0;" src="../../static/images/search1-3.png" mode=""></image>
+						</view>
+					</view>
+					<view class="shaixuan" @tap="show2 = false" v-if="show2">
+						<view class="shaixuan-body u-flex-col u-col-bottom" @tap.stop>
+							<view class="jiantou"></view>
+							<view class="body u-flex-col">
+								<view class="shaixuan-title">
+									配送方式
+								</view>
+								<view class="shaixuan-text u-flex u-col-center u-flex-wrap">
+									<text v-for="(item,index) in 3" :key="index">自取</text>
+								</view>
+								<view class="shaixuan-title">
+									配送方式
+								</view>
+								<view class="shaixuan-text u-flex u-col-center u-flex-wrap">
+									<text v-for="(item,index) in 3" :key="index">自取</text>
+								</view>
+								<view class="shaixuan-over" @tap="show2 = false">
+									确定
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="goods-item" v-for="(item,index) in 2" :key="index" @tap="toinfo">
+				<image src="" mode=""></image>
+				<view class="goods-body">
+					<view class="name">
+						这里是商品标题(这里 是商品标题)
+					</view>
+					<view class="content">
+						这里商品介绍
+					</view>
+					<view class="goods-down u-flex u-col-center">
+						<text>¥10.00</text>
+						<text>门市价￥99.00</text>
+						<text>销量：0</text>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				show1: false,
+				show2: false
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			toinfo(){
+				uni.navigateTo({
+					url:"./goods-info"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.search {
+		.goods-box {
+			.goods-item {
+				width: 705rpx;
+				height: 705rpx;
+				margin: 20rpx auto;
+				padding: 20rpx;
+				background-color: #fff;
+				border-radius: 10rpx;
+				position: relative;
+
+				.goods-body {
+					position: absolute;
+					left: 0;
+					bottom: 0;
+					width: 705rpx;
+					height: 170rpx;
+					background-color: rgba(256, 256, 256, 0.6);
+					padding: 20rpx 40rpx 40rpx 40rpx;
+
+					.goods-down {
+						text:first-child {
+							font-size:42rpx;
+							font-family: SourceHanSansCN;
+							font-weight: 400;
+							color: #E8380D;
+						}
+						text:nth-child(2){
+							font-size: 19rpx;
+							font-family: SourceHanSansCN;
+							font-weight: 400;
+							color: #FFFFFF;
+							margin: 0 35rpx 0 31rpx;
+						}
+						text:last-child{
+							font-size: 22rpx;
+							font-family: SourceHanSansCN;
+							font-weight: 400;
+						}
+					}
+
+					.content {
+						font-size: 22rpx;
+						font-family: SimHei;
+						font-weight: 400;
+						color: #FFFFFF;
+					}
+
+					.name {
+						font-size: 28rpx;
+						font-family: SimHei;
+						font-weight: 400;
+					}
+				}
+
+				image {
+					width: 665rpx;
+					height: 665rpx;
+					background-color: #27AA76;
+				}
+			}
+
+			.shaixuan-box {
+				.itme {
+					width: 33%;
+					position: relative;
+
+					.shaixuan {
+						position: fixed;
+						top: 0;
+						left: 0;
+						width: 750rpx;
+						height: 100vh;
+						background-color: rgba(0, 0, 0, 0);
+						z-index: 10;
+
+						.shaixuan-body {
+							position: fixed;
+							top: 160rpx;
+							right: 22rpx;
+
+							.jiantou {
+								width: 0;
+								height: 0;
+								border: 20rpx solid rgba(0, 0, 0, 0);
+								border-bottom-color: #fff;
+								position: relative;
+								z-index: 1;
+								margin-right: 90rpx;
+							}
+
+							.body {
+								background-color: #fff;
+								width: 470rpx;
+								// height: 389rpx;
+								box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(170, 170, 170, 0.75);
+								border-radius: 10rpx;
+								padding: 0 30rpx;
+
+								.shaixuan-title {
+									padding: 20rpx;
+									color: #595959;
+									font-size: 24rpx;
+								}
+
+								.shaixuan-text {
+									text {
+										padding: 10rpx 20rpx;
+										border-radius: 10rpx;
+										color: #27AA76;
+										background-color: #fff;
+										font-size: 22rpx;
+										margin-right: 20rpx;
+										margin-bottom: 10rpx;
+										border: 2rpx solid #27AA76;
+									}
+
+									.text {
+										color: #fff;
+										background-color: #27AA76;
+									}
+								}
+
+								.shaixuan-over {
+									margin: 30rpx auto;
+									width: 150rpx;
+									height: 60rpx;
+									border-radius: 100rpx;
+									font-size: 24rpx;
+									text-align: center;
+									line-height: 60rpx;
+									background-color: #F4CC14;
+								}
+							}
+						}
+					}
+
+					.xiala-box {
+						position: fixed;
+						top: 0;
+						left: 0;
+						width: 750rpx;
+						height: 100vh;
+						background-color: rgba(0, 0, 0, 0);
+						z-index: 10;
+
+						.xiala-body {
+							position: fixed;
+							top: 160rpx;
+							left: 22rpx;
+
+							.jiantou {
+								width: 0;
+								height: 0;
+								border: 20rpx solid rgba(0, 0, 0, 0);
+								border-bottom-color: #fff;
+								position: relative;
+								z-index: 1;
+							}
+
+							.body {
+								background-color: #fff;
+								width: 235rpx;
+								height: 338rpx;
+								box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(170, 170, 170, 0.75);
+								border-radius: 10rpx;
+
+								text {
+									width: 100%;
+									text-align: center;
+									line-height: 84rpx;
+									font-size: 25rpx;
+									font-family: SimHei;
+									font-weight: 400;
+								}
+							}
+						}
+					}
+
+					.image {
+						position: relative;
+						width: 40rpx;
+						height: 31rpx;
+						overflow: hidden;
+						margin-left: 15rpx;
+
+						image {
+							position: absolute;
+							top: 0;
+							width: 515rpx;
+							height: 31rpx;
+						}
+					}
+
+					text {
+						font-size: 31rpx;
+						font-family: SimHei;
+						font-weight: 400;
+					}
+				}
+			}
+		}
+
+		.lishi-box {
+			.down {
+				padding: 0 32rpx;
+
+				text {
+					padding: 10rpx 23rpx;
+					border-radius: 10rpx;
+					border: 2rpx solid #2AA47F;
+					margin-right: 30rpx;
+					margin-bottom: 20rpx;
+					font-size: 25rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #08AA8C;
+				}
+			}
+
+			.top {
+				margin-bottom: 32rpx;
+				padding: 0 42rpx;
+
+				text {
+					font-size: 25rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #555555;
+				}
+
+				image {
+					width: 35rpx;
+					height: 40rpx;
+				}
+			}
+		}
+
+		.header {
+			padding: 30rpx;
+
+			.right {
+				width: 124rpx;
+				height: 66rpx;
+				border-radius: 20rpx;
+				text-align: center;
+				background-color: #2AA47F;
+				font-size: 31rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #FFFFFF;
+				line-height: 66rpx;
+			}
+
+			.left {
+				width: 532rpx;
+				height: 65rpx;
+				border-radius: 20rpx;
+				border: 3rpx solid #2AA47F;
+				padding: 0 21rpx;
+
+				input {
+					flex: 1;
+				}
+
+				image {
+					width: 35rpx;
+					height: 35rpx;
+					margin-right: 18rpx;
+				}
+			}
+		}
+	}
+</style>

pages/shop/shop-order.vue

@@ -0,0 +1,458 @@
+<template>
+	<view class="shop-order">
+		<u-navbar :background="{background:'#2AA47F'}" title="店铺订单" :borderBottom="false"
+			title-color="#fff" back-icon-color="#fff">
+			<view class="left-box u-flex u-col-center" slot="left">
+				<image src="../../static/images/index1-3.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
+			</view>
+		</u-navbar>
+		<view class="header u-flex u-col-center u-row-between">
+			<view class="left u-flex u-col-center">
+				<image src="../../static/images/search1-2.png" mode=""></image>
+				<input type="text" placeholder="请输入搜索关键词" />
+			</view>
+			<view class="right">
+				搜索
+			</view>
+		</view>
+		<view class="goods-box">
+			<view class="shaixuan-box u-flex u-col-center u-row-between">
+				<view class="itme">
+					<view class="u-flex u-col-center u-row-center" @tap="show1 = true">
+						<text>综合</text>
+						<view class="image">
+							<image src="../../static/images/search1-3.png" mode=""></image>
+						</view>
+					</view>
+					<view class="xiala-box" @tap="show1 = false" v-if="show1">
+						<view class="xiala-body u-flex-col u-col-center" @tap.stop>
+							<view class="jiantou"></view>
+							<view class="body u-flex-col u-col-center">
+								<text>综合</text>
+								<text>距离</text>
+								<text>售价</text>
+								<text>销量</text>
+							</view>
+						</view>
+					</view>
+				</view>
+				<view class="itme u-flex u-col-center u-row-center">
+					<text>排序</text>
+					<view class="image">
+						<image style="left: -234rpx;" src="../../static/images/search1-3.png" mode=""></image>
+					</view>
+				</view>
+				<view class="itme">
+					<view class="u-flex u-col-center u-row-center" @tap="show2 = true">
+						<text>筛选</text>
+						<view class="image">
+							<image style="right: 0;" src="../../static/images/search1-3.png" mode=""></image>
+						</view>
+					</view>
+					<view class="shaixuan" @tap="show2 = false" v-if="show2">
+						<view class="shaixuan-body u-flex-col u-col-bottom" @tap.stop>
+							<view class="jiantou"></view>
+							<view class="body u-flex-col">
+								<view class="shaixuan-title">
+									配送方式
+								</view>
+								<view class="shaixuan-text u-flex u-col-center u-flex-wrap">
+									<text v-for="(item,index) in 3" :key="index">自取</text>
+								</view>
+								<view class="shaixuan-title">
+									配送方式
+								</view>
+								<view class="shaixuan-text u-flex u-col-center u-flex-wrap">
+									<text v-for="(item,index) in 3" :key="index">自取</text>
+								</view>
+								<view class="shaixuan-over" @tap="show2 = false">
+									确定
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="goods-item" v-for="(item,index) in 2" :key="index" @tap="toinfo">
+				<view class="header-box u-flex u-col-center u-row-between">
+					<text>sc123123123123123</text>
+					<text>待用户评价</text>
+				</view>
+				<view class="order-goods">
+					<view class="order-goods-box u-flex u-col-center">
+						<image src="../../static/images/648.png" class="goods-img" mode=""></image>
+						<view class="goods-right">
+							<view class="goods-name">
+								这是名字这是名字这是名字
+							</view>
+							<view class="goods-jieshao">
+								这是名字这是名字这是名字
+							</view>
+							<view class="goods-price">
+								<text>¥50.0</text>
+								<text>门市价：¥100</text>
+							</view>
+						</view>
+					</view>
+					<view class="taocan-box">
+						套餐1:鸡翅+鸡翅
+					</view>
+				</view>
+				<view class="taocan-count u-flex u-col-center">
+					<text>套餐1</text>
+					<text>x1</text>
+					<text>¥50</text>
+				</view>
+				<view class="price-box u-flex u-col-center u-row-right">
+					<text>商品原价：¥100</text>
+					<text>优惠：¥100</text>
+					<text>配送费：¥100</text>
+				</view>
+				<view class="shuoming-title">
+					快递费用说明：123
+				</view>
+				<view class="shuoming-title">
+					优惠金额说明：23
+				</view>
+				<view class="peisong-type">
+					配送方式：到家
+				</view>
+				<view class="pay-xuzhi">
+					购买须知：购买该商品需要在2020-02-02前使用
+				</view>
+				<view class="pay-title u-flex u-col-center">
+					<u-icon name="bag-fill" color="#429EFE" size="40"></u-icon>
+					<text class="text">购买商品</text>
+				</view>
+				<view class="order-text">
+					下单时间：2022-02-02 11:11:11
+				</view>
+				<view class="order-text">
+					付款时间：2022-02-02 11:11:11
+				</view>
+				<view class="order-text">
+					核销时间：2022-02-02 11:11:11
+				</view>
+				<view class="u-flex u-row-right">
+					<x-button :width="205" :height="71" borderRadius="20rpx" fontSize="25rpx" color="#000">服务进度</x-button>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				show1: false,
+				show2: false
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			toinfo(){
+				uni.navigateTo({
+					url:"./shop-orderinfo"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.shop-order {
+		.left-box {
+			padding: 0 25rpx;
+		
+			image {
+				margin-right: 25rpx;
+			}
+		}
+		.goods-box {
+			.goods-item {
+				width: 705rpx;
+				// height: 705rpx;
+				margin: 20rpx auto;
+				padding: 20rpx;
+				background-color: #fff;
+				border-radius: 10rpx;
+				position: relative;
+				.order-text{
+					font-size: 24rpx;
+					color: #A5A2A5;
+				}
+				.pay-title{
+					.text{
+						color: #2EBD9B;
+						font-size: 34rpx;
+					}
+				}
+				.pay-xuzhi{
+					padding: 10rpx 0 10rpx 0;
+					color: rgba(0,0,0,0.4);
+					border-bottom: 1rpx solid rgba(0,0,0,0.3);
+					margin-bottom: 20rpx;
+				}
+				.peisong-type{
+					color: rgba(0,0,0,0.5);
+					text-align: right;
+					font-size: 26rpx;
+					margin-top: 6rpx;
+				}
+				.shuoming-title{
+					text-align: right;
+					font-size: 22rpx;
+					color: rgba(0,0,0,0.3);
+					margin-top: 6rpx;
+				}
+				.price-box{
+					font-size: 26rpx;
+					color: rgba(0,0,0,0.5);
+					text{
+						margin-right: 6rpx;
+					}
+					text:first-child{
+						text-decoration: line-through;
+					}
+				}
+				.taocan-count{
+					margin-bottom: 4rpx;
+					padding: 20rpx 10rpx 4rpx 10rpx;
+					text:first-child{
+						font-size: 33rpx;
+					}
+					text:nth-child(2){
+						flex: 1;
+						margin: 0 10rpx;
+						font-size: 24rpx;
+						text-align: right;
+					}
+					text:last-child{
+						color: #F4A865;
+					}
+				}
+				.order-goods{
+					border-top: 1rpx solid #C0C0C0;
+					border-bottom: 1rpx solid #C0C0C0;
+					padding: 20rpx;
+					.taocan-box{
+						padding-top: 10rpx;
+						// border-bottom: 1rpx solid #C0C0C0;
+					}
+					
+					.order-goods-box{
+						.goods-img{
+							width: 155rpx;
+							height: 155rpx;
+							border-radius: 10rpx;
+							margin-right: 20rpx;
+						}
+						.goods-right{
+							flex: 1;
+							.goods-name{
+								font-size: 30rpx;
+								margin-bottom: 10rpx;
+							}
+							.goods-jieshao{
+								color: rgba(0,0,0,0.4);
+								margin-bottom: 10rpx;
+								font-size: 28rpx;
+							}
+							.goods-price{
+								color: rgba(0,0,0,0.3);
+								font-size: 22rpx;
+								text:last-child{
+									text-decoration: line-through;
+								}
+							}
+						}
+					}
+				}
+				.header-box{
+					margin-bottom: 20rpx;
+					text:last-child{
+						color: #CF8851;
+					}
+				}
+			}
+
+			.shaixuan-box {
+				.itme {
+					width: 33%;
+					position: relative;
+
+					.shaixuan {
+						position: fixed;
+						top: 0;
+						left: 0;
+						width: 750rpx;
+						height: 100vh;
+						background-color: rgba(0, 0, 0, 0);
+						z-index: 10;
+
+						.shaixuan-body {
+							position: fixed;
+							top: 160rpx;
+							right: 22rpx;
+
+							.jiantou {
+								width: 0;
+								height: 0;
+								border: 20rpx solid rgba(0, 0, 0, 0);
+								border-bottom-color: #fff;
+								position: relative;
+								z-index: 1;
+								margin-right: 90rpx;
+							}
+
+							.body {
+								background-color: #fff;
+								width: 470rpx;
+								// height: 389rpx;
+								box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(170, 170, 170, 0.75);
+								border-radius: 10rpx;
+								padding: 0 30rpx;
+
+								.shaixuan-title {
+									padding: 20rpx;
+									color: #595959;
+									font-size: 24rpx;
+								}
+
+								.shaixuan-text {
+									text {
+										padding: 10rpx 20rpx;
+										border-radius: 10rpx;
+										color: #27AA76;
+										background-color: #fff;
+										font-size: 22rpx;
+										margin-right: 20rpx;
+										margin-bottom: 10rpx;
+										border: 2rpx solid #27AA76;
+									}
+
+									.text {
+										color: #fff;
+										background-color: #27AA76;
+									}
+								}
+
+								.shaixuan-over {
+									margin: 30rpx auto;
+									width: 150rpx;
+									height: 60rpx;
+									border-radius: 100rpx;
+									font-size: 24rpx;
+									text-align: center;
+									line-height: 60rpx;
+									background-color: #F4CC14;
+								}
+							}
+						}
+					}
+
+					.xiala-box {
+						position: fixed;
+						top: 0;
+						left: 0;
+						width: 750rpx;
+						height: 100vh;
+						background-color: rgba(0, 0, 0, 0);
+						z-index: 10;
+
+						.xiala-body {
+							position: fixed;
+							top: 160rpx;
+							left: 22rpx;
+
+							.jiantou {
+								width: 0;
+								height: 0;
+								border: 20rpx solid rgba(0, 0, 0, 0);
+								border-bottom-color: #fff;
+								position: relative;
+								z-index: 1;
+							}
+
+							.body {
+								background-color: #fff;
+								width: 235rpx;
+								height: 338rpx;
+								box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(170, 170, 170, 0.75);
+								border-radius: 10rpx;
+
+								text {
+									width: 100%;
+									text-align: center;
+									line-height: 84rpx;
+									font-size: 25rpx;
+									font-family: SimHei;
+									font-weight: 400;
+								}
+							}
+						}
+					}
+
+					.image {
+						position: relative;
+						width: 40rpx;
+						height: 31rpx;
+						overflow: hidden;
+						margin-left: 15rpx;
+
+						image {
+							position: absolute;
+							top: 0;
+							width: 515rpx;
+							height: 31rpx;
+						}
+					}
+
+					text {
+						font-size: 31rpx;
+						font-family: SimHei;
+						font-weight: 400;
+					}
+				}
+			}
+		}
+
+		.header {
+			padding: 30rpx;
+
+			.right {
+				width: 124rpx;
+				height: 66rpx;
+				border-radius: 20rpx;
+				text-align: center;
+				background-color: #2AA47F;
+				font-size: 31rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #FFFFFF;
+				line-height: 66rpx;
+			}
+
+			.left {
+				width: 532rpx;
+				height: 65rpx;
+				border-radius: 20rpx;
+				border: 3rpx solid #2AA47F;
+				padding: 0 21rpx;
+
+				input {
+					flex: 1;
+				}
+
+				image {
+					width: 35rpx;
+					height: 35rpx;
+					margin-right: 18rpx;
+				}
+			}
+		}
+	}
+</style>

pages/shop/shop-orderinfo.vue

@@ -0,0 +1,197 @@
+<template>
+	<view class="shop-orderinfo">
+		<view class="header-box u-flex u-col-center u-row-between">
+			<text>sc213123123123</text>
+			<text>待用户评价</text>
+		</view>
+		<view class="address-box">
+			<view class="title">
+				收货地址
+			</view>
+			<view class="address-user">
+				啦啦啦 18888888888
+			</view>
+			<view class="address-text">
+				阿斯利康将阿奎罗加大科技大奖看见阿斯科利金德拉克
+			</view>
+		</view>
+		<view class="order-goods">
+			<view class="order-goods-box u-flex u-col-center">
+				<image src="../../static/images/648.png" class="goods-img" mode=""></image>
+				<view class="goods-right">
+					<view class="goods-name">
+						这是名字这是名字这是名字
+					</view>
+					<view class="goods-jieshao">
+						这是名字这是名字这是名字
+					</view>
+					<view class="goods-price">
+						<text>¥50.0</text>
+						<text>门市价：¥100</text>
+					</view>
+				</view>
+			</view>
+			<view class="taocan-box">
+				套餐1:鸡翅+鸡翅
+			</view>
+		</view>
+		<view class="taocan-count u-flex u-col-center">
+			<text>套餐1</text>
+			<text>x1</text>
+			<text>¥50</text>
+		</view>
+		<view class="price-box u-flex u-col-center u-row-right">
+			<text>商品原价：¥100</text>
+			<text>优惠：¥100</text>
+			<text>配送费：¥100</text>
+		</view>
+		<view class="shuoming-title">
+			快递费用说明：123
+		</view>
+		<view class="shuoming-title">
+			优惠金额说明：23
+		</view>
+		<view class="peisong-type">
+			配送方式：到家
+		</view>
+		<view class="pay-xuzhi">
+			购买须知：购买该商品需要在2020-02-02前使用
+		</view>
+		<view class="isfapiao">
+			是否需要发票：否
+		</view>
+		<view class="u-flex u-col-center u-row-right">
+			<x-button :width="205" :height="71" color="#000" fontSize="25rpx" borderRadius="20rpx">服务进度</x-button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				
+			}
+		},
+		onLoad() {
+			
+		},
+		methods:{
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.shop-orderinfo{
+		min-height: 100vh;
+		padding: 1rpx 30rpx;
+		background-color: #fff;
+		.isfapiao{
+			padding: 10rpx 0 10rpx 0;
+			color: rgba(0,0,0,0.4);
+		}
+		.pay-xuzhi{
+			padding: 10rpx 0 10rpx 0;
+			color: rgba(0,0,0,0.4);
+			border-bottom: rgba(0,0,0,0.1) 1rpx solid;
+			margin-bottom: 20rpx;
+		}
+		.peisong-type{
+			color: rgba(0,0,0,0.5);
+			text-align: right;
+			font-size: 26rpx;
+			margin-top: 6rpx;
+		}
+		.shuoming-title{
+			text-align: right;
+			font-size: 22rpx;
+			color: rgba(0,0,0,0.3);
+			margin-top: 6rpx;
+		}
+		.price-box{
+			font-size: 26rpx;
+			color: rgba(0,0,0,0.5);
+			text{
+				margin-right: 6rpx;
+			}
+			text:first-child{
+				text-decoration: line-through;
+			}
+		}
+		.taocan-count{
+			margin-bottom: 4rpx;
+			padding: 20rpx 10rpx 4rpx 10rpx;
+			text:first-child{
+				font-size: 33rpx;
+			}
+			text:nth-child(2){
+				flex: 1;
+				margin: 0 10rpx;
+				font-size: 24rpx;
+				text-align: right;
+			}
+			text:last-child{
+				color: #F4A865;
+			}
+		}
+		.order-goods{
+			padding: 20rpx;
+			border-bottom: rgba(0,0,0,0.1) 1rpx solid;
+			.taocan-box{
+				padding-top: 10rpx;
+				// border-bottom: 1rpx solid #C0C0C0;
+			}
+			
+			.order-goods-box{
+				.goods-img{
+					width: 155rpx;
+					height: 155rpx;
+					border-radius: 10rpx;
+					margin-right: 20rpx;
+				}
+				.goods-right{
+					flex: 1;
+					.goods-name{
+						font-size: 30rpx;
+						margin-bottom: 10rpx;
+					}
+					.goods-jieshao{
+						color: rgba(0,0,0,0.4);
+						margin-bottom: 10rpx;
+						font-size: 28rpx;
+					}
+					.goods-price{
+						color: rgba(0,0,0,0.3);
+						font-size: 22rpx;
+						text:last-child{
+							text-decoration: line-through;
+						}
+					}
+				}
+			}
+		}
+		.address-box{
+			padding: 30rpx 0;
+			border-bottom: rgba(0,0,0,0.1) 1rpx solid;
+			.address-text{
+				color: #8C8C8C;
+			}
+			.address-user{
+				color: #797979;
+				font-size: 32rpx;
+				margin: 10rpx 0;
+			}
+			.title{
+				color: #D47D3B;
+			}
+		}
+		.header-box{
+			padding: 20rpx 0;
+			border-bottom: rgba(0,0,0,0.1) 1rpx solid;
+			text:last-child{
+				color: #D47D3B;
+			}
+		}
+	}
+</style>

pages/shop/shop.vue

@@ -0,0 +1,244 @@
+<template>
+	<view class="shop">
+		<x-navbar :active="2">
+			<view class="nav-center u-flex u-col-center u-row-between" @tap="toseatch">
+				<u-icon name="search" color="rgba(0,0,0,0.8)"></u-icon>
+				<text class="text">搜索</text>
+			</view>
+		</x-navbar>
+		<view class="title">
+			今日新上
+		</view>
+		<scroll-view scroll-x="true" class="scroll-box">
+			<view class="goods-item" v-for="(item,index) in 4" :key='index'>
+				<image src="" mode=""></image>
+				<view class="name">
+					这里是商品标题(这里是商品标题)
+				</view>
+				<view class="price">
+					¥10.00
+				</view>
+			</view>
+		</scroll-view>
+		<image src="" class="img-box" mode=""></image>
+		<view class="tabs-box">
+			<u-tabs :list="list" :is-scroll="false" active-color="#2AA47F" :isScroll="true" :current="current"
+				@change="change"></u-tabs>
+		</view>
+		<view class="goods-list u-flex u-col-center u-row-between u-flex-wrap">
+			<view class="item" v-for="(item,index) in 4" :key="index" @tap="toinfo">
+				<image src="" mode=""></image>
+				<view class="name">
+					这里是商品标题(这里是商品标题)
+				</view>
+				<view class="label">
+					<text>限购2份</text>
+				</view>
+				<view class="tips">
+					活动优惠价
+				</view>
+				<view class="price u-flex u-col-center u-row-between">
+					<text>¥10.00</text>
+					<text>加入购物车</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				list: [{
+					name: '今日爆款'
+				}, {
+					name: '无需预约'
+				}, {
+					name: '离我最近'
+				}, {
+					name: '最多分享'
+				}, {
+					name: '即将下架'
+				}],
+				current: 0
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			toinfo(){
+				uni.navigateTo({
+					url:"./goods-info",
+					fail(err) {
+						console.log(err);
+					}
+				})
+			},
+			change(index) {
+				this.current = index;
+			},
+			toseatch(){
+				uni.navigateTo({
+					url:"./search"
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.shop {
+		.goods-list {
+			padding: 0 20rpx;
+
+			.item {
+				width: 350rpx;
+				background-color: #fff;
+				margin-bottom: 18rpx;
+				height: 598rpx;
+				border-radius: 10rpx;
+				overflow: hidden;
+
+				image {
+					width: 350rpx;
+					height: 350rpx;
+
+					background-color: #2AA47F;
+				}
+				.price{
+					padding: 0 16rpx;
+					text:first-child{
+						font-size: 39rpx;
+						font-family: SourceHanSansCN;
+						font-weight: 400;
+						color: #E8380D;
+					}
+					text:last-child{
+						width: 157rpx;
+						height: 42rpx;
+						line-height: 42rpx;
+						border-radius: 100rpx;
+						text-align: center;
+						background-color: #F4CC14;
+						font-size: 24rpx;
+					}
+				}
+				.name {
+					padding: 0 16rpx 10rpx 16rpx;
+					font-size: 30rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					display: -webkit-box;
+					-webkit-box-orient: vertical;
+					-webkit-line-clamp: 2;
+					overflow: hidden;
+				}
+				.tips{
+					font-size: 21rpx;
+					font-family: SourceHanSansCN;
+					font-weight: 400;
+					color: #A0A0A0;
+					padding: 0 16rpx;
+				}
+				.label {
+					padding: 0 16rpx;
+					margin-bottom: 10rpx;
+					text {
+						margin-right: 10rpx;
+						padding: 4rpx 10rpx;
+						border-radius: 100rpx;
+						background-color: #E1E1E1;
+						color: #929292;
+						font-size: 24rpx;
+					}
+				}
+			}
+		}
+
+		.tabs-box {
+			margin-bottom: 20rpx;
+		}
+
+		.img-box {
+			width: 750rpx;
+			height: 417rpx;
+			background-color: #2AA47F;
+			margin-bottom: 20rpx;
+		}
+
+		.scroll-box {
+			white-space: nowrap;
+			margin-bottom: 20rpx;
+
+			.goods-item {
+				display: inline-block;
+				width: 309rpx;
+				height: 472rpx;
+				border-radius: 10rpx;
+				margin-left: 28rpx;
+				background-color: #FAE5DF;
+				overflow: hidden;
+
+				image {
+					width: 309rpx;
+					height: 309rpx;
+					background-color: #2AA47F;
+				}
+
+				.name {
+					white-space: normal;
+					margin: 10rpx 16rpx;
+					display: -webkit-box;
+					-webkit-box-orient: vertical;
+					-webkit-line-clamp: 2;
+					overflow: hidden;
+					font-size: 27rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+
+				.price {
+					font-size: 34rpx;
+					font-family: SourceHanSansCN;
+					font-weight: 400;
+					color: #E8380D;
+					padding: 0 16rpx;
+				}
+			}
+		}
+
+		.title {
+			font-size: 28rpx;
+			font-family: SimHei;
+			font-weight: 400;
+			color: #FFFFFF;
+			-webkit-text-stroke: 3rpx #00A98B;
+			text-stroke: 3rpx #00A98B;
+			padding: 26rpx 30rpx;
+		}
+
+		.nav-center {
+			padding-left: 10rpx;
+			flex: 1;
+			background-color: #fff;
+			height: 51rpx;
+			border-radius: 6rpx;
+			overflow: hidden;
+			margin-right: 25rpx;
+
+			.text {
+				height: 51rpx;
+				padding: 0 16rpx;
+				background-color: #E1E1E1;
+				line-height: 51rpx;
+				font-size: 25rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #959595;
+			}
+		}
+
+	}
+</style>

pages/shop/xiadan.vue

@@ -0,0 +1,237 @@
+<template>
+	<view class="xiadan">
+		<view class="goods-box">
+			<view class="goods u-flex u-col-center">
+				<image src="" mode=""></image>
+				<view class="right u-flex-col">
+					<text class="name">名字名字</text>
+					<text class="tips">简介简介</text>
+					<view class="price">
+						<text>¥50</text>
+						<text>门市价¥100</text>
+					</view>
+				</view>
+			</view>
+			<view class="count-box u-flex u-col-center u-row-between">
+				<text class="text">购买数量 库存99 限购数量99</text>
+				<u-number-box v-model="value"></u-number-box>
+			</view>
+			<view class="taocan u-flex u-row-between u-col-top">
+				<text class="left">套餐1</text>
+				<view class="right u-flex-col u-col-bottom">
+					<view class="price1">¥50</view>
+					<view class="price2">
+						<text>商品原价：¥100</text>
+						<text>优惠：¥50</text>
+					</view>
+					<view class="shuoming">优惠金额说明：这里是优惠说明</view>
+				</view>
+			</view>
+			<view class="peisong-box u-flex u-col-center u-row-between">
+				<text class="text">配送方式</text>
+				<view class="right u-flex u-col-center">
+					<text class="text1">到家 </text>
+					<u-icon name="arrow-right" color="#08AA8C"></u-icon>
+				</view>
+			</view>
+		</view>
+		<view class="address-box">
+			<view class="qiehuan">
+				切换地址
+			</view>
+			<view class="address">
+				<view class="name">
+					姓名  1591663977
+				</view>
+				<view class="address-text">
+					字体样式  #707070
+				</view>
+			</view>
+			<view class="price1 u-flex u-col-center u-row-right">
+				<text class="text1">¥50</text>
+				<view class="text2">
+					<x-button :width='205' :height="71" color="#000" fontSize="25rpx">确认下单</x-button>
+				</view>
+			</view>
+			<view class="xieyi-box u-flex u-col-center u-row-right">
+				<u-checkbox v-model="checked" active-color="#08AA8C">请阅读并同意</u-checkbox>
+				<view class="text u-flex u-col-center" style="color: #08AA8C;">
+					《平台用户服务协议》
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				value: '',
+				checked:false
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.xiadan {
+		.address-box{
+			width: 706rpx;
+			// height: 1105rpx;
+			margin: 20rpx auto;
+			background-color: #fff;
+			border-radius: 20rpx;
+			padding: 0 20rpx 30rpx 20rpx;
+			.xieyi-box{
+				margin-top: 20rpx;
+				.text{
+					line-height: 1.8;
+				}
+			}
+			.price1{
+				.text1{
+					font-size: 31rpx;
+					font-family: SourceHanSansCN;
+					font-weight: 400;
+					color: #E8380D;
+					margin-right: 43rpx;
+				}
+				.text2 {
+					width: 205rpx;
+					height: 71rpx;
+					
+				}
+				
+				
+			}
+			.address{
+				.name{
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #707070;
+					margin-bottom: 20rpx;
+				}
+				.address-text{
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+					color: #707070;
+					margin-bottom: 80rpx;
+				}
+			}
+			.qiehuan{
+				text-align: right;
+				font-size: 31rpx;
+				font-family: SimHei;
+				font-weight: 400;
+				color: #08AA8C;
+				padding: 20rpx 0;
+			}
+		}
+		.goods-box {
+			width: 706rpx;
+			// height: 1105rpx;
+			margin: 20rpx auto;
+			background-color: #fff;
+			border-radius: 20rpx;
+			padding: 0 20rpx 30rpx 20rpx;
+			.peisong-box{
+				margin-top: 20rpx;
+				.right{
+					.text1{
+						font-size: 31rpx;
+						font-family: SimHei;
+						font-weight: 400;
+						color: #08AA8C;
+					}
+				}
+				.text{
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+			}
+			.taocan{
+				padding: 20rpx 0;
+				.right{
+					.shuoming{
+						font-size: 24rpx;
+						color: rgba(0,0,0,0.3);
+					}
+					.price2{
+						font-size:26rpx;
+						color: rgba(0,0,0,0.5);
+						text:first-child{
+							text-decoration: line-through;
+							margin-right: 4rpx;
+						}
+					}
+					.price1{
+						font-size: 31rpx;
+						font-family: SourceHanSansCN;
+						font-weight: 400;
+						color: #E8380D;
+					}
+				}
+				.left{
+					font-size: 31rpx;
+					font-family: SimHei;
+					font-weight: 400;
+				}
+			}
+			.count-box{
+				padding-bottom: 20rpx;
+				border-bottom: 1rpx solid rgba(0,0,0,0.1);
+				.text{
+					font-size: 28rpx;
+					color: rgba(0,0,0,0.5);
+				}
+			}
+			.goods {
+				padding: 27rpx 0;
+
+				.right {
+					.name {
+						font-size: 34rpx;
+						margin-bottom: 6rpx;
+					}
+
+					.tips {
+						color: rgba(0, 0, 0, 0.5);
+						margin-bottom: 8rpx;
+						font-size: 30rpx;
+					}
+
+					.price {
+						text:first-child {
+							font-size: 24rpx;
+							margin-right: 4rpx;
+						}
+
+						text:last-child {
+							font-size: 24rpx;
+							color: #999;
+							text-decoration: line-through;
+						}
+					}
+				}
+
+				image {
+					width: 151rpx;
+					height: 151rpx;
+					border-radius: 20rpx;
+					border: 1rpx solid #999;
+					margin-right: 20rpx;
+				}
+			}
+		}
+	}
+</style>