11/23

App.vue

@@ -54,10 +54,18 @@
 	.abetween {
 		align-content: space-between;
 	}
+	.astart {
+		align-items: flex-start;
+	}
 	.aend {
 		align-items: flex-end;
 	}
 	.fwrap {
 		flex-wrap: wrap;
 	}
+	.text_hide {
+		overflow: hidden;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+	}
 </style>

components/menuList/menuList.vue

@@ -0,0 +1,212 @@
+<template>
+	<view class="content hflex jbetween">
+		<scroll-view scroll-y="true" style="height: 1190rpx;">
+			<view :style="[MobileLeft]">
+				<view v-show="!isNav">
+					<view v-for="(item,index) in menuLists" :class="menuIndex==index ? 'menuListSelect' : 'menuList' " @click="selectMenu(index,item)">
+						{{item.title}}
+					</view>
+				</view>
+				<view v-show="isNav">
+					<slot name="nav"></slot>
+				</view>
+				<view :style="[foot]"></view>
+			</view>
+		</scroll-view>
+		<scroll-view scroll-y="true" style="height: 1190rpx;">
+			<view :style="[MobileRight]">
+				<view v-show="!isSlot">
+					<view class="goodsList hflex acenter jbetween" v-for="(it,index) in goods">
+						<image :src="it.img" style="width: 144rpx;height: 144rpx;border-radius: 16rpx;" mode="aspectFill"></image>
+						<view class="goodsDesc">
+							<text class="goods_text">{{it.label}}</text>
+							<!-- <view class="hot">月销量{{it.hot}}</view> -->
+							<view class="hflex acenter jbetween">
+								<view class="price">￥{{it.price}}元</view>
+								<image src="/static/images/shop/add-cart.png" style="width: 44rpx;height: 44rpx;"></image>
+							</view>
+							<!-- <view class="type" @tap="onClick(it)">选规格</view> -->
+						</view>
+					</view>
+				</view>
+				<view v-show="isSlot">
+					<slot name="list"></slot>
+				</view>
+				<!-- <view :style="[foot]"></view> -->
+			</view>
+		</scroll-view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		props:{
+			menuLists:{
+				type:[Array,Number,Object],
+				default:[]
+			},
+			bottomSize:{
+				type:String,
+				default:'0rpx'
+			},
+			isSlot:{
+				type:Boolean,
+				default:false
+			},
+			isNav:{
+				type:Boolean,
+				default:false
+			}
+		},
+		data() {
+			return {
+				menuIndex: 0,
+				goods:[],
+				height:'',
+				title:''
+			}
+		},
+		created() {
+			//设置手机的高度
+			var me = this
+			uni.getSystemInfo({
+			    success: function (res) {
+					me.height = res.windowHeight
+			    }
+			});
+			if(this.menuLists == []){
+				
+			}
+			this.goods = this.menuLists[0].goods
+		},
+		mounted() {
+
+		},
+		computed:{
+			// 右侧产品样式
+			MobileRight(){
+				let style = {}
+				// style.position = 'fixed'
+				// style.right = '0rpx'
+				style.width = '520rpx'
+				style.height = this.height +'px'
+				style.right = "3rpx"
+				style.backgroundColor = '#FFFFFF'
+				style.overflow = 'auto'
+				return style
+			},
+			//左侧菜单样式
+			MobileLeft(){
+				let style = {}
+				// style.position = 'fixed'
+				// style.left = '0rpx'
+				style.width = '230rpx'
+				style.height = this.height +'px'
+				style.backgroundColor = '#f3f4f6'
+				style.overflow = 'auto'
+				return style
+			},
+			// 产品图片样式
+			ImgStyle(){
+				let style = {}
+				style.width = this.imgSize
+				style.height = this.imgSize
+				style.marginTop = '10rpx'
+				return style
+			},
+			//底部距离
+			foot(){
+				let style = {}
+				style.width = '100%'
+				style.float = 'left'
+				style.height = this.bottomSize
+				return style
+			}
+		},
+		methods: {
+			// 菜单选择
+			selectMenu(index,data){
+				this.menuIndex = index
+				this.goods = this.menuLists[index].goods
+				this.title = this.menuLists[index].title
+				this.$emit('listenMenu',data);
+			},
+			// 点击规格
+			onClick(e) {
+				this.$emit('listenEvent',e);
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.menuList{
+		text-align: center;
+		padding: 20rpx 10rpx;
+		font-size: 30rpx;
+	}
+	.menuListSelect{
+		text-align: center;
+		background-color: #FFFFFF;
+		padding: 30rpx 0rpx;
+		font-size: 32rpx;
+		font-weight: bold;
+	}
+	.goodsList{
+		float: left;
+		border-bottom: 1rpx solid #f3f4f6;
+		padding: 10rpx;
+		text{
+			font-weight: bold;
+			font-size: 32rpx;
+		}
+	}
+	.title{
+		font-weight: bold;
+		font-size: 32rpx;
+		padding: 10rpx;
+	}
+	.hot{
+		color: red;
+		margin-top: 10rpx;
+		font-size: 26rpx;
+	}
+	.price{
+		margin-top: 10rpx;
+		font-size: 28rpx;
+		font-weight: bold;
+		color: #FF2626;
+	}
+	.type{
+		margin-left: 180rpx;
+		width: 105rpx;
+		display:inline-block;
+		margin-bottom: 10rpx;
+		background-color: #dd6161;
+		padding: 5rpx 10rpx;
+		border-radius: 10rpx;
+		color: #FFFFFF;
+		text-align: center;
+		font-size: 26rpx;
+	}
+	.goodsDesc{
+		width: calc(100% - 164rpx);
+		margin-left: 25rpx;
+		float: right;
+	}
+	.goods_text {
+		font-size: 28rpx;
+		font-weight: 500;
+		color: #222222;
+		line-height: 40rpx;
+		text-overflow: ellipsis;
+		overflow: hidden;
+		display: -webkit-box;
+		-webkit-box-orient: vertical;
+		box-orient: vertical;
+		line-clamp: 2;
+		-webkit-line-clamp: 2;
+		margin-bottom: 16rpx;
+	}
+</style>

components/my-order/my-order.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="my-order">
-		<view class="top hflex acenter jbetween">
+		<view class="top hflex acenter jbetween" @click="toDetail(order_no)">
 			<view class="order_no">订单号：{{order_no}}</view>
 			<view class="type" v-if="type == 0">未报价</view>
 			<view class="type1" v-if="type == 1">已报价</view>
@@ -8,7 +8,7 @@
 		</view>
 		<block v-if="order_type !== '5'">
 			<block v-for="(item,index) in good" :key="index">
-				<view class="box">
+				<view class="box"  @click="toDetail(order_no)">
 					<view class="text_style1">{{item.name}}</view>
 					<view class="box_norm hflex acenter" >
 						<view class="text_style2">规格：{{item.norm}}kg/桶</view>
@@ -19,7 +19,7 @@
 			</block>
 			<view class="bottom hflex acenter jbetween">
 				<view class="offer">订单报价：<span style="font-size: 32rpx;color: #222;">{{offer}}</span></view>
-				<view class="btn">查看详情</view>
+				<view class="btn" @click="toOffer(order_no)">查看详情</view>
 			</view>
 		</block>
 		<block v-else>
@@ -89,6 +89,15 @@
 			return {
 				
 			}
+		},
+		methods: {
+			// 订单详情
+			toDetail(order_no) {
+				this.$emit('toDetail', order_no)
+			},
+			toOffer(order_no) {
+				this.$emit('toOffer', order_no)
+			}
 		}
 	}
 </script>

components/order-top/order-top.vue

@@ -0,0 +1,89 @@
+<template>
+	<view class="order-top">
+		<view class="hflex acenter jbetween">
+			<view class="title">客户信息</view>
+			<view class="type1" v-if="type == 0">未报价</view>
+			<view class="type1 type2" v-if="type == 1">已报价</view>
+			<view class="type1 type3" v-if="type == 2">已匹配</view>
+		</view>
+		<view class="hflex acenter cell">
+			<view class="left">联系人：</view>
+			<view class="right">{{name}}</view>
+		</view>
+		<view class="hflex acenter">
+			<view class="left">手机号：</view>
+			<view class="right">{{phone}}</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name:"order-top",
+		props: {
+			name: {
+				type: String,
+				value: '' 
+			},
+			phone: {
+				type: String,
+				value: '' 
+			},
+			type: {
+				type: String,
+				value: '' 
+			},
+		},
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.order-top {
+		width: 690rpx;
+		background: #FFFFFF;
+		border-radius: 24rpx;
+		box-sizing: border-box;
+		padding: 24rpx 20rpx;
+		.title {
+			font-size: 30rpx;
+			font-weight: 500;
+			color: #222222;
+		}
+		.cell {
+			margin: 16rpx 0 24rpx;
+		}
+		.type1 {
+			width: 96rpx;
+			height: 40rpx;
+			background: #FFF4E8;
+			border-radius: 4rpx;
+			text-align: center;
+			line-height: 40rpx;
+			font-size: 22rpx;
+			font-weight: 400;
+			color: #FBA94E;
+		}
+		.type2 {
+			background: #E7EBF7;
+			color: #506DFF;
+		}
+		.type3 {
+			background: #E6F7E8;
+			color: #4AB256;
+		}
+		.left {
+			font-size: 26rpx;
+			font-weight: 400;
+			color: #222222;
+		}
+		.right {
+			font-size: 26rpx;
+			font-weight: 400;
+			color: #888888;
+		}
+	}
+</style>

page_index/pages/bidding/bidDetail.vue

@@ -0,0 +1,270 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="name">{{pageData.name}}</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="hflex acenter">
+					<view class="type">{{pageData.type}}</view>
+					<view class="city">{{pageData.city}}</view>
+				</view>
+				<view class="text_style1">{{pageData.date}}发布</view>
+			</view>
+			<view class="info_bg">
+				<view class="info_title cell">招标方信息</view>
+				<view class="hflex acenter cell">
+					<view class="label">公司名称</view>
+					<view class="text_style2">{{pageData.bid_inviter.company_name}}</view>
+				</view>
+				<view class="hflex acenter cell">
+					<view class="label">联系人</view>
+					<view class="text_style2">{{pageData.bid_inviter.linkUser}}</view>
+					<view class="blue">{{pageData.bid_inviter.phone}}</view>
+				</view>
+				<view class="hflex acenter cell">
+					<view class="label">披露时间</view>
+					<view class="text_style2">{{pageData.bid_inviter.disclosure_time}}</view>
+				</view>
+			</view>
+			<view class="info_bg" v-if="pageData.bid_winner.company_name != ''">
+				<view class="info_title2 cell">中标方信息</view>
+				<view class="hflex acenter cell">
+					<view class="label">公司名称</view>
+					<view class="text_style2">{{pageData.bid_winner.company_name}}</view>
+				</view>
+				<view class="hflex acenter cell">
+					<view class="label">联系人</view>
+					<view class="text_style2">{{pageData.bid_winner.linkUser}}</view>
+					<view class="blue">{{pageData.bid_winner.phone}}</view>
+				</view>
+			</view>
+		</view>
+		<view class="box" style="margin-bottom: 186rpx;">
+			<view class="box_title">招标简述</view>
+			<scroll-view :scroll-y="true" class="text">
+				<view>{{pageData.sketch}}</view>
+			</scroll-view>
+			<view class="hflex acenter cell">
+				<view class="text2">附件：</view>
+				<u-icon name="attach" color="#cacaca" size="14"></u-icon>
+				<view class="blue">{{pageData.enclosure[0].name}}</view>
+				<image src="/static/images/comment/down.png" class="down_img"></image>
+			</view>
+		</view>
+		<view class="bottom">
+			<view class="bottom_btn" @click="share">分享</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageData: {
+					name: '中国石油化工股份有限公司胜利油田分公司2022年胜利油田海洋采油厂291520船用变压器框架协议公开招标22914278船用变压器招标公告',
+					type: '工程招标类',
+					city: '广东 珠海',
+					date: '2022-07-23',
+					bid_inviter: {
+						company_name: '黑龙江丰益招投标有限公司',
+						linkUser: '江寒',
+						phone: '19898121291',
+						disclosure_time: '2022-09-23'
+					},
+					bid_winner: {
+						company_name: '辽宁省通辽市金顺建筑机械有限公司',
+						linkUser: '王晓斌',
+						phone: '19898121291',
+					},
+					sketch: '',
+					enclosure: [
+						{
+							name: '在发展中扎实推动共同富裕.doc'
+						}
+					]
+				}
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F5F5F5;
+		.box {
+			width: 100%;
+			box-sizing: border-box;
+			padding: 16rpx 30rpx;
+			background: #FFFFFF;
+			margin: 0 0 20rpx;
+			.name {
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 44rpx;
+			}
+			.cell {
+				padding: 10rpx 0;
+			}
+			.type {
+				background: #F0F8F3;
+				border-radius: 4rpx;
+				box-sizing: border-box;
+				padding: 4rpx 16rpx;
+				font-size: 22rpx;
+				font-weight: 400;
+				color: #46A95C;
+				line-height: 32rpx;
+			}
+			.city {
+				background: #F4F8FB;
+				border-radius: 4rpx;
+				box-sizing: border-box;
+				padding: 4rpx 16rpx;
+				font-size: 22rpx;
+				font-weight: 400;
+				color: #506DFF;
+				line-height: 32rpx;
+				margin-left: 20rpx;
+			}
+			.text_style1 {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #666666;
+				line-height: 28rpx;
+			}
+			.info_bg {
+				margin: 20rpx 0;
+				background: #F4F8FB;
+				border-radius: 8rpx;
+				box-sizing: border-box;
+				padding: 20rpx;
+				.info_title {
+					font-size: 24rpx;
+					font-weight: 500;
+					color: #FF9C27;
+					line-height: 34rpx;
+					position: relative;
+					padding-left: 24rpx;
+				}
+				.info_title::before {
+					content: '';
+					position: absolute;
+					width: 12rpx;
+					height: 12rpx;
+					top: 21rpx;
+					left: 0;
+					background: #FF9C27;
+				}
+				.info_title2 {
+					font-size: 24rpx;
+					font-weight: 500;
+					color: #506DFF;
+					line-height: 34rpx;
+					position: relative;
+					padding-left: 24rpx;
+				}
+				.info_title2::before {
+					content: '';
+					position: absolute;
+					width: 12rpx;
+					height: 12rpx;
+					top: 21rpx;
+					left: 0;
+					background: #506DFF;
+				}
+				.label {
+					width: 136rpx;
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #9BA3AF;
+					line-height: 34rpx;
+				}
+				.text_style2 {
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #3D4249;
+					line-height: 34rpx;
+				}
+				
+			}
+			.blue {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #506DFF;
+				line-height: 28rpx;
+				padding-left: 20rpx;
+			}
+			.box_title {
+				font-size: 30rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 42rpx;
+				position: relative;
+			}
+			.box_title::after {
+				content: "";
+				position: absolute;
+				bottom: 0;
+				left: 0;
+				width: 100rpx;
+				height: 12rpx;
+				background: linear-gradient(270deg, rgba(255,255,255,0) 0%, #506DFF 100%);
+				border-radius: 8rpx;
+				opacity: 0.8;
+			}
+			.text {
+				width: 100%;
+				margin: 28rpx 0;
+				height: 760rpx;
+				border: 1px solid #C6C6C6;
+				box-sizing: border-box;
+				padding: 20rpx;
+				font-size: 24rpx;
+				color: #222;
+				line-height: 30rpx;
+			}
+			.text2 {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #686868;
+				line-height: 36rpx;
+			}
+			.down_img {
+				width: 36rpx;
+				height: 36rpx;
+				padding-left: 16rpx;
+			}
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 40rpx 74rpx;
+			.bottom_btn {
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			
+		}
+	}
+</style>

page_index/pages/bidding/bidding.vue

@@ -0,0 +1,237 @@
+<template>
+	<view class="content">
+		<view class="navbar">
+			<u-navbar title="招标" @leftClick="leftClick" bgColor="rgba(0,0,0,0)" :placeholder="true" :autoBack="true">
+			</u-navbar>
+			<view class="search">
+				<u-input v-model="serach_value" type="text" :border="true" placeholder="热搜关键词" shape="circle"
+					prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399">
+					<template slot="suffix">
+						<view>搜索</view>
+					</template>
+				</u-input>
+			</view>
+		</view>
+		<view class="box">
+			<view class="hflex acenter jbetween">
+				<view class="hflex acenter jbetween tabs">
+					<block v-for="(item,index) in tabs" :key="index">
+						<view class="tabs_item hflex acenter" @click="changeTab(item.index)" :class="tab_active == item.index ? 'tab_active' : ''">
+							{{item.name}}
+							<block v-if="index != 0">
+								<u-icon name="arrow-down-fill" color="#666666" size="6" v-if="tab_active != item.index"></u-icon>
+								<u-icon name="arrow-up-fill" color="#506DFF" size="6" v-if="tab_active == item.index"></u-icon>
+							</block>
+						</view>
+					</block>
+				</view>
+				<view class="hflex acenter " @click="screen">
+					<view class="tabs_item" :class="screen_show? 'tab_active' : ''">筛选</view>
+					<image src="/static/images/comment/screen.png" class="screen_icon" v-show="!screen_show"></image>
+					<image src="/static/images/comment/screen_active.png" class="screen_icon" v-show="screen_show"></image>
+				</view>
+			</view>
+			<view class="list">
+				<block v-for="(item,index) in pageList" :key="index">
+					<view class="list_item" @click="toDetail(item.id)">
+						<view class="top">
+							<image src="/static/images/comment/bid-icon2.png" v-if="item.type == 0" class="top_icon"></image>
+							<image src="/static/images/comment/bid-icon1.png" v-if="item.type == 1" class="top_icon"></image>
+							<view class="item_name">{{item.name}}</view>
+						</view>
+						<view class="hflex acenter cell">
+							<image src="/static/images/comment/company.png" class="item_icon"></image>
+							<view class="text_style1">招标单位</view>
+							<view class="text_style1">{{item.company}}</view>
+						</view>
+						<view class="hflex acenter cell">
+							<u-icon name="clock-fill" color="#888888" size="14"></u-icon>
+							<view class="text_style1">发布时间</view>
+							<view class="text_style1">{{item.date}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				serach_value: '',
+				tabs: [
+					{
+						index: 0,
+						name: '默认',
+					},
+					{
+						index: 1,
+						name: '披露起始时间',
+					},
+					{
+						index: 2,
+						name: '披露截止时间',
+					}
+				],
+				tab_active: 0,
+				screen_show: false,
+				pageList: [
+					{
+						id: 1,
+						type: 0,
+						name: '珠海兴业绿色建筑科技有限公司2022年密封胶材料供应商年度框架招标项目',
+						company: '中铁大桥局第七工程有限公司',
+						date: '2022-07-12',
+					},
+					{
+						id: 1,
+						type: 1,
+						name: '珠海兴业绿色建筑科技有限公司2022年密封胶材料供应商年度框架招标项目',
+						company: '中铁大桥局第七工程有限公司',
+						date: '2022-07-12',
+					},
+					{
+						id: 1,
+						type: 0,
+						name: '珠海兴业绿色建筑科技有限公司2022年密封胶材料供应商年度框架招标项目',
+						company: '中铁大桥局第七工程有限公司',
+						date: '2022-07-12',
+					},
+					
+				]
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 返回
+			leftClick() {
+				$api.jump(-1)
+			},
+			// 切换tabs
+			changeTab(index) {
+				that.tab_active = index
+			},
+			// 筛选
+			screen() {
+				that.screen_show = !that.screen_show
+			},
+			// 查看详情
+			toDetail(id) {
+				$api.jump('/page_index/pages/bidding/bidDetail?id=' + id)
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background-color: #e8eff5;
+		.navbar {
+			
+			.search {
+				// background: #fff;
+				width: 100%;
+				height: 88rpx;
+				box-sizing: border-box;
+				padding: 12rpx 30rpx;
+				.u-input {
+					background-color: #fff;
+					height: 64rpx;
+					padding: 0 0 0 18rpx !important;
+					border: 1rpx solid #506Dff;
+					margin-bottom: 12rpx;
+				}
+				.u-input__content__subfix-icon {
+					width: 128rpx;
+					height: 64rpx;
+					background-color: #506Dff;
+					border-radius: 32rpx;
+					color: #fff;
+					font-size: 28rpx;
+					text-align: center;
+					line-height: 64rpx;
+				}
+			}
+		}
+		.box {
+			margin-top: 24rpx;
+			width: 100%;
+			min-height: calc(100vh - 296rpx);
+			background: linear-gradient(180deg, #FFFFFF 0%, #F5F5F5 100%);
+			border-radius: 40rpx 40rpx 0px 0px;
+			box-sizing: border-box;
+			padding: 30rpx;
+			.tabs {
+				width: 526rpx;
+			}
+			.tabs_item {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #666666;
+				line-height: 36rpx;
+				padding-right: 8rpx;
+				.u-icon{
+					padding-left: 8rpx;
+				}
+			}
+			.tab_active {
+				color: #506DFF;
+			}
+			.screen_icon {
+				width: 24rpx;
+				height: 24rpx;
+			}
+			.list {
+				margin-bottom: 60rpx;
+				.list_item {
+					margin: 20rpx auto 0;
+					width: 690rpx;
+					background: #FFFFFF;
+					border-radius: 10px;
+					box-sizing: border-box;
+					padding: 20rpx;
+					.cell {
+						padding: 12rpx 0;
+					}
+					.top { 
+						vertical-align:middle;
+						.item_name {
+							// width: calc(100% - 74rpx);
+							font-size: 30rpx;
+							font-weight: 400;
+							color: #222222;
+							// float: right;
+							line-height: 42rpx;
+						}
+						.top_icon {
+							width: 64rpx;
+							height: 28rpx;
+							float: left;
+							margin: 7rpx 10rpx 0 0;
+							
+						}
+					}
+					
+					.text_style1 {
+						font-size: 22rpx;
+						font-weight: 400;
+						color: #585F6A;
+						line-height: 32rpx;
+						padding-left: 12rpx;
+					}
+					.item_icon {
+						width: 28rpx;
+						height: 28rpx;
+					}
+				}
+			}
+		}
+		
+	}
+</style>

page_index/pages/demand/collect.vue

@@ -0,0 +1,137 @@
+<template>
+	<view class="content">
+		<view class="list">
+			<block v-for="(item,index) in pageList" :key="index">
+				<view class="list_item">
+					<view class="hflex acenter jbetween">
+						<view class="item_title">{{item.title}}</view>
+						<view class="item_blue">{{item.salary}}</view>
+					</view>
+					<view class="hflex acenter" style="padding: 20rpx 0 24rpx;">
+						<view class="item_box">{{item.city}}</view>
+						<view class="item_box">{{item.education}}</view>
+						<view class="item_box">{{item.experience}}</view>
+					</view>
+					<view class="item_name">{{item.company_name}}</view>
+					<view class="hflex acenter jbetween" style="padding-top: 16rpx;">
+						<view class="hflex acenter">
+							<image class="item_avatar" :src="item.user.avatar"></image>
+							<view class="user_name">{{item.user.name}}·{{item.user.position}}</view>
+						</view>
+						<view class="user_right">{{item.date}}</view>
+					</view>
+				</view>
+			</block>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageList: [
+					{
+						id: 0,
+						title: '船舶设计师',
+						salary: '13-15K',
+						monthly: '13',
+						city: '北京',
+						education: '本科',
+						experience: '经验不限',
+						company_name: '北京文化旅游产业发展集团有限公司',
+						date: '05月12日',
+						user: {
+							avatar: '/static/images/mine/avatar1.jpg',
+							name: '江女士',
+							position: '行政总监',
+						}
+					},
+					{
+						id: 1,
+						title: '船舶设计师',
+						salary: '13-15K',
+						monthly: '13',
+						city: '北京',
+						education: '本科',
+						experience: '经验不限',
+						company_name: '北京文化旅游产业发展集团有限公司',
+						date: '05月12日',
+						user: {
+							avatar: '/static/images/mine/avatar1.jpg',
+							name: '江女士',
+							position: '行政总监',
+						}
+					}
+				]
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		padding: 0 30rpx;
+		background: #F4F4F4;
+		.list {
+			.list_item {
+				margin-top: 20rpx;
+				width: 100%;
+				background: #FFFFFF;
+				border-radius: 20rpx;
+				box-sizing: border-box;
+				padding: 20rpx;
+				.item_title {
+					font-size: 32rpx;
+					font-weight: 600;
+					color: #222222;
+				}
+				.item_blue {
+					font-size: 32rpx;
+					font-weight: bold;
+					color: #506DFF;
+				}
+				.item_box {
+					height: 40rpx;
+					background: #F0F2F6;
+					border-radius: 2px;
+					box-sizing: border-box;
+					padding: 4rpx 18rpx;
+					font-size: 22rpx;
+					font-weight: 400;
+					color: #444444;
+					margin-right: 20rpx;
+				}
+				.item_name {
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #666666;
+				}
+				.item_avatar {
+					width: 40rpx;
+					height: 40rpx;
+					border-radius: 50%;
+					margin-right: 12rpx;
+				}
+				.user_name {
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #333333;
+				}
+				.user_right {
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #A1A1A1;
+				}
+			}
+		}
+	}
+</style>

page_index/pages/demand/delivery.vue

@@ -0,0 +1,137 @@
+<template>
+	<view class="content">
+		<view class="list">
+			<block v-for="(item,index) in pageList" :key="index">
+				<view class="list_item">
+					<view class="hflex acenter jbetween">
+						<view class="item_title">{{item.title}}</view>
+						<view class="item_blue">{{item.salary}}</view>
+					</view>
+					<view class="hflex acenter" style="padding: 20rpx 0 24rpx;">
+						<view class="item_box">{{item.city}}</view>
+						<view class="item_box">{{item.education}}</view>
+						<view class="item_box">{{item.experience}}</view>
+					</view>
+					<view class="item_name">{{item.company_name}}</view>
+					<view class="hflex acenter jbetween" style="padding-top: 16rpx;">
+						<view class="hflex acenter">
+							<image class="item_avatar" :src="item.user.avatar"></image>
+							<view class="user_name">{{item.user.name}}·{{item.user.position}}</view>
+						</view>
+						<view class="user_right">{{item.date}}</view>
+					</view>
+				</view>
+			</block>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageList: [
+					{
+						id: 0,
+						title: '船舶设计师',
+						salary: '13-15K',
+						monthly: '13',
+						city: '北京',
+						education: '本科',
+						experience: '经验不限',
+						company_name: '北京文化旅游产业发展集团有限公司',
+						date: '05月12日',
+						user: {
+							avatar: '/static/images/mine/avatar1.jpg',
+							name: '江女士',
+							position: '行政总监',
+						}
+					},
+					{
+						id: 1,
+						title: '船舶设计师',
+						salary: '13-15K',
+						monthly: '13',
+						city: '北京',
+						education: '本科',
+						experience: '经验不限',
+						company_name: '北京文化旅游产业发展集团有限公司',
+						date: '05月12日',
+						user: {
+							avatar: '/static/images/mine/avatar1.jpg',
+							name: '江女士',
+							position: '行政总监',
+						}
+					}
+				]
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		padding: 0 30rpx;
+		background: #F4F4F4;
+		.list {
+			.list_item {
+				margin-top: 20rpx;
+				width: 100%;
+				background: #FFFFFF;
+				border-radius: 20rpx;
+				box-sizing: border-box;
+				padding: 20rpx;
+				.item_title {
+					font-size: 32rpx;
+					font-weight: 600;
+					color: #222222;
+				}
+				.item_blue {
+					font-size: 32rpx;
+					font-weight: bold;
+					color: #506DFF;
+				}
+				.item_box {
+					height: 40rpx;
+					background: #F0F2F6;
+					border-radius: 2px;
+					box-sizing: border-box;
+					padding: 4rpx 18rpx;
+					font-size: 22rpx;
+					font-weight: 400;
+					color: #444444;
+					margin-right: 20rpx;
+				}
+				.item_name {
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #666666;
+				}
+				.item_avatar {
+					width: 40rpx;
+					height: 40rpx;
+					border-radius: 50%;
+					margin-right: 12rpx;
+				}
+				.user_name {
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #333333;
+				}
+				.user_right {
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #A1A1A1;
+				}
+			}
+		}
+	}
+</style>

page_index/pages/demand/demand.vue

@@ -0,0 +1,606 @@
+<template>
+	<view class="content">
+		<view class="search">
+			<u-input v-model="serach_value" type="text" :border="true" placeholder="热搜榜单" shape="circle"
+				prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399">
+				<template slot="suffix">
+					<view>搜索</view>
+				</template>
+			</u-input>
+		</view>
+		<view class="box hflex acenter jbetween">
+			<block v-for="(item,index) in tabs" :key="index">
+				<view class="vflex acenter jcenter" @click="toTab(item.url)">
+					<image :src="item.src" class="tab_img"></image>
+					<view class="tab_text">{{item.text}}</view>
+				</view>
+			</block>
+		</view>
+		<view class="box1">
+			<view class="hflex acenter jbetween box1_top">
+				<view class="hflex acenter">
+					<block v-for="(item,index) in tabs2" :key="index">
+						<view class="tabs_item" :class="tab_active == item.id? 'tabs_active' : ''" @click="changeTab(item.id)">{{item.text}}</view>
+					</block>
+				</view>
+				<view class="screen hflex acenter jcenter" @click="open">
+					<view class="screen_text">筛选</view>
+					<u-icon name="arrow-down-fill" color="#666666" size="6"></u-icon>
+				</view>
+			</view>
+			<view class="list" v-if="tab_active == 0">
+				<block v-for="(item,index) in pageList" :key="index">
+					<view class="list_item">
+						<view class="hflex acenter jbetween">
+							<view class="item_title">{{item.title}}</view>
+							<view class="item_blue">{{item.salary}}·{{item.monthly}}薪</view>
+						</view>
+						<view class="hflex acenter" style="padding: 20rpx 0 24rpx;">
+							<view class="item_box">{{item.city}}</view>
+							<view class="item_box">{{item.education}}</view>
+							<view class="item_box">{{item.experience}}</view>
+						</view>
+						<view class="item_name">{{item.company_name}}</view>
+						<view class="hflex acenter jbetween" style="padding-top: 16rpx;">
+							<view class="hflex acenter">
+								<image class="item_avatar" :src="item.user.avatar"></image>
+								<view class="user_name">{{item.user.position}}·{{item.user.name}}</view>
+							</view>
+							<view class="user_right">{{item.user.city}}·{{item.user.area}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+			<view class="list" v-if="tab_active == 1">
+				<block v-for="(item,index) in pageList" :key="index">
+					<view class="list_item hflex jbetween">
+						<view class="hflex">
+							<image class="item_avatar1" :src="item.avatar"></image>
+							<view class="item_right1 vflex">
+								<u--text class="item_title" mode="name" :text="item.name" format="encrypt"></u--text>
+								<view class="hflex acenter">
+									<view class="text_style1">{{item.city}}</view>
+									<view style="padding: 0 8rpx;">|</view>
+									<view class="text_style1">{{item.age}}</view>
+									<view style="padding: 0 8rpx;">|</view>
+									<view class="text_style1">{{item.year}}</view>
+									<view style="padding: 0 8rpx;">|</view>
+									<view class="text_style1">{{item.education}}</view>
+								</view>
+								<view class="item_box1 hflex acenter">应聘岗位<view style="padding: 0 8rpx;">|</view>{{item.postion}}</view>
+							</view>
+						</view>
+						<view class="item_btn1">打招呼</view>
+					</view>
+				</block>
+			</view>
+		</view>
+		<u-popup :show="show" mode="bottom" :round="20" :closeable="true" @close="close" @open="open">
+			<view class="popup">
+				<view class="popup_title">筛选</view>
+				<view class="popup_label">薪资待遇<span class="subtitle">(单选)</span></view>
+				<view class="hflex acenter fwrap">
+					<block v-for="(item,index) in salaryList" :key="index">
+						<view class="popup_box" :class="index == salary_active ? 'box_active' : ''" @click="changgeSalary(index)">{{item.value}}</view>
+					</block>
+				</view>
+				<view class="popup_label">学历要求</view>
+				<view class="hflex acenter fwrap">
+					<block v-for="(item,index) in educationList" :key="index">
+						<view class="popup_box" :class="item.id == education_active ? 'box_active' : ''" @click="changgeEdu(item.id)">{{item.value}}</view>
+					</block>
+				</view>
+				<view class="popup_bottom hflex acenter jbetween">
+					<view class="reset_btn" @click="reset">重置</view>
+					<view class="reset_btn confirm_btn" @click="confirm">确认</view>
+				</view>
+			</view>
+		</u-popup>
+		<u-modal :show="first_show" :closeOnClickOverlay="true" :showConfirmButton="false">
+			<view class="popup1">
+				<view class="popup1_title">Hello</view>
+				<view class="popup1_subtitle">欢迎进入此页</view>
+				<view class="popup1_line"></view>
+				<view class="popup1_text">此项内容<span style="color: #516EFF;">{{is_free}}</span>使用</view>
+				<view class="popup1_btn" @click="close">我知道了</view>
+			</view>
+		</u-modal>
+		
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				serach_value: '',
+				tabs: [
+					{
+						url: '/page_index/pages/demand/publish',
+						src: '/static/images/index/demand/tab1.png',
+						text: '发布应聘',
+					},
+					{
+						url: '/page_index/pages/demand/delivery',
+						src: '/static/images/index/demand/tab2.png',
+						text: '投递记录',
+					},
+					{
+						url: '/page_index/pages/demand/collect',
+						src: '/static/images/index/demand/tab3.png',
+						text: '我的收藏',
+					}
+				],
+				tabs2: [
+					{
+						id: 0,
+						text: '招聘信息'
+					},
+					{
+						id: 1,
+						text: '应聘信息'
+					}
+				], 
+				tab_active: 0,
+				pageList: [
+					{
+						id: 0,
+						title: '船舶设计师',
+						salary: '13-15K',
+						monthly: '13',
+						city: '北京',
+						education: '本科',
+						experience: '经验不限',
+						company_name: '北京文化旅游产业发展集团有限公司',
+						user: {
+							avatar: '/static/images/mine/avatar1.jpg',
+							name: '江女士',
+							position: '行政总监',
+							city: '北京市',
+							area: '东城区',
+						},
+						avatar: '/static/images/mine/avatar1.jpg',
+						name: '张三',
+						age: '27',
+						year: '5年',
+						postion: '船舶工程师',
+					},
+					{
+						id: 1,
+						title: '船舶设计师',
+						salary: '13-15K',
+						monthly: '13',
+						city: '北京',
+						education: '本科',
+						experience: '经验不限',
+						company_name: '北京文化旅游产业发展集团有限公司',
+						user: {
+							avatar: '/static/images/mine/avatar2.jpg',
+							name: '江女士',
+							position: '行政总监',
+							city: '北京市',
+							area: '东城区',
+						},
+						avatar: '/static/images/mine/avatar2.jpg',
+						name: '李四',
+						age: '27',
+						year: '5年',
+						postion: '船舶工程师',
+					}
+				],
+				salaryList: [
+					{
+						id: 0,
+						value: '不限'
+					},
+					{
+						id: 1,
+						value: '4k以下'
+					},
+					{
+						id: 2,
+						value: '4k-6k'
+					},
+					{
+						id: 3,
+						value: '6k-8k'
+					},
+					{
+						id: 4,
+						value: '8k-12k'
+					},
+					{
+						id: 5,
+						value: '12k以上'
+					}
+				],
+				educationList: [
+					{
+						id: 0,
+						value: '不限'
+					},
+					{
+						id: 1,
+						value: '初中及以下'
+					},
+					{
+						id: 2,
+						value: '中专/中技'
+					},
+					{
+						id: 3,
+						value: '高中'
+					},
+					{
+						id: 4,
+						value: '大专'
+					},
+					{
+						id: 5,
+						value: '本科'
+					},
+					{
+						id: 6,
+						value: '硕士'
+					},
+					{
+						id: 7,
+						value: '博士'
+					}
+				],
+				show: false,
+				salary_active: -1,
+				education_active: -1,
+				is_first: false,
+				first_show: false,
+				is_free: '免费'
+			}
+		},
+		onLoad() {
+			that = this
+			if(that.is_first) {
+				that.first_show = true
+			}
+		},
+		methods: {
+			// 点击tabs
+			toTab(url) {
+				$api.jump(url)
+			},
+			// 切换tabs
+			changeTab(id) {
+				that.tab_active = id
+			},
+			// 打开弹出层
+			open() {
+				that.show = true
+			},
+			// 关闭弹出层
+			close() {
+				that.first_show = false
+				that.show = false
+			},
+			// 选择薪资待遇
+			changgeSalary(index) {
+				console.log(index);
+				that.salary_active = index
+			},
+			// 选择学历要求
+			changgeEdu(id) {
+				that.education_active = id
+			},
+			
+			// 重置按钮
+			reset() {
+				that.salary_active = -1
+				that.education_active = -1
+			},
+			// 确认按钮
+			confirm() {
+				that.close()
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		position: relative;
+		background: #EEF1F8;
+		padding: 0 30rpx;
+		.search {
+			width: 100%;
+			height: 88rpx;
+			box-sizing: border-box;
+			padding: 12rpx 30rpx;
+			.u-input {
+				background-color: #fff;
+				height: 64rpx;
+				padding: 0 0 0 18rpx !important;
+				border: 1rpx solid #506Dff;
+				margin-bottom: 12rpx;
+			}
+			.u-input__content__subfix-icon {
+				width: 128rpx;
+				height: 64rpx;
+				background-color: #506Dff;
+				border-radius: 32rpx;
+				color: #fff;
+				font-size: 28rpx;
+				text-align: center;
+				line-height: 64rpx;
+			}
+		}
+		.box {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			box-sizing: border-box;
+			padding: 16rpx 60rpx 30rpx;
+			margin-top: 24rpx;
+			.tab_img {
+				width: 84rpx;
+				height: 84rpx;
+				margin-bottom: 8rpx;
+			}
+			.tab_text {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #444444;
+			}
+		}
+		.box1 {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			box-sizing: border-box;
+			padding: 28rpx 20rpx;
+			margin-top: 24rpx;
+			.box1_top {
+				width: 100%;
+				padding-bottom: 12rpx;
+				// border-bottom: 1rpx solid #F4F4F4;
+				.tabs_item {
+					font-size: 32rpx;
+					font-weight: 400;
+					color: #666666;
+					margin-right: 52rpx;
+				}
+				.tabs_active {
+					font-size: 32rpx;
+					font-weight: 500;
+					color: #222222;
+					position: relative;
+				}
+				.tabs_active::before {
+					content: '';
+					position: absolute;
+					width: 88rpx;
+					height: 16rpx;
+					background: linear-gradient(270deg, #FFFFFF 0%, #506DFF 100%);
+					border-radius: 10rpx;
+					bottom: 1rpx;
+					left: 1rpx;
+					opacity: 0.8;
+				}
+				.screen {
+					width: 92rpx;
+					height: 40rpx;
+					background: #F3F3F3;
+					border-radius: 4rpx;
+					.screen_text {
+						font-size: 24rpx;
+						color: #666666;
+						margin-right: 8rpx;
+					}
+				}
+			}
+			.list {
+				width: 100%;
+				.list_item {
+					width: 100%;
+					padding: 28rpx 0 20rpx;
+					border-top: 1rpx solid #F4F4F4;
+					.item_title {
+						font-size: 32rpx;
+						font-weight: 600;
+						color: #222222;
+					}
+					.item_blue {
+						font-size: 32rpx;
+						font-weight: bold;
+						color: #506DFF;
+					}
+					.item_box {
+						height: 40rpx;
+						background: #F0F2F6;
+						border-radius: 2px;
+						box-sizing: border-box;
+						padding: 4rpx 18rpx;
+						font-size: 22rpx;
+						font-weight: 400;
+						color: #444444;
+						margin-right: 20rpx;
+					}
+					.item_name {
+						font-size: 24rpx;
+						font-weight: 400;
+						color: #666666;
+					}
+					.item_avatar {
+						width: 40rpx;
+						height: 40rpx;
+						border-radius: 50%;
+						margin-right: 12rpx;
+					}
+					.item_avatar1 {
+						width: 88rpx;
+						height: 88rpx;
+						border-radius: 50%;
+						margin-right: 20rpx;
+					}
+					.item_right1 {
+						
+					}
+					.text_style1 {
+						font-size: 22rpx;
+						font-weight: 400;
+						color: #666666;
+						padding: 12rpx 0;
+					}
+					.item_box1 {
+						margin-top: 8rpx;
+						background: #EDF0FF;
+						border-radius: 8rpx;
+						box-sizing: border-box;
+						padding: 4rpx 16rpx;
+						font-size: 24rpx;
+						font-weight: 400;
+						color: #506DFF;
+					}
+					.item_btn1 {
+						width: 140rpx;
+						height: 52rpx;
+						background: #F1F3FF;
+						border-radius: 28rpx;
+						font-size: 26rpx;
+						font-weight: 500;
+						color: #506DFF;
+						line-height: 52rpx;
+						text-align: center;
+					}
+					.user_name {
+						font-size: 20rpx;
+						font-weight: 400;
+						color: #333333;
+					}
+					.user_right {
+						font-size: 20rpx;
+						font-weight: 400;
+						color: #A1A1A1;
+					}
+				}
+			}
+		}
+		.popup {
+			width: 100%;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 40rpx;
+			
+			.popup_title {
+				width: 100%;
+				text-align: center;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #222222;
+			}
+			.popup_label {
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #222222;	
+				margin: 36rpx 0 28rpx;
+			}
+			.subtitle {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #919191;
+			}
+			.popup_box {
+				width: 208rpx;
+				height: 76rpx;
+				background: #F2F2F2;
+				border-radius: 4rpx;
+				text-align: center;
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 76rpx;
+				margin: 0 24rpx 20rpx 0;
+			}
+			.popup_box:nth-child(3n) {
+				margin: 0 0 20rpx;
+			}
+			.box_active {
+				background: #F1F6FF;
+				color: #506DFF;
+			}
+			.popup_bottom {
+				margin: 82rpx 0 10rpx;
+				width: 100%;
+				.reset_btn {
+					width: 240rpx;
+					height: 76rpx;
+					background: #F1F6FF;
+					border-radius: 42rpx;
+					font-size: 32rpx;
+					font-weight: 500;
+					color: #506DFF;
+					text-align: center;
+					line-height: 76rpx;
+				}
+				.confirm_btn {
+					width: 400rpx;
+					background: #506DFF;
+					color: #FFFFFF;
+				}
+			}
+		}
+		.popup1 {
+			width: 530rpx;
+			height: 520rpx;
+			border-radius: 40rpx;
+			
+			box-sizing: border-box;
+			padding: 40rpx;
+			.popup1_title {
+				font-size: 48rpx;
+				font-weight: 400;
+				color: #222222;
+			}
+			.popup1_subtitle {
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #222222;
+				margin: 8rpx 0 60rpx;
+			}
+			.popup1_line {
+				width: 52rpx;
+				height: 12rpx;
+				background: #5572FF;
+				border-radius: 6rpx;
+			}
+			.popup1_text {
+				width: 100%;
+				text-align: center;
+				font-size: 40rpx;
+				font-weight: 500;
+				color: #222222;
+				margin: 28rpx 0 52rpx;
+			}
+			.popup1_btn {
+				margin: 0 auto;
+				width: 310rpx;
+				height: 84rpx;
+				background: linear-gradient(90deg, #506DFF 0%, #88A6FF 100%);
+				box-shadow: 0px 4rpx 24rpx 0px rgba(90,119,255,0.36);
+				border-radius: 42rpx;
+				text-align: center;
+				line-height: 84rpx;
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+			}
+		}
+		.u-modal__content {
+			padding: 0 !important;
+		}
+		.u-modal {
+			width: 530rpx !important;
+			background: url('/static/images/comment/eject.png') no-repeat;
+			background-size: 100%;
+		}
+	}
+</style>

page_index/pages/demand/perfect.vue

@@ -0,0 +1,555 @@
+<template>
+	<view class="content vflex jbetween">
+		<view >
+			<view class="box" v-show="index == '1'">
+				<view class="hflex acenter jbetween cell">
+					<view class="label">头像</view>
+					<u-avatar :src="base_info.avatar" @click="uploadAvatar"></u-avatar>
+				</view>
+				<view class="cell">
+					<view class="label">真实姓名</view>
+					<u-input v-model="base_info.real_name" border="none" placeholder="请填写你的真实姓名"></u-input>
+				</view>
+				<view class="cell">
+					<view class="label">性别</view>
+					<view class="hflex">
+						<view v-for="(item,index) in sexList" :key="index" style="padding-right: 52rpx;">
+							<radio :value="item.value" :checked="base_info.sex == item.value?true:false" color="#506dff" @click="selectSex(item.value)" />{{item.name}}
+						</view>
+					</view>
+				</view>
+				<view class="cell">
+					<view class="label">出生年月</view>
+					<view @click="open('birthday')">
+						<u-input v-model="base_info.birthday" border="none" placeholder="请选择你的出生年月" suffixIcon="arrow-right"></u-input>
+					</view>
+					<u-datetime-picker :minDate="minDate" title="生日" :show="birthday_show" v-model="newDate" ref="datetimePicker" @confirm="confirmAge" @cancel="cancel" :formatter="formatter" mode="date"></u-datetime-picker>
+				</view>
+				<view class="cell">
+					<view class="label">学历</view>
+					<view @click="open('education')">
+						<u-input v-model="base_info.education" border="none" placeholder="如:本科" suffixIcon="arrow-right"></u-input>
+					</view>
+					<u-picker title="学历" :show="education_show" :columns="educationList" ref="uPicker" @confirm="confirmEdu" @change="changeHandler" @cancel="cancel" ></u-picker>
+				</view>
+				<view class="cell">
+					<view class="label">参加工作时间</view>
+					<view @click="open('work_date')">
+						<u-input v-model="base_info.work_date" border="none" placeholder="请选择参加工作的时间" suffixIcon="arrow-right"></u-input>
+					</view>
+					<u-datetime-picker :minDate="minDate" title="参加工作时间" :show="work_show" v-model="newDate" ref="datetimePicker" @confirm="confirmWork" @cancel="cancel" :formatter="formatter" mode="year-month"></u-datetime-picker>
+				</view>
+				<view class="cell">
+					<view class="label">手机号码</view>
+					<u-input v-model="base_info.phone" border="none" placeholder="请填写你的手机号码"></u-input>
+				</view>
+				<view class="cell">
+					<view class="label">邮箱</view>
+					<u-input v-model="base_info.email" border="none" placeholder="用于接收面试邮件"></u-input>
+				</view>
+			</view>
+			<view class="box" v-if="index == '2'">
+				<view class="cell">
+					<view class="label">应聘岗位</view>
+					<u-input v-model="job_inte.post" border="none" placeholder="请填写你应聘的岗位"></u-input>
+				</view>
+				<view class="cell">
+					<view class="label">可工作地区范围</view>
+					<u-input v-model="job_inte.work_address" border="none" placeholder="请填写工作地区范围"></u-input>
+				</view>
+				<view class="cell">
+					<view class="label">期望薪资</view>
+					<view @click="open('salary')">
+						<u-input v-model="job_inte.salary" border="none" placeholder="请选择期望薪资" suffixIcon="arrow-right"></u-input>
+					</view>
+					<u-picker :show="salary_show" title="期望薪资" ref="uPicker" :columns="salaryList" @confirm="confirmSalary" @cancel="cancel"></u-picker>
+				</view>
+				<view class="cell">
+					<view class="label">可工作时间</view>
+					<u-input v-model="job_inte.work_time" border="none" placeholder="请输入工作时间比如12小时/天"></u-input>
+				</view>
+				<view class="cell">
+					<view class="label">工作性质</view>
+					<view @click="open('work_nature')">
+						<u-input v-model="job_inte.work_nature" border="none" placeholder="请选择用工性质" suffixIcon="arrow-right"></u-input>
+					</view>
+					<u-picker :show="nature_show" title="工作性质" ref="uPicker" :columns="natureList" @confirm="confirmNature" @cancel="cancel"></u-picker>
+				</view>
+			</view>
+			<view class="box" v-if="index == '3'">
+				<view class="cell">
+					<view class="label">公司名称</view>
+					<u-input v-model="experience.company_name" border="none" placeholder="请输入"></u-input>
+				</view>
+				<view class="cell">
+					<view class="label">职位名称</view>
+					<u-input v-model="experience.company_position" border="none" placeholder="请输入"></u-input>
+				</view>
+				<view class="cell">
+					<view class="label">在职时间</view>
+					<view class="hflex acenter jbetween">
+						<view @click="open('time1')">
+							<u-input v-model="experience.company_time1" border="none" placeholder="入职时间"></u-input>
+						</view>
+						<u-datetime-picker :minDate="minDate" title="入职时间" :show="show_time1" v-model="newDate" ref="datetimePicker" @confirm="confirmTime1" @cancel="cancel" :formatter="formatter" mode="year-month"></u-datetime-picker>
+						<view style="margin: 0 20rpx;">-</view>
+						<view @click="open('time2')">
+							<u-input v-model="experience.company_time2" border="none" placeholder="离职时间"></u-input>
+						</view>
+						<u-datetime-picker :minDate="minDate" title="离职时间" :show="show_time2" v-model="newDate" ref="datetimePicker" @confirm="confirmTime2" @cancel="cancel" :formatter="formatter" mode="year-month"></u-datetime-picker>
+					</view>
+				</view>
+				<view class="cell">
+					<view class="label">工作内容</view>
+					<u-input v-model="experience.company_content" border="none" placeholder="请详细描述你在公司的主要工作内容以及…" suffixIcon="arrow-right"></u-input>
+				</view>
+			</view>
+			<view class="box" v-if="index == '4'">
+				<view class="cell">
+					<view class="label">技能名称</view>
+					<u-input v-model="skills.skills_name" border="none" placeholder="掌握的技能名称"></u-input>
+				</view>
+				<view class="cell">
+					<view class="label">掌握程度</view>
+					<view @click="open('skills_degree')">
+						<u-input v-model="skills.skills_degree" border="none" placeholder="如:精通" suffixIcon="arrow-right"></u-input>
+					</view>
+					<u-picker :show="degree_show" title="掌握程度" ref="uPicker" :columns="degreeList" @confirm="confirmSkill" @cancel="cancel"></u-picker>
+				</view>	
+			</view>
+			<view class="box" v-if="index == '5'">
+				<view class="cell">
+					<view class="label">证书名称</view>
+					<u-input v-model="certificate.certificate_name" border="none" placeholder="获得的证书名称"></u-input>
+				</view>
+				<view class="cell">
+					<view class="label">获得时间</view>
+					<view @click="open('certificate_date')">
+						<u-input v-model="certificate.certificate_date" border="none" placeholder="年/月" suffixIcon="arrow-right"></u-input>
+					</view>
+					<u-datetime-picker :minDate="minDate" title="获得时间" :show="certificate_show" v-model="newDate" ref="datetimePicker" @confirm="confirmDate" @cancel="cancel" :formatter="formatter" mode="year-month"></u-datetime-picker>
+				</view>
+				<view class="cell">
+					<view class="hflex acenter">
+						<view class="label">上传图片</view>
+						<view class="hflex acenter" style="padding-bottom: 20rpx;">
+							<u-icon name="info-circle-fill" color="#FFA446" size="10"></u-icon>
+							<view class="label2">只能上传一张</view>
+						</view>
+					</view>
+					<view class="upload vflex acenter jcenter" @click="uploadImg" v-if="certificate.certificate_img == ''">
+						<u-icon name="plus" color="#CACACA" size="25"></u-icon>
+						<view class="text_style1">添加图片</view>
+					</view>
+					<view v-else>
+						<image :src="certificate.certificate_img" class="upload"></image>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="save" @click="save">保存</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				index: '0',
+				base_info: {
+					avatar: '',
+					real_name: '',
+					sex: '',
+					birthday: '',
+					work_date: '',
+					phone: '',
+					email: '',
+					education: '',
+				},
+				educationList: [
+					['小学','初中','高中','本科','硕士']
+				],
+				educationList2: [
+					['统招','非统招']
+				],
+				sexList: [
+					{
+						value: '0',
+						name: '男',
+					},
+					{
+						value: '1',
+						name: '女'
+					}
+				],
+				job_inte: {
+					post: '',
+					work_address: '',
+					salary: '',
+					work_time: '',
+					work_nature: '',
+				},
+				salaryList: [
+					['1k','2k','3k','4k','5k','6k','7k','8k'],
+					['3k','4k','5k','6k','7k','8k','9k','10k']
+				],
+				natureList: [
+					['兼职','全职']
+				],
+				experience: {
+					company_name: '',
+					company_position: '',
+					company_time1: '',
+					company_time2: '',
+					company_content: '',
+				},
+				certificate: {
+					certificate_name: '',
+					certificate_date: '',
+					certificate_img: [],
+				},
+				skills: {
+					skills_name: '',
+					skills_degree:'',
+				},
+				degreeList: [
+					['熟悉','掌握','精通']
+				],
+				salary_show: false,
+				birthday_show: false,
+				work_show: false,
+				nature_show: false,
+				show_time1: false,
+				show_time2: false,
+				degree_show: false,
+				education_show: false,
+				certificate_show: false,
+				newDate: Number(new Date()),
+				minDate: new Date('1980-01-01')
+			}
+		},
+		onLoad(options) {
+			that = this
+			that.index = options.index
+			that.isInfo(options.index)
+			// if(options.id) {
+			// }
+		},
+		onReady() {
+			// 微信小程序需要用此写法
+			this.$refs.datetimePicker.setFormatter(this.formatter)
+		},
+		methods: {
+			// 判断要修改的信息
+			isInfo(index) {
+				var text = ''
+				switch(index) {
+					case '1' : 
+						text = '基本信息';
+						break;
+					case '2' :
+						text = '求职意向';
+						break;
+					case '3' :
+						text = '工作经历';
+						break;
+					case '4' :
+						text = '专业技能';
+						break;
+					case '5' :
+						text = '资质证书';
+						break;
+				}
+				uni.setNavigationBarTitle({
+					title: text
+				})
+			},
+			// 保存
+			save() {
+				if(that.index == '1') {
+					if($api.formCheck(that.base_info.avatar,"required") && $api.formCheck(that.base_info.real_name,"truename") && $api.formCheck(that.base_info.birthday,"required") && $api.formCheck(that.base_info.education,"required")
+					 && $api.formCheck(that.base_info.work_date,"required") && $api.formCheck(that.base_info.phone,"mobile")&& $api.formCheck(that.base_info.email,"email")) {
+						$api.info('保存成功')
+						$api.jump(-1)
+					}
+				}
+				if(that.index == '2') {
+					if($api.formCheck(that.job_inte.post,"required") && $api.formCheck(that.job_inte.work_address,"required") && $api.formCheck(that.job_inte.salary,"required")
+					 && $api.formCheck(that.job_inte.work_time,"required") && $api.formCheck(that.job_inte.work_nature,"required")) {
+						$api.info('保存成功')
+						$api.jump(-1)
+					}
+				}
+				if(that.index == '3') {
+					if($api.formCheck(that.experience.company_name,"required") && $api.formCheck(that.experience.company_position,"required") && $api.formCheck(that.experience.company_time1,"required")
+					 && $api.formCheck(that.experience.company_time2,"required") && $api.formCheck(that.experience.company_content,"required")) {
+						$api.info('保存成功')
+						$api.jump(-1)
+					}
+				}
+				if(that.index == '4') {
+					if($api.formCheck(that.skills.skills_name,"required") && $api.formCheck(that.skills.skills_degree,"required")) {
+						$api.info('保存成功')
+						$api.jump(-1)
+					}
+				}
+				if(that.index == '5') {
+					if($api.formCheck(that.certificate.certificate_name,"required") && $api.formCheck(that.certificate.certificate_date,"required")) {
+						$api.info('保存成功')
+						$api.jump(-1)
+					}
+				}
+				// $api.jump(-1)
+			},
+			// 上传头像
+			uploadAvatar() {
+				uni.chooseImage({
+					count: 1, //默认9
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album'], //从相册选择
+					success: function (res) {
+						console.log(res.tempFilePaths);
+						that.base_info.avatar = res.tempFilePaths[0]
+						/* uni.uploadFile({
+							url: 'http://jxtx.zhousi.hdlkeji.com/api/Publics/uploadLocality',
+							filePath: tempFilePaths[0],
+							name: 'file',
+							formData: {
+								'user': 'test'
+							},
+							success: (res) => {
+								const data = JSON.parse(res.data)
+								if (data.code == 1) {
+									that.user.headimg = data.data.url
+									$api.req({
+										url: '/api/User/edit_user_info',
+										data:{
+											headimg: that.user.headimg,
+										}
+									},function(res) {
+										console.log("修改头像成功");
+									})
+								}
+							}
+						}); */
+					}
+				});
+			},
+			// 上传图书照片
+			uploadImg() {
+				uni.chooseImage({
+					count: 1, //默认9
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album'], //从相册选择
+					success: function (res) {
+						console.log(res.tempFilePaths);
+						that.certificate.certificate_img = res.tempFilePaths[0]
+					},
+				})
+			},
+			// 选择性别
+			selectSex(value) {
+				that.base_info.sex = value
+			},
+			// 打开
+			open(e) {
+				console.log(e);
+				switch(e) {
+					case 'birthday' : 
+						that.birthday_show = true;
+						break;
+					case 'work_date' :
+						that.work_show = true;
+						break;
+					case 'salary' :
+						that.salary_show = true;
+						break;
+					case 'work_nature' :
+						that.nature_show = true;
+						break;
+					case 'time1' :
+						that.show_time1 = true;
+						break;
+					case 'time2' :
+						that.show_time2 = true;
+						break;
+					case 'skills_degree' :
+						that.degree_show = true;
+						break;
+					case 'certificate_date' :
+						that.certificate_show = true;
+						break;
+					case 'education' :
+						that.education_show = true;
+						break;
+				}
+			},
+			// 格式化日期
+			formatter(type, value) {
+				if (type === 'year') {
+					return `${value}年`
+				}
+				if (type === 'month') {
+					return `${value}月`
+				}
+				if (type === 'day') {
+					return `${value}日`
+				}
+				return value
+			},
+			// 确定选择生日
+			confirmAge(e) {
+				that.base_info.birthday = $api.formatDate(e)
+				that.cancel()
+			},
+			// 确定选择参加工作时间
+			confirmWork(e) {
+				that.base_info.work_date = $api.formatDate(e)
+				that.cancel()
+			},
+			confirmSalary(e) {
+				console.log(e);
+				var index1 = e.indexs[0]
+				var index2 = e.indexs[1]
+				if (index1 - index2 > 2) {
+					$api.info('请选择正确的薪资范围')
+				} else {
+					that.job_inte.salary = e.value[0] + '-' + e.value[1]
+					that.cancel()
+				}
+				
+			},
+			// 选择工作性质
+			confirmNature(e) {
+				console.log(e);
+				that.job_inte.work_nature = e.value[0]
+				that.cancel()
+			},
+			// 选择在职时间1
+			confirmTime1(e) {
+				that.experience.company_time1 = $api.formatDate(e)
+				that.cancel()
+			},
+			// 选择在职时间2
+			confirmTime2(e) {
+				that.experience.company_time2 = $api.formatDate(e)
+				that.cancel()
+			},
+			// 选择技能掌握程度
+			confirmSkill(e) {
+				that.skills.skills_degree = e.value[0]
+				that.cancel()
+			},
+			// 选择证书获得时间
+			confirmDate(e) {
+				that.certificate.certificate_date = $api.formatDate(e)
+				that.cancel()
+			},
+			// 选择学历
+			changeHandler(e) {
+				const {
+					columnIndex,
+					value,
+					values, // values为当前变化列的数组内容
+					index,
+					// 微信小程序无法将picker实例传出来，只能通过ref操作
+					picker = this.$refs.uPicker
+				} = e
+				console.log(e);
+				// 当第一列值发生变化时，变化第二列(后一列)对应的选项
+				if (e.index == 3 || e.index == 4) {
+					// picker为选择器this实例，变化第二列对应的选项
+					console.log(this.educationList2);
+					picker.setColumnValues(1, this.educationList2[0])
+				}
+			},
+			// 选择学历
+			confirmEdu(e) {
+				console.log(e);
+				if(e.indexs.length > 1) {
+					that.base_info.education = e.value[1] + e.value[0] 
+				} else {
+					that.base_info.education = e.value[0]
+				}
+				that.cancel()
+			},
+			// 关闭选择器
+			cancel() {
+				that.birthday_show = false
+				that.work_show = false
+				that.salary_show = false
+				that.nature_show = false
+				that.show_time1 = false
+				that.show_time2 = false
+				that.degree_show = false
+				that.certificate_show = false
+				that.education_show = false
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F4F4F4;
+		padding: 20rpx 30rpx 0;
+		.box {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			box-sizing: border-box;
+			padding: 30rpx 20rpx;
+			.cell {
+				width: 100%;
+				padding: 28rpx 0;
+				border-bottom: 1rpx solid #F4F4F4;
+				.label {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #888888;
+					padding-bottom: 28rpx;
+					margin-right: 14rpx;
+				}
+				.label_img {
+					width: 20rpx;
+					height: 20rpx;
+					margin: 0 4rpx 0 14rpx;
+				}
+				.label2 {
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #B1B1B1;
+				}
+				.upload {
+					width: 200rpx;
+					height: 200rpx;
+					background: #F5F5F5;
+					border-radius: 20rpx;
+					.text_style1 {
+						margin-top: 18rpx;
+						font-size: 24rpx;
+						font-weight: 400;
+						color: #ADADAD;
+					}
+				}
+			}
+			.cell:nth-last-child(1) {
+				border: none;
+			}
+		}
+		.save {
+			width: 100%;
+			height: 84rpx;
+			background: #506DFF;
+			border-radius: 42rpx;
+			font-size: 36rpx;
+			text-align: center;
+			margin: 56rpx auto;
+			font-weight: 500;
+			color: #FFFFFF;
+			line-height: 84rpx;
+		}
+	}
+</style>

page_index/pages/demand/publish.vue

@@ -0,0 +1,574 @@
+<template>
+	<view class="content">
+		<view class="box" v-if="base_info.name == ''">
+			<view class="box_title">基本信息</view>
+			<view class="hflex acenter jbetween box_info">
+				<view class="hflex acenter">
+					<image src="/static/images/index/demand/icon1.png" class="box_icon"></image>
+					<view class="vflex">
+						<view class="box_title">完善个人信息</view>
+						<view class="box_subTitle">让更多人更好的了解你</view>
+					</view>
+				</view>
+				<view class="box_btn" @click="perfect(1)">完善</view>
+			</view>
+		</view>
+		<view class="box hflex jbetween" v-else>
+			<view class="">
+				<view class="hflex acenter">
+					<view class="name">{{base_info.name}}</view>
+					<view class="edit_btn" @click="perfect(1)">编辑</view>
+				</view>
+				<view class="hflex acenter">
+					<view class="hflex acenter padR-24">
+						<image src="/static/images/index/demand/sex.png" class="icon"></image>
+						<view class="text_style1">{{base_info.sex}}</view>
+					</view>
+					<view class="hflex acenter padR-24">
+						<image src="/static/images/index/demand/edution.png" class="icon"></image>
+						<view class="text_style1">{{base_info.edu}}</view>
+					</view>
+					<view class="hflex acenter padR-24">
+						<image src="/static/images/index/demand/birthday.png" class="icon"></image>
+						<view class="text_style1">{{base_info.age}}</view>
+					</view>
+					<view class="hflex acenter padR-24">
+						<image src="/static/images/index/demand/work.png" class="icon"></image>
+						<view class="text_style1">{{base_info.year}}</view>
+					</view>
+				</view>
+				<view class="hflex acenter padT-26">
+					<u-icon name="phone-fill" color="#666666" size="14" class="padR-24"></u-icon>
+					<view class="text_style1">{{base_info.phone}}</view>
+				</view>
+				<view class="hflex acenter padT-26">
+					<image src="/static/images/index/demand/email.png" class="icon"></image>
+					<view class="text_style1">{{base_info.email}}<span style="color: #506dff;" @click="copy(base_info.email)"><span style="padding: 0 5rpx;">|</span>复制</span></view>
+				</view>
+			</view>
+			<image :src="base_info.avatar" class="avatar"></image>
+		</view>
+		<view class="box" v-if="job_inte.job_name == ''">
+			<view class="box_title">求职意向</view>
+			<view class="hflex acenter jbetween box_info">
+				<view class="hflex acenter">
+					<image src="/static/images/index/demand/icon1.png" class="box_icon"></image>
+					<view class="vflex">
+						<view class="box_title">完善求职意向</view>
+						<view class="box_subTitle">我们会更精准的为你推荐</view>
+					</view>
+				</view>
+				<view class="box_btn" @click="perfect(2)">完善</view>
+			</view>
+		</view>
+		<view class="box" v-else>
+			<view class="hflex acenter jbetween">
+				<view class="box_title">求职意向</view>
+				<view class="edit_btn" @click="perfect(2)">编辑</view>
+			</view>
+			<view class="hflex acenter padT-26">
+				<view class="box_title">{{job_inte.job_name}}</view>
+				<view class="box_title">{{job_inte.salary}}</view>
+			</view>
+			<view class="hflex fwrap padT-26">
+				<view class="label">可工作区域</view>
+				<view class="text_style1" style="flex: 1;">{{job_inte.job_area}}</view>
+			</view>
+			<view class="hflex acenter padT-26">
+				<view class="label">可工作时间</view>
+				<view class="text_style1">{{job_inte.job_time}}</view>
+			</view>
+			<view class="hflex acenter padT-26">
+				<view class="label">工作性质</view>
+				<view class="text_style1">{{job_inte.job_type}}</view>
+			</view>
+		</view>
+		<view class="box" v-if="experience.length == 0">
+			<view class="box_title">工作经历</view>
+			<view class="hflex acenter jbetween box_info">
+				<view class="hflex acenter">
+					<image src="/static/images/index/demand/icon1.png" class="box_icon"></image>
+					<view class="vflex">
+						<view class="box_title">完善工作经历</view>
+						<view class="box_subTitle">我们会跟精准的为你推荐</view>
+					</view>
+				</view>
+				<view class="box_btn" @click="perfect(3)">完善</view>
+			</view>
+		</view>
+		<view class="box" v-else>
+			<view class="hflex acenter jbetween">
+				<view class="box_title">工作经历</view>
+				<view class="hflex acenter" @click="perfect(3)">
+					<u-icon name="plus-circle-fill" color="#555555" size="12"></u-icon>
+					<view class="text_style1">添加</view>
+				</view>
+			</view>
+			<block v-for="(item,index) in experience" :key="index">
+				<view class="padT-26" @click="editInfo(item.id)">
+					<view class="hflex acenter jbetween">
+						<view class="box_title">{{item.company_name}}</view>
+						<u-icon name="arrow-right" color="#555555" size="12"></u-icon>
+					</view>
+					<view class="hflex acenter padT-26">
+						<view class="text_style1 padR-24">{{item.company_date}}</view>
+						<view class="text_style1">{{item.company_postion}}</view>
+					</view>
+					<view class="hflex fwrap padT-26 text_style2">工作内容：{{item.company_content}}</view>
+				</view>
+			</block>
+		</view>
+		<view class="box" v-if="skills.length == 0">
+			<view class="box_title">专业技能</view>
+			<view class="hflex acenter jbetween box_info">
+				<view class="hflex acenter">
+					<image src="/static/images/index/demand/icon1.png" class="box_icon"></image>
+					<view class="vflex">
+						<view class="box_title">添加专业技能</view>
+						<view class="box_subTitle">把你的强项展示一下吧</view>
+					</view>
+				</view>
+				<view class="box_btn" @click="perfect(4)">添加</view>
+			</view>
+		</view>
+		<view class="box" v-else>
+			<view class="hflex acenter jbetween">
+				<view class="box_title">专业技能</view>
+				<view class="hflex acenter" @click="perfect(4)">
+					<u-icon name="plus-circle-fill" color="#555555" size="12"></u-icon>
+					<view class="text_style1">添加</view>
+				</view>
+			</view>
+			<view class="hflex acenter fwrap">
+				<block v-for="(item,index) in skills" :key="index">
+					<view class="hflex acenter jbetween item_box2">
+						<view class="text_style1">{{item.skills_name}}</view>
+						<view class="text_style1">{{item.skills_degree}}</view>
+						<image src="/static/images/index/demand/detele.png" class="detele" @click="delSkill(item.id)"></image>
+					</view>
+				</block>
+			</view>
+		</view>
+		<view class="box" v-if="certificate.length == 0">
+			<view class="box_title">资质证书</view>
+			<view class="hflex acenter jbetween box_info">
+				<view class="hflex acenter">
+					<image src="/static/images/index/demand/icon1.png" class="box_icon"></image>
+					<view class="vflex">
+						<view class="box_title">添加资质证书</view>
+						<view class="box_subTitle">把你的强项展示一下吧</view>
+					</view>
+				</view>
+				<view class="box_btn" @click="perfect(5)">添加</view>
+			</view>
+		</view>
+		<view class="box" v-else>
+			<view class="hflex acenter jbetween">
+				<view class="box_title">资质证书</view>
+				<view class="hflex acenter" @click="perfect(5)">
+					<u-icon name="plus-circle-fill" color="#555555" size="12"></u-icon>
+					<view class="text_style1">添加</view>
+				</view>
+			</view>
+			<view class="">
+				<block v-for="(item,index) in certificate" :key="index">
+					<view class="hflex aend item_box3">
+						<view class="box_title padR-24">{{item.certificate_name}}</view>
+						<view class="text_style1">{{item.certificate_date}}</view>
+						<image src="/static/images/index/demand/detele.png" class="detele" @click="delSkill(item.id)"></image>
+					</view>
+				</block>
+			</view>
+		</view>
+		<view class="box" style="margin-bottom: 186rpx;">
+			<view class="box_title" style="padding-bottom: 16rpx;">福利待遇</view>
+			<u-input v-model="salary" placeholder="请填写你期望的薪资待遇" border="none"></u-input>
+			<view class="line"></view>
+			<view class="box_title" style="padding-bottom: 16rpx;">备注</view>
+			<u-input v-model="remarks" placeholder="请填写你想要备注的内容" border="none"></u-input>
+		</view>
+		<view class="bottom">
+			<view class="bottom_btn" :class="is_publish?'publish_btn':''" @click="open">发布</view>
+		</view>
+		<u-popup :show="show" mode="bottom" :round="20" @close="close">
+			<view class="popup">
+				<view class="popup_title vflex acenter jcenter">本人承诺</br>以上所填写的内容真实有效</view>
+				<view class="popu_label" style="font-size: 28rpx;font-weight: 500;">请填写以下信息</view>
+				<view class="popu_label">身份证号</view>
+				<u-input v-model="IDNumber" placeholder="请输入身份证号" border="bottom"></u-input>
+				<view class="popu_label">手机号码</view>
+				<u-input v-model="phone" placeholder="请输入手机号码" border="bottom"></u-input>
+				<view class="popu_label">验证码</view>
+				<view class="hflex acenter jbetween">
+					<u-input v-model="code" placeholder="请输入验证码" border="none"></u-input>
+					<view class="popu_label code" @click="getCode">{{tips}}</view>
+					<u-code :seconds="seconds" @end="end" @start="start" ref="uCode" @change="codeChange"></u-code>
+				</view>
+				<view class="btn1" @click="publish">立即发布</view>
+				<view class="cancel" @click="close">取消</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				is_publish: false,
+				salary: '',
+				remarks: '',
+				base_info: {
+					name: '张三',
+					avatar: '/static/images/mine/avatar1.jpg',
+					sex: '男',
+					edu: '本科',
+					age: '27',
+					year: '5年',
+					phone: '18923465789',
+					email: '18923465789@qq.com',
+				},
+				job_inte: {
+					job_name: '船舶工程设计师',
+					salary: '11-19k',
+					job_area: '江苏省南京市浦口区江北街道东方万汇城22号楼一单元2021',
+					job_time: '两个月',
+					job_type: '全职'
+				},
+				experience: [
+					{
+						company_name: '上海船舶技术工程有限公司',
+						company_date: '2019.07-2022.02',
+						company_postion: '船舶工程设计师',
+						company_content: '1，负责线上平台app/小程序页面更新设计，2，负责活动H5页面，banner设计3，负责外包项目设计；4，制定工作计划'
+					},
+					{
+						company_name: '上海船舶技术工程有限公司',
+						company_date: '2019.07-2022.02',
+						company_postion: '船舶工程设计师',
+						company_content: '1，负责线上平台app/小程序页面更新设计，2，负责活动H5页面，banner设计3，负责外包项目设计；4，制定工作计划'
+					}
+				],
+				skills: [
+					{
+						skills_name: 'Access',
+						skills_degree: '熟练'
+					},
+					{
+						skills_name: 'Access',
+						skills_degree: '精通'
+					}
+				],
+				certificate: [
+					{
+						certificate_name: '普通话等级证书',
+						certificate_date: '2012-06-12'
+					},
+					{
+						certificate_name: '大学英语四级证书',
+						certificate_date: '2012-06-12'
+					}
+				],
+				show: false,
+				IDNumber: '',
+				phone: '',
+				code: '',
+				tips: '',
+				seconds: 60,
+				del_show: false,
+				id: '',
+				
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		onShow() {
+			that.isPubilsh()
+		},
+		methods: {
+			// 判断是否可以发布
+			isPubilsh() {
+				if (that.base_info.name != '' && that.job_inte.job_name != '') {
+					that.is_publish = true
+				}
+			},
+			// 发布
+			publish() {
+				if($api.formCheck(that.IDNumber, 'identity') && $api.formCheck(that.phone, 'mobile') && $api.formCheck(that.code, 'code6')) {
+					$api.info('发布成功')
+					that.close()
+				}
+			},
+			// 打开弹窗
+			open() {
+				if (that.is_publish) {
+					that.show = true
+				}
+			},
+			// 关闭弹窗
+			close() {
+				that.show = false
+			},
+			// 添加或完善
+			perfect(index) {
+				$api.jump('/page_index/pages/demand/perfect?index='+index)
+			},
+			// 修改工作经历
+			editInfo(id) {
+				$api.jump('/page_index/pages/demand/perfect?index=3&id='+ id)
+			},
+			// 复制
+			copy(value) {
+				uni.setClipboardData({
+					data: value,
+					success: function () {
+						$api.info('复制成功')
+					}
+				});
+			},
+			// 删除
+			delete(id) {
+				that.del_show = true
+				that.id = id
+			},
+			// 确定删除
+			deleSkill() {
+				
+			},
+			// 验证码文字改变
+			codeChange(text) {
+				this.tips = text;
+			},
+			getCode() {
+				if(this.$refs.uCode.canGetCode) {
+					// 模拟向后端请求验证码
+					uni.showLoading({
+						title: '正在获取验证码'
+					})
+					setTimeout(() => {
+						uni.hideLoading();
+						// 这里此提示会被this.start()方法中的提示覆盖
+						uni.$u.toast('验证码已发送');
+						// 通知验证码组件内部开始倒计时
+						this.$refs.uCode.start();
+					}, 2000);
+				} else {
+					uni.$u.toast('倒计时结束后再发送');
+				}
+			},
+			end() {
+				uni.$u.toast('倒计时结束');
+			},
+			start() {
+				uni.$u.toast('倒计时开始');
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F4F4F4;
+		.box {
+			margin: 20rpx 30rpx 0;
+			width: 690rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			box-sizing: border-box;
+			padding: 28rpx 20rpx;
+			.box_title {
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #222222;
+			}
+			.name {
+				font-size: 40rpx;
+				font-weight: 500;
+				color: #222222;
+			}
+			.edit_btn {
+				width: 84rpx;
+				height: 36rpx;
+				background: #F0F2F6;
+				border-radius: 20rpx;
+				font-size: 20rpx;
+				text-align: center;
+				font-weight: 400;
+				color: #506DFF;
+				line-height: 36rpx;
+				margin-left: 16rpx;
+			}
+			.padT-26 {
+				padding-top: 26rpx;
+			}
+			.padR-24 {
+				padding-right: 24rpx;
+			}
+			.label {
+				width: 148rpx;
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #888888;
+			}
+			.icon {
+				width: 28rpx;
+				height: 28rpx;
+			}
+			.text_style1 {
+				font-size: 24rpx;
+				padding-left: 5rpx;
+				font-weight: 400;
+				color: #666666;
+			}
+			.text_style2 {
+				font-size: 22rpx;
+				font-weight: 400;
+				color: #777777;
+				line-height: 32rpx;
+			}
+			.item_box2 {
+				background: #F4F4F4;
+				border-radius: 26rpx;
+				box-sizing: border-box;
+				padding: 8rpx 34rpx;
+				margin: 20rpx 32rpx 0 0;
+				position: relative;
+				.detele {
+					position: absolute !important;
+					right: 1rpx;
+					top: 1rpx;
+					width: 21rpx;
+					height: 21rpx;
+				}
+			}
+			.item_box3 {
+				width: 100%;
+				background: #F4F4F4;
+				border-radius: 26rpx;
+				box-sizing: border-box;
+				padding: 8rpx 20rpx;
+				margin: 20rpx 0 0;
+				position: relative;
+				.detele {
+					position: absolute !important;
+					right: 1rpx;
+					top: 1rpx;
+					width: 21rpx;
+					height: 21rpx;
+				}
+			}
+			.avatar {
+				width: 120rpx;
+				height: 120rpx;
+				border-radius: 50%;
+			}
+			.box_info {
+				margin: 42rpx 0 0;
+				
+				.box_icon {
+					width: 56rpx;
+					height: 56rpx;
+					margin-right: 28rpx;
+				}
+				.box_subTitle {
+					margin-top: 4rpx;
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #777777;
+				}
+				.box_btn {
+					box-sizing: border-box;
+					padding: 6rpx 24rpx;
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #FFFFFF;
+					line-height: 34rpx;
+					background: #506DFF;
+					border-radius: 14px;
+				}
+			}
+			.line {
+				margin: 20rpx 0;
+				width: 100%;
+				height: 1rpx;
+				background: #F3F3F5;
+			}
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 40rpx 74rpx;
+			.bottom_btn {
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				opacity: 0.4;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			.publish_btn {
+				opacity: 1;
+			}
+			
+		}
+		.popup {
+			background: #FFFFFF;
+			border-radius: 40rpx 40rpx 0px 0px;
+			width: 100%;
+			box-sizing: border-box;
+			padding: 30rpx;
+			.popup_title {
+				width: 100%;
+				padding-bottom: 32rpx;
+				border-bottom: 1rpx solid #F4F4F4;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 50rpx;
+			}
+			.popu_label {
+				font-size: 30rpx;
+				font-weight: 400;
+				color: #222222;
+				padding: 24rpx 0;
+			}
+			.code {
+				color: #506DFF;
+			}
+			.btn1 {
+				margin: 90rpx 0 40rpx;
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 21px;
+				text-align: center;
+				line-height: 84rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+			}
+			.cancel {
+				width: 100%;
+				text-align: center;
+				font-size: 32rpx;
+				font-weight: 400;
+				color: #777777;
+			}
+			.u-input {
+				padding: 12rpx 0 !important;
+			}
+		}
+	}
+</style>

page_index/pages/index/changeCity.vue

@@ -26,7 +26,7 @@
 					热门
 				</view>
 				<view class="hflex acenter fwrap jbetween">
-					<block v-for="(item2,index) in hotList">
+					<block v-for="(item2,index) in hotList" :key="index">
 						<view class="city_box hflex acenter jcenter"@click="selectCity(item2)">{{item2}}</view>
 					</block>
 				</view>

page_index/pages/purchase/orderDetail.vue

@@ -0,0 +1,617 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="hflex acenter jbetween top">
+				<view class="order_no">订单编号：{{pageData.order_no}}</view>
+				<view class="type type1" v-if="id == 1">采购订单</view>
+				<view class="type type2" v-if="id == 2">生产订单</view>
+				<view class="type type3" v-if="id == 3">外协订单</view>
+				<view class="type type4" v-if="id == 4">海运订单</view>
+			</view>	
+			<view class="title">{{pageData.name}}</view>
+			<view class="hflex acenter jbetween padT-16">
+				<view class="hflex astart">
+					<view class="text_style2" style="width: 96rpx;">地址：</view>	
+					<view class="text_style2 black">
+						{{pageData.address}}
+					</view>
+				</view>	
+				<u-icon name="map-fill" color="#506DFF" size="14"></u-icon>
+			</view>	
+			<view class="hflex astart padT-16">
+				<view class="text_style2" style="width: 96rpx;">联系人：</view>	
+				<view class="text_style2 black">
+					{{pageData.linkUser}}
+				</view>
+			</view>
+			<view class="hflex acenter jbetween padT-16">
+				<view class="hflex astart">
+					<view class="text_style2" style="width: 96rpx;">手机号：</view>	
+					<view class="text_style2 black">
+						{{pageData.phone}}
+					</view>
+				</view>	
+				<u-icon name="phone-fill" color="#506DFF" size="14"></u-icon>
+			</view>	
+		</view>	
+		<view class="box">
+			<view class="title">商品明细</view>
+			<view class="list">
+				<block v-for="(item,index) in pageData.goods" :key="index">
+					<view class="list_item" v-if="id == 1">
+						<view class="item_title cell">{{item.name}}</view>
+						<view class="hflex acenter cell">
+							<view class="text_style2 padR-20">规格：{{item.norm}}</view>
+							<view class="text_style2">数量：{{item.num}}</view>
+						</view>
+						<view class="hflex acenter cell">
+							<view class="text_style2 padR-20">原购买价：{{item.price}}</view>
+						</view>
+						<view class="hflex acenter fwrap text_style2 cell">质量标准：{{item.standard}}</view>
+						<view class="cell" style="width: 100%;">
+							<view class="item_btn btn1" v-if="item.type == 1" @click="see(index)">已接单，立即查看</view>
+							<view class="item_btn btn1" v-if="item.type == 2" @click="start">立即接单</view>
+							<view class="item_btn btn2" v-if="item.type == 3">不用报价，已匹配接单人</view>
+						</view>
+					</view>
+					<view class="list_item" v-if="id == 2 || id == 3">
+						<view class="item_title">{{item.name}}</view>
+						<view class="hflex acenter cell">
+							<view class="text_style2 padR-20" v-if="item.norm">规格型号：{{item.norm}}/桶</view>
+							<view class="text_style2" v-if="item.num">生产数量：{{item.norm}}/桶</view>
+						</view>
+						<view class="hflex acenter jbetween" style="margin-top: 20rpx;">
+							<view class="hflex acenter">
+								<image src="/static/images/comment/icon_pdf.png" class="item_img"></image>
+								<view class="text_style1">{{item.enclosure_name}}</view>
+							</view>
+							<view class="hflex acenter jcenter item_btn1">
+								<u-icon name="download" color="#506DFF" size="10"></u-icon>
+								<view>下载附件</view>
+							</view>
+						</view>
+					</view>
+					<view class="list_item" v-if="id == 4">
+						<view class="item_title cell">{{item.name}}</view>
+						<view class="hflex acenter cell">
+							<view class="text_style2 padR-20">数量/吨位：{{item.num}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+			<view class="" v-if="id == 2 || id == 3">
+				<view class="hflex acenter fwrap text_style2 cell">生产技术标准：{{pageData.technology}}</view>
+				<view class="hflex acenter fwrap text_style2 cell">生产验收标准：{{pageData.acceptance}}</view>
+			</view>
+			<view v-if="pageData.imgs.length > 0">
+				<view class="title">图片/视频</view>
+				<view>
+					<block v-for="(item,index) in pageData.imgs" :key="index">
+						<image v-if="item.is_img" :src="item.src" class="img" mode="aspectFill"></image>
+						<image v-else :src="item.src" class="img"></image>
+					</block>
+				</view>
+			</view>
+			<view v-if="id == 4">
+				<view class="hflex acenter padT-16">
+					<view class="text_style2">包装形式：</view>
+					<view class="text_style2 black">{{pageData.form}}</view>
+				</view>
+				<view class="hflex acenter padT-16"> 
+					<view class="text_style2">装货码头：</view>
+					<view class="text_style2 black">{{pageData.loading_dock}}</view>
+				</view>
+				<view class="hflex acenter padT-16">
+					<view class="text_style2">到港码头：</view>
+					<view class="text_style2 black">{{pageData.arrival_wharf}}</view>
+				</view>
+			</view>
+		</view>
+		<view class="box" style="margin-bottom: 186rpx;" v-if="id != 4">
+			<view class="hflex acenter padT-16">
+				<view class="text_style2">交货地址：</view>
+				<view class="text_style2 black">{{pageData.delivery_address}}</view>
+			</view>
+			<view class="hflex acenter padT-16">
+				<view class="text_style2">交货日期：</view>
+				<view class="text_style2 black">{{pageData.delivery_date}}</view>
+			</view>
+			<view class="hflex acenter padT-16">
+				<view class="text_style2">发布日期：</view>
+				<view class="text_style2 black">{{pageData.rekease_date}}</view>
+			</view>
+		</view>
+		<view style="margin-bottom: 186rpx;" v-else></view>
+		<view class="bottom hflex acenter jbetween">
+			<view class="vflex acenter" @click="collect">
+				<u-icon name="star" color="#444444" size="20" v-if="pageData.is_collect == 0"></u-icon>
+				<u-icon name="star-fill" color="#506DFF" size="20" v-else></u-icon>
+				<view class="text_style1">收藏</view>	
+			</view>	
+			<view class="vflex acenter">
+				<image src="/static/images/comment/share.png" mode="" class="bottom_img"></image>	
+				<view class="text_style1">分享</view>	
+			</view>	
+			<view class="bottom_btn" v-if="id == 1">私信聊聊</view>
+			<view class="hflex acenter" v-else>
+				<view class="bottom_btn1">私信聊聊</view>
+				<view class="bottom_btn2" @click="start">开始接单</view>
+			</view>
+		</view>
+		<u-popup :show="quotation_show" mode="center" :round="10" :closeable="true" :safeAreaInsetBottom="false" @close="close">
+			<view class="popup">
+				<view class="popup_title">填写报价信息</view>
+				<view class="input_bg hflex acenter">
+					<view class="price">￥</view>
+					<u-input v-model="offer" placeholder="填写你的报价" border="none"></u-input>
+				</view>
+				<view class="hflex acenter">
+					<image src="/static/images/comment/icon_tips.png" style="width: 24rpx;height: 24rpx;padding-right: 6rpx"></image>
+					<view class="popup_info">报价可先不填，可等评估后再填写</view>
+				</view>
+				<view class="input_bg hflex acenter" v-if="id == 4">
+					<view class="price">报价说明</view>
+					<u-input v-model="description" placeholder="例如:税前/税后" border="none"></u-input>
+				</view>
+				<view class="input_bg hflex acenter" v-else>
+					<view class="price">货期</view>
+					<u-input v-model="lead_time" placeholder="例如: 1个月" border="none"></u-input>
+				</view>
+				<view class="input_bg" v-if="id != 4">
+					<view class="price">产品介绍以及报价说明</view>
+					<u--textarea v-model="description" placeholder="例如:税前/税后" border="none"></u--textarea>
+				</view>
+				<view class="hflex acenter jbetween" v-if="id == 1">
+					<view class="price">是否现货</view>
+					<u-switch v-model="is_stock" activeColor="#506dff" @change="change"></u-switch>
+				</view>
+				<view class="hflex acenter" style="padding-bottom: 20rpx;">
+					<view class="price">上传图片及资质证明图片</view>
+					<image src="/static/images/comment/icon_tips.png" style="width: 24rpx;height: 24rpx;padding-right: 6rpx"></image>
+					<view class="popup_info">最多上传9张图片</view>
+				</view>
+				<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="9"></u-upload>
+				<view class="popup_btn">立即接单</view>
+				<view class="price">友情提醒：</view>
+				<view class="popup_info">请认真核算报价，报价后不可修改和删除，报价时间约需x天内报价，逾期影响信用等级。</view>
+			</view>
+		</u-popup>
+		<u-popup :show="detail_show" mode="center" :round="10" :closeable="true" :safeAreaInsetBottom="false" @close="close">
+			<view class="popup">
+				<view class="popup_title">报价信息</view>
+				<view class="popup_name">报价说明</view>
+				<view class="input_bg">{{pageData.goods[index].description}}</view>
+				<view class="popup_name">当前报价</view>
+				<view class="hflex acenter input_bg" v-if="pageData.goods[index].one != ''">
+					<view class="popup_text">第一次报价</view>
+					<view class="red">{{pageData.goods[index].one}}</view>
+				</view>
+				<view class="hflex acenter input_bg" v-if="pageData.goods[index].two != ''">
+					<view class="popup_text">第二次报价</view>
+					<view class="red">{{pageData.goods[index].two}}</view>
+				</view>
+				<view class="hflex acenter input_bg" v-if="pageData.goods[index].three != ''">
+					<view class="popup_text">第三次报价</view>
+					<view class="red">{{pageData.goods[index].three}}</view>
+				</view>
+				<view class="popup_name">图片及资质证明图片</view>
+				<block v-for="(item,index) in pageData.goods[index].img" :key="index">
+					<image :src="item" style="width: 188rpx;height: 188rpx;margin: 0 14rpx 20rpx 0;border-radius: 16rpx;"></image>
+				</block>
+				<view class="popup_btn">查看详情</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				id: '',
+				pageData: {
+					is_collect: 0,
+					type: 2,
+					order_no: 'Cbz20220122130923',
+					name: '福建船舶有限公司',
+					address: '山东省济南市历下区历元大街188号解放军家属院',
+					linkUser: '李建国',
+					phone: '189235767865',
+					goods: [
+						{
+							id: 1,
+							name: '聚酰胺/非离子表面活性剂Lutensol XP',
+							norm: '15kg/桶',
+							num: '10桶',
+							price: '18999.89',
+							type: 1,
+							description: '报价说明报价说明报价说明报价说明报价说…',
+							one: '2,399.89',
+							two: '1,459.89',
+							three: '',
+							img: '',
+							enclosure_name: '在发展中扎实推动共同富裕.pdf',
+							standard: '按照国家三级标准规定，按照国家三级标准规定，按照国家三级标准规定，按照国家三级标准规定，'
+						},
+						{
+							id: 1,
+							name: '聚酰胺/非离子表面活性剂Lutensol XP',
+							norm: '15kg/桶',
+							num: '10桶',
+							price: '18999.89',
+							type: 2,
+							standard: '按照国家三级标准规定，按照国家三级标准规定，按照国家三级标准规定，按照国家三级标准规定，'
+						},
+						{
+							id: 1,
+							name: '聚酰胺/非离子表面活性剂Lutensol XP',
+							norm: '15kg/桶',
+							num: '10桶',
+							price: '18999.89',
+							type: 3,
+							standard: '按照国家三级标准规定，按照国家三级标准规定，按照国家三级标准规定，按照国家三级标准规定，'
+						}
+					],
+					imgs: [
+						
+					],
+					delivery_address: '山东省济南市历下区XX街道',
+					delivery_date: '2022-09-12',
+					rekease_date: '2022-06-12',
+					form: '散装/货柜/整船/整仓',
+					loading_dock: '饶平县海山镇222省道三百门码头附近',
+					arrival_wharf: '云霄县福崎北路与沿海大道交叉口东南60米',
+					technology: '生产技术标准按照国家三级验收标准规定来说，生产技术标准按照国家三级验收标准规定来说，生产技术标准按照国家…',
+					acceptance: '生产技术标准按照国家三级验收标准规定来说，生产技术标准按照国家三级验收',
+				},
+				quotation_show: false,
+				detail_show: false,
+				offer: '',
+				lead_time: '',
+				description: '',
+				is_stock: false,
+				fileList1: [],
+				index: 0,
+			}
+		},
+		onLoad(options) {
+			that = this
+			that.id = options.id
+		},
+		methods: {
+			// 收藏
+			collect() {
+				if(that.pageData.is_collect == 0) {
+					that.pageData.is_collect = 1
+					$api.info('收藏成功')
+				} else {
+					that.pageData.is_collect = 0
+					$api.info('取消收藏')
+				}
+			},
+			// 打开填写报价信息
+			start() {
+				that.quotation_show = true
+			},
+			// 打开报价信息
+			see(index) {
+				that.index = index
+				that.detail_show = true
+			},
+			// 关闭弹窗
+			close() {
+				that.quotation_show = false
+				that.detail_show = false
+			},
+			// 是否现货
+			change(e) {
+				console.log(e);
+				that.is_stock = e
+			},
+			// 删除图片
+			deletePic(event) {
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: url('/static/images/comment/background.png') #f4f4f4 no-repeat;
+		background-size: 100%;
+		.box {
+			margin: 20rpx 30rpx 0;
+			width: 690rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			padding: 20rpx;
+			
+			.top {
+				padding-bottom: 24rpx;
+				border-bottom: 1rpx solid #F4F4F4;
+				.order_no {
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #222222;
+				}
+				.type {
+					width: 100rpx;
+					height: 36rpx;
+					background: #506DFF;
+					border-radius: 4rpx;
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #FFFFFF;
+					text-align: center;
+					line-height: 36rpx;
+				}
+				.type1 {
+					background: #506DFF;
+				}
+				.type2 {
+					background: #FEA227;
+				}
+				.type3 {
+					background: #54D2C5;
+				}
+				.type4 {
+					background: #60CE8A;
+				}
+			}
+			
+			
+			.title {
+				margin: 20rpx 0 24rpx;
+				font-size: 30rpx;
+				font-weight: 500;
+				color: #222222;
+			}
+			.img {
+				width: 208rpx;
+				height: 208rpx;
+				border-radius: 16rpx;
+				margin: 0 14rpx 20rpx 0;
+			}
+			.img:nth-child(3n) {
+				margin: 0 0 20rpx;
+			}
+			.padT-16{
+				padding-top: 16rpx;
+			}
+			.padR-20 {
+				padding-right: 20rpx;
+			}
+			.cell {
+				padding: 10rpx 0;
+			}
+			.list {
+				width: 100%;
+				.list_item {
+					width: 100%;
+					box-sizing: border-box;
+					padding: 20rpx;
+					background: #F4F4F4;
+					border-radius: 8px;
+					margin-top: 20rpx;
+					.item_title {
+						font-size: 28rpx;
+						font-weight: 400;
+						color: #222222;
+					}
+					
+					.item_btn {
+						width: 570rpx;
+						margin: 0 auto;
+						height: 76rpx;
+						text-align: center;
+						line-height: 76rpx;
+						font-size: 32rpx;
+						font-weight: 400;
+						color: #506DFF;
+					}
+					.item_btn1 {
+						width: 120rpx;
+						height: 44rpx;
+						border-radius: 22rpx;
+						border: 1px solid #506DFF;
+						padding: 0 8rpx;
+						box-sizing: border-box;
+						font-size: 16rpx;
+						font-weight: 400;
+						color: #506DFF;
+					}
+					.btn1 {
+						background: #EAF4FF;
+						border-radius: 12rpx;
+						border: 1px solid #536FFE;
+					}
+					.btn2 {
+						background: #C5C5C5;
+						border-radius: 6px;
+						color: #FFFFFF;
+					}
+					.item_img {
+						width: 36rpx;
+						height: 44rpx;
+						margin-right: 8rpx;
+					}
+				}
+			}
+			
+		}
+		
+		.text_style1 {
+			font-size: 20rpx;
+			font-weight: 400;
+			color: #444444;
+		}
+		.text_style2 {
+			font-size: 24rpx;
+			font-weight: 400;
+			color: #666666;
+			line-height: 34rpx;
+		}
+		.black {
+			color: #222222;
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 30rpx 74rpx;
+			
+			.bottom_btn {
+				width: 530rpx;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			.bottom_btn1 {
+				width: 204rpx;
+				height: 84rpx;
+				border-radius: 21px;
+				border: 1px solid #506DFF;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #506DFF;
+				text-align: center;
+				line-height: 84rpx;
+				margin-right: 20rpx;
+			}
+			.bottom_btn2 {
+				width: 300rpx;
+				height: 84rpx;
+				border-radius: 21px;
+				background: #506DFF;
+				color: #FFFFFF;
+				font-size: 36rpx;
+				font-weight: 500;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			.bottom_img {
+				width: 40rpx;
+				height: 40rpx;
+			}
+			
+		}
+		.popup {
+			width: 670rpx;
+			background: #FFFFFF;
+			border-radius: 10px;
+			box-sizing: border-box;
+			padding: 36rpx 30rpx 24rpx;
+			.popup_title {
+				width: 100%;
+				text-align: center;
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #222222;
+				margin-bottom: 24rpx;
+			}
+			.popup_name {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #222222;
+				padding: 28rpx 0 20rpx;
+			}
+			.popup_text {
+				font-size: 22rpx;
+				font-weight: 500;
+				color: #777777;
+				padding-right: 60rpx;
+			}
+			.input_bg {
+				background: #F4F4F4;
+				border-radius: 8px;
+				box-sizing: border-box;
+				padding: 16rpx 20rpx;
+				margin: 20rpx 0;
+				.price {
+					font-size: 32rpx;
+					font-weight: 500;
+					color: #222222;
+					padding-right: 20rpx;
+				}
+				.u-textarea {
+					background-color: #F4F4F4 !important;
+				}
+				.red {
+					font-size: 28rpx;
+					font-weight: bold;
+					color: #FF3636;
+				}
+			}
+			.popup_info {
+				font-size: 20rpx;
+				font-weight: 400;
+				color: #C0C0C0;
+				line-height: 28rpx;
+			}
+			.popup_btn {
+				width: 610rpx;
+				height: 80rpx;
+				background: #506DFF;
+				border-radius: 40rpx;
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 80rpx;
+				margin: 20rpx 0;
+			}
+		}
+	}
+</style>

page_index/pages/purchase/purchase.vue

@@ -0,0 +1,415 @@
+<template>
+	<view class="content">
+		<u-navbar title="" @leftClick="leftClick" :placeholder="true" :autoBack="true">
+			<view slot="center" class="hflex nav">
+				<view class="nav_item" :class="nav_index == 1 ? 'nav_active' : ''" @click="changeNav(nav_index)">采购订单</view>
+				<view class="nav_item" :class="nav_index == 2 ? 'nav_active' : ''" @click="changeNav(nav_index)">接单需求</view>
+			</view>
+		</u-navbar>
+		<view class="" v-if="nav_index == 1">
+			<view class="tabs">
+				<u-tabs :list="tabs" :scrollable="false" :activeStyle="{color: '#506DFF'}" lineColor="#506DFF" @click="changeTabs"></u-tabs>
+			</view>
+			<view class="box1">
+				<view class="box1_top hflex acenter">
+					<view class="top_item" :class="sort_index == 1 ? 'top_active' : ''" @click="changeSort(sort_index)">按照距离</view>
+					<view class="top_item" :class="sort_index == 2 ? 'top_active' : ''" @click="changeSort(sort_index)">价格高低</view>
+				</view>
+				<block v-for="(item,index) in pageList" :key="index">
+					<view class="order_box">
+						<view class="order_top hflex acenter">
+							<image src="/static/images/comment/order_type1.png"  v-if="item.type == 0" class="order_img"></image>
+							<image src="/static/images/comment/order_type2.png"  v-if="item.type == 1" class="order_img"></image>
+							<image src="/static/images/comment/order_type3.png"  v-if="item.type == 2" class="order_img"></image>
+							<image src="/static/images/comment/order_type4.png"  v-if="item.type == 3" class="order_img"></image>
+							<view class="order_title">{{item.name}}</view>
+						</view>
+						<view class="">
+							<block v-for="(item2,inx) in item.order" :key="inx">
+								<view class="order_item">
+									<view class="item_name">{{item2.name}}</view>
+									<view class="hflex acenter ">
+										<view class="text_style1 padR-20" >规格：{{item2.norm}}</view>
+										<view class="text_style1">数量：{{item2.num}}</view>
+									</view>
+								</view>
+							</block>
+						</view>
+						<view class="hflex acenter jbetween order_bottom">
+							<view class="text_style1">发布于{{item.date}}</view>
+							<view class="more" @click="toDetail(item.index)">查看更多 》</view>
+						</view>
+					</view>
+				</block>
+			</view>
+			
+		</view>
+		<view class="box2" v-if="nav_index == 2">
+			<view class="search">
+				<u-input v-model="serach_value" type="text" border="none" placeholder="大家都在搜" shape="circle"
+					prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399">
+				</u-input>
+			</view>
+			<block v-for="(item,index) in pageList2" :key="index">
+				<view class="box hflex" @click="toDetail2(item.id)">
+					<image :src="item.avatar" class="item_avatar"></image>
+					<view class="vflex" style="margin-left: 20rpx;">
+						<view class="item_name">{{item.name}}</view>
+						<view class="hflex acenter cell">
+							<u-icon name="phone-fill" color="#b8b8b8" size="14"></u-icon>
+							<view class="text_style1" style="padding-left: 16rpx;">{{item.phone}}</view>
+						</view>
+						<view class="hflex astart cell">
+							<u-icon name="map-fill" color="#b8b8b8" size="14"></u-icon>
+							<view class="text_style1" style="padding-left: 16rpx;">{{item.address}}</view>
+						</view>
+					</view>
+				</view>
+			</block>
+			<view class="add">
+				<image src="/static/images/comment/add.png" class="add_img" @click="release"></image>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				nav_index: 2,
+				tabs: [
+					{
+						index: 0,
+						name: '采购订单',
+					},
+					{
+						index: 1,
+						name: '生产订单',
+					},
+					{
+						index: 2,
+						name: '外协订单',
+					},
+					{
+						index: 3,
+						name: '海运订单',
+					}
+				],
+				sort_index: 1,
+				pageList: [
+					{
+						index: 1,
+						type: 0,
+						name: '福建船舶有限公司',
+						order: [
+							{
+								id: 1,
+								name: '聚酰胺/非离子表面活性剂Lutensol XP',
+								norm: '15kg/桶',
+								num: '10桶'
+							},
+							{
+								id: 2,
+								name: '聚酰胺/非离子表面活性剂Lutensol XP',
+								norm: '15kg/桶',
+								num: '10桶'
+							}
+						],
+						date: '2022-11-14 12:34'
+					},
+					{
+						index: 2,
+						type: 1,
+						name: '福建船舶有限公司',
+						order: [
+							{
+								id: 1,
+								name: '聚酰胺/非离子表面活性剂Lutensol XP',
+								norm: '15kg/桶',
+								num: '10桶'
+							},
+							{
+								id: 2,
+								name: '聚酰胺/非离子表面活性剂Lutensol XP',
+								norm: '15kg/桶',
+								num: '10桶'
+							}
+						],
+						date: '2022-11-14 12:34'
+					},
+					{
+						index: 3,
+						type: 2,
+						name: '福建船舶有限公司',
+						order: [
+							{
+								id: 1,
+								name: '聚酰胺/非离子表面活性剂Lutensol XP',
+								norm: '15kg/桶',
+								num: '10桶'
+							},
+							{
+								id: 2,
+								name: '聚酰胺/非离子表面活性剂Lutensol XP',
+								norm: '15kg/桶',
+								num: '10桶'
+							}
+						],
+						date: '2022-11-14 12:34'
+					},
+					{
+						index: 4,
+						type: 3,
+						name: '福建船舶有限公司',
+						order: [
+							{
+								id: 1,
+								name: '聚酰胺/非离子表面活性剂Lutensol XP',
+								norm: '15kg/桶',
+								num: '10桶'
+							},
+							{
+								id: 2,
+								name: '聚酰胺/非离子表面活性剂Lutensol XP',
+								norm: '15kg/桶',
+								num: '10桶'
+							}
+						],
+						date: '2022-11-14 12:34'
+					}
+				],
+				pageList2: [
+					{
+						id: 1,
+						avatar: '/static/images/mine/avatar1.jpg',
+						name: '张美华',
+						phone: '189235767865',
+						address: '山东省济南市历下区历元大街188号解放军家 属院东省济南市'
+					}
+				],
+				
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 返回
+			leftClick() {
+				console.log('返回');
+				$api.jump(-1)
+			},
+			// 切换导航栏
+			changeNav(index) {
+				if (index == 1) {
+					that.nav_index = 2
+				} else {
+					that.nav_index = 1
+				}
+			},
+			// 切换tabs
+			changeTabs(e) {
+				console.log(e);
+			},
+			// 切换排序
+			changeSort(index) {
+				if (index == 1) {
+					that.sort_index = 2
+				} else {
+					that.sort_index = 1
+				}
+			},
+			// 查看订单详情
+			toDetail(id) {
+				$api.jump('/page_index/pages/purchase/orderDetail?id=' + id)
+			},
+			// 发布
+			release() {
+				$api.jump('/page_index/pages/purchase/release')
+			},
+			// 查看接单详情
+			toDetail2(id) {
+				$api.jump('/page_index/pages/purchase/receivingDetail?id=' + id)
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F4F4F4;
+		.nav {
+			width: 350rpx;
+			height: 60rpx;
+			background: #F4F4F4;
+			border-radius: 30rpx;
+			font-size: 28rpx;
+			font-weight: 400;
+			color: #020202;
+			.nav_item {
+				width: 50%;
+				height: 60rpx;
+				background: #F4F4F4;
+				border-radius: 15px;
+				text-align: center;
+				line-height: 60rpx;
+			}
+			.nav_active {
+				background: #506DFF;
+				color: #FFFFFF;
+			}
+		}
+		.tabs {
+			width: 100%;
+			background-color: #fff;
+			height: 80rpx;
+		}
+		.box1 {
+			width: 100%;
+			margin-top: 20rpx;
+			background: linear-gradient(180deg, #FFFFFF 0%, #F4F4F4 100%);
+			border-radius: 40rpx 40rpx 0px 0px;
+			box-sizing: border-box;
+			padding: 28rpx 30rpx 72rpx;
+			.box1_top {
+				width: 100%;
+				margin-bottom: 8rpx;
+				.top_item {
+					width: 152rpx;
+					height: 52rpx;
+					background: #EDEDED;
+					border-radius: 26rpx;
+					margin-right: 28rpx;
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #666666;
+					text-align: center;
+					line-height: 52rpx;
+				}
+				.top_active {
+					color: #516EFE;
+					background: #EDF2FE;
+					border-radius: 26rpx;
+					border: 1px solid #506DFF;
+				}
+			}
+			.order_box {
+				width: 100%;
+				margin: 20rpx 0 ;
+				background: #FFFFFF;
+				border-radius: 10px;
+				box-sizing: border-box;
+				padding: 28rpx 20rpx;
+				.order_top {
+					width: 100%;
+					
+					/* .order_type {
+						width: 108rpx;
+						height: 36rpx;
+						text-align: center;
+						line-height: 36rpx;
+						font-size: 20rpx;
+						color: #fff;
+						margin-right: 5rpx;
+						border-radius: 4rpx;
+					}
+					.type1 {
+						background-color: #506dff;
+					} */
+					.order_img {
+						width: 108rpx;
+						height: 36rpx;
+						margin-right: 5rpx;
+					}
+					.order_title {
+						font-size: 32rpx;
+						font-weight: 500;
+						color: #222222;
+					}
+				}
+				.order_item {
+					width: 100%;
+					padding: 20rpx 0;
+					border-bottom: 1rpx solid #F4F4F4;
+				}
+				.item_name {
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #222222;
+					padding: 20rpx 0;
+				}
+				
+				.order_bottom {
+					width: 100%;
+					padding: 20rpx 0 0;
+					.more {
+						// width: 140rpx;
+						// height: 48rpx;
+						box-sizing: border-box;
+						padding: 10rpx 20rpx;
+						border-radius: 24rpx;
+						border: 1px solid #979797;
+						font-size: 20rpx;
+						font-weight: 400;
+						color: #888888;
+					}
+				}
+			}
+			
+		}
+		.padR-20 {
+			padding-right: 20rpx;
+		}
+		.text_style1 {
+			font-size: 24rpx;
+			font-weight: 400;
+			color: #888888;
+		}
+		.box2 {
+			width: 100%;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			.search {
+				width: 100%;
+				margin: 20rpx 0 4rpx;
+				.u-input {
+					background-color: #fff !important;
+					padding: 20rpx 30rpx !important;
+				}
+			}
+			.box {
+				background: #FFFFFF;
+				box-sizing: border-box;
+				padding: 24rpx 20rpx;
+				border-radius: 20rpx;
+				margin: 20rpx 0;
+				.item_avatar {
+					width: 84rpx;
+					height: 84rpx;
+					border-radius: 50%;
+				}
+				.cell {
+					margin-top: 20rpx;
+				}
+				.item_name {
+					font-size: 30rpx;
+					font-weight: 500;
+					color: #222222;
+				}
+			}
+			.add {
+				position: fixed;
+				right: 30rpx;
+				bottom: 186rpx;
+				z-index: 99;
+				.add_img {
+					width: 96rpx;
+					height: 96rpx;
+				}
+			}
+		}
+	}
+</style>

page_index/pages/purchase/receivingDetail.vue

@@ -0,0 +1,108 @@
+<template>
+	<view class="content">
+		<view class="box hflex astart">
+			<image :src="user.avatar" class="item_avatar"></image>
+			<view class="vflex" style="padding-left: 20rpx;">
+				<view class="item_name">{{user.name}}</view>
+				<view class="hflex acenter cell">
+					<u-icon name="phone-fill" color="#b8b8b8" size="14"></u-icon>
+					<view class="text_style1" style="padding-left: 16rpx;">{{user.phone}}</view>
+				</view>
+				<view class="hflex astart cell">
+					<u-icon name="map-fill" color="#b8b8b8" size="14"></u-icon>
+					<view class="text_style1" style="padding-left: 16rpx;">{{user.address}}</view>
+				</view>
+			</view>
+		</view>
+		<view class="box">
+			<view class="item_name">接单需求</view>
+			<view class="input_bg">{{user.repir}}</view>
+			<view class="item_name">营业执照或者身份证件照</view>
+			<image :src="img1" class="img1"></image>
+		</view>
+		<view class="box">
+			<view class="item_name">图片以及资质证件图片</view>
+			<image :src="img2" class="img1"></image>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				id: '',
+				user: {
+					avatar: '/static/images/mine/avatar1.jpg',
+					name: '张美华',
+					phone: '189235767865',
+					address: '山东省济南市历下区历元大街188号解放军家 属院东省济南市',
+					repir: '具体需求内容具体采购需求内容具体采购需求内容具体采购需求内容具体采购需求内容具体采购需求内容容具体采购需求内容具体采购需求内容具体采购需求内容',
+					img1: '',
+					img2: '',
+				}
+			}
+		},
+		onLoad(options) {
+			that = this
+			that.id = options.id
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: url('/static/images/comment/background.png') #f4f4f4 no-repeat;
+		background-size: 100%;
+		padding: 0 30rpx;
+		.box {
+			margin-top: 20rpx;
+			width: 100%;
+			box-sizing: border-box;
+			padding: 24rpx 20rpx;
+			background: #FFFFFF;
+			border-radius: 10px;
+			.item_avatar {
+				width: 84rpx;
+				height: 84rpx;
+				border-radius: 50%;
+			}
+			.cell {
+				margin-top: 20rpx;
+			}
+			.item_name {
+				font-size: 28rpx;
+				font-weight: 400;
+				color: #222222;
+				// padding: 20rpx 0;
+			}
+			.input_bg {
+				margin: 24rpx 0;
+				width: 100%;
+				background: #F5F5F5;
+				border-radius: 16rpx;
+				box-sizing: border-box;
+				padding: 22rpx 20rpx;
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #303030;
+			}
+			.text_style1 {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #888888;
+			}
+			.img1 {
+				width: 320rpx;
+				height: 200rpx;
+				border-radius: 16rpx;
+				margin-top: 16rpx;
+			}
+		}
+	}
+</style>

page_index/pages/purchase/release.vue

@@ -0,0 +1,127 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="title">需求说明</view>
+			<u--textarea v-model="repair" border="none" placeholder="请输入内容" ></u--textarea>
+			<view class="title">上传营业执照或者身份证照</view>
+			<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="1"></u-upload>
+		</view>
+		<view class="box" style="margin-bottom: 186rpx;">
+			<view class="title">上传图片以及资质证件图片</view>
+			<u-upload :fileList="fileList2" @afterRead="afterRead" @delete="deletePic" name="2" multiple :maxCount="3"></u-upload>
+		</view>
+		<view class="bottom">
+			<view class="bottom_btn" @click="open">立即发布</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				repair: '',
+				fileList1: [],
+				fileList2: []
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 删除图片
+			deletePic(event) {
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+			// 立即发布
+			open() {},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F5F5F5;
+		.box {
+			width: 690rpx;
+			margin: 20rpx 30rpx 0;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			box-sizing: border-box;
+			padding: 12rpx 20rpx;
+			.title {
+				font-size: 28rpx;
+				font-weight: 400;
+				color: #222222;
+				margin: 20rpx 0;
+			}
+			.u-textarea {
+				background: #F5F5F5;
+			}
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 40rpx 74rpx;
+			.bottom_btn {
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			
+		}
+	}
+</style>

page_index/pages/repair/orderDetail.vue

@@ -0,0 +1,341 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="hflex acenter">
+				<image :src="pageData.avatar" class="avatar"></image>
+				<view class="vflex" style="padding-left: 12rpx;">
+					<view class="text_style1">{{pageData.name}}</view>
+					<view class="hflex acenter">
+						<view class="text_style2">{{pageData.address}}</view>
+						<view class="text_style2" style="padding: 0 10rpx;">|</view>
+						<view class="text_style2">{{pageData.release_date}}发布</view>
+					</view>
+				</view>
+			</view>
+			<view class="text_style3 cell">{{pageData.fault}}</view>
+			<view class="cell">
+				<block v-for="(item,index) in pageData.imgList" :key="index">
+					<image :src="item" class="img"></image>
+				</block>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="label">联系方式</view>
+				<view class="text_style3">{{pageData.phone}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="label">维修时间</view>
+				<view class="text_style3">{{pageData.release_date}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="label">维修地点</view>
+				<view class="text_style3">{{pageData.repair_address}}</view>
+			</view>
+		</view>
+		<view class="box hflex acenter jbetween">
+			<view class="title">订单类型</view>
+			<view class="right">{{pageData.order_type}}</view>
+		</view>
+		<view class="bottom">
+			<view class="bottom_btn" @click="openOffer" v-if="state == 0">立即接单</view>
+			<view class="bottom_btn bottom_btn2" @click="openSee" v-if="state == 1">已报价，立即查看</view>
+		</view>
+		<u-popup :show="quotation_show" mode="center" :round="10" :closeable="true" :safeAreaInsetBottom="false" @close="close">
+			<view class="popup">
+				<view class="popup_title">立即报价</view>
+				<view class="input_bg hflex acenter">
+					<view class="price">￥</view>
+					<u-input v-model="offer" placeholder="填写你的报价" border="none"></u-input>
+				</view>
+				<view class="hflex acenter">
+					<image src="/static/images/comment/icon_tips.png" style="width: 24rpx;height: 24rpx;padding-right: 6rpx"></image>
+					<view class="popup_info">报价可先不填，可等评估后再填写</view>
+				</view>
+				<view class="hflex acenter" style="padding:30rpx 0 20rpx;">
+					<view class="price">上传图片及资质证明图</view>
+				</view>
+				<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="9"></u-upload>
+				<view class="popup_btn">提交</view>
+			</view>
+		</u-popup>
+		<u-popup :show="detail_show" mode="center" :round="10" :closeable="true" :safeAreaInsetBottom="false" @close="close">
+			<view class="popup">
+				<view class="popup_title">报价信息</view>
+				<view class="popup_name">当前报价</view>
+				<view class="hflex acenter input_bg" v-if="offer_info.offer.length >= 1">
+					<view class="popup_text">第一次报价</view>
+					<view class="red">{{offer_info.offer[0].price}}</view>
+				</view>
+				<view class="hflex acenter input_bg" v-if="offer_info.offer.length >= 2">
+					<view class="popup_text">第二次报价</view>
+					<view class="red">{{offer_info.offer[1].price}}</view>
+				</view>
+				<view class="hflex acenter input_bg" v-if="offer_info.offer.length >= 3">
+					<view class="popup_text">第三次报价</view>
+					<view class="red">{{offer_info.offer[2].price}}</view>
+				</view>
+				<view class="popup_name">图片及资质证明图片</view>
+				<view>
+					<block v-for="(item,index) in offer_info.imgs" :key="index">
+						<image :src="item" style="width: 188rpx;height: 188rpx;margin: 0 14rpx 20rpx 0;border-radius: 16rpx;"></image>
+					</block>
+				</view>
+				<view class="popup_btn">查看详情</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				state: 1,
+				pageData: {
+					avatar: '/static/images/mine/avatar2.jpg',
+					name: 'NANA的微笑',
+					address: '江苏南京市',
+					release_date: '2022-08-08 12:34',
+					fault: '请详细描述故障情况及原因，方便师傅带齐工具，并为您提供准确合理的维修请详细描述故障情况及原因，方便师傅带齐工具，并为提供准确合理的维修请详细描述故障情况及',
+					imgList: ['/static/images/mine/avatar1.jpg','/static/images/mine/avatar1.jpg','/static/images/mine/avatar1.jpg'],
+					phone: '19834874567',
+					repair_date: '2022-08-03至08-04',
+					repair_address: '上海市浦东区滨河路18号江东造船厂',
+					order_type: '快修'
+				},
+				quotation_show: false,
+				offer: '',
+				fileList1: [],
+				detail_show: false,
+				offer_info: {
+					offer: [
+						{
+							index: 1,
+							price: '2,399.89'
+						},
+					],
+					imgs: ['/static/images/mine/avatar2.jpg']
+				}
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 立即接单
+			openOffer() {
+				that.quotation_show = true
+			},
+			// 查看报价
+			openSee() {
+				that.detail_show = true
+			},
+			// 关闭
+			close() {
+				that.quotation_show = false
+				that.detail_show = false
+			},
+			// 删除图片
+			deletePic(event) {
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F4F4F4;
+		.box {
+			width: 690rpx;
+			margin: 20rpx 30rpx 0;
+			background: #FFFFFF;
+			border-radius: 10px;
+			box-sizing: border-box;
+			padding: 20rpx;
+			.avatar {
+				width: 72rpx;
+				height: 72rpx;
+			}
+			.text_style1 {
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 40rpx;
+			}
+			.text_style2 {
+				font-size: 22rpx;
+				font-weight: 400;
+				color: #B7B7B7;
+				line-height: 32rpx;
+			}
+			.text_style3 {
+				font-size: 28rpx;
+				font-weight: 400;
+				color: #444444;
+				line-height: 44rpx;
+			}
+			.img {
+				width: 200rpx;
+				height: 200rpx;
+				border-radius: 12rpx;
+				margin: 0 14rpx 20rpx 0;
+			}
+			.img:nth-child(3n+3) {
+				margin: 0 0 20rpx 0;
+			}
+			.label {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #777777;
+				line-height: 36rpx;
+			}
+			.title {
+				font-size: 30rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 42rpx;
+			}
+			.right {
+				 font-size: 30rpx;
+				 font-weight: 500;
+				 color: #506DFF;
+				 line-height: 42rpx;
+			}
+			.cell {
+				padding: 14rpx 0;
+			}
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 40rpx 74rpx;
+			.bottom_btn {
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			.bottom_btn2 {
+				background: rgba(80,109,255,0.5);
+			}
+		}
+		.popup {
+			width: 670rpx;
+			background: #FFFFFF;
+			border-radius: 10px;
+			box-sizing: border-box;
+			padding: 36rpx 30rpx 24rpx;
+			.popup_title {
+				width: 100%;
+				text-align: center;
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #222222;
+				margin-bottom: 24rpx;
+			}
+			.popup_name {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #222222;
+				padding: 28rpx 0 20rpx;
+			}
+			.popup_text {
+				font-size: 22rpx;
+				font-weight: 500;
+				color: #777777;
+				padding-right: 60rpx;
+			}
+			.input_bg {
+				background: #F4F4F4;
+				border-radius: 8px;
+				box-sizing: border-box;
+				padding: 16rpx 20rpx;
+				margin: 20rpx 0;
+				.price {
+					font-size: 32rpx;
+					font-weight: 500;
+					color: #222222;
+					padding-right: 20rpx;
+				}
+				.u-textarea {
+					background-color: #F4F4F4 !important;
+				}
+				.red {
+					font-size: 28rpx;
+					font-weight: bold;
+					color: #FF3636;
+				}
+			}
+			.popup_info {
+				font-size: 20rpx;
+				font-weight: 400;
+				color: #C0C0C0;
+				line-height: 28rpx;
+			}
+			.popup_btn {
+				width: 610rpx;
+				height: 80rpx;
+				background: #506DFF;
+				border-radius: 40rpx;
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 80rpx;
+				margin: 20rpx 0;
+			}
+		}
+	}
+</style>

page_index/pages/repair/receivingOrder.vue

@@ -0,0 +1,216 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="hflex acenter jbetween cell">
+				<view class="label">姓名</view>
+				<u-input v-model="name" placeholder="请填写姓名" inputAlign="right" border="none"></u-input>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="label">所在单位</view>
+				<u-input v-model="work" placeholder="请填写所在单位名称" inputAlign="right" border="none"></u-input>
+			</view>
+			<view class="cell">
+				<view class="label">营业执照照片</view>
+				<view class="upload hflex acenter jcenter">
+					<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="1" multiple :previewFullImage="true" width="530rpx" height="324rpx">
+						<image src="/static/images/comment/upload-business.png" style="width: 530rpx;height: 324rpx;"></image>
+						<image class="upload_img" src="/static/images/comment/upload-top.png"></image>
+					</u-upload>
+				</view>
+			</view>
+			<view class="cell" style="border: none;">
+				<view class="label">身份证正反面</view>
+				<view class="hflex acenter jbetween" style="margin-top: 28rpx;">
+					<u-upload :fileList="fileList2" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="2" multiple :previewFullImage="true" width="310rpx" height="188rpx">
+						<image src="/static/images/comment/upload-just.png" style="width: 310rpx;height: 188rpx;"></image>
+					</u-upload>
+					<view class="upload2">
+						<u-upload :fileList="fileList3" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="3" multiple :previewFullImage="true" width="310rpx" height="188rpx">
+							<image src="/static/images/comment/upload-back.png" style="width: 310rpx;height: 188rpx;"></image>
+							<image class="upload_img2" src="/static/images/comment/upload-top.png"></image>
+						</u-upload>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="box">
+			<view class="hflex acenter jbetween cell">
+				<view class="label">手机号</view>
+				<u-input v-model="phone" placeholder="请填写你的手机号" inputAlign="right" border="none"></u-input>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="label">邮箱</view>
+				<u-input v-model="eamil" placeholder="请填写你的邮箱" inputAlign="right" border="none"></u-input>
+			</view>
+			<view class="hflex acenter jbetween cell" style="border: none;">
+				<view class="label">地址</view>
+				<u-input v-model="address" placeholder="请填写你的详细地址" inputAlign="right" border="none"></u-input>
+			</view>
+		</view>
+		<view class="box" style="margin-bottom: 186rpx;">
+			<view class="cell vflex jbetween">
+				<view class="label">工作简历</view>
+				<u-input v-model="resume" placeholder="请详细描述你的工作经历" border="none"></u-input>
+			</view>
+			<view class="cell vflex jbetween" style="border: none;">
+				<view class="label">特长</view>
+				<u-input v-model="resume" placeholder="请简单叙述一下你的优点及特长" border="none"></u-input>
+			</view>
+		</view>
+		<view class="bottom">
+			<view class="bottom_btn" @click="open">立即发布</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				name: '',
+				work: '',
+				fileList1: [],
+				fileList2: [],
+				fileList3: [],
+				phone: '',
+				email: '',
+				address: '',
+				resume: '',
+				speciality: '',
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 立即发布
+			open() {
+				if($api.formCheck(that.name,'required') && $api.formCheck(that.work,'required') && $api.formCheck(that.fileList1,'required') && $api.formCheck(that.fileList2,'required') && $api.formCheck(that.fileList3,'required')
+					 && $api.formCheck(that.phone,'mobile') && $api.formCheck(that.email,'email') && $api.formCheck(that.address,'required')&& $api.formCheck(that.resume,'required')&& $api.formCheck(that.speciality,'required')) {
+						 
+				}
+			},
+			// 删除图片
+			deletePic(event) {
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				console.log(event);
+				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F4F4F4;
+		.box {
+			width: 690rpx;
+			margin: 20rpx 30rpx 0;
+			background: #FFFFFF;
+			border-radius: 10px;
+			box-sizing: border-box;
+			padding: 20rpx;
+			.cell {
+				width: 100%;
+				padding: 32rpx 0 24rpx;
+				border-bottom: 1rpx solid #F4F4F4;
+				.label {
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 40rpx;
+				}
+				.upload {
+					box-sizing: border-box;
+					padding: 40rpx 60rpx;
+					position: relative;
+					width: 100%;
+					height: 400rpx;
+					background: #F4F4F4;
+					border-radius: 16rpx;
+					margin-top: 24rpx;
+					.upload_img {
+						position: absolute;
+						width: 120rpx;
+						height: 120rpx;
+						top: 142rpx;
+						left: 266rpx;
+					}
+				}
+				.upload2 {
+					position: relative;
+					.upload_img2 {
+						position: absolute;
+						width: 80rpx;
+						height: 80rpx;
+						top: 40rpx;
+						left: 116rpx;
+					}
+				}
+			}
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 40rpx 74rpx;
+			.bottom_btn {
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			
+		}
+	}
+</style>

page_index/pages/repair/repair.vue

@@ -0,0 +1,777 @@
+<template>
+	<view class="content">
+		<u-navbar title=" " @leftClick="leftClick" :placeholder="true" :autoBack="true">
+			<view slot="center" class="hflex nav">
+				<view class="nav_item" :class="nav_index == 1 ? 'nav_active' : ''" @click="changeNav(nav_index)">维修单</view>
+				<view class="nav_item" :class="nav_index == 2 ? 'nav_active' : ''" @click="changeNav(nav_index)">维修工</view>
+			</view>
+		</u-navbar>
+		<view  v-if="nav_index == 1">
+			<view class="top">
+				<view class="top_title">快修订单</view>
+				<view class="vflex dm_box">
+					<block v-if="domWidth == 0">
+						<view class="hflex dm_scroll" :style="'--dom-width:' + domWidth + ';' ">
+							<view class="hflex acenter dm1">
+								<block v-for="(item,index) in bullet_chat" :key="index">
+									<view class="hflex acenter dm">
+										<image :src="item.avatar" class="dm_img"></image>
+										<view class="dm_text hflex">{{item.text}}</view>
+									</view>
+								</block>
+							</view>
+						</view>
+					</block>
+					<block v-else>
+						<view class="hflex dm_scroll" :style="'--dom-width:' + domWidth + ';' ">
+							<view class="hflex acenter dm1">
+								<block v-for="(item,index) in bullet_chat" :key="index">
+									<view class="hflex acenter dm">
+										<image :src="item.avatar" class="dm_img"></image>
+										<view class="dm_text hflex">{{item.text}}</view>
+									</view>
+								</block>
+							</view>
+							<view class="hflex acenter ">
+								<block v-for="(item,index) in bullet_chat" :key="index">
+									<view class="hflex acenter dm">
+										<image :src="item.avatar" class="dm_img"></image>
+										<view class="dm_text hflex">{{item.text}}</view>
+									</view>
+								</block>
+							</view>
+						</view>
+					</block>
+					
+					<block v-if="domWidth == 0">
+						<view class="hflex dm_scroll" :style="'--dom-width:' + domWidth + ';' ">
+							<view class="hflex acenter dm1">
+								<block v-for="(item,index) in bullet_chat" :key="index">
+									<view class="hflex acenter dm">
+										<image :src="item.avatar" class="dm_img"></image>
+										<view class="dm_text hflex">{{item.text}}</view>
+									</view>
+								</block>
+							</view>
+						</view>
+					</block>
+					<block v-else>
+						<view class="hflex dm_scroll1" :style="'--dom-width:' + domWidth + ';' ">
+							<view class="hflex acenter dm1">
+								<block v-for="(item,index) in bullet_chat" :key="index">
+									<view class="hflex acenter dm">
+										<image :src="item.avatar" class="dm_img"></image>
+										<view class="dm_text hflex">{{item.text}}</view>
+									</view>
+								</block>
+							</view>
+							<view class="hflex acenter ">
+								<block v-for="(item,index) in bullet_chat" :key="index">
+									<view class="hflex acenter dm">
+										<image :src="item.avatar" class="dm_img"></image>
+										<view class="dm_text hflex">{{item.text}}</view>
+									</view>
+								</block>
+							</view>
+						</view>
+					</block>
+				</view>
+				
+			</view>
+			<view class="box">
+				<view class="hflex acenter jbetween">
+					<block v-for="(item,index) in tabs" :key="index">
+						<view class="tabs_item" @click="changeTab(item.index)" :class="tabs_active == item.index?'tabs_active':''">{{item.name}}</view>
+					</block>
+				</view>
+				<view class="list">
+					<block v-for="(item,index) in pageList" :key="index">
+						<view class="list_item" @click="orderDetail(item.id)">
+							<view class="item_top hflex acenter jbetween">
+								<view class="hflex acenter" v-if="item.type == 0">
+									<image src="/static/images/comment/repair1.png" class="top_img"></image>
+									<view class="top_text">普修</view>
+								</view>
+								<view class="hflex acenter" v-if="item.type == 1">
+									<image src="/static/images/comment/repair2.png" class="top_img"></image>
+									<view class="">快修</view>
+								</view>
+								<view class="top_btn" @click="meetOrder(item.id)">接单</view>
+							</view>
+							<view class="item_name cell text_hide">{{item.name}}</view>
+							<view class="hflex acenter cell">
+								<u-icon name="map-fill" color="#888888" size="14"></u-icon>
+								<view class="text_style1" style="padding-left: 16rpx;">{{item.address}}</view>
+							</view>
+							<view class="hflex acenter cell">
+								<u-icon name="clock-fill" color="#888888" size="14"></u-icon>
+								<view class="text_style1" style="padding-left: 16rpx;">维修时间：{{item.repair_date}}</view>
+							</view>
+							<view class="img_list cell">
+								<block v-for="(item2,index2) in item.imgsList" :key="index2">
+									<image :src="item2.src" class="item_img"></image>
+								</block>
+							</view>
+							<view class="item_bottom hflex acenter jbetween">
+								<view class="hflex acenter">
+									<image :src="item.user.avatar" class="bottom_img"></image>
+									<view class="bottom_text" style="padding-left: 8rpx;">{{item.user.name}}</view>
+								</view>
+								<view class="bottom_text">发布于{{item.user.release_date}}</view>
+							</view>
+						</view>
+					</block>
+				</view>
+			</view>
+			
+		</view>
+		<view class="" v-if="nav_index == 2">
+			<view class="search">
+				<u-input v-model="serach_value" type="text" :border="true" placeholder="输入搜索关键词" shape="circle"
+					prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399">
+					<template slot="suffix">
+						<view>搜索</view>
+					</template>
+				</u-input>
+			</view>
+			<block v-for="(item,index) in pageList2" :key="index">
+				<view class="box1 hflex" @click="toDetail2(item.id)">
+					<image :src="item.avatar" class="item_avatar"></image>
+					<view class="vflex" style="padding-left: 20rpx;">
+						<view class="hflex aend">
+							<view class="item_name">{{item.name}}</view>
+							<view class="text_style1"style="padding-left: 8rpx;">{{item.phone}}</view>
+						</view>
+						<view class="hflex acenter cell">
+							<image src="/static/images/comment/company.png" class="item_icon"></image>
+							<view class="text_style1" style="padding-left: 16rpx;">{{item.company}}</view>
+						</view>
+						<view class="hflex astart cell">
+							<u-icon name="map-fill" color="#b8b8b8" size="14"></u-icon>
+							<view class="text_style1" style="padding-left: 16rpx;">{{item.address}}</view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<view class="add" v-show="!repair_show">
+			<image src="/static/images/comment/add.png" @click="openRelease" class="add_img"></image>
+		</view>
+		<view class="add2" v-show="repair_show">
+			<view class="add vflex aend">
+				<view class="hflex acenter jcenter release_box" @click="receivingOrder">
+					<image src="/static/images/comment/repair_icon1.png" class="box_img"></image>
+					<view class="box_text">维修工发布接单需求</view>
+				</view>
+				<view class="hflex acenter jcenter release_box" @click="repairOrder">
+					<image src="/static/images/comment/repair_icon2.png" class="box_img"></image>
+					<view class="box_text">船老板发布维修订单</view>
+				</view>
+				<image src="/static/images/comment/close.png" @click="close" class="add_img"></image>
+			</view>
+		</view>
+		<u-modal :show="show_tips" :closeOnClickOverlay="true" :showConfirmButton="false">
+			<view class="popup1">
+				<image src="/static/images/comment/small-bell.png" class="popup_img"></image>
+				<view class="popup1_title">温馨提示</view>
+				<view class="popup1_text">您还不是维修工，不能参与报价，可立即申请成为维修工</view>
+				<view class="popup1_btn" @click="toApply">立即申请</view>
+				<view class="popup1_text" style="margin: 36rpx 0 56rpx;" @click="close">暂不</view>
+			</view>
+		</u-modal>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				nav_index: 1,
+				domWidth: 0,
+				bullet_chat: [
+					{
+						index: 1,
+						avatar: '/static/images/mine/avatar1.jpg',
+						text: '红木家具打蜡保养',
+					},
+					{
+						index: 1,
+						avatar: '/static/images/mine/avatar1.jpg',
+						text: '红木家具打蜡保养',
+					},
+					{
+						index: 1,
+						avatar: '/static/images/mine/avatar1.jpg',
+						text: '红木家具打蜡保养',
+					},
+					
+				],
+				tabs: [
+					{
+						index: 0,
+						name: '全部'
+					},
+					{
+						index: 1,
+						name: '快修'
+					},
+					{
+						index: 2,
+						name: '普修'
+					}
+				],
+				tabs_active: 0,
+				pageList: [
+					{
+						id: 1,
+						type: 0,
+						name: '红木家具打蜡保养红木家具打蜡保养红木保养红木家具打蜡保养红木家具打蜡保养红木保养',
+						address: '浦东区 滨河路 江东造船厂24号',
+						repair_date: '2022-08-03至08-04',
+						imgsList: [
+							{
+								src: '/static/images/mine/avatar2.jpg',
+							},
+							{
+								src: '/static/images/mine/avatar2.jpg',
+							},
+							{
+								src: '/static/images/mine/avatar2.jpg',
+							},
+							
+						],
+						user: {
+							avatar: '/static/images/mine/avatar1.jpg',
+							name: '咖喱录音',
+							release_date: '2022-08-08 12:34'
+						}
+					},
+					{
+						id: 1,
+						type: 0,
+						name: '红木家具打蜡保养红木家具打蜡保养红木保养红木家具打蜡保养红木家具打蜡保养红木保养',
+						address: '浦东区 滨河路 江东造船厂24号',
+						repair_date: '2022-08-03至08-04',
+						imgsList: [
+							{
+								src: '/static/images/mine/avatar2.jpg',
+							},
+							{
+								src: '/static/images/mine/avatar2.jpg',
+							},
+							{
+								src: '/static/images/mine/avatar2.jpg',
+							},
+							
+						],
+						user: {
+							avatar: '/static/images/mine/avatar1.jpg',
+							name: '咖喱录音',
+							release_date: '2022-08-08 12:34'
+						}
+					},
+					{
+						id: 1,
+						type: 0,
+						name: '红木家具打蜡保养红木家具打蜡保养红木保养红木家具打蜡保养红木家具打蜡保养红木保养',
+						address: '浦东区 滨河路 江东造船厂24号',
+						repair_date: '2022-08-03至08-04',
+						imgsList: [
+							{
+								src: '/static/images/mine/avatar2.jpg',
+							},
+							{
+								src: '/static/images/mine/avatar2.jpg',
+							},
+							{
+								src: '/static/images/mine/avatar2.jpg',
+							},
+							
+						],
+						user: {
+							avatar: '/static/images/mine/avatar1.jpg',
+							name: '咖喱录音',
+							release_date: '2022-08-08 12:34'
+						}
+					}
+				],
+				temp: '',
+				repair_show: false,
+				serach_value: '',
+				pageList2: [
+					{
+						id: 1,
+						avatar: '/static/images/mine/avatar1.jpg',
+						name: '张美华',
+						phone: '189235767865',
+						company: '博锐船舶器械维修厂',
+						address: '浦东区 滨河路 江东造船厂'
+					},
+					{
+						id: 1,
+						avatar: '/static/images/mine/avatar1.jpg',
+						name: '张美华',
+						phone: '189235767865',
+						company: '博锐船舶器械维修厂',
+						address: '浦东区 滨河路 江东造船厂'
+					},
+					{
+						id: 1,
+						avatar: '/static/images/mine/avatar1.jpg',
+						name: '张美华',
+						phone: '189235767865',
+						company: '博锐船舶器械维修厂',
+						address: '浦东区 滨河路 江东造船厂'
+					}
+				],
+				is_maintenance: true,
+				show_tips: false,
+			}
+		},
+		onLoad() {
+			that = this
+			
+		},
+		mounted() {
+			const query = uni.createSelectorQuery().in(this);
+			query.select('.dm1').boundingClientRect(data => {
+				console.log(data);
+			  that.domWidth = `-${data.width}px`
+			  that.temp = `${that.domWidth};`
+			  console.log(that.temp);
+			}).exec();
+		},
+		methods: {
+			// 返回
+			leftClick() {
+				console.log('返回');
+				$api.jump(-1)
+			},
+			// 切换导航栏
+			changeNav(index) {
+				if (index == 1) {
+					that.nav_index = 2
+				} else {
+					that.nav_index = 1
+				}
+			},
+			// 切换tabs
+			changeTab(index) {
+				that.tabs_active = index
+			},
+			// 点击加号
+			openRelease() {
+				that.repair_show = true
+			},
+			// 关闭
+			close() {
+				that.repair_show = false
+				that.show_tips = false
+			},
+			// 发布接单需求
+			receivingOrder() {
+				console.log(that.is_maintenance);
+				if(that.is_maintenance) {
+					$api.jump('/page_index/pages/repair/receivingOrder')
+					that.close()
+				} else {
+					that.show_tips = true
+				}
+				
+			},
+			// 去申请
+			toApply() {
+				that.is_maintenance = true
+				that.close()
+			},
+			// 发布维修订单
+			repairOrder() {
+				$api.jump('/page_index/pages/repair/repairOrder')
+				that.close()
+			},
+			// 接单
+			meetOrder(id) {
+				if(that.is_maintenance) {
+					
+				} else {
+					that.show_tips = true
+				}
+			},
+			// 订单详情
+			orderDetail(id) {
+				$api.jump('/page_index/pages/repair/orderDetail?id=' + id)
+			},
+			// 维修工详情
+			toDetail2(id) {
+				$api.jump('/page_index/pages/repair/repairDetail?id=' + id)
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F4F4F4;
+		.nav {
+			width: 350rpx;
+			height: 60rpx;
+			background: #F4F4F4;
+			border-radius: 30rpx;
+			font-size: 28rpx;
+			font-weight: 400;
+			color: #020202;
+			.nav_item {
+				width: 50%;
+				height: 60rpx;
+				background: #F4F4F4;
+				border-radius: 15px;
+				text-align: center;
+				line-height: 60rpx;
+			}
+			.nav_active {
+				background: #506DFF;
+				color: #FFFFFF;
+			}
+		}
+		.top {
+			width: 100%;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 20rpx 0 0;
+			.top_title {
+				width: 100%;
+				padding-left: 20rpx;
+				padding-bottom: 20rpx;
+				border-bottom: 1rpx solid #F4F4F4;
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #222222;
+				position: relative;
+			}
+			.top_title::before {
+				content: '';
+				width: 8rpx;
+				height: 28rpx;
+				background: #506DFF;
+				position: absolute;
+				left: 0;
+				top: 5rpx;
+			}
+			.dm_box {
+				width: 100%;
+				height: 162rpx;
+				overflow: hidden;
+				position: relative;
+				
+				.dm {
+					width: 276rpx;
+					height: 48rpx;
+					background: #E7EBFF;
+					border-radius: 36rpx;
+					margin: 0 17rpx;
+					
+					.dm_img {
+						width: 44rpx;
+						height: 44rpx;
+						border-radius: 50%;
+					}
+					.dm_text {
+						margin-left: 12rpx;
+						font-size: 24rpx;
+						font-weight: 400;
+						color: #222222;
+					}
+					
+				}
+			}
+		}
+		.box {
+			margin-top: 20rpx;
+			width: 100%;
+			box-sizing: border-box;
+			background: linear-gradient(180deg, #FFFFFF 0%, #F4F4F4 100%);
+			padding: 20rpx 30rpx 88rpx;
+			.tabs_item {
+				width: 33%;
+				font-size: 32rpx;
+				font-weight: 400;
+				color: #666666;
+				text-align: center;
+			}
+			.tabs_active {
+				position: relative;
+				font-weight: 500;
+				color: #222222;
+			}
+			.tabs_active::after{
+				content: "";
+				position: absolute;
+				width: 64rpx;
+				height: 12rpx;
+				background: linear-gradient(270deg, #F9F9F9 0%, #506DFF 100%);
+				border-radius: 6rpx;
+				opacity: 0.8;
+				bottom: 0;
+				left: 38%;
+			}
+			.list {
+				.list_item {
+					margin-top: 20rpx;
+					background: #FFFFFF;
+					border-radius: 16rpx;
+					box-sizing: border-box;
+					padding: 20rpx;
+					.item_top {
+						padding: 0 0 12rpx;
+						border-bottom: 1rpx solid #F4F4F4;
+						.top_img {
+							width: 40rpx;
+							height: 40rpx;
+							margin-right: 8rpx;
+						}
+						.top_text {
+							font-size: 28rpx;
+							font-weight: 500;
+							color: #222222;
+						}
+						.top_btn {
+							text-align: center;
+							width: 132rpx;
+							height: 52rpx;
+							line-height: 52rpx;
+							background: #506DFF;
+							box-shadow: 0px 0px 16rpx 0px rgba(80,109,255,0.42);
+							border-radius: 26rpx;
+							font-size: 26rpx;
+							font-weight: 400;
+							color: #FFFFFF;
+						}
+					}
+					.item_name {
+						font-size: 30rpx;
+						font-weight: 500;
+						color: #222222;
+					}
+					.cell {
+						padding: 10rpx 0;
+					}
+					.text_style1 {
+						font-size: 26rpx;
+						font-weight: 400;
+						color: #222222;
+					}
+					.img_list {
+						.item_img {
+							width: 212rpx;
+							height: 160rpx;
+							border-radius: 8rpx;
+							margin: 0 8rpx 20rpx 0;
+						}
+						.item_img:nth-child(3n) {
+							margin: 0 0 20rpx;
+						}
+					}
+					.item_bottom {
+						width: 100%;
+						padding-top: 26rpx;
+						border-top: 1rpx solid #F4F4F4;
+						.bottom_img {
+							width: 40rpx;
+							height: 40rpx;
+							border-radius: 50%;
+						} 
+						.bottom_text {
+							font-size: 24rpx;
+							font-weight: 400;
+							color: #999999;
+						}
+					}
+					
+				}
+			}
+		}
+		.add {
+			position: fixed;
+			right: 30rpx;
+			bottom: 186rpx;
+			z-index: 99;
+			.add_img {
+				width: 96rpx;
+				height: 96rpx;
+			}
+		}
+		.add2 {
+			position: fixed;
+			left: 0;
+			top: 0;
+			width: 100%;
+			height: 100%;
+			background-color: rgba(0, 0, 0, .3);
+			z-index: 99;
+			.add {
+				position: fixed;
+				right: 30rpx;
+				bottom: 186rpx;
+				.release_box {
+					width: 320rpx;
+					height: 72rpx;
+					opacity: 1;
+					background: linear-gradient(270deg, #88A6FF 0%, #506DFF 100%);
+					border-radius: 40rpx;
+					margin-bottom: 40rpx;
+					.box_img {
+						width: 32rpx;
+						height: 32rpx;
+					}
+					.box_text {
+						font-size: 26rpx;
+						font-weight: 400;
+						color: #FFFFFF;
+						padding-left: 10rpx;
+					}
+				}
+				.add_img {
+					width: 72rpx;
+					height: 72rpx;
+				}
+			}
+		}
+		.search {
+			// background: #fff;
+			width: 100%;
+			height: 88rpx;
+			box-sizing: border-box;
+			padding: 12rpx 30rpx;
+			.u-input {
+				background-color: #fff;
+				height: 64rpx;
+				padding: 0 0 0 18rpx !important;
+				border: 1rpx solid #506Dff;
+				margin-bottom: 12rpx;
+			}
+			.u-input__content__subfix-icon {
+				width: 128rpx;
+				height: 64rpx;
+				background-color: #506Dff;
+				border-radius: 32rpx;
+				color: #fff;
+				font-size: 28rpx;
+				text-align: center;
+				line-height: 64rpx;
+			}
+		}
+		.box1 {
+			// width: 100%;
+			background: #FFFFFF;
+			border-radius: 8px;
+			box-sizing: border-box;
+			padding: 24rpx 20rpx;
+			margin: 20rpx 30rpx;
+			.item_avatar {
+				width: 84rpx;
+				height: 84rpx;
+				border-radius: 50%;
+			}
+			.cell {
+				margin-top: 20rpx;
+			}
+			.item_icon {
+				width: 28rpx;
+				height: 28rpx;
+			}
+			.text_style1 {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #555555;
+			}
+			.item_name {
+				font-size: 30rpx;
+				font-weight: 500;
+				color: #222222;
+			}
+		}
+		.u-popup__content {
+			overflow: unset !important;
+		}
+		.u-modal__content {
+			padding: 0 !important;
+		}
+		.u-modal {
+			width: 530rpx !important;
+			background: url('/static/images/comment/eject.png') no-repeat;
+			background-size: 100%;
+			overflow: unset !important; 
+		}
+		.popup1 {
+			width: 530rpx;
+			height: 520rpx;
+			border-radius: 40rpx;
+			position: relative;
+			box-sizing: border-box;
+			padding: 0 40rpx 40rpx;
+			.popup_img {
+				width: 174rpx;
+				height: 172rpx;
+				position: absolute;
+				top: -50rpx;
+				left: 178rpx;
+				z-index: 99;
+			}
+			.popup1_title {
+				margin-top: 134rpx;
+				text-align: center;
+				font-size: 48rpx;
+				font-weight: 400;
+				color: #222222;
+			}
+			
+			.popup1_text {
+				width: 100%;
+				text-align: center;
+				font-size: 28rpx;
+				font-weight: 400;
+				color: #666666;
+				margin: 44rpx auto 52rpx;
+			}
+			.popup1_btn {
+				margin: 0 auto;
+				width: 310rpx;
+				height: 84rpx;
+				background: linear-gradient(90deg, #506DFF 0%, #88A6FF 100%);
+				box-shadow: 0px 4rpx 24rpx 0px rgba(90,119,255,0.36);
+				border-radius: 42rpx;
+				text-align: center;
+				line-height: 84rpx;
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+			}
+		}
+	}
+	.dm_scroll {
+		position:absolute;
+		top: 24rpx;
+		left: 0%;
+		animation: rowScrollTest 10s linear infinite;
+	}
+	.dm_scroll1 {
+		position:absolute;
+		top: 96rpx;
+		left: 0%;
+		animation: rowScrollTest 12s linear infinite;
+	}
+	
+	@keyframes rowScrollTest {
+		from {
+			// left: 100%;
+			transform: translateX(1);
+		}
+		to {
+			// left: 0%;
+			transform: translateX(var(--dom-width));
+		}
+		
+	}
+</style>

page_index/pages/repair/repairDetail.vue

@@ -0,0 +1,135 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="hflex acenter cell">
+				<u-avatar :src="pageData.avatar"></u-avatar>
+				<view class="name">{{pageData.name}}</view>
+			</view>
+			<view class="hflex acenter cell">
+				<u-icon name="phone-fill" color="#666666" size="14"></u-icon>
+				<view class="text_style1">{{pageData.phone}}</view>
+			</view>
+			<view class="hflex acenter cell">
+				<u-icon name="email-fill" color="#666666" size="14"></u-icon>
+				<view class="text_style1">{{pageData.email}}</view>
+			</view>
+			<view class="hflex acenter cell">
+				<image src="/static/images/comment/company.png" class="icon"></image>
+				<view class="text_style1">{{pageData.company_name}}</view>
+			</view>
+			<view class="hflex acenter cell">
+				<u-icon name="map-fill" color="#666666" size="14"></u-icon>
+				<view class="text_style1">{{pageData.address}}</view>
+			</view>
+		</view>
+		<view class="box">
+			<view class="title cell">营业执照照片</view>
+			<image :src="pageData.license" mode="aspectFill" class="img1 cell"></image>
+			<view class="line"></view>
+			<view class="title cell">身份证正反面</view>
+			<view class="hflex acenter jbetween cell">
+				<image :src="pageData.card_photo[0]"  mode="aspectFill" class="img2"></image>
+				<image :src="pageData.card_photo[0]" mode="aspectFill" class="img2"></image>
+			</view>
+		</view>
+		<view class="box" style="margin-bottom: 72rpx;">
+			<view class="title cell">工作简历</view>
+			<view class="cell text_style2">{{pageData.resume}}</view>
+			<view class="line"></view>
+			<view class="title cell">维修特长</view>
+			<view class="cell text_style2">{{pageData.speciality}}</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageData: {
+					avatar: '/static/images/mine/avatar1.jpg',
+					name: '孙勤政',
+					phone: '18923465789',
+					email: '18923465789@163.com',
+					company_name: '博锐船舶器械维修厂',
+					address: '上海市普陀区丹巴路382号104室',
+					license: '/static/images/index/class_img1.png',
+					card_photo: ['/static/images/index/class_img3.png','/static/images/index/class_img4.png'],
+					resume: '在xx公司担任工程设计师一职，为人和善，平易近人，工作能力很强，专业技术过硬',
+					speciality: '喜欢摄影、运动细胞很发达',
+				}
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: url('/static/images/comment/background.png') #F4F4F4 no-repeat;
+		background-size: 100%;
+		padding: 0 30rpx;
+		.box {
+			background: #FFFFFF;
+			border-radius: 10px;
+			box-sizing: border-box;
+			padding: 0 20rpx 15rpx;
+			margin-top: 20rpx;
+			.cell {
+				padding:  14rpx 0;
+				.icon {
+					width: 28rpx;
+					height: 28rpx;
+				}
+			}
+			.name {
+				font-size: 30rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 42rpx;
+				padding-left: 20rpx;
+			}
+			.text_style1 {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 30rpx;
+				padding-left: 20rpx;
+			}
+			.title {
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 40rpx;
+			}
+			.img1 {
+				width: 100%;
+				height: 400rpx;
+				border-radius: 12rpx;
+			}
+			.line {
+				width: 100%;
+				height: 1rpx;
+				background: #F4F4F4;
+			}
+			.img2 {
+				width: 310rpx;
+				height: 228rpx;
+				border-radius: 12rpx;
+			}
+			.text_style2 {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 36rpx;
+			}
+		}
+	}
+</style>

page_index/pages/repair/repairOrder.vue

@@ -0,0 +1,224 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="cell">
+				<view class="label required">产品图片</view>
+				<view>
+					<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" :maxCount="9" name="1" multiple :previewFullImage="true" width="200rpx" height="200rpx">
+						<image src="/static/images/comment/add-img.png" style="width: 200rpx;height: 200rpx;"></image>
+					</u-upload>
+				</view>
+			</view>
+			<view class="cell">
+				<view class="label required">维修时间</view>
+				<view class="hflex acenter jbetween">
+					<view @click="open(1)">
+						<u-input v-model="startTime" border="none" placeholder="开始时间"></u-input>
+					</view>
+					<u-datetime-picker title="开始时间" :show="show_time1" :minDate="newDate" v-model="newDate" ref="datetimePicker" @confirm="confirmTime1" @cancel="cancel" :formatter="formatter" mode="date"></u-datetime-picker>
+					<view style="margin: 0 20rpx;">-</view>
+					<view @click="open(2)">
+						<u-input v-model="endTime" border="none" placeholder="结束时间"></u-input>
+					</view>
+					<u-datetime-picker title="结束时间" :show="show_time2" :minDate="newDate" v-model="newDate" ref="datetimePicker" @confirm="confirmTime2" @cancel="cancel" :formatter="formatter" mode="date"></u-datetime-picker>
+				</view>
+			</view>
+			<view class="cell">
+				<view class="label required">维修地点</view>
+				<view>
+					<u-input v-model="address" border="none" placeholder="请选择"  suffixIcon="arrow-right"></u-input>
+				</view>
+			</view>
+			<view class="cell">
+				<view class="label required">故障描述</view>
+				<view>
+					<u--textarea v-model="fault" maxlength="300" placeholder="请详细描述故障情况及原因,方便师傅带齐工具,并为您提供准确合理的维修" border="none" count></u--textarea>
+				</view>
+			</view>
+		</view>
+		<view class="box">
+			<view class="hflex acenter jbetween">
+				<view class="label">是否快修</view>
+				<u-switch v-model="is_quick" activeColor="#506dff" @change="change"></u-switch>
+			</view>
+		</view> 
+		<view class="bottom">
+			<view class="bottom_btn" @click="release">立即发布</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				fileList1: [],
+				fault: '',
+				is_quick: false,
+				startTime: '',
+				endTime: '',
+				address: '',
+				show_time1: false,
+				show_time2: false,
+				newDate: Number(new Date()),
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		onReady() {
+			// 微信小程序需要用此写法
+			this.$refs.datetimePicker.setFormatter(this.formatter)
+		},
+		methods: {
+			// 格式化日期选择
+			formatter(type, value) {
+				if (type === 'year') {
+					return `${value}年`
+				}
+				if (type === 'month') {
+					return `${value}月`
+				}
+				if (type === 'day') {
+					return `${value}日`
+				}
+				return value
+			},
+			// 删除图片
+			deletePic(event) {
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				console.log(event);
+				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+			// 是否快修
+			change(e) {
+				that.is_quick = e
+			},
+			// 打开选择器
+			open(index) {
+				if(index == 1) {
+					that.show_time1 = true
+				} else {
+					that.show_time2 = true
+				}
+			},
+			cancel() {
+				that.show_time1 = false
+				that.show_time2 = false
+			},
+			confirmTime1(e) {
+				that.startTime = $api.formatDate(e)
+				that.cancel()
+			},
+			confirmTime2(e) {
+				that.endTime = $api.formatDate(e)
+				that.cancel()
+			},
+			// 立即发布
+			release() {
+				if($api.formCheck(that.fileList1,'required') &&$api.formCheck(that.fault,'required') && $api.formCheck(that.startTime,'required') && $api.formCheck(that.endTime,'required')&& $api.formCheck(that.endTime,'required') ) {
+					
+				}
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F4F4F4;
+		.box {
+			width: 690rpx;
+			margin: 20rpx 30rpx 0;
+			background: #FFFFFF;
+			border-radius: 10px;
+			box-sizing: border-box;
+			padding: 20rpx;
+			.cell {
+				padding: 32rpx 0 0;
+				.label {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #222222;
+					padding-bottom: 28rpx;
+				}
+				.required {
+					position: relative;
+					padding-left: 15rpx;
+				}
+				.required::after {
+					content: '*';
+					position: absolute;
+					top: 5rpx;
+					left: 0;
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #FF3232;
+				}
+			}
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 40rpx 74rpx;
+			.bottom_btn {
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			
+		}
+	}
+</style>

page_index/pages/resources/resourDetail.vue

@@ -0,0 +1,112 @@
+<template>
+	<view class="content">
+		<view class="top hflex acenter">
+			<image src="/static/images/comment/company1.png" class="top_img"></image>
+			<view class="top_text">{{pageData.name}}</view>
+		</view>
+		<view class="box">
+			<view class="tabs hflex acenter jcenter">
+				<view class="tabs_item" :class="tab_active == 1 ? 'tab_active' : ''" @click="changeTab(1)">规则</view>
+				<view class="tabs_item" :class="tab_active == 2 ? 'tab_active' : ''" @click="changeTab(2)">公约</view>
+			</view>
+			<view class="text">
+				<u-parse :content="content"></u-parse>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageData: {
+					name: '重庆长江轮船有限公司江湾船厂',
+					rule: '根据《中华人民共和国价格法》、《中华人民共和国商业银行法》、《商业银行服务价格管理办法》、《国家发展改革委 中国银监会关于印发商业银行服务政府指导价政府定价目录的通知》、《中国银保监会关于规范银行服务市场调节价管理的指导意见》等规定，按照“收费项目公开、服务质价公开、效用功能公开、优惠政策公开”的“四公开”要求，现将本行各项金融服务价格标准予以公告。本公告内容包括服务提示、政府指导价政府定价项目价格标准、中国农业银行免费服务项目及中国农业银行市场调节价服务价格标准等，自2022年4月30日起执行。',
+					convention:'根据《中华人民共和国价格法》、《中华人民共和国商业银行法》、《商业银行服务价格管理办法》、《国家发展改革委 中国银监会关于印发商业银行服务政府指导价政府定价目录的通知》、《中国银保监会关于规范银行服务市场调节价管理的指导意见》等规定，按照“收费项目公开、服务质价公开、效用功能公开、优惠政策公开”的“四公开”要求，现将本行各项金融服务价格标准予以公告。本公告内容包括服务提示、政府指导价政府定价项目价格标准、中国农业银行免费服务项目及中国农业银行市场调节价服务价格标准等，自2022年4月30日起执行。',
+				},
+				content: '',
+				tab_active: 1
+			}
+		},
+		onLoad() {
+			that = this
+			that.content = that.pageData.rule
+		},
+		methods: {
+			// 切换tab
+			changeTab(index) {
+				that.tab_active = index
+				if(index == 1) {
+					that.content = that.pageData.rule
+				} else {
+					that.content = that.pageData.convention
+				}
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F4F4F4;
+		.top {
+			width: 100%;
+			height: 120rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 36rpx 30rpx;
+			.top_img {
+				width: 48rpx;
+				height: 48rpx;
+			}
+			.top_text {
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 50rpx;
+				padding-left: 12rpx;
+			}
+		}
+		.box {
+			margin: 20rpx 0 0;
+			width: 100%;
+			min-height: calc(100vh - 140rpx);
+			background: #FFFFFF;
+			.tabs {
+				width: 100%;
+				padding: 24rpx 0 16rpx;
+				border-bottom: 1rpx solid #F4F4F4;
+				.tabs_item {
+					width: 50%;
+					text-align: center;
+					font-size: 30rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 42rpx;
+				}
+				.tab_active {
+					color: #506DFF;
+					position: relative;
+				}
+				.tab_active::after {
+					position: absolute;
+					content: "";
+					bottom: -16rpx;
+					left: 160rpx;
+					width: 60rpx;
+					height: 6rpx;
+					background: #506DFF;
+					border-radius: 8rpx;
+				}
+			}
+			.text {
+				width: 100%;
+				box-sizing: border-box;
+				padding: 30rpx;
+			}
+		}
+	}
+</style>

page_index/pages/resources/resources.vue

@@ -0,0 +1,153 @@
+<template>
+	<view class="content">
+		<view class="hflex acenter jbetween">
+			<view class="top_bg">
+				<view class="top" @click="toRule">规则</view>
+			</view>
+			<view class="top_bg">
+				<view class="top">公约</view>
+			</view>
+			<view class="top_bg">
+				<view class="top">供方认可机构清单</view>
+			</view>
+		</view>
+		<view class="">
+			<block v-for="(item,index) in pageList" :key="index">
+				<view class="box">
+					<view class="box_name">{{item.name}}</view>
+					<view class="text_style1 text_hide">规则：{{item.rule}}</view>
+					<view class="text_style1 text_hide">公约：{{item.convention}}</view>
+					<view class="bottom hflex jend">
+						<view class="btn" @click="toDetail(item.id)">查看详情</view>
+					</view>
+				</view>
+			</block>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageList: [
+					{
+						id: 1,
+						name: '重庆长江轮船有限公司江湾船厂',
+						rule: '古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+						convention:'古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+					},
+					{
+						id: 1,
+						name: '重庆长江轮船有限公司江湾船厂',
+						rule: '古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+						convention:'古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+					},
+					{
+						id: 1,
+						name: '重庆长江轮船有限公司江湾船厂',
+						rule: '古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+						convention:'古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+					},
+					{
+						id: 1,
+						name: '重庆长江轮船有限公司江湾船厂',
+						rule: '古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+						convention:'古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+					},
+					{
+						id: 1,
+						name: '重庆长江轮船有限公司江湾船厂',
+						rule: '古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+						convention:'古宥村船溪二港北帝庙周边环境改造工程—招标项目的潜在投标…',
+					}
+				],
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 查看详情
+			toDetail(id) {
+				$api.jump('/page_index/pages/resources/resourDetail?id=' + id)
+			},
+			// 规则
+			toRule() {
+				$api.jump('/page_index/pages/resources/rule')
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		padding: 20rpx 30rpx;
+		background: #F4F4F4;
+		.top_bg {
+			height: 64rpx;
+			box-sizing: border-box;
+			padding: 0 60rpx;
+			background: #506DFF;
+			border-radius: 12rpx;
+			.top {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #FFFFFF;
+				line-height: 64rpx;
+				position: relative;
+			}
+			.top::before {
+				position: absolute;
+				content: "";
+				width: 8rpx;
+				height: 8rpx;
+				background: #FFB33A;
+				border-radius: 50%;
+				top: 32rpx;
+				left: -16rpx;
+			}
+		}
+		
+		.box {
+			width: 100%;
+			margin-top: 20rpx;
+			background: #FFFFFF;
+			border-radius: 24rpx;
+			box-sizing: border-box;
+			padding: 24rpx 20rpx;
+			.box_name {
+				font-size: 30rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 42rpx;
+				padding-bottom: 20rpx;
+			}
+			.text_style1 {
+				font-size: 20rpx;
+				font-weight: 400;
+				color: #999999;
+				line-height: 28rpx;
+				padding-bottom: 20rpx;
+			}
+			.bottom {
+				width: 100%;
+				padding: 20rpx 0 0;
+				border-top: 1rpx solid #F4F4F4;
+				.btn {
+					width: 148rpx;
+					height: 52rpx;
+					border-radius: 28rpx;
+					border: 1px solid #506DFF;
+					text-align: center;
+					line-height: 52rpx;
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #506DFF;
+				}
+			}
+		}
+	}
+</style>

page_index/pages/resources/rule.vue

@@ -0,0 +1,30 @@
+<template>
+	<view class="content">
+		<u-parse :content="content"></u-parse>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				content: ''
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background-color: #fff;
+		padding: 24rpx 30rpx;
+	}
+</style>

page_mine/pages/order/detail.vue

@@ -0,0 +1,251 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<order-top :name="name" :phone="phone" :type="type"></order-top>
+		</view>
+		<view class="box" style="margin-bottom: 186rpx;">
+			<view class="box1">
+				<view class="title">商品明细</view>
+				<view class="list">
+					<block v-for="(item,index) in goodsList" :key="index">
+						<view class="list_item">
+							<view class="item_title">{{item.name}}</view>
+							<view class="hflex acenter item_cell">
+								<view class="item_text" v-if="item.norm">规格型号：{{item.norm}}/桶</view>
+								<view class="item_text" v-if="item.num">生产数量：{{item.norm}}/桶</view>
+							</view>
+							<view class="hflex acenter jbetween" style="margin-top: 20rpx;">
+								<view class="hflex acenter">
+									<image src="/static/images/comment/icon_pdf.png" class="item_img"></image>
+									<view class="text_style1">{{item.enclosure_name}}</view>
+								</view>
+								<view class="hflex acenter jcenter item_btn">
+									<u-icon name="download" color="#506DFF" size="10"></u-icon>
+									<view>下载附件</view>
+								</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				<view class="text_style1"><span class="label">生产技术标准：</span>{{technology}}</view>
+				<view class="text_style1"><span class="label">生产技术标准：</span>{{acceptance}}</view>
+				<view class="hflex acenter jbetween offer">
+					<view class="hflex acenter">
+						<view class="offer_title">订单报价：</view>
+						<view class="offer_text" v-if="is_offer">{{offer}}</view>
+						<view class="offer_text2" v-else>暂未报价</view>
+					</view>
+					<view class="offer_btn" v-if="is_offer">查看详情</view>
+					<view class="offer_btn" v-else>立即报价</view>
+				</view>
+				<view class="text_style2">交货地址：{{delivery_address}}</view>
+				<view class="text_style2">交货日期：{{delivery_date}}</view>
+				<view class="text_style2">发布日期：{{release_date}}</view>
+			</view>
+			<view class="box1">
+				<view class="title">订单信息</view>
+				<view class="text_style2">订单编号：{{order_no}}</view>
+				<view class="text_style2">下单时间：{{order_time}}</view>
+			</view>
+		</view>
+		<view class="bottom">
+			<view class="btn">查看回复</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				order_no: '',
+				name: '张宇',
+				phone: '19818894423',
+				type: 0,
+				goodsList: [
+					{
+						id: 1,
+						name: '聚酰胺/非离子表面活性剂Lutensol XP',
+						num: 3,
+						norm: 15,
+						is_enclosure: 1,
+						enclosure_name: '在发展中扎实推动共同富裕.pdf',
+					},
+					{
+						id: 2,
+						name: '聚酰胺/非离子表面活性剂Lutensol XP',
+						num: 3,
+						norm: 15,
+						is_enclosure: 0,
+						enclosure_name: '在发展中扎实推动共同富裕.pdf',
+					}
+				],
+				technology: '生产技术标准按照国家三级验收标准规定 来说，生产技术标准按照国家三级验收标准规定来说， 生产技术标准按照国家…',
+				acceptance: '生产技术标准按照国家三级验收标准规定来说，生产技术标准按照国家三级验收',
+				is_offer: 0,
+				offer: '1999.89',
+				delivery_address: '山东省济南市历下区XX街道',
+				delivery_date: '2022-09-12',
+				release_date: '2022-09-12',
+				order_time: '2022-07-23 22:34',
+			}
+		},
+		onLoad(options) {
+			that = this
+			that.order_no = options.order_no
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background-color: #F4F4F4;
+		// padding: 0 30rpx;
+		.box {
+			width: 100%;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			margin: 20rpx 0 0;
+			
+			.box1 {
+				width: 100%;
+				background: #FFFFFF;
+				border-radius: 24rpx;
+				box-sizing: border-box;
+				padding: 24rpx 20rpx;
+				margin-bottom: 20rpx;
+				
+				.title {
+					font-size: 30rpx;
+					font-weight: 500;
+					color: #222222;
+				}
+				.list {
+					
+					.list_item {
+						width: 100%;
+						background: #F4F4F4;
+						border-radius: 16rpx;
+						box-sizing: border-box;
+						padding: 20rpx;
+						margin: 24rpx 0 20rpx;
+						
+						.item_title {
+							font-size: 28rpx;
+							font-weight: 400;
+							color: #222222;
+						}
+						
+						.item_cell {
+							width: 100%;
+							padding: 22rpx 0;
+							border-bottom: 1rpx solid #ECECEC;
+							
+							.item_text {
+								font-size: 24rpx;
+								margin-right: 50rpx;
+								font-weight: 400;
+								color: #888888;
+							}
+						}
+						.item_img {
+							width: 36rpx;
+							height: 44rpx;
+							margin-right: 8rpx;
+						}
+						.text_style1 {
+							font-size: 24rpx;
+							font-weight: 400;
+							color: #333333;
+						}
+						.item_btn {
+							width: 120rpx;
+							height: 44rpx;
+							border-radius: 22rpx;
+							border: 1px solid #506DFF;
+							padding: 0 8rpx;
+							box-sizing: border-box;
+							font-size: 16rpx;
+							font-weight: 400;
+							color: #506DFF;
+						}
+					}
+				}
+			
+				.text_style1 {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #999999;
+				}
+				.label {
+					color: #444444;
+				}
+				.offer {
+					width: 100%;
+					height: 72rpx;
+					background: #EAF4FF;
+					border-radius: 16rpx;
+					box-sizing: border-box;
+					padding: 0 20rpx;
+					.offer_title {
+						font-size: 24rpx;
+						font-weight: 400;
+						color: #506DFF;
+					}
+					.offer_text {
+						font-size: 32rpx;
+						font-weight: 400;
+						color: #222222;
+					}
+					.offer_text2 {
+						font-size: 26rpx;
+						font-weight: 400;
+						color: #FF3434;
+					}
+					.offer_btn {
+						width: 124rpx;
+						height: 44rpx;
+						background: #EAF4FF;
+						border-radius: 22rpx;
+						border: 1rpx solid #506DFF;
+						font-size: 22rpx;
+						font-weight: 400;
+						color: #506DFF;
+						text-align: center;
+						line-height: 44rpx;
+					}
+				}
+				.text_style2 {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #444444;
+					margin: 12rpx 0;
+				}
+			}
+		}
+		.bottom {
+			position: fixed;
+			bottom: 0;
+			width: 100%;
+			height: 166rpx;
+			background: #FFFFFF;
+			.btn {
+				margin: 10rpx auto;
+				width: 690rpx;
+				height: 88rpx;
+				background: #506DFF;
+				border-radius: 44rpx;
+				text-align: center;
+				line-height: 88rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+			}
+		}
+	}
+</style>

page_mine/pages/order/offer.vue

@@ -0,0 +1,212 @@
+<template>
+	<view class="content">
+		<view class="box" v-if="offer_history.length > 0">
+			<view class="title">报价记录</view>
+			<block v-for="(item,index) in offer_history" :key="index">
+				<view class="offer_detail hflex acenter">
+					<view class="offer_left">第{{index + 1}}次报价</view>
+					<view class="offer_money">{{item.offer_money}}</view>
+				</view>
+			</block>
+		</view>
+		<view class="box" v-if="state != 2">
+			<view class="title">订单报价</view>
+			<view class="input hflex acenter">
+				<view>￥</view>
+				<u-input v-model="money" border="none" placeholder="请填写你的报价"></u-input>
+			</view>
+			<view class="text_style1">上传图片及资质证明图片</view>
+			<view class="upload">
+				<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" :maxCount="3" name="1" multiple :previewFullImage="true" width="100" height="100">
+				</u-upload>
+			</view>
+		</view>
+		<view class="box" v-if="state == 2 && fileList1.length > 0">
+			<view class="text_style1">图片及资质证明图片</view>
+			<view class="hflex acenter fwrap">
+				<block v-for="(item,index) in fileList1" :key="index">
+					<image :src="item" mode="aspectFill" class="imgs"></image>
+				</block>
+			</view>
+		</view>
+		<view v-if="state != 2">
+			<view class="btn">{{offer_history.length > 0 ? '重新报价' : '立即报价'}}</view>
+			<view class="text">友情提醒</view>
+			<view class="text text2">请认真核算报价，报价后不可修改和删除，报价时间约需x天内报价，逾期影响信用等级。</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				order_no: '',
+				offer_history: [
+					{
+						id: 1,
+						offer_money: '2399.89',
+						offer_imgs: ''
+					},
+					{
+						id: 2,
+						offer_money: '1459.89',
+						offer_imgs: ''
+					},
+					{
+						id: 3,
+						offer_money: '1459.89',
+						offer_imgs: ''
+					}
+				],
+				money: '',
+				fileList1: [],
+				state: 2
+			}
+		},
+		onLoad(options) {
+			that = this
+			that.order_no = options.order_no
+		},
+		methods: {
+			// 删除图片
+			deletePic(event) {
+				// that.userInfo.imgList.splice(event.index, 1)
+				console.log(event)
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				console.log(`fileList${event.name}`);
+				console.log(this[`fileList${event.name}`]);
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			// 上传图片
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F4F4F4;
+		padding: 0 30rpx;
+		.box {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 24rpx;
+			box-sizing: border-box;
+			padding: 24rpx 20rpx;
+			margin-top: 20rpx;
+			.title {
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #222222;
+			}
+			.offer_detail {
+				width: 100%;
+				height: 68rpx;
+				background: #F4F4F4;
+				border-radius: 16rpx;
+				box-sizing: border-box;
+				padding: 20rpx;
+				margin: 10rpx 0;
+				.offer_left {
+					font-size: 22rpx;
+					font-weight: 400;
+					color: #777777;
+					margin-right: 40rpx;
+				}
+				.offer_money {
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #FF3636;
+				}
+				
+			}
+			.input {
+				width: 100%;
+				height: 88rpx;
+				background: #F4F4F4;
+				border-radius: 16rpx;
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #222222;
+				box-sizing: border-box;
+				padding: 0 20rpx;
+				line-height: 88rpx;
+				margin: 20rpx 0;
+			}
+			.text_style1 {
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #444444;
+			}
+			.imgs {
+				width: 200rpx;
+				height: 200rpx;
+				border-radius: 16rpx;
+				margin: 0 20rpx 20rpx 0;
+			}
+			.upload {
+				margin-top: 20rpx;
+			}
+		}
+		.btn {
+			margin: 56rpx 0 22rpx;
+			width: 100%;
+			height: 88rpx;
+			background: #506DFF;
+			border-radius: 44rpx;
+			font-size: 36rpx;
+			font-weight: 500;
+			text-align: center;
+			line-height: 88rpx;
+			color: #FFFFFF;
+		}
+		.text {
+			font-size: 24rpx;
+			font-weight: 400;
+			color: #222222;
+		}
+		.text2 {
+			color: #999999;
+		}
+	}
+</style>

page_mine/pages/order/production.vue

@@ -7,7 +7,7 @@
 		</view>
 		<view class="box">
 			<block v-for="(item,index) in pageList" :key="index">
-				<my-order :order_no="item.order_no" :type="item.type" :good="item.goods" :offer="item.offer" order_type="1"></my-order>
+				<my-order :order_no="item.order_no" :type="item.type" :good="item.goods" :offer="item.offer" order_type="1" @toDetail="toDetail" @toOffer="toOffer"></my-order>
 			</block>
 		</view>
 	</view>
@@ -86,6 +86,16 @@
 			// 切换tabs
 			changeTabs(id) {
 				that.active = id
+			},
+			// 查看详情
+			toDetail(e) {
+				console.log(e);
+				$api.jump('/page_mine/pages/order/detail?order_no=' + e)
+			},
+			// 报价详情
+			toOffer(e) {
+				console.log(e)
+				$api.jump('/page_mine/pages/order/offer?order_no=' + e)
 			}
 		},
 	}

page_mine/pages/service/applyMaintenance.vue

@@ -30,15 +30,15 @@
 				<view class="cell">
 					<view class="img_title">身份证人像面照片</view>
 					<view class="upload_img hflex acenter jcenter">
-						<u-upload :fileList="userInfo.fileList1" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="1" multiple :previewFullImage="true" width="110" height="110">
+						<u-upload :fileList="userInfo.fileList1" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="1" multiple :previewFullImage="true" width="550rpx" height="324rpx">
 							<image src="/static/images/comment/upload-just.png" style="width: 550rpx;height: 324rpx;"></image>
 						</u-upload>
 					</view>
 				</view>
 				<view class="cell">
-					<view class="img_title">身份证人像面照片</view>
+					<view class="img_title">身份证国徽面照片</view>
 					<view class="upload_img hflex acenter jcenter">
-						<u-upload :fileList="userInfo.fileList2" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="1" multiple :previewFullImage="true" width="110" height="110">
+						<u-upload :fileList="userInfo.fileList2" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="2" multiple :previewFullImage="true" width="550rpx" height="324rpx">
 							<image src="/static/images/comment/upload-back.png" style="width: 550rpx;height: 324rpx;"></image>
 						</u-upload>
 					</view>
@@ -52,21 +52,42 @@
 				<view class="cell">
 					<view class="img_title">营业执照（必填）</view>
 					<view class="upload_img hflex acenter jcenter">
-						<u-upload :fileList="userInfo.fileList3" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="1" multiple :previewFullImage="true" width="110" height="110">
-							<image src="/static/images/comment/upload-just.png" style="width: 550rpx;height: 324rpx;"></image>
+						<u-upload :fileList="userInfo.fileList3" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="3" multiple :previewFullImage="true" width="550rpx" height="324rpx">
+							<image src="/static/images/comment/upload-business.png" style="width: 550rpx;height: 324rpx;"></image>
 						</u-upload>
 					</view>
 				</view>
 				<view class="cell">
 					<view class="img_title">厂家授权（非必填）</view>
 					<view class="upload_img hflex acenter jcenter">
-						<u-upload :fileList="userInfo.fileList4" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="1" multiple :previewFullImage="true" width="110" height="110">
-							<image src="/static/images/comment/upload-just.png" style="width: 550rpx;height: 324rpx;"></image>
+						<u-upload :fileList="userInfo.fileList4" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="4" multiple :previewFullImage="true" width="550rpx" height="324rpx">
+							<image src="/static/images/comment/upload-business.png" style="width: 550rpx;height: 324rpx;"></image>
 						</u-upload>
 					</view>
 				</view>
 				<view class="cell">
 					<view class="img_title">以往业绩</view>
+					<view class="img_subtitle">请详细描述您的以往业绩</view>
+					<u-input v-model="userInfo.achievement" border="bottom"></u-input>
+				</view>
+				<view class="bottom">
+					<view class="btn" @click="submit">提交</view>
+				</view>
+			</view>
+			<view v-if="current == 2" class="box vflex acenter jcenter">
+				<view v-if="state == 1">
+					<image src="/static/images/comment/wait.png" class="box1_img"></image>
+					<view class="box1_title">审核中</view>
+					<view class="box1_subTitle">预计审核时间3个工作日</view>
+					<view class="box1_subTitle">请留意当前页面变动</view>
+					<view class="btn" @click="result">返回</view>
+				</view>
+				<view v-else>
+					<image src="/static/images/comment/error.png" class="box1_img"></image>
+					<view class="box1_title">审核失败</view>
+					<view class="box1_subTitle">驳回原因</view>
+					<view class="box1_subTitle">{{reason}}<span style="color: #506dff;margin-left: 8rpx;" @click="edit">立即修改></span></view>
+					<view class="btn" @click="result">返回</view>
 				</view>
 			</view>
 		</view>
@@ -89,7 +110,9 @@
 					fileList2: [],
 					fileList3: [],
 					fileList4: [],
-				}
+					achievement: '',
+				},
+				state: 1,
 			}
 		},
 		onLoad() {
@@ -100,14 +123,16 @@
 			deletePic(event) {
 				// that.userInfo.imgList.splice(event.index, 1)
 				console.log(event)
-				this[`fileList${event.name}`].splice(event.index, 1)
+				this.userInfo[`fileList${event.name}`].splice(event.index, 1)
 			},
 			// 新增图片
 			async afterRead(event) {
+				console.log(`fileList${event.name}`);
+				console.log(this.userInfo[`fileList${event.name}`]);
 				let lists = [].concat(event.file)
-				let fileListLen = this[`fileList${event.name}`].length
+				let fileListLen = this.userInfo[`fileList${event.name}`].length
 				lists.map((item) => {
-					this[`fileList${event.name}`].push({
+					this.userInfo[`fileList${event.name}`].push({
 						...item,
 						status: 'uploading',
 						message: '上传中'
@@ -115,8 +140,8 @@
 				})
 				for (let i = 0; i < lists.length; i++) {
 					const result = await this.uploadFilePromise(lists[i].url)
-					let item = this[`fileList${event.name}`][fileListLen]
-					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+					let item = this.userInfo[`fileList${event.name}`][fileListLen]
+					this.userInfo[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
 						status: 'success',
 						message: '',
 						url: result
@@ -143,10 +168,19 @@
 				})
 			},
 			next() {
-				that.current = that.current + 1
-				// if ($api.formCheck(that.userInfo.name,'truename') && $api.formCheck(that.userInfo.idNumber,'identity') && $api.formCheck(that.userInfo.eamil,'email') && $api.formCheck(that.userInfo.address,'required') && $api.formCheck(that.userInfo.just_img,'required') && $api.formCheck(that.userInfo.back_img,'required')) {
-				// 	that.current = that.current + 1
-				// }
+				// that.current = that.current + 1
+				if ($api.formCheck(that.userInfo.name,'truename') && $api.formCheck(that.userInfo.idNumber,'identity') && $api.formCheck(that.userInfo.eamil,'email') && $api.formCheck(that.userInfo.address,'required') && $api.formCheck(that.userInfo.fileList1,'required') && $api.formCheck(that.userInfo.fileList2,'required')) {
+					that.current = that.current + 1
+				}
+			},
+			submit() {
+				// that.current = that.current + 1
+				if ($api.formCheck(that.userInfo.fileList3,'required') && $api.formCheck(that.userInfo.achievement,'required')) {
+					that.current = that.current + 1
+				}
+			},
+			result() {
+				$api.jump('/pages/tabbar/mine/mine',3)
 			}
 		},
 	}
@@ -209,6 +243,15 @@
 					align-items: center !important;
 					justify-content: center !important;
 				}
+				.img_subtitle {
+					font-size: 28rpx;
+					color: #A3A3A3;
+					padding: 12rpx 0;
+				}
+				.u-input {
+					width: 100%;
+					margin-top: 30rpx;
+				}
 			}
 			.line {
 				width: 100%;
@@ -230,6 +273,36 @@
 				}
 			}
 		}
-		
+		.box {
+			width: 100%;
+			// height: 100vh;
+			background-color: #fff;
+			.box1_img {
+				width: 124rpx;
+				height: 124rpx;
+				margin: 108rpx 0 40rpx;
+			}
+			.box1_title {
+				font-size: 32rpx;
+				color: #222;
+				margin-bottom: 24rpx;
+			}
+			.box1_subTitle {
+				margin: 12rpx 0;
+				font-size: 26rpx;
+				color: #999999;
+			}
+			.btn {
+				width: 530rpx;
+				height: 88rpx;
+				background-color: #506dff;
+				color: #fff;
+				text-align: center;
+				line-height: 88rpx;
+				border-radius: 44rpx;
+				font-size: 36rpx;
+				margin-top: 122rpx;
+			}
+		}
 	}
 </style>

page_mine/pages/service/demand.vue

@@ -0,0 +1,26 @@
+<template>
+	<view class="content">
+		
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+</style>

page_mine/pages/service/feed/detail.vue

@@ -0,0 +1,93 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="hflex acenter jbetween box_top">
+				<view class="title">反馈内容</view>
+				<view class="text_style1">{{detail.createTime}}</view>
+			</view>
+			<view class="text">{{detail.text}}</view>
+			<view class="hflex acenter">
+				<block v-for="(item,index) in detail.imgList" :key="index">
+					<image mode="aspectFill" :src="item" class="img"></image>
+				</block>
+			</view>
+		</view>
+		<view class="box" v-if="detail.repaly !== ''">
+			<view class="hflex acenter jbetween box_top">
+				<view class="title">回复</view>
+				<view class="text_style1">{{detail.repalyTime}}</view>
+			</view>
+			<view class="text">{{detail.repaly}}</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				id: '',
+				detail: {
+					id: 1,
+					text: '反馈内容详情反馈内容详情反馈内容详情反馈内容详情反馈内容详情反馈内容详情反馈内容详情',
+					createTime: '2022-11-10 12:34:45',
+					imgList: ['/static/images/index/class_img3.png','/static/images/index/class_img3.png'],
+					repaly: '您反馈的问题我们已经收到了，请耐心等待我们解决。您反馈的问题我们已经收到了，请耐心等待我们解决。',
+					repalyTime: '2022-11-10 12:34:45',
+				}
+			}
+		},
+		onLoad(options) {
+			that = this
+			that.id = options.id
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F5F5F5;
+		padding: 0 30rpx;
+		.box {
+			margin-top: 20rpx;
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			box-sizing: border-box;
+			padding: 24rpx 20rpx;
+			.box_top {
+				width: 100%;
+				padding-bottom: 14rpx;
+				border-bottom: 1rpx solid #F5F5F5;
+				.title {
+					font-size: 30rpx;
+					font-weight: 500;
+					color: #222222;
+				}
+				.text_style1 {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #666666;
+				}
+			}
+			.text {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 36rpx;
+				margin: 24rpx 0 20rpx;
+			}
+			.img {
+				width: 208rpx;
+				height: 208rpx;
+				border-radius: 20rpx;
+				margin: 0 14rpx 20rpx 0;
+			}
+		}
+	}
+</style>

page_mine/pages/service/feed/feedback.vue

@@ -0,0 +1,155 @@
+<template>
+	<view class="content vflex jbetween">
+		<view class="">
+			<view class="box">
+				<view>
+					<u--textarea v-model="problem" placeholder="请描述您遇到的具体问题(必填)" ></u--textarea>
+				</view>
+				<view class="left">图片（选填）</view>
+				<view class="upload">
+					<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="1" multiple :previewFullImage="true" width="204rpx" height="204rpx">
+					</u-upload>
+				</view>
+			</view>
+			<view class="box">
+				<view class="hflex acenter">
+					<view class="left">联系方式</view>
+					<u-input v-model="info.phone" border="none" placeholder="请输入您的联系方式,以便更好的解决问题"></u-input>
+				</view>
+			</view>
+			<view class="history" @click="toHistory">反馈记录</view>
+		</view>
+		<view class="btn" @click="submit">提交</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				problem: '',
+				fileList1: [],
+				phone: '',
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 删除图片
+			deletePic(event) {
+				// that.userInfo.imgList.splice(event.index, 1)
+				console.log(event)
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				console.log(`fileList${event.name}`);
+				console.log(this[`fileList${event.name}`]);
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			// 上传图片
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+			// 提交
+			submit() {
+				if($api.formCheck(that.problem,"requires") && $api.formCheck(that.phone,"phone")) {
+					$api.jump('/pages/tabbar/mine/mine',3)
+				}
+			},
+			toHistory() {
+				$api.jump('/page_mine/pages/service/feed/history')
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background-color: #F5F5F5;
+		padding: 20rpx 30rpx;
+		.box {
+			width: 100%;
+			background-color: #fff;
+			border-radius: 20rpx;
+			box-sizing: border-box;
+			padding: 32rpx 20rpx;
+			margin-bottom: 20rpx;
+			.left {
+				font-size: 26rpx;
+				color: #222222;
+				margin-right: 20rpx;
+			}
+			.u-textarea {
+				// margin: 28rpx auto 0;
+				// background-color: #f4f4f4;
+				// border-radius: 28rpx;
+				box-sizing: border-box;
+				padding: 32rpx 0;
+				width: 610rpx;
+				border: none;
+			}
+			.upload {
+				width: 100%;
+				margin: 28rpx 0 24rpx;
+			}
+		}
+		.history {
+			width: 184rpx;
+			height: 52rpx;
+			border-radius: 26rpx;
+			border: 1rpx solid #526FFF;
+			margin: 34rpx auto 0;
+			color: #506DFF;
+			font-size: 26rpx;
+			text-align: center;
+			line-height: 52rpx;
+		}
+		.btn {
+			width: 100%;
+			height: 84rpx;
+			background-color: #506dff;
+			border-radius: 42rpx;
+			font-size: 18px;
+			color: #FFFFFF;
+			text-align: center;
+			line-height: 84rpx;
+			margin-bottom: 80rpx;
+		}
+	}
+</style>

page_mine/pages/service/feed/history.vue

@@ -0,0 +1,125 @@
+<template>
+	<view class="content">
+		<block v-for="(item,index) in pageList" :key="index">
+			<view class="box" @click="toDetail(item.id)">
+				<view class="title">{{item.title}}</view>
+				<view class="text">问题描述：{{item.text}}</view>
+				<view class="reply" v-if="item.reply !== ''">{{item.reply}}</view>
+				<view class="bottom hflex acenter jend">
+					<view class="btn" @click="detele(item.id)">删除</view>
+					<view class="btn1">编辑</view>
+				</view>
+			</view>
+		</block>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageList: [
+					{
+						id: 0,
+						title: '页面出现闪退问题',
+						text: '问题描述问题描述',
+						reply: '您反馈的问题我们已经收到了，请耐心等待我们解决请耐心等待我们解决',
+						
+					},
+					{
+						id: 1,
+						title: '页面出现闪退问题',
+						text: '问题描述问题描述',
+						reply: '',
+						
+					}
+				]
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 详情
+			toDetail(id) {
+				$api.jump('/page_mine/pages/service/feed/detail?id=',id)
+			},
+			// 删除
+			detele(id) {
+				
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F5F5F5;
+		padding: 0 30rpx;
+		.box {
+			width: 100%;
+			margin: 20rpx 0 0;
+			background-color: #fff;
+			border-radius: 20rpx;
+			box-sizing: border-box;
+			padding: 28rpx 20rpx;
+			.title {
+				font-size: 30rpx;
+				font-weight: 500;
+				color: #222222;
+			}
+			.text {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #777777;
+				margin: 18rpx 0 24rpx;
+				line-height: 18px;
+			}
+			.reply {
+				width: 100%;
+				height: 76rpx;
+				background: #F5F5F5;
+				border-radius: 16rpx;
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 76rpx;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				white-space: nowrap;
+				margin-bottom: 24rpx;
+				box-sizing: border-box;
+				padding: 0 8rpx 0 16rpx;
+			}
+			.bottom {
+				width: 100%;
+				padding-top: 24rpx;
+				border-top: 1rpx solid #f5f5f5;
+				.btn {
+					width: 120rpx;
+					height: 56rpx;
+					border-radius: 28rpx;
+					border: 1rpx solid #D3D3D3;
+					font-size: 26rpx;
+					color: #222222;
+					margin-left: 20rpx;
+					text-align: center;
+					line-height: 56rpx;
+				}
+				.btn1 {
+					width: 120rpx;
+					height: 56rpx;
+					border-radius: 28rpx;
+					border: 1rpx solid #506DFF;
+					font-size: 26rpx;
+					color: #506DFF;
+					margin-left: 20rpx;
+					text-align: center;
+					line-height: 56rpx;
+				}
+			}
+		}
+	}
+</style>

page_mine/pages/service/release.vue

@@ -0,0 +1,26 @@
+<template>
+	<view class="content">
+		
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+</style>

page_mine/pages/service/settledMerchants.vue

@@ -0,0 +1,278 @@
+<template>
+	<view class="content">
+		<view v-if="state == 0">
+			<view class="box">
+				<view class="title">商家信息</view>	
+				<view class="hflex acenter jbetween cell">
+					<view class="left">商家名称</view>
+					<u-input v-model="info.name" border="none" placeholder="请输入商家名称" inputAlign="right"></u-input>
+				</view>
+				<view class="hflex acenter jbetween cell">
+					<view class="left">商家地址</view>
+					<u-input v-model="info.address" border="none" placeholder="请选择" inputAlign="right"></u-input>
+				</view>
+				<view class="hflex acenter jbetween cell">
+					<view class="left">联系人</view>
+					<u-input v-model="info.contacts" border="none" placeholder="请输入联系人姓名" inputAlign="right"></u-input>
+				</view>
+				<view class="hflex acenter jbetween cell">
+					<view class="left">联系电话</view>
+					<u-input v-model="info.phone" border="none" placeholder="请输入联系电话" inputAlign="right"></u-input>
+				</view>
+				<view class="vflex cell" style="border: none;">
+					<view class="left">商家简介</view>
+					<u--textarea v-model="info.introduction" placeholder="在此输入商家简介内容" ></u--textarea>
+				</view>
+				
+			</view>	
+			<view class="box">
+				<view class="cell" style="border: none;padding: none;">
+					<view class="img_title">上传营业执照</view>
+					<view class="upload_img vflex acenter jcenter">
+						<u-upload :fileList="info.fileList1" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="1" multiple :previewFullImage="true" width="550rpx" height="324rpx">
+							<image src="/static/images/comment//upload-business.png" style="width: 550rpx;height: 324rpx;"></image>
+						</u-upload>
+						<view class="hflex acenter ">
+							<u-icon name="camera" color="#999999" size="16"></u-icon>
+							<view class="">点击上传营业执照</view>	
+						</view>	
+					</view>
+				</view>
+			</view>
+			<view class="hflex acenter">
+				<u-checkbox-group @change="checkboxChange">
+					<u-checkbox v-model="agree" shape="circle"></u-checkbox>
+				</u-checkbox-group>
+				<view class="text">阅读并同意<span class="read" @click="open">《商家入驻规则》</span></view>
+			</view>
+			<view class="button hflex acenter jcenter" @click="settled">
+				<view>立即入驻</view>
+			</view>
+		</view>
+		<view v-if="state == 1">
+			<view class="box1 vflex acenter jcenter">
+				<image src="/static/images/comment/wait.png" class="box1_img"></image>
+				<view class="box1_title">审核中</view>
+				<view class="box1_subTitle">预计审核时间3个工作日</view>
+				<view class="box1_subTitle">请留意当前页面变动</view>
+				<view class="btn" @click="result">返回</view>
+			</view>
+		</view>
+		<view v-if="state == 2">
+			<view class="box1 vflex acenter jcenter">
+				<image src="/static/images/comment/error.png" class="box1_img"></image>
+				<view class="box1_title">审核失败</view>
+				<view class="box1_subTitle">驳回原因</view>
+				<view class="box1_subTitle">{{reason}}<span style="color: #506dff;margin-left: 8rpx;" @click="edit">立即修改></span></view>
+				<view class="btn" @click="result">返回</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				info: {
+					name: '',
+					address: '',
+					contacts: '',
+					phone: '',
+					introduction: '',
+					fileList1: [],
+				},
+				agree: false,
+				state: 0
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 删除图片
+			deletePic(event) {
+				// that.userInfo.imgList.splice(event.index, 1)
+				console.log(event)
+				this.info[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				console.log(`fileList${event.name}`);
+				console.log(this.info[`fileList${event.name}`]);
+				let lists = [].concat(event.file)
+				let fileListLen = this.info[`fileList${event.name}`].length
+				lists.map((item) => {
+					this.info[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this.info[`fileList${event.name}`][fileListLen]
+					this.info[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			// 上传图片
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+			// 阅读并同意
+			checkboxChange(n) {
+				that.agree = !that.agree
+			},
+			settled() {
+				if ($api.formCheck(that.info.name,'required')&&$api.formCheck(that.info.address,'required')&&$api.formCheck(that.info.contacts,'required')&&$api.formCheck(that.info.phone,'phone')&&$api.formCheck(that.info.introduction,'required')) {
+					if(that.agree) {
+						that.state = 1
+					}else {
+						$api.info('请先阅读并同意《商家入驻规则》')
+					}
+				}
+			},
+			result() {
+				$api.jump('/pages/tabbar/mine/mine',3)
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F4F4F4;
+		padding: 20rpx 30rpx;
+		.box {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 28rpx;
+			padding: 28rpx 20rpx;
+			box-sizing: border-box;
+			margin-bottom: 16rpx;
+			.title {
+				font-size: 28rpx;
+				color: #222222;
+			}
+			.cell {
+				width: 100%;
+				padding: 20rpx 0 28rpx;
+				border-bottom: 1rpx solid #f4f4f4;
+				.left {
+					font-size: 28rpx;
+					color: #222;
+					position: relative;
+					padding-left: 10rpx;
+				}
+				.left::before {
+					content: "*";
+					position: absolute;
+					top: 0rpx;
+					left: -5rpx;
+					color: #FF0D0D;
+					font-size: 20rpx;
+				}
+				.u-input {
+					font-size: 28rpx;
+					color: #222;
+				}
+				.img_title {
+					font-size: 28rpx;
+					color: #444;
+				}
+				.upload_img {
+					width: 670rpx;
+					height: 404rpx;
+					background-color: #fff;
+					border-radius: 20rpx;
+					margin: 28rpx 0 0;
+					padding: 20rpx 0;
+					border: 1rpx dashed #e0e0e0;
+				}
+				.u-upload__wrap {
+					display: flex;
+					align-items: center !important;
+					justify-content: center !important;
+				}
+				.u-textarea {
+					margin: 28rpx auto 0;
+					background-color: #f4f4f4;
+					border-radius: 28rpx;
+					box-sizing: border-box;
+					padding: 24rpx;
+					width: 610rpx;
+				}
+			}
+		}
+		.text {
+			font-size: 24rpx;
+			color: #9c9c9c;
+		}
+		.read {
+			color: #2a63f3;
+		}
+		.button {
+			width: 100%;
+			height: 88rpx;
+			background-color: #506dff;
+			border-radius: 50rpx;
+			box-shadow: 0 4rpx 28rpx 0 rgba(132,123,255,0.4);
+			font-size: 40rpx;
+			color: #fff;
+			margin: 40rpx 0 36rpx;
+		}
+		.box1 {
+			width: 100%;
+			// height: 100vh;
+			background-color: #fff;
+			padding-bottom: 80rpx;
+			.box1_img {
+				width: 124rpx;
+				height: 124rpx;
+				margin: 108rpx 0 40rpx;
+			}
+			.box1_title {
+				font-size: 32rpx;
+				color: #222;
+				margin-bottom: 24rpx;
+			}
+			.box1_subTitle {
+				margin: 12rpx 0;
+				font-size: 26rpx;
+				color: #999999;
+			}
+			.btn {
+				width: 530rpx;
+				height: 88rpx;
+				background-color: #506dff;
+				color: #fff;
+				text-align: center;
+				line-height: 88rpx;
+				border-radius: 44rpx;
+				font-size: 36rpx;
+				margin-top: 122rpx;
+			}
+		}
+	}
+</style>

page_mine/pages/service/settledShipyard.vue

@@ -0,0 +1,278 @@
+<template>
+	<view class="content">
+		<view v-if="state == 0">
+			<view class="box">
+				<view class="title">船厂信息</view>	
+				<view class="hflex acenter jbetween cell">
+					<view class="left">船厂名称</view>
+					<u-input v-model="info.name" border="none" placeholder="请输入船厂名称" inputAlign="right"></u-input>
+				</view>
+				<view class="hflex acenter jbetween cell">
+					<view class="left">船厂地址</view>
+					<u-input v-model="info.address" border="none" placeholder="请选择" inputAlign="right"></u-input>
+				</view>
+				<view class="hflex acenter jbetween cell">
+					<view class="left">联系人</view>
+					<u-input v-model="info.contacts" border="none" placeholder="请输入联系人姓名" inputAlign="right"></u-input>
+				</view>
+				<view class="hflex acenter jbetween cell">
+					<view class="left">联系电话</view>
+					<u-input v-model="info.phone" border="none" placeholder="请输入联系电话" inputAlign="right"></u-input>
+				</view>
+				<view class="vflex cell" style="border: none;">
+					<view class="left">船厂简介</view>
+					<u--textarea v-model="info.introduction" placeholder="在此输入船厂简介内容" ></u--textarea>
+				</view>
+				
+			</view>	
+			<view class="box">
+				<view class="cell" style="border: none;padding: none;">
+					<view class="img_title">上传营业执照</view>
+					<view class="upload_img vflex acenter jcenter">
+						<u-upload :fileList="info.fileList1" @afterRead="afterRead" @delete="deletePic" :maxCount="1" name="1" multiple :previewFullImage="true" width="550rpx" height="324rpx">
+							<image src="/static/images/comment//upload-business.png" style="width: 550rpx;height: 324rpx;"></image>
+						</u-upload>
+						<view class="hflex acenter ">
+							<u-icon name="camera" color="#999999" size="16"></u-icon>
+							<view class="">点击上传营业执照</view>	
+						</view>	
+					</view>
+				</view>
+			</view>
+			<view class="hflex acenter">
+				<u-checkbox-group @change="checkboxChange">
+					<u-checkbox v-model="agree" shape="circle"></u-checkbox>
+				</u-checkbox-group>
+				<view class="text">阅读并同意<span class="read" @click="open">《商家入驻规则》</span></view>
+			</view>
+			<view class="button hflex acenter jcenter" @click="settled">
+				<view>立即入驻</view>
+			</view>
+		</view>
+		<view v-if="state == 1">
+			<view class="box1 vflex acenter jcenter">
+				<image src="/static/images/comment/wait.png" class="box1_img"></image>
+				<view class="box1_title">审核中</view>
+				<view class="box1_subTitle">预计审核时间3个工作日</view>
+				<view class="box1_subTitle">请留意当前页面变动</view>
+				<view class="btn" @click="result">返回</view>
+			</view>
+		</view>
+		<view v-if="state == 2">
+			<view class="box1 vflex acenter jcenter">
+				<image src="/static/images/comment/error.png" class="box1_img"></image>
+				<view class="box1_title">审核失败</view>
+				<view class="box1_subTitle">驳回原因</view>
+				<view class="box1_subTitle">{{reason}}<span style="color: #506dff;margin-left: 8rpx;" @click="edit">立即修改></span></view>
+				<view class="btn" @click="result">返回</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				info: {
+					name: '',
+					address: '',
+					contacts: '',
+					phone: '',
+					introduction: '',
+					fileList1: [],
+				},
+				agree: false,
+				state: 0
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 删除图片
+			deletePic(event) {
+				// that.userInfo.imgList.splice(event.index, 1)
+				console.log(event)
+				this.info[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				console.log(`fileList${event.name}`);
+				console.log(this.info[`fileList${event.name}`]);
+				let lists = [].concat(event.file)
+				let fileListLen = this.info[`fileList${event.name}`].length
+				lists.map((item) => {
+					this.info[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this.info[`fileList${event.name}`][fileListLen]
+					this.info[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			// 上传图片
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+			// 阅读并同意
+			checkboxChange(n) {
+				that.agree = !that.agree
+			},
+			settled() {
+				if ($api.formCheck(that.info.name,'required')&&$api.formCheck(that.info.address,'required')&&$api.formCheck(that.info.contacts,'required')&&$api.formCheck(that.info.phone,'phone')&&$api.formCheck(that.info.introduction,'required')) {
+					if(that.agree) {
+						
+					}else {
+						$api.info('请先阅读并同意《商家入驻规则》')
+					}
+				}
+			},
+			result() {
+				$api.jump('/pages/tabbar/mine/mine',3)
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F4F4F4;
+		padding: 20rpx 30rpx;
+		.box {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 28rpx;
+			padding: 28rpx 20rpx;
+			box-sizing: border-box;
+			margin-bottom: 16rpx;
+			.title {
+				font-size: 28rpx;
+				color: #222222;
+			}
+			.cell {
+				width: 100%;
+				padding: 20rpx 0 28rpx;
+				border-bottom: 1rpx solid #f4f4f4;
+				.left {
+					font-size: 28rpx;
+					color: #222;
+					position: relative;
+					padding-left: 10rpx;
+				}
+				.left::before {
+					content: "*";
+					position: absolute;
+					top: 0rpx;
+					left: -5rpx;
+					color: #FF0D0D;
+					font-size: 20rpx;
+				}
+				.u-input {
+					font-size: 28rpx;
+					color: #222;
+				}
+				.img_title {
+					font-size: 28rpx;
+					color: #444;
+				}
+				.upload_img {
+					width: 670rpx;
+					height: 404rpx;
+					background-color: #fff;
+					border-radius: 20rpx;
+					margin: 28rpx 0 0;
+					padding: 20rpx 0;
+					border: 1rpx dashed #e0e0e0;
+				}
+				.u-upload__wrap {
+					display: flex;
+					align-items: center !important;
+					justify-content: center !important;
+				}
+				.u-textarea {
+					margin: 28rpx auto 0;
+					background-color: #f4f4f4;
+					border-radius: 28rpx;
+					box-sizing: border-box;
+					padding: 24rpx;
+					width: 610rpx;
+				}
+			}
+		}
+		.text {
+			font-size: 24rpx;
+			color: #9c9c9c;
+		}
+		.read {
+			color: #2a63f3;
+		}
+		.button {
+			width: 100%;
+			height: 88rpx;
+			background-color: #506dff;
+			border-radius: 50rpx;
+			box-shadow: 0 4rpx 28rpx 0 rgba(132,123,255,0.4);
+			font-size: 40rpx;
+			color: #fff;
+			margin: 40rpx 0 36rpx;
+		}
+		.box1 {
+			width: 100%;
+			// height: 100vh;
+			background-color: #fff;
+			padding-bottom: 80rpx;
+			.box1_img {
+				width: 124rpx;
+				height: 124rpx;
+				margin: 108rpx 0 40rpx;
+			}
+			.box1_title {
+				font-size: 32rpx;
+				color: #222;
+				margin-bottom: 24rpx;
+			}
+			.box1_subTitle {
+				margin: 12rpx 0;
+				font-size: 26rpx;
+				color: #999999;
+			}
+			.btn {
+				width: 530rpx;
+				height: 88rpx;
+				background-color: #506dff;
+				color: #fff;
+				text-align: center;
+				line-height: 88rpx;
+				border-radius: 44rpx;
+				font-size: 36rpx;
+				margin-top: 122rpx;
+			}
+		}
+	}
+</style>

page_shop/pages/address/add.vue

@@ -0,0 +1,127 @@
+<template>
+	<view class="content vflex jbetween">
+		<view class="form">
+			<view class="hflex acenter jbetween item">
+				<view class="left">收货人</view>
+				<u-input v-model="name" border="none" placeholder="请填写收货人姓名"></u-input>
+			</view>
+			<view class="hflex acenter jbetween item">
+				<view class="left">手机号码</view>
+				<u-input v-model="phone" border="none" placeholder="请填写收货人手机号码"></u-input>
+			</view>
+			<picker @change="bindPickerChange" mode="region">
+				<view class="hflex acenter jbetween item">
+					<view class="left">所在地区</view>
+					<u-input v-model="area" border="none" placeholder="请选择所在地区"></u-input>
+					<u-icon name="map-fill" color="#506DFF" size="13"></u-icon>
+				</view>
+			</picker>
+			<view class="hflex acenter jbetween item">
+				<view class="left">详细地址</view>
+				<u-input v-model="address" border="none" placeholder="请输入街道、楼牌号"></u-input>
+			</view>
+			<view class="hflex acenter jbetween item">
+				<view class="left">设为默认地址</view>
+				<u-switch v-model="is_active" activeColor="#506dff" @change="change"></u-switch>
+			</view>
+		</view>
+		<view class="btn" v-if="is_edit == 0">保存</view>
+		<view class="bottom hflex acenter jbetween" v-else>
+			<view class="del_btn">删除</view>
+			<view class="save_btn">保存</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				name: '章鱼小丸子',
+				phone: '17864323411',
+				area: '北京市昌平区天通苑北街道',
+				address: '天通苑北一区15号楼一单元803',
+				is_active: true,
+				is_edit: 0,
+				id: ''
+			}
+		},
+		onLoad(options) {
+			that = this
+			if(options.id) {
+				that.id = options.id
+				that.is_edit = 1
+			}
+		},
+		methods: {
+			// 选择地区
+			bindPickerChange(e) {
+				console.log(e);
+				that.area = e.detail.value[0] + e.detail.value[1] + e.detail.value[2]
+			},
+			// 设置默认地址
+			change(e) {
+				that.is_active = e
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		padding: 0 30rpx;
+		.form {
+			margin-top: 22rpx;
+			.item {
+				padding: 26rpx 0;
+			}
+			.left {
+				width: 200rpx;
+				font-size: 28rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 40rpx;
+			}
+		}
+		.btn {
+			width: 100%;
+			height: 84rpx;
+			background: #506DFF;
+			border-radius: 42rpx;
+			font-size: 36rpx;
+			font-weight: 500;
+			color: #FFFFFF;
+			text-align: center;
+			line-height: 84rpx;
+			margin-bottom: 66rpx;
+		}
+		.bottom {
+			width: 100%;
+			margin-bottom: 66rpx;
+			.del_btn {
+				width: 230rpx;
+				height: 88rpx;
+				border-radius: 44rpx;
+				border: 1px solid #506DFF;
+				text-align: center;
+				line-height: 88rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #506DFF;
+			}
+			.save_btn {
+				width: 430rpx;
+				height: 88rpx;
+				background: #506DFF;
+				border-radius: 44rpx;
+				text-align: center;
+				line-height: 88rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+			}
+		}
+	}
+</style>

page_shop/pages/address/list.vue

@@ -0,0 +1,234 @@
+<template>
+	<view class="content">
+		<view class="list" v-if="pageList.length > 0">
+			<block v-for="(item,index) in pageList" :key="index">
+				<view class="item">
+					<view class="hflex acenter">
+						<view class="item_name">{{item.name}}</view>
+						<view class="item_phone">{{item.phone}}</view>
+					</view>
+					<view class="item_addr">{{item.address}}</view>
+					<view class="hflex acenter jbetween item_bottom">
+						<view class="hflex acenter" @click="setDefault(item.id)">
+							<image v-if="item.is_default == 1" src="/static/images/shop/checked.png" class="item_icon"></image>
+							<image v-else src="/static/images/shop/check.png" class="item_icon"></image>
+							<view class="item_phone">设为默认地址</view>
+						</view>
+						<view class="hflex acenter">
+							<view class="hflex acenter" @click="edit(item.id)" style="padding-right: 28rpx;">
+								<image src="/static/images/shop/icon_edit.png" class="item_icon"></image>
+								<view class="icon_text">编辑</view>
+							</view>
+							<view class="hflex acenter" @click="detele(item.id)">
+								<image src="/static/images/shop/icon_detele.png" class="item_icon"></image>
+								<view class="icon_text">删除</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</block>
+		</view> 
+		<view v-else class="vflex acenter jcenter" style="margin-top: 302rpx;">
+			<image class="no_img" src="/static/images/shop/no_addr.png"></image>
+			<view class="no_text">暂无地址，请去添加地址</view>
+		</view>
+		<view class="bottom">
+			<view  v-if="pageList.length > 0" class="bottom_btn" @click="add">添加收货地址</view>
+			<view  v-else class="bottom_btn" @click="add">+新增收货地址</view>
+		</view>
+		<u-modal :show="del_show" title="确定要删除该地址吗？" :showConfirmButton="false">
+			<view class="model hflex acenter jbetween">
+				<view class="model_left hflex acenter jcenter" @click="close">取消</view>
+				<view class="model_right hflex acenter jcenter" @click="sure">确认</view>
+			</view>
+		</u-modal>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageList: [
+					{
+						id: 5,
+						name: '张大成',
+						phone: '198****2345',
+						address: '河北省 保定市 莲池区 未来石4号楼20221室',
+						is_default: 1,
+						
+					},
+					{
+						id: 6,
+						name: '小丸子',
+						phone: '198****2345',
+						address: '江苏省 南京市 浦口区 未明发财富中心7栋B座1919',
+						is_default: 0,
+						
+					},
+					{
+						id: 9,
+						name: '小丸子',
+						phone: '198****2345',
+						address: '江苏省 南京市 浦口区 未明发财富中心7栋B座1919',
+						is_default: 0,
+						
+					}
+				],
+				del_show: false,
+				del_id: ''
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 选择默认地址
+			setDefault(id) {
+				for(var i=0;i<that.pageList.length;i++) {
+					if(id == that.pageList[i].id) {
+						console.log(i);
+						that.$set(that.pageList[i],'is_default',1)
+					} else {
+						that.$set(that.pageList[i],'is_default',0)
+					}
+				}
+			},
+			// 添加地址
+			add() {
+				$api.jump('/page_shop/pages/address/add')
+			},
+			// 删除地址
+			detele(id) {
+				that.del_show = true
+				that.del_id = id
+			},
+			edit(id) {
+				$api.jump('/page_shop/pages/address/add?id=' + id)
+			},
+			close() {
+				that.del_show = false
+			},
+			sure() {
+				
+			}
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F4F4F4;
+		.list {
+			width: 100%;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			.item {
+				margin-top: 20rpx;
+				background: #FFFFFF;
+				border-radius: 12px;
+				box-sizing: border-box;
+				padding: 24rpx 20rpx;
+				.item_name {
+					font-size: 28rpx;
+					font-weight: 500;
+					color: #222222;
+					line-height: 40rpx;
+					padding-right: 16rpx;
+				}
+				.item_phone {
+					font-size: 22rpx;
+					font-weight: 400;
+					color: #999999;
+					line-height: 32rpx;
+				}
+				.item_addr {
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #444444;
+					line-height: 34rpx;
+					padding: 12rpx 0 20rpx;
+				}
+				.item_bottom {
+					padding: 16rpx 0 0;
+					border-top: 1rpx solid #F1F7FE;
+					.item_icon {
+						width: 24rpx;
+						height: 24rpx;
+						margin-right: 8rpx;
+					}
+					.icon_text {
+						font-size: 20rpx;
+						font-weight: 400;
+						color: #777777;
+						line-height: 28rpx;
+					} 
+				}
+				
+			}
+			.item:nth-last-child(1) {
+				margin-bottom: 186rpx;
+			}
+		}
+		.no_img {
+			width: 200rpx;
+			height: 200rpx;
+		}
+		.no_text {
+			font-size: 28rpx;
+			font-weight: 400;
+			color: #999999;
+			line-height: 40rpx;
+			margin-top: 40rpx;
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 40rpx 74rpx;
+			.bottom_btn {
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			
+		}
+		.model {
+			width: 100%;
+			margin-top: 78rpx;
+			.model_left {
+				width: 220rpx;
+				height: 76rpx;
+				border-radius: 38rpx;
+				border: 1px solid #506DFF;
+				font-size: 32rpx;
+				font-weight: 400;
+				color: #506DFF;
+				line-height: 44rpx;
+			}
+			.model_right {
+				width: 220rpx;
+				height: 76rpx;
+				border-radius: 38rpx;
+				background: #506DFF;
+				font-size: 32rpx;
+				font-weight: 400;
+				color: #fff;
+				line-height: 44rpx;
+			}
+		}
+	}
+</style>

page_shop/pages/base/base.vue

@@ -0,0 +1,238 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="tabs hflex acenter">
+				<block v-for="(item,index) in tabs" :key="index">
+					<view class="hflex acenter" style="padding-right: 68rpx;">
+						<view class="tab_item" :class="tab_active == index ? 'tab_active': ''" @click="changeTab(index)">{{item.name}}</view>
+						<view class="vflex acenter jcenter" v-if="index == 2">
+							<u-icon name="arrow-up-fill" :color="color" size="4"></u-icon>
+							<u-icon name="arrow-down-fill" :color="color2" size="4"></u-icon>
+						</view>
+					</view>
+				</block>
+			</view>
+			<menuList :menuLists="pageList" bottomSize="200rpx" @listenEvent="myEvent" @listenMenu="myMenu">
+			</menuList>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageList: [
+					{
+						title: '柴油机',
+						goods: [
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							}
+						]
+					},
+					{
+						title: '齿轮箱',
+						goods: [
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img4.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							}
+						]
+					},
+					{
+						title: '舵机',
+						goods: [
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img5.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							},
+							{
+								label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+								img: '/static/images/index/class_img3.png',
+								price: '3400.00',
+							}
+						]
+					}
+				],
+				tabs: [
+					{
+						index: 0,
+						name: '全部',
+					},
+					{
+						index: 1,
+						name: '销量',
+					},
+					{
+						index: 2,
+						name: '价格',
+					}
+				],
+				tab_active: 0,
+				color: '#7D7D7D',
+				color2: '#7D7D7D',
+			}
+		},
+		onLoad(options) {
+			that = this
+			var name = options.name
+			uni.setNavigationBarTitle({
+				title: name
+			});
+		},
+		methods: {
+			// 点击产品列表
+			myEvent(e) {
+				console.log(e);
+			},
+			// 点击菜单列表
+			myMenu(e) {
+				console.log(e);
+			},
+			// 切换tabs
+			changeTab(e) {
+				console.log(e);
+				if(that.tab_active != 2) {
+					that.color = '#506dff'
+				} else {
+					that.color = '#7D7D7D'
+					that.color2 = '#506dff'
+				}
+				that.tab_active = e
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background-color: #F4F4F4;
+		padding-top: 24rpx;
+		.box {
+			background: #FFFFFF;
+			border-radius: 20rpx 20rpx 0 0;
+			.tabs {
+				width: 100%;
+				box-sizing: border-box;
+				padding: 34rpx 30rpx 40rpx;
+				.tab_item {
+					font-size: 32rpx;
+					font-weight: 500;
+					color: #7D7D7D;
+					line-height: 44rpx;
+					padding-right: 10rpx;
+				}
+				.tab_active {
+					font-size: 36rpx;
+					font-weight: 500;
+					color: #222222;
+					line-height: 50rpx;
+					position: relative;
+				}
+				.tab_active::after {
+					content: "";
+					position: absolute;
+					left: 18rpx;
+					bottom: -5rpx;
+					width: 40rpx;
+					height: 8rpx;
+					background: #506DFF;
+					border-radius: 4rpx;
+				}
+			}
+				
+		}
+	}
+</style>

page_shop/pages/good/detail.vue

@@ -0,0 +1,631 @@
+<template>
+	<view class="content">
+		<u-navbar title=" " @leftClick="leftClick" height="44px" bgColor="#F5F5F5" :placeholder="true">
+			<view class="hflex acenter" slot="center">
+				<view class="nav_item" @click="changeNav(1)" :class="nav_active == 1?'nav_active': '' ">商品</view>
+				<view class="nav_item" @click="changeNav(2)" :class="nav_active == 2?'nav_active': '' ">详情</view>
+			</view>
+		</u-navbar>
+		<view class="swiper">
+			<u-swiper :list="pageData.imgList" height="300" @change="e => currentNum = e.current" :autoplay="false" indicatorStyle="right: 20px">
+				<view slot="indicator" class="indicator-num">
+					<text class="indicator-num__text">{{ currentNum + 1 }}/{{ pageData.imgList.length }}</text>
+				</view>
+			</u-swiper>
+		</view>
+		<view class="box">
+			<view class="hflex acenter jbetween">
+				<view class="price">￥{{pageData.price}}</view>
+				<view class="hflex acenter">
+					<view class="vflex acenter" @click="collect">
+						<u-icon name="star" color="#444444" size="20" v-if="pageData.is_collect == 0"></u-icon>
+						<u-icon name="star-fill" color="#506DFF" size="20" v-else></u-icon>
+						<view class="text_style1">收藏</view>	
+					</view>	
+					<view class="vflex acenter" style="margin-left: 42rpx;">
+						<image src="/static/images/comment/share.png" class="bottom_img"></image>	
+						<view class="text_style1">分享</view>	
+					</view>	
+				</view>
+			</view>
+			<view class="name">{{pageData.name}}</view>
+		</view>
+		<view class="box">
+			<view class="hflex acenter jbetween" @click="openNorm">
+				<view class="hflex acenter">
+					<view class="label">选择</view>
+					<view class="text_style2">{{normStr?normStr:'选择规格'}}</view>
+				</view>
+				<u-icon name="arrow-right" color="#000" size="14"></u-icon>
+			</view>
+			<view class="hflex acenter jbetween pad-20" @click="openAddr">
+				<view class="hflex acenter">
+					<view class="label">配送</view>
+					<view class="text_style2">{{delivery?delivery:'选择配送地址'}}</view>
+				</view>
+				<u-icon name="arrow-right" color="#000" size="14"></u-icon>
+			</view>
+		</view>
+		<view class="box1">
+			<view class="title">商品图文详情</view>
+			<block v-for="(item,index) in pageData.detail" :key="index">
+				<image :src="item" mode="widthFix" class="detail_img"></image>
+			</block>
+		</view>
+		<view class="bottom hflex acenter jbetween">
+			<view class="vflex acenter" @click="toShop">
+				<image src="/static/images/shop/shop_icon.png" class="bottom_img"></image>
+				<view class="text_style1">店铺</view>	
+			</view>	
+			<view class="vflex acenter">
+				<image src="/static/images/shop/customer_icon.png" class="bottom_img"></image>	
+				<view class="text_style1">客服</view>	
+			</view>	
+			<view class="vflex acenter" @click="toCart">
+				<image src="/static/images/shop/cart_icon.png" class="bottom_img"></image>	
+				<view class="text_style1">购物车</view>	
+			</view>	
+			<view class="hflex acenter">
+				<view class="btn1" @click="addCart">加入购物车</view>
+				<view class="btn2" @click="buy">立即购买</view>
+			</view>
+		</view>
+		<u-popup :show="norm_show" @close="close" mode="bottom" :round="20" :closeable="true">
+			<view class="popu">
+				<view class="hflex acenter">
+					<image :src="pageData.imgList[0]" class="popu_img" mode="aspectFill"></image>
+					<view class="vflex jbetween popu_right">
+						<view class="popu_price">￥{{pageData.price}}</view>
+						<view class="popu_norm">{{normStr?normStr:'选择规格'}}</view>
+					</view>
+				</view>
+				<view class="popu_title">规格</view>
+				<view class="hflex acenter fwrap">
+					<block v-for="(item,index) in pageData.norm.normList" :key="index">
+						<view class="popu_box" @click="selectNorm(item.index)" :class="norm_active == item.index?'sele_active':''">{{item.name}}</view>
+					</block>
+				</view>
+				<view class="popu_title">颜色</view>
+				<view class="hflex acenter fwrap">
+					<block v-for="(item,index) in pageData.norm.colorList" :key="index">
+						<view class="popu_box" @click="selectColor(item.index)" :class="color_active == item.index?'sele_active':''">{{item.name}}</view>
+					</block>
+				</view>
+				<view class="hflex acenter jbetween">
+					<view class="popu_title">数量</view>
+					<u-number-box v-model="pageData.norm.num" @change="changeNum"></u-number-box>
+				</view>
+				<view class="sure_btn" @click="sure">确定</view>
+			</view>
+		</u-popup>
+		<u-popup :show="addr_show" @close="close" mode="bottom" :round="20" :closeable="true">
+			<view class="popu">
+				<view class="hflex acenter jcenter popu_title">配送地址</view>
+				<view>
+					<block v-for="(item,index) in pageData.delivery" :key="index">
+						<view class="box_bg hflex acenter" @click="selectAddr(item.index)">
+							<image v-if="item.checked == 1" src="/static/images/shop/checked.png" class="check_img"></image>
+							<u-icon v-else name="map-fill" color="#b2b2b2" size="12"></u-icon>
+							<view class="popu_right2">
+								<view class="hflex acenter">
+									<view class="popu_name">{{item.name}}</view>
+									<view class="popu_phone">{{item.phone}}</view>
+								</view>
+								<view class="popu_addr">{{item.address}}</view>
+							</view>
+						</view>
+					</block>
+				</view>
+				<view class="sure_btn" @click="select">选择其他收货地址</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				nav_active: 1,
+				currentNum: 0,
+				pageData: {
+					imgList: [
+						'/static/images/index/class_img1.png',
+						'/static/images/index/class_img1.png',
+						'/static/images/index/class_img1.png',
+					],
+					price: '699.33',
+					name: 'TCL 电视 55英寸 4K超清护眼防蓝光超薄金属全面屏 远程语音',
+					norm: {
+						normList: [
+							{
+								index: 0,
+								name: '3kw单相手启动'
+							},
+							{
+								index: 1,
+								name: '3kw单相手启动'
+							},
+							{
+								index: 2,
+								name: '3kw单相手启动'
+							},
+							{
+								index: 3,
+								name: '3kw单相手启动'
+							},
+							{
+								index: 4,
+								name: '3kw单相手启动'
+							},
+							{
+								index: 5,
+								name: '3kw单相手启动'
+							}
+						],
+						colorList: [
+							{
+								index: 0,
+								name: '褐色'
+							},
+							{
+								index: 1,
+								name: '白色'
+							},
+							{
+								index: 2,
+								name: '黑色'
+							},
+							{
+								index: 3,
+								name: '粉色'
+							},
+							{
+								index: 4,
+								name: '午夜色'
+							},
+							{
+								index: 5,
+								name: '红色'
+							}
+						],
+						num: 1
+					},
+					delivery: [
+						{
+							index: 0,
+							name: '张大成',
+							phone: '198****2345',
+							address: '河北省 保定市 莲池区 未来石4号楼20221室',
+							delivery: '河北省 保定市 莲池区',
+							is_default: 1
+						},
+						{
+							index: 1,
+							name: '张大成',
+							phone: '198****2345',
+							address: '河北省 保定市 莲池区 未来石4号楼20221室',
+							delivery: '河北省 保定市 莲池区',
+							is_default: 0
+						},
+						{
+							index: 2,
+							name: '张大成',
+							phone: '198****2345',
+							address: '河北省 保定市 莲池区 未来石4号楼20221室',
+							delivery: '河北省 保定市 莲池区',
+							is_default: 0
+						}
+					],
+					detail: ['/static/images/index/class_img1.png','/static/images/index/class_img2.png','/static/images/index/class_img1.png','/static/images/index/class_img2.png',],
+					is_collect: 0,
+				},
+				normStr: '',
+				norm: '',
+				color: '',
+				delivery: '',
+				norm_show: false,
+				addr_show: false,
+				norm_active: -1,
+				color_active:-1,
+				is_buy: 0,
+			}
+		},
+		onLoad() {
+			that = this
+			that.delivery = that.pageData.delivery[0].delivery
+			that.pageData.delivery[0].checked = true
+		},
+		onPageScroll(e) {
+			console.log(e);
+			if(e.scrollTop < 530) {
+				that.nav_active = 1
+			} else {
+				that.nav_active = 2
+			}
+		},
+		methods: {
+			// 返回
+			leftClick() {
+				$api.jump(-1)
+			},
+			// 切换导航栏
+			changeNav(index) {
+				that.nav_active = index
+				if(index == 1) {
+					uni.pageScrollTo({
+						scrollTop: 0,
+						duration: 300
+					});
+				} else {
+					uni.pageScrollTo({
+						scrollTop: 530,
+						duration: 300
+					});
+				}
+			},
+			// 收藏
+			collect() {
+				if(that.pageData.is_collect == 0) {
+					that.pageData.is_collect = 1
+					$api.info('收藏成功')
+				} else {
+					that.pageData.is_collect = 0
+					$api.info('取消收藏')
+				}
+			},
+			// 打开规格
+			openNorm() {
+				that.norm_show = true
+			},
+			// 打开配送
+			openAddr() {
+				that.addr_show = true
+			},
+			// 选择规格
+			selectNorm(index) {
+				that.norm_active = index
+				that.norm = that.pageData.norm.normList[index].name
+				that.normStr = that.norm + ' ' + that.color + ' ' + 'X' + that.pageData.norm.num
+			},
+			// 选择颜色
+			selectColor(index) {
+				that.color_active = index
+				that.color = that.pageData.norm.colorList[index].name
+				that.normStr = that.norm + ' ' + that.color + ' ' + 'X' + that.pageData.norm.num
+			},
+			// 选择数量
+			changeNum(e) {
+				that.pageData.norm.num = e.value
+				that.normStr = that.norm + ' ' + that.color + ' ' + 'X' + that.pageData.norm.num
+			},
+			// 选择地址
+			selectAddr(index) {
+				for(var i=0;i<that.pageData.delivery.length;i++) {
+					if(i == index) {
+						console.log(i);
+						that.$set(that.pageData.delivery[i],'checked',1)
+						that.delivery = that.pageData.delivery[i].delivery
+					} else {
+						that.$set(that.pageData.delivery[i],'checked',0)
+					}
+				}
+			},
+			// 加入购物车
+			addCart() {
+				if(that.norm == '' && that.color == '') {
+					that.openNorm()
+				} else {
+					$api.info('加入购物车成功')
+					that.close()
+				}
+			},
+			// 立即购买
+			buy() {
+				
+				if(that.norm == '' && that.color == '') {
+					that.is_buy = 1
+					that.openNorm()
+				} else {
+					$api.jump('/page_shop/pages/good/submit')
+					that.close()
+				}
+			},
+			// 确定选择规格
+			sure() {
+				console.log(that.norm);
+				console.log(that.color);
+				if(that.norm == '' || that.color == '') {
+					$api.info('请选择规格')
+					return
+				}
+				if(that.is_buy == 1) {
+					that.buy()
+				} else {
+					that.addCart()
+				}
+				
+			},
+			// 关闭弹窗
+			close() {
+				that.norm_show = false
+				that.addr_show = false
+			},
+			// 选择其他收货地址
+			select() {
+				$api.jump('/page_shop/pages/address/list')
+				that.close()
+			},
+			// 店铺
+			toShop() {
+				$api.jump('/page_shop/pages/good/shop')
+			},
+			// 购物车
+			toCart() {
+				$api.jump('/page_shop/pages/mine/cart')
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F5F5F5;
+		.nav_item {
+			font-size: 32rpx;
+			font-weight: 500;
+			color: #999999;
+			line-height: 50rpx;
+			margin-right: 88rpx;
+		}
+		.nav_active {
+			color: #222222;
+			position: relative;
+		}
+		.nav_active::after {
+			content: "";
+			position: absolute;
+			bottom: -8rpx;
+			left: 11rpx;
+			width: 40rpx;
+			height: 8rpx;
+			background: #506DFF;
+			border-radius: 6rpx;
+		}
+		.swiper {
+			width: 100%;
+			margin: 0 0 10rpx;
+			.indicator {
+				@include flex(row);
+				justify-content: center;
+		
+			}
+		
+			.indicator-num {
+				padding: 4rpx 0;
+				background-color: rgba(0, 0, 0, 0.6);
+				border-radius: 20rpx;
+				width: 72rpx;
+				@include flex;
+				justify-content: center;
+		
+				&__text {
+					 color: #FFFFFF;
+					 font-size: 24rpx;
+					 font-weight: 400;
+					 line-height: 30rpx;
+				 }
+			}	
+		}
+		.box {
+			margin: 10rpx auto;
+			width: 690rpx;
+			background: #FFFFFF;
+			border-radius: 16rpx;
+			box-sizing: border-box;
+			padding: 26rpx 20rpx;
+			
+			.price {
+				font-size: 32rpx;
+				font-weight: bold;
+				color: #FF5959;
+				line-height: 38rpx;
+			}
+			.name {
+				margin-top: 20rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 50rpx;
+			}
+			.bottom_img {
+				width: 40rpx;
+				height: 40rpx;
+			}
+			.pad-20 {
+				padding: 40rpx 0 0;
+			} 
+			.label {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #979797;
+				line-height: 36rpx;
+				padding-right: 32rpx;
+			}
+			.text_style2 {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #333333;
+				line-height: 36rpx;
+			}
+			
+		}
+		.box1 {
+			width: 690rpx;
+			background: #FFFFFF;
			border-radius: 16rpx;
+			margin: 10rpx auto 186rpx;
+			box-sizing: border-box;
+			padding: 26rpx 0;
+			.title {
+				font-size: 30rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 42rpx;
+				width: 100%;
+				text-align: center;
+				padding: 30rpx 0;
+			}
+			.detail_img {
+				width: 100%;
+				padding-bottom: 20rpx;
+			}
+		}
+		.text_style1 {
+			font-size: 20rpx;
+			font-weight: 400;
+			color: #444444;
+			margin-top: 6rpx;
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 30rpx 74rpx;
+			
+			.btn1 {
+				width: 220rpx;
+				height: 72rpx;
+				background: #FFCA43;
+				border-radius: 38rpx 0px 0px 38rpx;
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 72rpx;
+			}
+			.btn2 {
+				width: 220rpx;
+				height: 72rpx;
+				background: #506DFF;
+				border-radius: 0px 38rpx 38rpx 0px;
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 72rpx;
+			}
+			.bottom_img {
+				width: 40rpx;
+				height: 40rpx;
+			}
+			
+		}
+		.popu {
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 48rpx 30rpx;
+			.popu_img {
+				width: 160rpx;
+				height: 160rpx;
+				border-radius: 12rpx;
+				margin-right: 20rpx;
+			}
+			.popu_right {
+				height: 124rpx;
+				margin: 20rpx 0 16rpx;
+				.popu_price {
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #FF4747;
+					line-height: 34rpx;
+				}
+				.popu_norm {
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #A7A7A7;
+					line-height: 34rpx;
+				}
+			}
+			.popu_title {
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 40rpx;
+				padding: 20rpx 0;
+			}
+			.box_bg {
+				background: #F5F5F5;
+				border-radius: 16rpx;
+				box-sizing: border-box;
+				padding: 24rpx 20rpx;
+				margin: 10rpx 0;
+				.check_img {
+					width: 24rpx;
+					height: 24rpx;
+				}
+				.popu_right2 {
+					padding-left: 30rpx;
+					
+					.popu_name {
+						font-size: 28rpx;
+						font-weight: 500;
+						color: #222222;
+						line-height: 40rpx;
+					}
+					.popu_phone {
+						padding-left: 16rpx;
+						font-size: 22rpx;
+						font-weight: 400;
+						color: #999999;
+						line-height: 16px;
+					}
+					.popu_addr {
+						padding: 16rpx 0 0;
+						font-size: 24rpx;
+						font-weight: 400;
+						color: #444444;
+						line-height: 34rpx;
+					}
+				}
+			}
+			
+			.popu_box {
+				background: #F4F4F4;
+				border-radius: 8rpx;
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 36rpx;
+				padding: 14rpx 36rpx;
+				margin: 0 22rpx 28rpx 0;
+			}
+			// .popu_box:nth-child(4n+4) {
+			// 	margin: 0 0 28rpx 0;
+			// }
+			.sele_active {
+				background: #F1F4FF;
+				border: 1px solid #5471FF;
+				color: #506DFF;
+			}
+			.sure_btn {
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				line-height: 84rpx;
+				text-align: center;
+				margin-top: 94rpx;
+			}
+			
+		}
+	}
+</style>

page_shop/pages/good/shop.vue

@@ -0,0 +1,367 @@
+<template>
+	<view class="content">
+		<view class="top">
+			<u-navbar title=" " @leftClick="leftClick" height="44px" bgColor="rgb(255,255,255,0)" :placeholder="true">
+				<view class="u-nav-slot" slot="center"> 
+					<u-search placeholder="店铺热搜" v-model="keyword" :showAction="false"></u-search>
+				</view>
+			</u-navbar>
+		</view>
+		<view class="box">
+			<view class="box_top hflex acenter" @click="toDetail">
+				<image :src="shop.img" class="avatar"></image>
+				<view class="top_name">{{shop.name}}</view>
+			</view>
+			<view class="addr hflex acenter jbetween">
+				<view class="addr_text">{{shop.address}}</view>
+				<image src="/static/images/shop/map_icon.png" class="addr_icon"></image>
+			</view>
+			<view class="tabs hflex acenter">
+				<block v-for="(item,index) in tabs" :key="index">
+					<view class="hflex acenter" style="padding-right: 68rpx;">
+						<view class="tab_item" :class="tab_active == index ? 'tab_active': ''" @click="changeTab(index)">{{item.name}}</view>
+						<view class="vflex acenter jcenter" v-if="index == 2">
+							<u-icon name="arrow-up-fill" :color="color" size="4"></u-icon>
+							<u-icon name="arrow-down-fill" :color="color2" size="4"></u-icon>
+						</view>
+					</view>
+				</block>
+			</view>
+			<menuList :menuLists="shop.lists" bottomSize="200rpx" @listenEvent="myEvent" @listenMenu="myMenu">
+			</menuList>
+			<view class="bottom hflex acenter jbetween">
+				<view class="vflex acenter" @click="tellPhone">
+					<u-icon name="phone-fill" color="#506dff" size="20"></u-icon>
+					<view class="text_style1">打电话</view>	
+				</view>	
+				<view class="hflex acenter jcenter btn">
+					<image class="btn_icon" src="/static/images/shop/consulting.png"></image>
+					<view class="btn_text">咨询客服</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				keyword: '',
+				shop: {
+					img: '/static/images/mine/avatar1.jpg',
+					name: '江南造船厂',
+					address: '北城新区与汾河路交汇处',
+					phone: '13412341234',
+					lists: [
+						{
+							title: '柴油机',
+							goods: [
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								}
+							]
+						},
+						{
+							title: '齿轮箱',
+							goods: [
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img4.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								}
+							]
+						},
+						{
+							title: '舵机',
+							goods: [
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img5.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								},
+								{
+									label: '扬子柴油发电机3kw/5kw/8kw/10kw小型家用工业…',
+									img: '/static/images/index/class_img3.png',
+									price: '3400.00',
+								}
+							]
+						}
+					],
+				},
+				tabs: [
+					{
+						index: 0,
+						name: '全部',
+					},
+					{
+						index: 1,
+						name: '销量',
+					},
+					{
+						index: 2,
+						name: '价格',
+					}
+				],
+				tab_active: 0,
+				color: '#7D7D7D',
+				color2: '#7D7D7D',
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 返回
+			leftClick() {
+				console.log('返回');
+				$api.jump(-1)
+			},
+			// 店铺详情
+			toDetail() {
+				$api.jump('/page_shop/pages/good/shopDetail')
+			},
+			// 点击产品列表
+			myEvent(e) {
+				console.log(e);
+			},
+			// 点击菜单列表
+			myMenu(e) {
+				console.log(e);
+			},
+			// 切换tabs
+			changeTab(e) {
+				console.log(e);
+				if(that.tab_active != 2) {
+					that.color = '#506dff'
+				} else {
+					that.color = '#7D7D7D'
+					that.color2 = '#506dff'
+				}
+				that.tab_active = e
+			},
+			// 打电话
+			tellPhone() {
+				var value = that.shop.phone
+				uni.makePhoneCall({
+					phoneNumber: value //仅为示例
+				});
+			}
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		position: relative;
+		.top {
+			background: url('../../../static/images/comment/nav_bg.png') no-repeat;
+			background-size: 100%;
+			box-sizing: border-box;
+			padding: 30rpx;
+			height: 540rpx;
+			.u-nav-slot {
+				position: absolute;
+				top: 8rpx;
+				left: 134rpx;
+			}
+		}
+		.box {
+			position: absolute;
+			left: 0;
+			top: 240rpx;
+			width: 100%;
+			min-height: calc(100vh - 240rpx);
+			background: #FFFFFF;
+			border-radius: 40rpx 40rpx 0  0;
+			.box_top {
+				position: relative;
+				.avatar {
+					position: absolute;
+					left: 30rpx;
+					top: -52rpx;
+					width: 148rpx;
+					height: 148rpx;
+					border-radius: 50%;
+					border: 4rpx solid #FFFFFF;
+				}
+				.top_name {
+					font-size: 40rpx;
+					font-weight: 500;
+					color: #222222;
+					line-height: 56rpx;
+					padding: 20rpx 0 0 218rpx;
+				}
+			}
+			.addr {
+				padding: 44rpx 30rpx 28rpx;
+				box-sizing: border-box;
+				border-bottom: 1rpx solid #F4F4F4;
+				width: 100%;
+				.addr_text {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 36rpx ;
+				}
+				.addr_icon {
+					width: 36rpx;
+					height: 36rpx;
+				}
+			}
+			.tabs {
+				width: 100%;
+				box-sizing: border-box;
+				padding: 34rpx 30rpx 40rpx;
+				.tab_item {
+					font-size: 32rpx;
+					font-weight: 500;
+					color: #7D7D7D;
+					line-height: 44rpx;
+					padding-right: 10rpx;
+				}
+				.tab_active {
+					font-size: 36rpx;
+					font-weight: 500;
+					color: #222222;
+					line-height: 50rpx;
+					position: relative;
+				}
+				.tab_active::after {
+					content: "";
+					position: absolute;
+					left: 18rpx;
+					bottom: -5rpx;
+					width: 40rpx;
+					height: 8rpx;
+					background: #506DFF;
+					border-radius: 4rpx;
+				}
+			}
+			.bottom {
+				width: 100%;
+				z-index: 9;
+				position: fixed;
+				bottom: 0;
+				height: 166rpx;
+				background: #FFFFFF;
+				box-sizing: border-box;
+				padding: 8rpx 50rpx 74rpx;
+				.text_style1 {
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #506DFF;
+					line-height: 28rpx;
+					padding-top: 6rpx;
+				}
+				.btn {
+					width: 550rpx;
+					height: 84rpx;
+					background: #506DFF;
+					border-radius: 42rpx;
+				}
+				.btn_icon {
+					width: 40rpx;
+					height: 40rpx;
+				}
+				.btn_text {
+					padding-left: 4rpx;
+					font-size: 32rpx;
+					font-weight: 500;
+					color: #FFFFFF;
+					line-height: 44rpx;
+				}
+			}
+		}
+	}
+</style>

page_shop/pages/good/shopDetail.vue

@@ -0,0 +1,153 @@
+<template>
+	<view class="content">
+		<view class="top">
+			<u-navbar title="店铺详情" @leftClick="leftClick" height="44px" bgColor="rgb(255,255,255,0)" :placeholder="true">
+			</u-navbar>
+		</view>
+		<view class="box">
+			<view class="box_top hflex acenter">
+				<image :src="shop.img" class="avatar"></image>
+				<view class="top_name">{{shop.name}}</view>
+			</view>
+			<view class="addr hflex acenter jbetween">
+				<view class="addr_text">{{shop.address}}</view>
+				<image src="/static/images/shop/map_icon.png" class="addr_icon"></image>
+			</view>
+			<view class="text_style1">商家简介</view>
+			<view class="text_style2">{{shop.brief}}</view>
+		</view>
+		<view class="box1">
+			<view class="text_style1">图片及视频</view>
+			<view class="hflex acenter fwrap">
+				<block v-for="(item,index) in shop.imgs" :key="index">
+					<image :src="item" class="box1_img"></image>
+				</block>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				shop: {
+					img: '/static/images/mine/avatar1.jpg',
+					name: '江南造船厂',
+					address: '北城新区与汾河路交汇处',
+					phone: '13412341234',
+					brief: ' 根据《中华人民共和国价格法》、《中华人民共和国商业银行法》、《商业银行服务价格管理办法》、《国家发展改革委 中国银监会关于印发商业银行服务政府指导价政府定价目录的通知》、《中国银保监会关于规范银行服务市场调节价管理的指导意见》等规定，按照“收费项目公开、服务质价公开、效用功能公开、优惠政策公开”的“四公开”要求，现将本行各项金融服务价格标准予以公告。本公告内容包括服务提示、政府指导价政府定价项目价格标准、中国农业银行免费服务项目及中国农业银行市场调节价服务价格标准等，自2022年4月30日起执行。',
+					imgs: [
+						'/static/images/mine/avatar1.jpg',
+						'/static/images/mine/avatar1.jpg',
+						'/static/images/mine/avatar1.jpg',
+					]
+				},
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 返回
+			leftClick() {
+				console.log('返回');
+				$api.jump(-1)
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F4F4F4;
+		position: relative;
+		.top {
+			background: url('../../../static/images/comment/nav_bg.png') no-repeat;
+			background-size: 100%;
+			box-sizing: border-box;
+			padding: 30rpx;
+			height: 248rpx;
+			.u-nav-slot {
+				position: absolute;
+				top: 8rpx;
+				left: 134rpx;
+			}
+		}
+		.box {
+			// position: absolute;
+			// left: 0;
+			// top: 240rpx;
+			width: 100%;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 30rpx;
+			border-radius: 40rpx 40rpx 0  0;
+			.box_top {
+				position: relative;
+				.avatar {
+					position: absolute;
+					left: 0;
+					top: -52rpx;
+					width: 148rpx;
+					height: 148rpx;
+					border-radius: 50%;
+					border: 4rpx solid #FFFFFF;
+				}
+				.top_name {
+					font-size: 40rpx;
+					font-weight: 500;
+					color: #222222;
+					line-height: 56rpx;
+					padding: 20rpx 0 0 218rpx;
+				}
+			}
+			.addr {
+				padding: 44rpx 0 28rpx;
+				box-sizing: border-box;
+				border-bottom: 1rpx solid #F4F4F4;
+				width: 100%;
+				.addr_text {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 36rpx ;
+				}
+				.addr_icon {
+					width: 36rpx;
+					height: 36rpx;
+				}
+			}
+		}
+		.text_style1 {
+			font-size: 32rpx;
+			font-weight: 500;
+			color: #222222;
+			padding: 24rpx 0 20rpx;
+		}
+		.text_style2 {
+			font-size: 26rpx;
+			font-weight: 400;
+			color: #222222;
+			line-height: 36rpx;
+		}
+		.box1 {
+			margin: 20rpx 0;
+			width: 100%;
+			box-sizing: border-box;
+			padding: 24rpx 30rpx;
+			background: #FFFFFF;
+			.box1_img {
+				width: 220rpx;
+				height: 220rpx;
+				border-radius: 20rpx;
+				margin: 0 16rpx 20rpx 0;
+			}
+			.box1_img:nth-child(3n+3) {
+				margin: 0 0 20rpx;
+			}
+		}
+	}
+</style>

page_shop/pages/good/submit.vue

@@ -0,0 +1,245 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<block v-if="JSON.stringify(address) == '{}'">
+				<view class="hflex acenter jbetween">
+					<view class="title">新增收货地址</view>
+					<u-icon name="arrow-right" color="#ABABAB" size="11"></u-icon>
+				</view>
+			</block>
+			<block v-else>
+				<view class="hflex acenter jbetween">
+					<view class="hflex acenter">
+						<u-icon name="map-fill" color="#506DFF" size="22"></u-icon>
+						<view class="vflex" style="padding-left: 16rpx;">
+							<view class="hflex acenter">
+								<view class="text_style1" style="padding-right: 20rpx;">{{address.name}}</view>
+								<view class="text_style1">{{address.phone}}</view>
+							</view>
+							<view class="text_style2">{{address.address}}</view>
+						</view>
+					</view>
+					<u-icon name="arrow-right" color="#ABABAB" size="11"></u-icon>
+				</view>
+			</block>
+		</view>
+		<block v-for="(item,index) in goodList" :key="index">
+			<view class="box">
+				<view class="title">{{item.name}}</view>
+				<view class="hflex acenter cell">
+					<image :src="item.src" class="img"></image>
+					<view class="img_right">
+						<view class="hflex acenter jbetween">
+							<view class="item_name text_hide" style="width: 374rpx;">{{item.good_name}}</view>
+							<view class="item_name">￥{{item.price}}</view>
+						</view>
+						<view class="hflex jbetween" style="padding: 2rpx 0 0;">
+							<view class="norm">{{item.norm}}</view>
+							<view class="left_text">X{{item.num}}</view>
+						</view>
+					</view>
+				</view>
+				<view class="hflex acenter jbetween">
+					<view class="title">订单备注</view>
+					<u-input v-model="item.remarks" inputAlign="right" border="none" placeholder="建议留言前先与商家沟通确认"></u-input>
+				</view>
+			</view>
+		</block>
+		<view class="box">
+			<view class="hflex acenter jbetween">
+				<view class="left_text">商品金额</view>
+				<view class="right_text">￥{{amount}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell2">
+				<view class="left_text">运费</view>
+				<view class="right_text">￥{{freight}}</view>
+			</view>
+			<view class="hflex acenter jend item_bottom">
+				<view class="title" style="font-size: 22rpx;">合计：<span class="text_red">￥{{total}}</span></view>
+			</view>
+			
+		</view>
+		<view class="box hflex acenter jbetween">
+			<view class="hflex acenter">
+				<image src="/static/images/shop/wx_pay.png" class="pay_icon"></image>
+				<view class="text_style1">微信支付</view>
+			</view>
+			<u-radio-group>
+				<u-radio activeColor="#506DFF"></u-radio>
+			</u-radio-group>
+		</view>
+		<view class="bottom hflex acenter jend">
+			<view class="title" style="font-size: 22rpx;">合计：<span class="text_blue">￥{{total}}</span></view>
+			<view class="btn">提交订单</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				address: {
+					name: '张大成',
+					phone: '19876523456',
+					address: '河北省 保定区 莲池区 未来石4号楼20221室',
+				},
+				goodList: [
+					{
+						name: '江南造船厂',
+						src: '/static/images/index/class_img3.png',
+						good_name: '扬子柴油发电机3kw/5kw…',
+						price: '29.90',
+						num: '1',
+						remarks: '',
+						norm: '规格类型:3kw单相手启动;颜色:黑色;配置:128G',
+					}
+				],
+				amount: '29.90',
+				freight: '0.00',
+				total: '29.90',
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background-color: #F4F4F4;
+		.box {
+			background: #FFFFFF;
+			border-radius: 10px;
+			margin: 20rpx auto 0;
+			width: 690rpx;
+			box-sizing: border-box;
+			padding: 34rpx 20rpx;
+			.title {
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 44rpx;
+			}
+			.text_style1 {
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 40rpx;
+			}
+			.text_style2 {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #888888;
+				line-height: 36rpx;
+			}
+			.cell {
+				padding: 20rpx 0 32rpx;
+			}
+			.cell2 {
+				padding: 32rpx 0 20rpx;
+			}
+			.img {
+				width: 160rpx;
+				height: 160rpx;
+				border-radius: 24rpx;
+			}
+			.img_right {
+				width:calc(100% - 160rpx);
+				padding-left: 20rpx;
+				.item_name {
+					font-size: 30rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 42rpx;
+				}
+				.norm {
+					width: 288rpx;
+					// height: 42px;
+					background: #F5F5F5;
+					border-radius: 12rpx;
+					box-sizing: border-box;
+					padding: 12rpx;
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #888888;
+					line-height: 28rpx;
+				}
+				
+			}
+			.left_text {
+				font-size: 24rpx;
+				font-weight: 500;
+				color: #888888;
+				line-height: 28rpx;
+			}
+			.right_text {
+				font-size: 24rpx;
+				font-weight: bold;
+				color: #222222;
+				line-height: 28rpx;
+			}
+			.item_bottom {
+				padding-top: 22rpx;
+				border-top: 1rpx solid #F4F4F4;
+			}
+			.text_red {
+				font-weight: bold;
+				color: #EE5850;
+			}
+			.pay_icon {
+				width: 48rpx;
+				height: 48rpx;
+				margin-right: 20rpx;
+			}
+			.check_icon {
+				width: 32rpx;
+				height: 32rpx;
+			}
+		}
+		.box:nth-last-child(1) {
+			margin-bottom: 186rpx;
+		}
+		.u-radio-group {
+			flex: 0 !important;
+		}
+		.bottom {
+			width: 100%;
+			height: 166rpx;
+			background: #FFFFFF;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			box-sizing: border-box;
+			padding: 8rpx 50rpx 74rpx;
+			.title {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 34rpx;
+			}
+			.text_blue {
+				font-size: 44rpx;
+				color: #5270FF;
+			}
+			.btn{
+				margin-left: 16rpx;
+				width: 260rpx;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				text-align: center;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				line-height: 84rpx;
+			}
+		}
+	}
+</style>

page_shop/pages/mine/cart.vue

@@ -0,0 +1,385 @@
+<template>
+	<view class="content">
+		<view class="top hflex acenter jbetween">
+			<view class="hflex acenter">
+				<u-icon name="map-fill" color="#555555" size="13"></u-icon>
+				<view class="top_text">{{city}}</view>
+			</view>
+			<view class="top_text" @click="manager">{{is_manager == 0?'管理':'取消'}}</view>
+		</view>
+		<view class="center">
+			<block v-for="(item,index) in pageList" :key="index">
+				<view class="box vflex">
+					
+					<view class="hflex acenter jbetween cell">
+						<view class="hflex acenter">
+							<u-checkbox-group placement="column" @change="checkboxAll(index)">
+								<u-checkbox :value="all" :checked="isAllSelected" shape="circle"></u-checkbox>
+							</u-checkbox-group>
+							<view class="title">{{item.name}}</view>
+						</view>
+						<view class="right_btn" @click="toShop(item.id)">进店看看</view>
+					</view>
+					
+					<block v-for="(item2,index2) in item.goods" :key="index2">
+						<u-checkbox-group placement="column" @change="checkboxChange(index,index2)">
+							<u-swipe-action>
+								<u-swipe-action-item :options="options2">
+									<view class="hflex acenter cell">
+										<u-checkbox v-model="item2.id" :value="item2.id" :checked="item2.checked" shape="circle"></u-checkbox>
+										<image :src="item2.src" class="img"></image>
+										<view class="vflex img_right">
+											<view class="item_name">{{item2.name}}</view>
+											<view class="hflex acenter jbetween">
+												<view class="text_red">￥{{item2.price}}</view>
+												<u-number-box buttonSize="20" v-model="item2.num" @change="valChange"></u-number-box>
+											</view>
+										</view>
+									</view>
+								</u-swipe-action-item>
+							  </u-swipe-action>
+							
+						</u-checkbox-group>
+					</block>
+				</view>
+			</block>
+		</view>
+		<view class="bottom hflex acenter jbetween">
+			<view>
+				<u-checkbox-group placement="column" @change="checkboxAll2">
+					<u-checkbox :value="all" :checked="isAllSelected" shape="circle" label="全选"></u-checkbox>
+				</u-checkbox-group>
+			</view>
+			<view class="hflex aend" v-if="is_manager == 0">
+				<view class="bottom_num">已选{{num?num:0}}件</view>
+				<view class="bottom_total">合计：<span class="text-blue">￥{{total}}</span></view>
+				<view class="btn">一键结算</view>
+			</view>
+			<view class="hflex aend" v-if="is_manager == 1">
+				<view class="btn2">删除</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				is_manager: 0,
+				city: '临沂市',
+				pageList: [
+					{
+						id: 2,
+						name: '江南造船厂(浦东店)',
+						all: '',
+						isAllSelected: false,
+						goods: [
+							{
+								id: 3,
+								src: '/static/images/index/class_img3.png',
+								name: '舒适达 牙龈护理牙膏120g/盒',
+								price: 1289,
+								num: 1,
+							},
+							{
+								id: 4,
+								src: '/static/images/index/class_img3.png',
+								name: '舒适达 牙龈护理牙膏120g/盒',
+								price: 1289,
+								num: 1
+							}
+						]
+						
+					},
+					{
+						id: 2,
+						name: '江南造船厂(浦东店)',
+						all: '',
+						isAllSelected: false,
+						goods: [
+							{
+								id: 5,
+								src: '/static/images/index/class_img3.png',
+								name: '舒适达 牙龈护理牙膏120g/盒',
+								price: 1289,
+								num: 1,
+							},
+							{
+								id: 6,
+								src: '/static/images/index/class_img3.png',
+								name: '舒适达 牙龈护理牙膏120g/盒',
+								price: 1289,
+								num: 1
+							}
+						]
+						
+					}
+				],
+				num: 0,
+				total: 0,
+				isAllSelected: false,
+				options2: [{
+                    text: '删除'
+                }]
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 管理
+			manager() {
+				if(that.is_manager == 0) {
+					that.is_manager = 1
+				} else {
+					that.is_manager = 0
+				}
+			},
+			// 单个店铺全选
+			checkboxAll(index) {
+				// console.log(e);
+				that.pageList[index].isAllSelected = !that.pageList[index].isAllSelected
+				if(that.pageList[index].isAllSelected) {
+					for(var i = 0;i<that.pageList[index].goods.length;i++) {
+						that.$set(that.pageList[index].goods[i],'checked',true)
+						// that.pageList[index].isAllSelected = true
+					}
+				} else {
+					for(var i = 0;i<that.pageList[index].goods.length;i++) {
+						that.$set(that.pageList[index].goods[i],'checked',false)
+						// that.pageList[index].isAllSelected = false
+					}
+				}
+				that.totalGood()
+			},
+			// 选择单个商品
+			checkboxChange(index,index2) {
+				if(that.pageList[index].goods[index2].checked) {
+					that.pageList[index].goods[index2].checked = !that.pageList[index].goods[index2].checked
+				} else {
+					that.$set(that.pageList[index].goods[index2],'checked',true)
+				}
+				that.totalGood()
+			},
+			// 选择所有商品
+			checkboxAll2() {
+				that.isAllSelected = !that.isAllSelected
+				if(that.isAllSelected) {
+					for(var i = 0;i<that.pageList.length;i++) {
+						that.pageList[i].isAllSelected = true
+						for (var j=0;j<that.pageList[i].goods.length;j++) {
+							that.$set(that.pageList[i].goods[j],'checked',true)
+						}
+					}
+					
+				} else {
+					for(var i = 0;i<that.pageList.length;i++) {
+						that.pageList[i].isAllSelected = false
+						for (var j=0;j<that.pageList[i].goods.length;j++) {
+							that.$set(that.pageList[i].goods[j],'checked',false)
+						}
+					}
+					that.num = 0
+					that.total = 0
+				}
+				that.totalGood()
+			},
+			// 进店看看
+			toShop(id) {
+				$api.jump('/page_shop/pages/good/shop?id=' + id)
+			},
+			// 计算选择数量和价格
+			totalGood() {
+				var total = 0	
+				that.total = 0
+				that.num = 0
+				var num = 0
+				for(var i = 0;i<that.pageList.length;i++) {
+					for (var j=0;j<that.pageList[i].goods.length;j++) {
+						if(that.pageList[i].goods[j].checked) {
+							num += that.pageList[i].goods[j].num
+							total += that.pageList[i].goods[j].num * that.pageList[i].goods[j].price
+							that.total = total.toFixed(2)
+							that.num = num
+						}
+					}
+				}
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F5F5F5;
+		.top {
+			width: 100%;
+			height: 80rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 20rpx 30rpx;
+			.top_text {
+				font-size: 28rpx;
+				font-weight: 400;
+				color: #555555;
+				line-height: 40rpx;
+				padding-left: 6rpx;
+			}
+		}
+		.center {
+			width: 100%;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			margin-bottom: 186rpx;
+			.box {
+				width: 100%;
+				background: #FFFFFF;
+				border-radius: 14px;
+				margin-top: 20rpx;
+				box-sizing: border-box;
+				padding: 10rpx 20rpx;
+				.cell {
+					padding: 10rpx 0;
+				}
+				.title {
+					font-size: 30rpx;
+					font-weight: 500;
+					color: #222222;
+					line-height: 42rpx;
+				}
+				.right_btn {
+					width: 112rpx;
+					height: 36rpx;
+					background: #EDF0FF;
+					border-radius: 18rpx;
+					text-align: center;
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #506DFF;
+					line-height: 36rpx;
+				}
+				.img {
+					width: 128rpx;
+					height: 128rpx;
+					border-radius: 12rpx;
+					margin: 0 20rpx 0 16rpx;
+				}
+				.img_right {
+					width: calc(100% - 188rpx);
+				}
+				.item_name {
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 40rpx;
+					padding-bottom: 32rpx;
+				}
+				.text_red {
+					font-size: 28rpx;
+					font-weight: bold;
+					color: #FF4747;
+					line-height: 32rpx;
+				}
+				.u-number-box {
+					// width: 152rpx;
+					// height: 40rpx !important;
+					.input {
+						min-height: 40rpx !important;
+					}
+					.u-number-box__minus {
+						border-radius: 20rpx 0 0 20rpx;
+					}
+					.u-number-box__input {
+						margin: 0 !important;
+						min-height: 40rpx !important;
+					}
+					.u-number-box__plus {
+						border-radius: 0 20rpx 20rpx 0;
+					}
+				}
+				
+			}
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 30rpx 74rpx;
+			.bottom_num {
+				font-size: 20rpx;
+				font-weight: 400;
+				color: #939393;
+				line-height: 34rpx;
+				padding-bottom: 16rpx;
+			}
+			.bottom_total {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 34rpx;
+				padding-bottom: 16rpx;
+			}
+			.text-blue {
+				font-size: 44rpx;
+				font-weight: 400;
+				color: #5270FF;
+			}
+			.btn {
+				width: 232rpx;
+				height: 88rpx;
+				background: #506DFF;
+				border-radius: 44rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				line-height: 88rpx;
+				text-align: center;
+			}
+			.btn2 {
+				width: 200rpx;
+				height: 80rpx;
+				border-radius: 44rpx;
+				border: 1px solid #506DFF;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #506DFF;
+				line-height: 80rpx;
+				text-align: center;
+			}
+		}
+		.u-page {
+			padding: 0;
+		}
+	
+		.u-demo-block__title {
+			padding: 10px 0 2px 15px;
+		}
+	
+		.swipe-action {
+			&__content {
+				 padding: 25rpx 0;
+		
+				&__text {
+					 font-size: 15px;
+					 color: $u-main-color;
+					 padding-left: 30rpx;
+				 }
+			}
+		}
+		.u-swipe-action-item__right__button__wrapper {
+			background-color: #FF4C4C !important;
+		}
+		.u-swipe-action-item__right {
+			width: 114rpx;
+			height: 128rpx;
+			margin:  0 0 30rpx;
+		}
+	}
+</style>

page_shop/pages/mine/collect.vue

@@ -0,0 +1,180 @@
+<template>
+	<view class="content">
+		<view class="top hflex acenter jbetween">
+			<view class="left">共<span class="text_red">{{length}}</span>件商品</view>
+			<view class="left" :class="is_manager?'text_blue':''" @click="manager">{{is_manager?'完成':'编辑'}}</view>
+		</view>
+		<view class="box">
+			<block v-for="(item,index) in pageList" :key="index">
+				<view class="item hflex acenter">
+					<u-checkbox-group v-if="is_manager == 1" placement="column" @change="checkboxChange(index)">
+						<u-checkbox v-model="item.id" :value="item.id" :checked="item.checked" shape="circle"></u-checkbox>
+					</u-checkbox-group>
+					<view class="">
+						<image :src="item.img" class="img"></image>
+					</view>
+					<view class="vflex" style="margin-left: 24rpx;">
+						<view class="name">{{item.name}}</view>
+						<view class="price">￥{{item.price}}</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<view class="bottom hflex acenter jbetween" v-if="is_manager == 1">
+			<view>
+				<u-checkbox-group placement="column" @change="checkboxAll2">
+					<u-checkbox :value="all" :checked="isAllSelected" shape="circle" label="全选"></u-checkbox>
+				</u-checkbox-group>
+			</view>
+			<view class="hflex aend">
+				<view class="btn2">删除</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				length: 0,
+				pageList: [
+					{
+						img: '/static/images/mine/avatar1.jpg',
+						name: '兰蔻小黑瓶50ml全新肌底液精华液化妆品护肤全套礼盒…',
+						price: 1298
+					},
+					{
+						img: '/static/images/index/class_img4.png',
+						name: '兰蔻小黑瓶50ml全新肌底液精华液化妆品护肤全套礼盒…',
+						price: 1298
+					}
+				],
+				is_manager: 0,
+				all: '',
+				isAllSelected: false,
+			}
+		},
+		onLoad() {
+			that = this
+			that.totalLength()
+		},
+		methods: {
+			// 统计商品数量
+			totalLength() {
+				that.length = that.pageList.length
+			},
+			// 编辑
+			manager() {
+				if(that.is_manager == 0) {
+					that.is_manager = 1
+				} else {
+					that.is_manager = 0
+				}
+			},
+			// 全选
+			checkboxAll2() {
+				that.isAllSelected = !that.isAllSelected
+				if(that.isAllSelected) {
+					for(var i = 0;i<that.pageList.length;i++) {
+						that.$set(that.pageList[i],'checked',true)
+					}
+					
+				} else {
+					for(var i = 0;i<that.pageList.length;i++) {
+						that.$set(that.pageList[i],'checked',false)
+					}
+				}
+			},
+			// 单选
+			checkboxChange(index) {
+				console.log(index);
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F5F5F5;
+		.top {
+			width: 100%;
+			box-sizing: border-box;
+			padding: 20rpx 30rpx;
+			.left {
+				font-size: 32rpx;
+				font-weight: 400;
+				color: #555555;
+				line-height: 44rpx;
+			}
+			.text_red {
+				color: #FF5E5E;
+			}
+			.text_blue {
+				color: #506DFF;
+			}
+		}
+		.box {
+			width: 100%;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			background: #FFFFFF;
+			.item {
+				width: 100%;
+				padding: 20rpx 0 32rpx;
+				border-bottom: 1rpx solid #F4F4F4;
+				.img {
+					width: 196rpx;
+					height: 196rpx;
+					border-radius: 16rpx;
+				}
+				.name {
+					font-size: 32rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 44rpx;
+					text-overflow: ellipsis;
+					overflow: hidden;
+					display: -webkit-box;
+					-webkit-box-orient: vertical;
+					box-orient: vertical;
+					line-clamp: 2;
+					-webkit-line-clamp: 2;
+				}
+				.price {
+					font-size: 44rpx;
+					font-weight: bold;
+					color: #FF5E5E;
+					line-height: 52rpx;
+					padding-top: 32rpx;
+				}
+			}
+			.item:nth-last-child(1) {
+				border: none;
+			}
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 30rpx 74rpx;
+			.btn2 {
+				width: 200rpx;
+				height: 80rpx;
+				border-radius: 44rpx;
+				border: 1px solid #506DFF;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #506DFF;
+				line-height: 80rpx;
+				text-align: center;
+			}
+		}
+	}
+</style>

page_shop/pages/mine/mine.vue

@@ -0,0 +1,189 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<u-navbar title="我的" titleStyle="color: #fff;" @leftClick="leftClick" height="44px" bgColor="rgb(255,255,255,0)" :placeholder="true"></u-navbar>
+			<view class="top hflex acenter">
+				<image :src="user.avatar" class="avatar"></image>
+				<view class="top_text">{{user.name}}</view>
+			</view>
+			<view class="hflex acenter jbetween tabs">
+				<block v-for="(item,index) in tabs" :key="index">
+					<view class="vflex acenter tab_item" @click="toDetail(item.url)">
+						<image :src="item.src" class="tab_icon"></image>
+						<view class="tab_text">{{item.name}}</view>
+					</view>
+				</block>
+			</view>
+			<view class="order">
+				<view class="hflex acenter jbetween">
+					<view class="title">我的订单</view>
+					<view class="right" @click="toOrder(0)">查看全部</view>
+				</view>
+				<view class="hflex acenter jbetween" style="margin-top: 32rpx;">
+					<block v-for="(item,index) in orderList" :key="index">
+						<view class="vflex acenter order_item" @click="toOrder(item.id)">
+							<image :src="item.src" class="order_icon"></image>
+							<view class="order_text">{{item.name}}</view>
+						</view>
+					</block>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				user: {
+					avatar: '/static/images/mine/avatar1.jpg',
+					name: 'Dxy_Leo'
+				},
+				tabs: [
+					{
+						src: '/static/images/shop/consulting.png',
+						name: '消息',
+						url: ''
+					},
+					{
+						src: '/static/images/shop/collect.png',
+						name: '收藏',
+						url: '/page_shop/pages/mine/collect'
+					},
+					{
+						src: '/static/images/shop/address.png',
+						name: '地址',
+						url: '/page_shop/pages/address/list'
+					}
+				],
+				orderList: [
+					{
+						src: '/static/images/shop/order_icon1.png',
+						name: '待付款',
+						id: 1,
+					},
+					{
+						src: '/static/images/shop/order_icon2.png',
+						name: '待发货',
+						id: 2,
+					},
+					{
+						src: '/static/images/shop/order_icon3.png',
+						name: '待收货',
+						id: 3,
+					},
+					{
+						src: '/static/images/shop/order_icon4.png',
+						name: '退款/售后',
+						id: 4,
+					}
+				]
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 返回
+			leftClick() {
+				console.log('返回');
+				$api.jump(-1)
+			},
+			// 进入详情页面
+			toDetail(url) {
+				$api.jump(url)
+			},
+			toOrder(id) {
+				if(id == 4) {
+					$api.jump('/page_shop/pages/order/refund')
+				} else {
+					$api.jump('/page_shop/pages/order/list?id=' + id)
+				}
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F5F5F5;
+		.box {
+			width: 100%;
+			background: linear-gradient(360deg, #F5F5F5 0%, #506DFF 100%);
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			.top {
+				width: 100%;
+				padding: 8rpx 0 30rpx;
+				.avatar {
+					width: 120rpx;
+					height: 120rpx;
+					border-radius: 50%;
+					border: 2px solid #FFFFFF;
+				}
+				.top_text {
+					font-size: 40rpx;
+					font-weight: 500;
+					color: #FFFFFF;
+					line-height: 56rpx;
+					margin-left: 12rpx;
+				}
+			}
+			.tabs {
+				padding: 30rpx 0 40rpx;
+				.tab_item {
+					width: 33%;
+					text-align: center;
+					.tab_icon {
+						width: 52rpx;
+						height: 52rpx;
+					}
+					.tab_text {
+						font-size: 26rpx;
+						font-weight: 400;
+						color: #FFFFFF;
+						line-height: 36rpx;
+						padding-top: 12rpx;
+					}
+				}
+			}
+			.order {
+				width: 100%;
+				box-sizing: border-box;
+				padding: 24rpx 20rpx;
+				background: #FFFFFF;
+				border-radius: 10px;
+				.title {
+					font-size: 28rpx;
+					font-weight: 500;
+					color: #0A0A0A;
+					line-height: 40rpx;
+				}
+				.right {
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #B4B4B4;
+					line-height: 34rpx;
+				}
+				.order_item{
+					width: 25%;
+					text-align: center;
+					.order_icon {
+						width: 52rpx;
+						height: 52rpx;
+					}
+					.order_text {
+						padding-top: 24rpx;
+						font-size: 26rpx;
+						font-weight: 400;
+						color: #0A0A0A;
+						line-height: 36rpx;
+					}
+				}
+			}
+		}
+	}
+</style>

page_shop/pages/order/apply.vue

@@ -0,0 +1,329 @@
+<template>
+	<view class="content vflex jbetween">
+		<view>
+			<view class="box">
+				<view class="title">退款商品</view>
+				<view class="hflex acenter ">
+					<image :src="pageData.src" class="img"></image>
+					<view class="img_right">
+						<view class="hflex acenter jbetween">
+							<view class="item_name text_hide" style="width: 374rpx;">{{pageData.name}}</view>
+							<view class="item_name">￥{{pageData.price}}</view>
+						</view>
+						<view class="hflex jbetween" style="padding: 20rpx 0 0;">
+							<view class="norm">{{pageData.norm}}</view>
+							<view class="left_text">X{{pageData.num}}</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="box">
+				<view class="title">退款信息</view>
+				<view class="hflex acenter jbetween cell" @click="selectReason">
+					<view class="left">退款原因</view>
+					<u-input v-model="reason" inputAlign="right" placeholder="请选择退款原因>" border="none"></u-input>
+				</view>
+				<view class="hflex acenter jbetween cell">
+					<view class="left">退款金额</view>
+					<view class="right">￥{{money}}</view>
+				</view>
+			</view>
+			<view class="box">
+				<view class="title">退款信息</view>
+				<view class="bg">
+					<u-textarea autoHeight  v-model="remarks" placeholder="补充描述,便于商家更好的处理售后问题" border="none"></u-textarea>
+					<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="1" width="132rpx" height="132rpx">
+						<!-- <image src="https://cdn.uviewui.com/uview/demo/upload/positive.png" mode="widthFix" style="width: 132rpx;height: 132rpx;"></image> -->
+						<view class="upload vflex acenter jcenter">
+							<u-icon name="camera" color="#B5B5B5" size="18"></u-icon>
+							<view class="text">上传凭证</view>
+						</view>
+					</u-upload>
+				</view>
+			</view>
+			<u-popup :show="show" :round="20" :closeable="true" mode="bottom" @close="close">
+				<view class="popu">
+					<view class="popu_title">退款原因</view>
+					<view class="text_style2">请选择退款的原因（必选）</view>
+					<u-radio-group v-model="reason" placement="column">
+						<block v-for="(item, index) in cancelList" :key="index" >
+							<u-radio :name="item.name" @change="radioChange" :customStyle="{padding: '28rpx 0'}" :label="item.name"></u-radio>
+						</block>
+					</u-radio-group>
+					<view class="sure_btn" @click="sure">确定</view>
+				</view>
+			</u-popup>
+		</view>
+		<view class="btn">申请退款</view>
+		
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageData: {
+					src: '/static/images/index/class_img3.png',
+					name: '扬子柴油发电机3kw/5kw…',
+					price: '29.90',
+					num: '1',
+					remarks: '',
+					norm: '规格类型:3kw单相手启动;颜色:黑色;配置:128G',
+				},
+				reason: '',
+				money: '89.00',
+				cancelList: [
+					{
+						name: '商品无货'
+					},
+					{
+						name: '发货时间问题'
+					},
+					{
+						name: '不想要了'
+					},
+					{
+						name: '商品错选/多选'
+					},
+					{
+						name: '地址信息填写错误'
+					},
+					{
+						name: '其他原因'
+					}
+				],
+				show: false,
+				fileList1: []
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 选择退款原因
+			selectReason() {
+				that.show = true
+			},
+			// 关闭
+			close() {
+				that.show = false
+			},
+			radioChange(e) {
+				console.log(e);
+				that.reason = e
+			},
+			// 确定
+			sure() {
+				that.show = false
+			},
+			// 删除图片
+			deletePic(event) {
+				this[`fileList${event.name}`].splice(event.index, 1)
+			},
+			// 新增图片
+			async afterRead(event) {
+				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++
+				}
+			},
+			uploadFilePromise(url) {
+				return new Promise((resolve, reject) => {
+					let a = uni.uploadFile({
+						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
+						filePath: url,
+						name: 'file',
+						formData: {
+							user: 'test'
+						},
+						success: (res) => {
+							setTimeout(() => {
+								resolve(res.data.data)
+							}, 1000)
+						}
+					});
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F4F4F4;
+		padding: 0 30rpx;
+		.box {
+			margin-top: 20rpx;
+			background: #FFFFFF;
+			border-radius: 12px;
+			box-sizing: border-box;
+			padding: 28rpx 20rpx;
+			.title {
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 44rpx;
+				padding-bottom: 28rpx;
+			}
+			.img {
+				width: 160rpx;
+				height: 160rpx;
+				border-radius: 24rpx;
+			}
+			.img_right {
+				width:calc(100% - 160rpx);
+				padding-left: 20rpx;
+				.item_name {
+					font-size: 30rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 42rpx;
+				}
+				.norm {
+					width: 288rpx;
+					// height: 42px;
+					background: #F5F5F5;
+					border-radius: 12rpx;
+					box-sizing: border-box;
+					padding: 12rpx;
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #888888;
+					line-height: 28rpx;
+				}
+				
+			}
+			.cell {
+				padding: 16rpx 0 30rpx;
+				.left {
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 40rpx;
+				}
+				.right {
+					font-size: 24rpx;
+					font-weight: bold;
+					color: #EE5850;
+					line-height: 28rpx;
+				}
+			}
+			.bg {
+				width: 100%;
+				background: #F4F4F4;
+				border-radius: 24rpx;
+				// padding: 20rpx;
+				box-sizing: border-box;
+				.u-textarea {
+					background-color: #F4F4F4;
+				}
+				.upload {
+					width: 132rpx;
+					height: 132rpx;
+					border-radius: 16rpx;
+					border: 1px dashed #C8C8C8;
+					margin: 20rpx;
+					.text {
+						font-size: 20rpx;
+						font-weight: 400;
+						color: #A4A4A4;
+						line-height: 28rpx;
+						padding-top: 12rpx;
+					}
+					
+				}
+				.u-upload__wrap__preview {
+					margin: 20rpx;
+				}
+			}
+		}
+		.btn {
+			margin-bottom: 74rpx;
+			width: 100%;
+			height: 84rpx;
+			text-align: center;
+			background: #506DFF;
+			border-radius: 42rpx;
+			font-size: 36rpx;
+			font-weight: 500;
+			color: #FFFFFF;
+			line-height: 84rpx;
+		}
+		.popu {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 40rpx 40rpx 0px 0px;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			.popu_title {
+				width: 100%;
+				text-align: center;
+				padding: 48rpx 0 44rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 50rpx;
+			}
+			.popu_price {
+				font-size: 36rpx;
+				font-weight: 400;
+				color: #FF2626;
+				line-height: 44rpx;
+				padding: 0 0 36rpx;
+			}
+			.type {
+				font-size: 30rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 42rpx;
+			}
+			.way {
+				width: 100%;
+				margin: 28rpx 0 60rpx;
+				background: #F4F4F4;
+				border-radius: 12px;
+				box-sizing: border-box;
+				padding: 36rpx 20rpx;
+				.pay_icon {
+					width: 48rpx;
+					height: 48rpx;
+					margin-right: 20rpx;
+				}
+			}
+			.sure_btn {
+				margin-top: 200rpx;
+				width: 100%;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				text-align: center;
+				font-size: 32rpx;
+				font-weight: 400;
+				color: #FFFFFF;
+				line-height: 84rpx;
+			}
+			.u-radio-group {
+				flex: unset;
+			}
+		}
+	}
+</style>

page_shop/pages/order/detail.vue

@@ -0,0 +1,534 @@
+<template>
+	<view class="content">
+		<view class="top">
+			<view class="hflex acenter">
+				<view class="state">{{pageData.state}}</view>
+				<view class="hflex acenter blue_bg2" v-if="pageData.stateId == 0">
+					<view class="blue_bg">剩余付款时间</view>
+					<view class="">
+						<u-count-down autoStart :time="time" format="HH:mm" @change="onChange">
+							<view class="time">
+								<text class="time__item">{{ timeData.hours>10?timeData.hours:'0'+timeData.hours}}&nbsp;小时</text>
+								<text class="time__item">{{ timeData.minutes>10?timeData.minutes:'0'+timeData.minutes }}&nbsp;分钟</text>
+							</view>
+						</u-count-down>
+					</view>
+				</view>
+			</view>
+			<view class="subTitle">{{pageData.subTitle}}</view>
+		</view>
+		<view class="box">
+			<view class="hflex acenter">
+				<u-icon name="map-fill" color="#506DFF" size="22"></u-icon>
+				<view class="vflex" style="padding-left: 16rpx;">
+					<view class="hflex acenter">
+						<view class="text_style1" style="padding-right: 20rpx;">{{address.name}}</view>
+						<view class="text_style1">{{address.phone}}</view>
+					</view>
+					<view class="text_style2">{{address.address}}</view>
+				</view>
+			</view>
+		</view>
+		<view class="box">
+			<block v-for="(item,index) in pageData.good" :key="index">
+				<view class="cell">
+					<view class="cell2 hflex acenter ">
+						<image :src="item.src" class="img"></image>
+						<view class="img_right">
+							<view class="hflex acenter jbetween">
+								<view class="item_name text_hide" style="width: 374rpx;">{{item.good_name}}</view>
+								<view class="item_name">￥{{item.price}}</view>
+							</view>
+							<view class="hflex jbetween" style="padding: 20rpx 0 0;">
+								<view class="norm">{{item.norm}}</view>
+								<view class="left_text">X{{item.num}}</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</block>
+			<view class="hflex acenter jbetween cell">
+				<view class="title">商品金额</view>
+				<view class="right">￥{{pageData.money}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="title">运费</view>
+				<view class="right">￥{{pageData.freight}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="title">实付款</view>
+				<view class="text_red">￥{{pageData.total}}</view>
+			</view>
+			<view class="line"></view>
+			<view class="hflex acenter jbetween cell">
+				<view class="title">订单编号</view>
+				<view class="hflex acenter">
+					<view class="text_style2">{{pageData.order_no}}</view>
+					<view class="text_blue">|</view>
+					<view class="text_blue" @click="copy">复制</view>
+				</view>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="title">下单时间</view>
+				<view class="text_style2">{{pageData.create_time}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell" v-if="pageData.pay_time">
+				<view class="title">付款时间</view>
+				<view class="text_style2">{{pageData.pay_time}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell" v-if="pageData.pay_type">
+				<view class="title">支付方式</view>
+				<view class="text_style2">{{pageData.pay_type}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell" v-if="pageData.send_time">
+				<view class="title">发货时间</view>
+				<view class="text_style2">{{pageData.send_time}}</view>
+			</view>
+		</view>
+		<view class="bottom hflex acenter jend" v-if="pageData.stateId == 0">
+			<view class="btn" @click="openCancel">取消订单</view>
+			<view class="btn btn2" @click="openPay">立即支付</view>
+		</view>
+		<view class="bottom hflex acenter jend" v-if="pageData.stateId == 1">
+			<view class="btn">提醒发货</view>
+			<view class="btn btn2">申请退款</view>
+		</view>
+		<view class="bottom hflex acenter jend" v-if="pageData.stateId == 2">
+			<view class="btn btn2">确认收货</view>
+		</view>
+		<u-popup :show="cancel_show" :round="20" :closeable="true" mode="bottom" @close="close">
+			<view class="popu">
+				<view class="popu_title">订单取消原因</view>
+				<view class="text_style2">请选择取消订单的原因（必选）</view>
+				<u-radio-group v-model="cancelReason" placement="column">
+					<block v-for="(item, index) in cancelList" :key="index" >
+						<u-radio :name="item.name" @change="radioChange" :customStyle="{padding: '28rpx 0'}" :label="item.name"></u-radio>
+					</block>
+				</u-radio-group>
+				<view class="btn_group hflex acenter jbetween">
+					<view class="cancel_btn" @click="close">我再想想</view>
+					<view class="sure_btn" @click="cancelOrder">取消订单</view>
+				</view>
+			</view>
+		</u-popup>
+		<u-popup :show="pay_show" :round="20" :closeable="true" mode="bottom" @close="close">
+			<view class="popu">
+				<view class="popu_title">立即付款</view>
+				<view class="popu_price hflex acenter jcenter">￥{{pageData.total}}</view>
+				<view class="type">支付方式</view>
+				<view class="way hflex acenter jbetween">
+					<view class="hflex acenter">
+						<image class="pay_icon" src="/static/images/shop/wx_pay.png"></image>
+						<view >微信支付</view>
+					</view>
+					<u-radio-group v-model="payWay">
+						<u-radio name="wx"></u-radio>
+					</u-radio-group>
+				</view>
+				<view class="btn_group hflex acenter jbetween">
+					<view class="sure_btn2" @click="payOrder">确认付款</view>
+				</view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				time: 864000000,
+				timeData: {},
+				pageData: {
+					stateId: 0,
+					state: '待付款',
+					subTitle: '等待买家付款',
+					good: [
+						{
+							name: '江南造船厂',
+							src: '/static/images/index/class_img3.png',
+							good_name: '扬子柴油发电机3kw/5kw…',
+							price: '29.90',
+							num: '1',
+							remarks: '',
+							norm: '规格类型:3kw单相手启动;颜色:黑色;配置:128G',
+						},
+						
+					],
+					money: '89.00',
+					freight: '0.00',
+					total: '89.00',
+					order_no: '1624914624039902680',
+					create_time: '2022-11-22 16:53:12',
+					pay_time: '',
+					pay_type: '',
+					send_time:'',
+				},
+				address: {
+					name: '张大成',
+					phone: '19876523456',
+					address: '河北省 保定区 莲池区 未来石4号楼20221室',
+				},
+				cancel_show: false,
+				pay_show: false,
+				cancelList: [
+					{
+						name: '商品无货'
+					},
+					{
+						name: '发货时间问题'
+					},
+					{
+						name: '不想要了'
+					},
+					{
+						name: '商品错选/多选'
+					},
+					{
+						name: '地址信息填写错误'
+					},
+					{
+						name: '其他原因'
+					}
+				],
+				cancelReason: '',
+				payWay: 'wx'
+			}
+		},
+		onLoad() {
+			that = this
+			that.computTime()
+		},
+		methods: {
+			// 倒计时
+			onChange(e) {
+				that.timeData = e
+			},
+			// 计算倒计时
+			computTime() {
+				var date = new Date(that.pageData.create_time).getTime() + (24 * 60 * 60 * 1000);
+				var nowDate = new Date().getTime()
+				that.time = date - nowDate
+			},
+			// 复制订单号
+			copy() {
+				uni.setClipboardData({
+					data: that.pageData.order_no,
+					success: function () {
+						$api.info('复制成功')
+					}
+				});
+			},
+			// 关闭
+			close() {
+				that.cancel_show = false
+				that.pay_show = false
+			},
+			// 取消订单
+			openCancel() {
+				that.cancel_show = true
+			},
+			// 立即支付
+			openPay() {
+				that.pay_show = true
+			},
+			// 选择取消原因
+			radioChange(e) {
+				that.cancelReason = e
+			},
+			// 确认取消
+			cancelOrder() {
+				if(that.cancelReason == '') {
+					$api.info('请选择取消订单的原因')
+				} else {
+					$api.info('订单取消成功')
+				}
+			},
+			// 确认付款
+			payOrder() {
+				
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: #F4F4F4;
+		
+		.top {
+			width: 100%;
+			padding: 20rpx 30rpx 24rpx;
+			.state {
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 50rpx;
+				padding-right: 24rpx;
+			}
+			.blue_bg {
+				width: 124rpx;
+				height: 32rpx;
+				background: #506DFF;
+				border-radius: 18rpx 0px 18rpx 18rpx;
+				font-size: 16rpx;
+				text-align: center;
+				font-weight: 400;
+				color: #FFFFFF;
+				line-height: 32rpx;
+			}
+			.blue_bg2 {
+				width: 256rpx;
+				height: 32rpx;
+				background: #E7EBFF;
+				border-radius: 18rpx;
+				font-size: 16rpx;
+				font-weight: bold;
+				color: #222222;
+				line-height: 32rpx;
+			}
+			.time {
+				padding-left: 16rpx;
+			}
+			.subTitle {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #888888;
+				line-height: 34rpx;
+			}
+		}
+		.text_style2 {
+			font-size: 26rpx;
+			font-weight: 400;
+			color: #888888;
+			line-height: 36rpx;
+		}
+		.box {
+			background: #FFFFFF;
+			border-radius: 10px;
+			margin: 20rpx auto 0;
+			width: 690rpx;
+			box-sizing: border-box;
+			padding: 34rpx 20rpx;
+			.title {
+				font-size: 32rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 44rpx;
+			}
+			.text_style1 {
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 40rpx;
+			}
+			.text_style2 {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #888888;
+				line-height: 36rpx;
+			}
+			.text_blue {
+				font-size: 26rpx;
+				font-weight: 400;
+				color: #506DFF;
+				line-height: 36rpx;
+				padding-left: 8rpx;
+			}
+			.cell {
+				padding: 20rpx 0 32rpx;
+			}
+			.cell2 {
+				border-bottom: 1rpx solid #F4F4F4;
+			}
+			.cell2:nth-last-child(1) {
+				border: none;
+			}
+			.img {
+				width: 160rpx;
+				height: 160rpx;
+				border-radius: 24rpx;
+			}
+			.img_right {
+				width:calc(100% - 160rpx);
+				padding-left: 20rpx;
+				.item_name {
+					font-size: 30rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 42rpx;
+				}
+				.norm {
+					width: 288rpx;
+					// height: 42px;
+					background: #F5F5F5;
+					border-radius: 12rpx;
+					box-sizing: border-box;
+					padding: 12rpx;
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #888888;
+					line-height: 28rpx;
+				}
+				
+			}
+			.left_text {
+				font-size: 24rpx;
+				font-weight: 500;
+				color: #888888;
+				line-height: 28rpx;
+			}
+			.right_text {
+				font-size: 24rpx;
+				font-weight: bold;
+				color: #222222;
+				line-height: 28rpx;
+			}
+			.item_bottom {
+				padding-top: 22rpx;
+				border-top: 1rpx solid #F4F4F4;
+			}
+			.text_red {
+				font-weight: bold;
+				color: #EE5850;
+			}
+			.pay_icon {
+				width: 48rpx;
+				height: 48rpx;
+				margin-right: 20rpx;
+			}
+			.check_icon {
+				width: 32rpx;
+				height: 32rpx;
+			}
+			.line {
+				width: 100%;
+				height: 1px;
+				background: #F1F8FE;
+			}
+		}
+		.box:nth-last-child(1) {
+			margin-bottom: 186rpx;
+		}
+		.bottom {
+			width: 100%;
+			height: 166rpx;
+			background: #FFFFFF;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			box-sizing: border-box;
+			padding: 8rpx 50rpx 74rpx;
+			.title {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 34rpx;
+			}
+			.text_blue {
+				font-size: 44rpx;
+				color: #5270FF;
+			}
+			.btn{
+				margin-left: 16rpx;
+				width: 188rpx;
+				height: 76rpx;
+				border-radius: 38rpx;
+				border: 1px solid #D2D2D2;
+				text-align: center;
+				font-size: 28rpx;
+				font-weight: 400;
+				color: #222;
+				line-height: 76rpx;
+			}
+			.btn2 {
+				border: 1px solid #506DFF;
+				color: #506DFF;
+			}
+		}
+		.popu {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 40rpx 40rpx 0px 0px;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			.popu_title {
+				width: 100%;
+				text-align: center;
+				padding: 48rpx 0 44rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 50rpx;
+			}
+			.popu_price {
+				font-size: 36rpx;
+				font-weight: 400;
+				color: #FF2626;
+				line-height: 44rpx;
+				padding: 0 0 36rpx;
+			}
+			.type {
+				font-size: 30rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 42rpx;
+			}
+			.way {
+				width: 100%;
+				margin: 28rpx 0 60rpx;
+				background: #F4F4F4;
+				border-radius: 12px;
+				box-sizing: border-box;
+				padding: 36rpx 20rpx;
+				.pay_icon {
+					width: 48rpx;
+					height: 48rpx;
+					margin-right: 20rpx;
+				}
+			}
+			.btn_group {
+				width: 100%;
+				margin-top: 56rpx;
+				.cancel_btn {
+					width: 330rpx;
+					height: 84rpx;
+					background: #F4F6FF;
+					border-radius: 42rpx;
+					text-align: center;
+					font-size: 32rpx;
+					font-weight: 400;
+					color: #506DFF;
+					line-height: 84rpx;
+				}
+				.sure_btn {
+					width: 330rpx;
+					height: 84rpx;
+					background: #506DFF;
+					border-radius: 42rpx;
+					text-align: center;
+					font-size: 32rpx;
+					font-weight: 400;
+					color: #FFFFFF;
+					line-height: 84rpx;
+				}
+				.sure_btn2 {
+					width: 100%;
+					height: 84rpx;
+					background: #506DFF;
+					border-radius: 42rpx;
+					text-align: center;
+					font-size: 32rpx;
+					font-weight: 400;
+					color: #FFFFFF;
+					line-height: 84rpx;
+				}
+			}
+			.u-radio-group {
+				flex: unset;
+			}
+		}
+	}
+</style>

page_shop/pages/order/list.vue

@@ -0,0 +1,390 @@
+<template>
+	<view class="content">
+		<view class="top">
+			<u-navbar title=" " @leftClick="leftClick" height="44px" bgColor="rgb(255,255,255)" :placeholder="true">
+				<view class="u-nav-slot" slot="center"> 
+					<u-search placeholder="搜索我的订单" v-model="keyword" :showAction="false"></u-search>
+				</view>
+			</u-navbar>
+			<view class="tabs hflex acenter jbetween">
+				<block v-for="(item,index) in tabs" :key="index">
+					<view class="tab_item" :class="tab_active == index?'tab_active':''" @click="changeTab(index)">{{item.name}}</view>
+				</block>
+			</view>
+		</view>
+		<view class="box">
+			<block v-for="(item,index) in pageList" :key="index">
+				<view class="box_item">
+					<view class="hflex acenter jbetween cell">
+						<view class="hflex acenter" @click="toShop(item.id)">
+							<view class="title">{{item.name}}</view>
+							<u-icon color="#B5B5B5" name="arrow-right" size="10"></u-icon>
+						</view>
+						<view class="text-blue">{{item.stateName}}</view>
+					</view>
+					<view @click="toOrderDetail(item.id)">
+						<view class="hflex acenter" v-if="item.good.length == 1">
+							<view>
+								<image :src="item.good[0].img" class="img"></image>
+							</view>	
+							<view class="img_right">
+								<view class="hflex acenter jbetween">
+									<view class="name text_hide">{{item.good[0].name}}</view>
+									<view class="price">￥{{item.good[0].price}}</view>
+								</view>
+								<view class="hflex jbetween" style="padding-top: 12rpx;">
+									<view class="norm">{{item.good[0].norm}}</view>
+									<view class="num">X{{item.good[0].num}}</view>
+								</view>
+							</view>
+						</view>
+						<view class="scroll_img" v-else>
+							<scroll-view scroll-x="true" style="white-space: nowrap;" class="imgs hflex">
+								<block v-for="(item2,index2) in item.good" :key="index2">
+									<view class="imgs_item">
+										<image :src="item2.img" class="img"></image>
+									</view>
+								</block>
+							</scroll-view>
+							<view class="img_leng">共{{item.good.length}}件</view>
+						</view>
+					</view>
+					<view class="hflex acenter jend cell">
+						<view class="price">实付款：￥{{item.pay}}</view>
+					</view>
+					<view class="hflex acenter jend cell">
+						<block v-if="item.state == 0">
+							<view class="btn1">取消订单</view>
+							<view class="btn1 btn2">立即支付</view>
+						</block>
+						<block v-if="item.state == 1">
+							<view class="btn1" @click="toApply(item.id)">申请退款</view>
+							<view class="btn1 btn2">提醒发货</view>
+						</block>
+						<block v-if="item.state == 2">
+							<view class="btn1 btn2">确认收货</view>
+						</block>
+						<block v-if="item.state == 3">
+							<view class="btn1">发表评价</view>
+							<view class="btn1 btn2">再次购买</view>
+						</block>
+					</view>
+				</view>
+			</block>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				keyword: '',
+				tabs: [
+					{
+						name: '全部'
+					},
+					{
+						name: '待支付'
+					},
+					{
+						name: '待发货'
+					},
+					{
+						name: '待收货'
+					}
+				],
+				tab_active: 0,
+				pageList: [
+					{
+						id: 1,
+						name: '江南造船厂',
+						state: 0,
+						stateName: '待支付',
+						good: [
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+								
+							}
+						],
+						pay: 29.90
+					},
+					{
+						id: 3,
+						name: '福东海官方自营旗舰店',
+						state: 1,
+						stateName: '待发货',
+						good: [
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+								
+							},
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							},
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							},
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							}
+						],
+						pay: 29.90
+					},
+					{
+						id: 4,
+						name: '江南造船厂',
+						state: 2,
+						stateName: '待收货',
+						good: [
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							}
+						],
+						pay: 29.90
+					},
+					{
+						id: 5,
+						name: '江南造船厂',
+						state: 3,
+						stateName: '已完成',
+						good: [
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							}
+						],
+						pay: 29.90
+					},
+				]
+			}
+		},
+		onLoad(options) {
+			that = this
+			that.tab_active = options.id
+		},
+		methods: {
+			// 返回
+			leftClick() {
+				console.log('返回');
+				$api.jump(-1)
+			},
+			changeTab(index) {
+				that.tab_active = index
+			},
+			// 店铺
+			toShop(id) {
+				$api.jump('/page_shop/pages/good/shop?id=' + id)
+			},
+			toOrderDetail(id) {
+				$api.jump('/page_shop/pages/order/detail?id=' + id)
+			},
+			// 申请退款
+			toApply(id) {
+				$api.jump('/page_shop/pages/order/apply?id=' + id)
+			}
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F3F3F3;
+		.top {
+			box-sizing: border-box;
+			// padding: 30rpx;
+			// height: 540rpx;
+			.u-nav-slot {
+				position: absolute;
+				top: 8rpx;
+				left: 134rpx;
+			}
+			.tabs {
+				background-color: #fff;
+				width: 100%;
+				box-sizing: border-box;
+				padding: 20rpx 30rpx;
+				.tab_item {
+					font-size: 32rpx;
+					font-weight: 400;
+					color: #333333;
+					line-height: 44rpx;
+				}
+				.tab_active {
+					font-weight: 500;
+					color: #222222;
+					position: relative;
+				}
+				.tab_active::after {
+					content: "";
+					position: absolute;
+					bottom: -14rpx;
+					left: 12rpx;
+					width: 40rpx;
+					height: 6rpx;
+					background: #506DFF;
+					border-radius: 4rpx;
+				}
+			}
+		}
+		.box {
+			width: 100%;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			.box_item {
+				background: #FFFFFF;
+				border-radius: 20rpx;
+				width: 100%;
+				margin-top: 20rpx;
+				box-sizing: border-box;
+				padding: 0 20rpx;
+				.cell {
+					padding: 20rpx 0;
+				}
+				.title {
+					font-size: 30rpx;
+					font-weight: 500;
+					color: #333333;
+					line-height: 42rpx;
+				}
+				.text-blue {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #506DFF;
+					line-height: 36rpx;
+				}
+				.img {
+					width: 160rpx;
+					height: 160rpx;
+					border-radius: 16rpx;
+					
+				}
+				.img_right {
+					margin-left: 16rpx;
+					width: calc(100% - 176rpx);
+					.name {
+						width: 392rpx;
+						font-size: 28rpx;
+						font-weight: 500;
+						color: #222222;
+						line-height: 40rpx;
+					}
+					
+					.norm {
+						width: 308rpx;
+						height: 84rpx;
+						background: #F5F5F5;
+						border-radius: 4rpx;
+						font-size: 22rpx;
+						font-weight: 400;
+						color: #888888;
+						line-height: 32rpx;
+						box-sizing: border-box;
+						padding: 12rpx;
+					}
+					.num {
+						font-size: 24rpx;
+						font-weight: 500;
+						color: #888888;
+						line-height: 28rpx;
+					}
+					
+				}
+				.scroll_img {
+					position: relative;
+					.imgs {
+						width: 100%;
+						height: 170rpx;
+						overflow: hidden;
+						white-space: nowrap;
+						.imgs_item {
+							width: 160rpx;
+							height: 160rpx;
+							border-radius: 16rpx;
+							margin-right: 20rpx;
+							display: inline-block;
+						}
+						
+					}
+					.img_leng {
+						position: absolute;
+						right: 0;
+						top: 0;
+						width: 130rpx;
+						height: 160rpx;
+						border-radius: 12rpx;
+						font-size: 24rpx;
+						font-weight: 500;
+						color: #222222;
+						line-height: 160rpx;
+						text-align: center;
+						background: linear-gradient(270deg, #FFFFFF 0%, rgba(255,255,255,0.78) 100%);
+					}
+				}
+				
+				.price {
+					font-size: 30rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 24rpx;
+				}
+				.btn1 {
+					width: 180rpx;
+					height: 68rpx;
+					border-radius: 36rpx;
+					border: 1px solid #D0D0D0;
+					text-align: center;
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 68rpx;
+				}
+				.btn2 {
+					border: 1px solid #506DFF;
+					color: #506DFF;
+					margin-left: 32rpx;
+				}
+			}
+		}
+		.box:nth-last-child(1) {
+			margin-bottom: 30rpx;
+		}
+	}
+</style>

page_shop/pages/order/paySuccess.vue

@@ -0,0 +1,27 @@
+<template>
+	<view class="content">
+		
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {}
+</style>

page_shop/pages/order/refund.vue

@@ -0,0 +1,336 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<block v-for="(item,index) in pageList" :key="index">
+				<view class="box_item">
+					<view class="hflex acenter jbetween cell">
+						<view class="hflex acenter" @click="toShop(item.id)">
+							<view class="title">{{item.name}}</view>
+							<u-icon color="#B5B5B5" name="arrow-right" size="10"></u-icon>
+						</view>
+						<view class="text-blue">{{item.stateName}}</view>
+					</view>
+					<view>
+						<view class="hflex acenter" v-if="item.good.length == 1">
+							<view>
+								<image :src="item.good[0].img" class="img"></image>
+							</view>	
+							<view class="img_right">
+								<view class="hflex acenter jbetween">
+									<view class="name text_hide">{{item.good[0].name}}</view>
+									<view class="price">￥{{item.good[0].price}}</view>
+								</view>
+								<view class="hflex jbetween" style="padding-top: 12rpx;">
+									<view class="norm">{{item.good[0].norm}}</view>
+									<view class="num">X{{item.good[0].num}}</view>
+								</view>
+							</view>
+						</view>
+						<view class="scroll_img" v-else>
+							<scroll-view scroll-x="true" style="white-space: nowrap;" class="imgs hflex">
+								<block v-for="(item2,index2) in item.good" :key="index2">
+									<view class="imgs_item">
+										<image :src="item2.img" class="img"></image>
+									</view>
+								</block>
+							</scroll-view>
+							<view class="img_leng">共{{item.good.length}}件</view>
+						</view>
+					</view>
+					<view class="hflex acenter jend cell">
+						<view class="price">退款：￥{{item.pay}}</view>
+					</view>
+					<view class="hflex acenter jend cell">
+						<view class="btn1">删除记录</view>
+						<view class="btn1 btn2" @click="toOrderDetail(item.id)">查看详情</view>
+					</view>
+				</view>
+			</block>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageList: [
+					{
+						id: 1,
+						name: '江南造船厂',
+						state: 0,
+						stateName: '已退款',
+						good: [
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+								
+							}
+						],
+						pay: 29.90
+					},
+					{
+						id: 3,
+						name: '福东海官方自营旗舰店',
+						state: 1,
+						stateName: '退款中',
+						good: [
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+								
+							},
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							},
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							},
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							}
+						],
+						pay: 29.90
+					},
+					{
+						id: 4,
+						name: '江南造船厂',
+						state: 2,
+						stateName: '已退款',
+						good: [
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							}
+						],
+						pay: 29.90
+					},
+					{
+						id: 5,
+						name: '江南造船厂',
+						state: 3,
+						stateName: '已退款',
+						good: [
+							{
+								id:2,
+								img: '/static/images/index/class_img3.png',
+								name: 'wanpy顽皮鲜封包猫咪鸡胸…',
+								price: 29.90,
+								norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+								num: 1,
+							}
+						],
+						pay: 29.90
+					},
+				]
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 店铺
+			toShop(id) {
+				$api.jump('/page_shop/pages/good/shop?id=' + id)
+			},
+			toOrderDetail(id) {
+				console.log(id);
+				$api.jump('/page_shop/pages/order/refundDetail?id=' + id)
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F3F3F3;
+		.top {
+			box-sizing: border-box;
+			// padding: 30rpx;
+			// height: 540rpx;
+			.u-nav-slot {
+				position: absolute;
+				top: 8rpx;
+				left: 134rpx;
+			}
+			.tabs {
+				background-color: #fff;
+				width: 100%;
+				box-sizing: border-box;
+				padding: 20rpx 30rpx;
+				.tab_item {
+					font-size: 32rpx;
+					font-weight: 400;
+					color: #333333;
+					line-height: 44rpx;
+				}
+				.tab_active {
+					font-weight: 500;
+					color: #222222;
+					position: relative;
+				}
+				.tab_active::after {
+					content: "";
+					position: absolute;
+					bottom: -14rpx;
+					left: 12rpx;
+					width: 40rpx;
+					height: 6rpx;
+					background: #506DFF;
+					border-radius: 4rpx;
+				}
+			}
+		}
+		.box {
+			width: 100%;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			.box_item {
+				background: #FFFFFF;
+				border-radius: 20rpx;
+				width: 100%;
+				margin-top: 20rpx;
+				box-sizing: border-box;
+				padding: 0 20rpx;
+				.cell {
+					padding: 20rpx 0;
+				}
+				.title {
+					font-size: 30rpx;
+					font-weight: 500;
+					color: #333333;
+					line-height: 42rpx;
+				}
+				.text-blue {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #506DFF;
+					line-height: 36rpx;
+				}
+				.img {
+					width: 160rpx;
+					height: 160rpx;
+					border-radius: 16rpx;
+					
+				}
+				.img_right {
+					margin-left: 16rpx;
+					width: calc(100% - 176rpx);
+					.name {
+						width: 392rpx;
+						font-size: 28rpx;
+						font-weight: 500;
+						color: #222222;
+						line-height: 40rpx;
+					}
+					
+					.norm {
+						width: 308rpx;
+						height: 84rpx;
+						background: #F5F5F5;
+						border-radius: 4rpx;
+						font-size: 22rpx;
+						font-weight: 400;
+						color: #888888;
+						line-height: 32rpx;
+						box-sizing: border-box;
+						padding: 12rpx;
+					}
+					.num {
+						font-size: 24rpx;
+						font-weight: 500;
+						color: #888888;
+						line-height: 28rpx;
+					}
+					
+				}
+				.scroll_img {
+					position: relative;
+					.imgs {
+						width: 100%;
+						height: 170rpx;
+						overflow: hidden;
+						white-space: nowrap;
+						.imgs_item {
+							width: 160rpx;
+							height: 160rpx;
+							border-radius: 16rpx;
+							margin-right: 20rpx;
+							display: inline-block;
+						}
+						
+					}
+					.img_leng {
+						position: absolute;
+						right: 0;
+						top: 0;
+						width: 130rpx;
+						height: 160rpx;
+						border-radius: 12rpx;
+						font-size: 24rpx;
+						font-weight: 500;
+						color: #222222;
+						line-height: 160rpx;
+						text-align: center;
+						background: linear-gradient(270deg, #FFFFFF 0%, rgba(255,255,255,0.78) 100%);
+					}
+				}
+				
+				.price {
+					font-size: 30rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 24rpx;
+				}
+				.btn1 {
+					width: 180rpx;
+					height: 68rpx;
+					border-radius: 36rpx;
+					border: 1px solid #D0D0D0;
+					text-align: center;
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 68rpx;
+				}
+				.btn2 {
+					border: 1px solid #506DFF;
+					color: #506DFF;
+					margin-left: 32rpx;
+				}
+			}
+		}
+		.box:nth-last-child(1) {
+			margin-bottom: 30rpx;
+		}
+	}
+</style>

page_shop/pages/order/refundDetail.vue

@@ -0,0 +1,153 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<view class="title">退款信息</view>
+			<view class="hflex acenter jbetween">
+				<view class="img_box">
+					<image class="img" :src="pageData.img"></image>
+				</view>
+				<view class="vflex img_right">
+					<view class="hflex acenter">
+						<view class="name text_hide">{{pageData.name}}</view>
+						<view class="name">￥{{pageData.price}}</view>
+					</view>
+					<view class="hflex jbetween" style="padding: 20rpx 0 0;">
+						<view class="norm">{{pageData.norm}}</view>
+						<view class="left_text">X{{pageData.num}}</view>
+					</view>
+				</view>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="left">退款原因</view>
+				<view class="right">{{pageData.reason}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="left">退款金额</view>
+				<view class="right">￥{{pageData.price}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="left">申请时间</view>
+				<view class="right">{{pageData.apply_time}}</view>
+			</view>
+			<view class="hflex acenter jbetween cell">
+				<view class="left">退款编号</view>
+				<view class="hflex acenter">
+					<view class="right">{{pageData.after_id}}</view>
+					<view style="margin: 0 8rpx;">|</view>
+					<view class="text_red" @click="copy">复制</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				id: '',
+				pageData: {
+					img: '/static/images/index/class_img3.png',
+					name: '【礼遇季】ANESS/安热',
+					price: '29.90',
+					norm: '网络类型:无需合约机;颜色:黑色;尺寸:12寸;配置:128G',
+					num: 1,
+					reason: '商品无货',
+					apply_time: '2022-08-23 20:34:34',
+					after_id: 'Cbz202212120919838881'
+				}
+			}
+		},
+		onLoad(options) {
+			that = this
+			that.id = options.id
+		},
+		methods: {
+			// 复制订单号
+			copy() {
+				uni.setClipboardData({
+					data: that.pageData.order_no,
+					success: function () {
+						$api.info('复制成功')
+					}
+				});
+			},
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		background: #F4F4F4;
+		padding: 20rpx 30rpx;
+		.box {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 24rpx;
+			box-sizing: border-box;
+			padding: 24rpx 20rpx;
+			.title {
+				font-size: 30rpx;
+				font-weight: 500;
+				color: #333333;
+				line-height: 42rpx;
+				padding: 24rpx 0 14rpx;
+			}
+			.img_box {
+				margin-right: 20rpx;
+				.img {
+					width: 180rpx;
+					height: 180rpx;
+					border-radius: 16rpx;
+				}
+			}
+			.img_right {
+				width: calc(100% - 200rpx);
+			}
+			.name {
+				font-size: 30rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 42rpx;
+			}
+			.norm {
+				width: 288rpx;
+				// height: 42px;
+				background: #F5F5F5;
+				border-radius: 12rpx;
+				box-sizing: border-box;
+				padding: 12rpx;
+				font-size: 20rpx;
+				font-weight: 400;
+				color: #888888;
+				line-height: 28rpx;
+			}
+			.left_text {
+				font-size: 24rpx;
+				font-weight: 500;
+				color: #888888;
+				line-height: 28rpx;
+			}
+			.cell {
+				padding: 15rpx 0;
+				.left {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #232323;
+					line-height: 36rpx;
+				}
+				.right {
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #888888;
+					line-height: 36rpx;
+				}
+				.text_red {
+					color: #EE5850;
+				}
+			}
+		}
+	}
+</style>

pages.json

@@ -13,20 +13,29 @@
 		{
 			"path": "pages/tabbar/shipyard/shipyard",
 			"style": {
-				"navigationBarTitleText": "",
+				"navigationBarTitleText": "船厂",
 				"navigationBarBackgroundColor": "#fff"
 			}
 		},
 		{
+			"path": "pages/tabbar/shipyard/detail",
+			"style": {
+				"navigationBarTitleText": "",
+				"navigationStyle": "custom" // 隐藏系统导航栏
+			}
+		},
+		{
 			"path": "pages/tabbar/shop/shop",
 			"style": {
-				"navigationBarTitleText": "商城"
+				"navigationBarTitleText": "商城",
+				"navigationStyle": "custom" // 隐藏系统导航栏
 			}
 		},
 		{
 			"path": "pages/tabbar/mine/mine",
 			"style": {
-				"navigationBarTitleText": ""
+				"navigationBarTitleText": "",
+				"navigationStyle": "custom" // 隐藏系统导航栏
 			}
 		},
 		{
@@ -78,8 +87,144 @@
 					"style": {
 						"navigationBarTitleText": "文章详情"
 					}
+				},
+				{
+					"path": "pages/demand/demand",
+					"style": {
+						"navigationBarTitleText": "劳务需求",
+						"navigationBarBackgroundColor": "#EEF1F8"
+					}
+				},
+				{
+					"path": "pages/demand/publish",
+					"style": {
+						"navigationBarTitleText": "发布应聘",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/demand/perfect",
+					"style": {
+						"navigationBarTitleText": "",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/demand/delivery",
+					"style": {
+						"navigationBarTitleText": "投递记录",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/demand/collect",
+					"style": {
+						"navigationBarTitleText": "我的收藏",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/purchase/purchase",
+					"style": {
+						// "navigationBarTitleText": "采购订单",
+						"navigationStyle": "custom" ,// 隐藏系统导航栏
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/purchase/orderDetail",
+					"style": {
+						"navigationBarTitleText": "订单详情",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/purchase/receivingDetail",
+					"style": {
+						"navigationBarTitleText": "详情",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/purchase/release",
+					"style": {
+						"navigationBarTitleText": "采购需求",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/repair/repair",
+					"style": {
+						// "navigationBarTitleText": "船机修理",
+						"navigationStyle": "custom" ,// 隐藏系统导航栏
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/repair/receivingOrder",
+					"style": {
+						"navigationBarTitleText": "发布接单需求",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/repair/repairOrder",
+					"style": {
+						"navigationBarTitleText": "发布维修",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+				    "path" : "pages/repair/orderDetail",
+				    "style" : {
+						"navigationBarTitleText": "订单详情",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+				    "path" : "pages/repair/repairDetail",
+				    "style" : {
+						"navigationBarTitleText": "详情",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/bidding/bidding",
+					"style": {
+						"navigationBarTitleText": "招标",
+						"navigationStyle": "custom" // 隐藏系统导航栏
+					}
+				},
+				{
+					"path": "pages/bidding/bidDetail",
+					"style": {
+						"navigationBarTitleText": "招标详情",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/resources/resources",
+					"style": {
+						"navigationBarTitleText": "资源中心",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/resources/resourDetail",
+					"style": {
+						"navigationBarTitleText": "船级社详情",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
+				},
+				{
+					"path": "pages/resources/rule",
+					"style": {
+						"navigationBarTitleText": "规则",
+						"navigationBarBackgroundColor": "#ffffff"
+					}
 				}
-			]
+				
+            ]
 		},
 		{
 			"root": "page_mine",
@@ -218,6 +363,20 @@
 					}
 				},
 				{
+					"path": "pages/order/detail",
+					"style": {
+						"navigationBarTitleText": "订单详情",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/order/offer",
+					"style": {
+						"navigationBarTitleText": "报价详情",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
 					"path": "pages/service/joinPerson",
 					"style": {
 						"navigationBarTitleText": "船用人才注册",
@@ -230,6 +389,165 @@
 						"navigationBarTitleText": "申请维修工",
 						"navigationBarBackgroundColor": "#fff"
 					}
+				},
+				{
+					"path": "pages/service/settledShipyard",
+					"style": {
+						"navigationBarTitleText": "入驻船厂",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/service/settledMerchants",
+					"style": {
+						"navigationBarTitleText": "入驻商家",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/service/release",
+					"style": {
+						"navigationBarTitleText": "我的发布",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/service/demand",
+					"style": {
+						"navigationBarTitleText": "我的需求",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/service/feed/feedback",
+					"style": {
+						"navigationBarTitleText": "意见反馈",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/service/feed/history",
+					"style": {
+						"navigationBarTitleText": "反馈记录",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/service/feed/detail",
+					"style": {
+						"navigationBarTitleText": "反馈详情",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				}
+			]
+		},
+		{
+			"root": "page_shop",
+			"pages": [
+				{
+					"path": "pages/base/base",
+					"style": {
+						"navigationBarTitleText": "",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/good/detail",
+					"style": {
+						"navigationBarTitleText": "",
+						"navigationStyle": "custom" // 隐藏系统导航栏
+					}
+				},
+				{
+					"path": "pages/good/submit",
+					"style": {
+						"navigationBarTitleText": "确认订单",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/good/shop",
+					"style": {
+						"navigationBarTitleText": "",
+						"navigationStyle": "custom" // 隐藏系统导航栏
+					}
+				},
+				{
+					"path": "pages/good/shopDetail",
+					"style": {
+						"navigationBarTitleText": "店铺详情",
+						"navigationStyle": "custom" // 隐藏系统导航栏
+					}
+				},
+				{
+					"path": "pages/address/list",
+					"style": {
+						"navigationBarTitleText": "地址管理",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/address/add",
+					"style": {
+						"navigationBarTitleText": "收货地址",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/mine/cart",
+					"style": {
+						"navigationBarTitleText": "购物车",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/mine/mine",
+					"style": {
+						"navigationBarTitleText": "我的",
+						"navigationStyle": "custom" // 隐藏系统导航栏
+					}
+				},
+				{
+					"path": "pages/mine/collect",
+					"style": {
+						"navigationBarTitleText": "商品收藏",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/order/list",
+					"style": {
+						"navigationBarTitleText": "",
+						"navigationStyle": "custom" // 隐藏系统导航栏
+					}
+				},
+				{
+					"path": "pages/order/detail",
+					"style": {
+						"navigationBarTitleText": "订单详情",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/order/refund",
+					"style": {
+						"navigationBarTitleText": "退款/售后",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/order/apply",
+					"style": {
+						"navigationBarTitleText": "申请退款",
+						"navigationBarBackgroundColor": "#fff"
+					}
+				},
+				{
+					"path": "pages/order/refundDetail",
+					"style": {
+						"navigationBarTitleText": "退款详情",
+						"navigationBarBackgroundColor": "#fff"
+					}
 				}
 			]
 		}
@@ -267,7 +585,7 @@
 	},
 	"globalStyle": {
 		"navigationBarTextStyle": "black",
-		"navigationBarTitleText": "uni-app",
+		"navigationBarTitleText": "",
 		"navigationBarBackgroundColor": "#F8F8F8",
 		"backgroundColor": "#F8F8F8"
 	},

pages/tabbar/index/index.vue

@@ -31,13 +31,13 @@
 			</view>
 		</view>
 		<view class="boxs hflex acenter jbetween">
-			<image :src="class_img1" mode="widthFix" style="width: 336rpx;"></image>
-			<image :src="class_img2" mode="widthFix" style="width: 336rpx;"></image>
+			<image :src="class_img1" mode="widthFix" style="width: 336rpx;" @click="toDetail(1)"></image>
+			<image :src="class_img2" mode="widthFix" style="width: 336rpx;" @click="toDetail(2)"></image>
 		</view>
 		<view class="boxs hflex acenter jbetween">
-			<image :src="class_img3" mode="widthFix" style="width: 220rpx;"></image>
-			<image :src="class_img4" mode="widthFix" style="width: 220rpx;"></image>
-			<image :src="class_img5" mode="widthFix" style="width: 220rpx;"></image>
+			<image :src="class_img3" mode="widthFix" style="width: 220rpx;" @click="toDetail(3)"></image>
+			<image :src="class_img4" mode="widthFix" style="width: 220rpx;" @click="toDetail(4)"></image>
+			<image :src="class_img5" mode="widthFix" style="width: 220rpx;" @click="toDetail(5)"></image>
 		</view>
 		<view class="boxs">
 			<u-tabs :list="tabs" @click="changeTaaba"
@@ -76,8 +76,8 @@
 				class_img1: '/static/images/index/class_img1.png',
 				class_img2: '/static/images/index/class_img2.png',
 				class_img3: '/static/images/index/class_img3.png',
-				class_img4: '/static/images/index/class_img3.png',
-				class_img5: '/static/images/index/class_img3.png',
+				class_img4: '/static/images/index/class_img4.png',
+				class_img5: '/static/images/index/class_img5.png',
 				tabs: [
 					{
 						name: '推荐',
@@ -146,6 +146,28 @@
 			toNotice() {
 				$api.jump('/page_index/pages/index/noticeList')
 			},
+			toDetail(index) {
+				var url = ''
+				switch(index) {
+					case 1: 
+						url = '/page_index/pages/demand/demand';
+						break;
+					case 2:
+						url = '/page_index/pages/purchase/purchase';
+						break;
+					case 3:
+						url = '/page_index/pages/repair/repair';
+						break;
+					case 4:
+						url = '/page_index/pages/bidding/bidding';
+						break;
+					case 5:
+						url = '/page_index/pages/resources/resources';
+						break;
+				}
+				console.log(url);
+				$api.jump(url)
+			}
 		}
 	}
 </script>
@@ -184,6 +206,7 @@
 					background: #fff;
 					height: 76rpx;
 					margin-left: 16rpx;
+					padding: 0 24rpx !important;
 				}
 			}
 		}

pages/tabbar/mine/mine.vue

@@ -129,44 +129,42 @@
 				],
 				serviceList: [
 					{
-						url: '',
 						img: '/static/images/mine/service1.png',
 						text: '加入人才库',
 						url: '/page_mine/pages/service/joinPerson'
 					},
 					{
-						url: '',
 						img: '/static/images/mine/service2.png',
 						text: '成为维修工',
 						url: '/page_mine/pages/service/applyMaintenance'
 					},
 					{
-						url: '',
+						url: '/page_mine/pages/service/settledShipyard',
 						img: '/static/images/mine/service3.png',
 						text: '入驻船厂',
 					},
 					{
-						url: '',
+						url: '/page_mine/pages/service/settledMerchants',
 						img: '/static/images/mine/service4.png',
 						text: '入驻商家',
 					},
 					{
-						url: '',
+						url: '/page_mine/pages/setting/real_name',
 						img: '/static/images/mine/service5.png',
 						text: '实名认证',
 					},
 					{
-						url: '',
+						url: '/page_mine/pages/service/release',
 						img: '/static/images/mine/service6.png',
 						text: '我的发布',
 					},
 					{
-						url: '',
+						url: '/page_mine/pages/service/demand',
 						img: '/static/images/mine/service7.png',
 						text: '我的需求',
 					},
 					{
-						url: '',
+						url: '/page_mine/pages/service/feed/feedback',
 						img: '/static/images/mine/service8.png',
 						text: '意见反馈',
 					},
@@ -256,6 +254,7 @@
 		background-size: 100%;
 		padding: 0 30rpx;
 		.user {
+			padding: 184rpx 0 0;
 			width: 100%;
 			margin: 24rpx 0;
 			.avatar {

pages/tabbar/shipyard/detail.vue

@@ -0,0 +1,419 @@
+<template>
+	<view class="content">
+		<view class="top">
+			<u-navbar title=" " @leftClick="leftClick" height="44px" bgColor="rgb(255,255,255,0)" :placeholder="true">
+			</u-navbar>
+			<view class="hflex acenter jbetween">
+				<view >
+					<view class="top_name">{{pageData.name}}</view>
+					<view class="scale">{{pageData.scale}}</view>
+				</view>
+				<image :src="pageData.img" class="top_avatar"></image>
+			</view>
+		</view>
+		<view class="box">
+			<view class="hflex acenter jcenter tabs">
+				<view class="tabs_item" :class="tab_active == 1 ? 'tab_active' :''" @click="changeTab(1)">公司信息</view>
+				<view class="tabs_item" :class="tab_active == 2 ? 'tab_active' :''" @click="changeTab(2)">职位信息</view>
+			</view>
+			<view class="box1" v-if="tab_active == 1">
+				<view class="title cell">公司简介</view>
+				<view class="cell">
+					<u-read-more closeText="展开" :shadowStyle="shadowStyle" ref="uReadMore" :toggle="true" openText="收起" showHeight="66" backgroundImage="none">
+						<u-parse :content="pageData.company.company_info" @load="load"></u-parse>
+					</u-read-more>
+				</view>
+				<view class="title cell">公司地址</view>
+				<view class="cell">
+					<view class="text">{{pageData.company.company_address}}</view>
+				</view>
+				<view class="title cell">公司环境</view>
+				<view class="cell">
+					<block v-for="(item,index) in pageData.company.company_environment" :key="index">
+						<image :src="item" class="img"></image>
+					</block>
+				</view>
+				<view class="title cell">产品介绍</view>
+				<view class="cell">
+					<view class="text">{{pageData.company.company_product}}</view>
+				</view>
+			</view>
+			<view class="list" v-if="tab_active == 2">
+				<block v-for="(item,index) in pageData.position" :key="index">
+					<view class="list_item">
+						<view class="hflex acenter jbetween">
+							<view class="item_title">{{item.title}}</view>
+							<view class="item_blue">{{item.salary}}·{{item.monthly}}薪</view>
+						</view>
+						<view class="hflex acenter" style="padding: 20rpx 0 24rpx;">
+							<view class="item_box">{{item.city}}</view>
+							<view class="item_box">{{item.education}}</view>
+							<view class="item_box">{{item.experience}}</view>
+						</view>
+						<view class="item_name">{{item.company_name}}</view>
+						<view class="hflex acenter jbetween" style="padding-top: 16rpx;">
+							<view class="hflex acenter">
+								<image class="item_avatar" :src="item.user.avatar"></image>
+								<view class="user_name">{{item.user.position}}·{{item.user.name}}</view>
+							</view>
+							<view class="user_right">{{item.user.city}}·{{item.user.area}}</view>
+						</view>
+					</view>
+				</block>
+			</view>
+		</view>
+		<view class="bottom hflex acenter jbetween">
+			<view class="vflex acenter" @click="collect">
+				<u-icon name="star" color="#444444" size="20" v-if="pageData.is_collect == 0"></u-icon>
+				<u-icon name="star-fill" color="#506DFF" size="20" v-else></u-icon>
+				<view class="text_style1">收藏</view>	
+			</view>	
+			<view class="vflex acenter">
+				<image src="/static/images/comment/share.png" mode="" class="bottom_img"></image>	
+				<view class="text_style1">分享</view>	
+			</view>	
+			<view class="bottom_btn">私信聊聊</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				pageData: {
+					img: '/static/images/mine/avatar1.jpg',
+					name: '江南造船厂',
+					scale: '20-99人',
+					company: {
+						company_info: '2012年4月22日正式上线，推崇品质、青春、时尚的品牌内涵，2012年4月22日正式上线，推崇品质、青春、时尚的品牌内涵2012年4月22日正式上线，推崇品质',
+						company_address: '江苏省南京市浦口区东方万汇城23号楼1单元2203',
+						company_environment: ['/static/images/mine/avatar1.jpg','/static/images/mine/avatar1.jpg','/static/images/mine/avatar1.jpg'],
+						company_product: ' 根据《中华人民共和国价格法》、《中华人民共和国商业银行法》、《商业银行服务价格管理办法》、《国家发展改革委 中国银监会关于印发商业银行服务政府指导价政府定价目录的通知》、《中国银保监会关于规范银行服务市场调节价管理的指导意见》等规定，按照“收费项目公开、服务质价公开、效用功能公开、优惠政策公开”的“四公开”要求，现将本行各项金融服务价格标准予以公告。本公告内容包括服务提示、政府指导价政府定价项目价格标准、中国农业银行免费服务项目及中国农业银行市场调节价服务价格标准等，自2022年4月30日起执行。'	
+					},
+					position: [
+						{
+							id: 0,
+							title: '船舶设计师',
+							salary: '13-15K',
+							monthly: '13',
+							city: '北京',
+							education: '本科',
+							experience: '经验不限',
+							company_name: '北京文化旅游产业发展集团有限公司',
+							user: {
+								avatar: '/static/images/mine/avatar1.jpg',
+								name: '江女士',
+								position: '行政总监',
+								city: '北京市',
+								area: '东城区',
+							},
+						},
+						{
+							id: 0,
+							title: '船舶设计师',
+							salary: '13-15K',
+							monthly: '13',
+							city: '北京',
+							education: '本科',
+							experience: '经验不限',
+							company_name: '北京文化旅游产业发展集团有限公司',
+							user: {
+								avatar: '/static/images/mine/avatar1.jpg',
+								name: '江女士',
+								position: '行政总监',
+								city: '北京市',
+								area: '东城区',
+							},
+						},
+						
+						{
+							id: 0,
+							title: '船舶设计师',
+							salary: '13-15K',
+							monthly: '13',
+							city: '北京',
+							education: '本科',
+							experience: '经验不限',
+							company_name: '北京文化旅游产业发展集团有限公司',
+							user: {
+								avatar: '/static/images/mine/avatar1.jpg',
+								name: '江女士',
+								position: '行政总监',
+								city: '北京市',
+								area: '东城区',
+							},
+						}
+					],
+					is_collect: 0
+				},
+				tab_active: 1,
+				shadowStyle: {
+					backgroundImage: "none",
+				}
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		methods: {
+			// 返回
+			leftClick() {
+				console.log('返回');
+				$api.jump(-1)
+			},
+			// 切换tabs
+			changeTab(index) {
+				that.tab_active = index
+			},
+			load() {
+				this.$refs.uReadMore.init();
+			},
+			// 收藏
+			collect() {
+				if(that.pageData.is_collect == 0) {
+					that.pageData.is_collect = 1
+					$api.info('收藏成功')
+				} else {
+					that.pageData.is_collect = 0
+					$api.info('取消收藏')
+				}
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		position: relative;
+		.top {
+			background: url('../../../static/images/comment/nav_bg.png') no-repeat;
+			background-size: 100%;
+			box-sizing: border-box;
+			padding: 30rpx;
+			height: 540rpx;
+			.top_name {
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #222222;
+				line-height: 50rpx;
+			}
+			.scale {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 34rpx;
+			}
+			.top_avatar {
+				width: 116rpx;
+				height: 116rpx;
+				border-radius: 16rpx;
+			}
+		}
+		.box {
+			position: absolute;
+			left: 0;
+			top: 344rpx;
+			width: 100%;
+			min-height: calc(100vh - 256rpx);
+			background: #FFFFFF;
+			border-radius: 40rpx 40rpx 0px 0px;
+			.tabs {
+				width: 100%;
+				padding: 36rpx 0 40rpx;
+				.tabs_item {
+					font-size: 32rpx;
+					font-weight: 500;
+					color: #959595;
+					line-height: 44rpx;
+					width: 50%;
+					text-align: center;
+				}
+				.tab_active {
+					position: relative;
+					color: #222222;
+				}
+				.tab_active::after {
+					content: "";
+					position: absolute;
+					bottom: -8rpx;
+					left: 39%;
+					width: 80rpx;
+					height: 4rpx;
+					background: #506DFF;
+					border-radius: 4rpx;
+				}
+			}
+			.box1 {
+				width: 100%;
+				box-sizing: border-box;
+				padding: 0 30rpx;
+				margin-bottom: 186rpx;
+				.title {
+					font-size: 36rpx;
+					font-weight: 500;
+					color: #222222;
+					line-height: 50rpx;
+				}
+				.cell {
+					padding: 14rpx 0;
+				}
+				.text {
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #555555;
+					line-height: 40rpx;
+				}
+				.img {
+					width: 220rpx;
+					height: 220rpx;
+					border-radius: 12rpx;
+					margin: 0 16rpx 20rpx 0;
+				}
+				.img:nth-child(3n+3) {
+					margin: 0 0 20rpx;
+				}
+			}
+			.list {
+				box-sizing: border-box;
+				width: 100%;
+				padding: 0 30rpx;
+				.list_item {
+					width: 100%;
+					padding: 28rpx 0 20rpx;
+					border-top: 1rpx solid #F4F4F4;
+					.item_title {
+						font-size: 32rpx;
+						font-weight: 600;
+						color: #222222;
+					}
+					.item_blue {
+						font-size: 32rpx;
+						font-weight: bold;
+						color: #506DFF;
+					}
+					.item_box {
+						height: 40rpx;
+						background: #F0F2F6;
+						border-radius: 2px;
+						box-sizing: border-box;
+						padding: 4rpx 18rpx;
+						font-size: 22rpx;
+						font-weight: 400;
+						color: #444444;
+						margin-right: 20rpx;
+					}
+					.item_name {
+						font-size: 24rpx;
+						font-weight: 400;
+						color: #666666;
+					}
+					.item_avatar {
+						width: 40rpx;
+						height: 40rpx;
+						border-radius: 50%;
+						margin-right: 12rpx;
+					}
+					.item_avatar1 {
+						width: 88rpx;
+						height: 88rpx;
+						border-radius: 50%;
+						margin-right: 20rpx;
+					}
+					.item_right1 {
+						
+					}
+					.text_style1 {
+						font-size: 22rpx;
+						font-weight: 400;
+						color: #666666;
+						padding: 12rpx 0;
+					}
+					.item_box1 {
+						margin-top: 8rpx;
+						background: #EDF0FF;
+						border-radius: 8rpx;
+						box-sizing: border-box;
+						padding: 4rpx 16rpx;
+						font-size: 24rpx;
+						font-weight: 400;
+						color: #506DFF;
+					}
+					.item_btn1 {
+						width: 140rpx;
+						height: 52rpx;
+						background: #F1F3FF;
+						border-radius: 28rpx;
+						font-size: 26rpx;
+						font-weight: 500;
+						color: #506DFF;
+						line-height: 52rpx;
+						text-align: center;
+					}
+					.user_name {
+						font-size: 20rpx;
+						font-weight: 400;
+						color: #333333;
+					}
+					.user_right {
+						font-size: 20rpx;
+						font-weight: 400;
+						color: #A1A1A1;
+					}
+				}
+			}
+		}
+		.bottom {
+			width: 100%;
+			z-index: 9;
+			position: fixed;
+			bottom: 0;
+			height: 166rpx;
+			background: #FFFFFF;
+			box-sizing: border-box;
+			padding: 8rpx 30rpx 74rpx;
+			
+			.bottom_btn {
+				width: 530rpx;
+				height: 84rpx;
+				background: #506DFF;
+				border-radius: 42rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #FFFFFF;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			.bottom_btn1 {
+				width: 204rpx;
+				height: 84rpx;
+				border-radius: 21px;
+				border: 1px solid #506DFF;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #506DFF;
+				text-align: center;
+				line-height: 84rpx;
+				margin-right: 20rpx;
+			}
+			.bottom_btn2 {
+				width: 300rpx;
+				height: 84rpx;
+				border-radius: 21px;
+				background: #506DFF;
+				color: #FFFFFF;
+				font-size: 36rpx;
+				font-weight: 500;
+				text-align: center;
+				line-height: 84rpx;
+			}
+			.bottom_img {
+				width: 40rpx;
+				height: 40rpx;
+			}
+			
+		}
+	}
+</style>

pages/tabbar/shipyard/shipyard.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="content">
 		<view class="search">
-			<u-input v-model="serach_value" type="text" :border="true" placeholder="搜索关键词" shape="circle"
+			<u-input v-model="serach_value" type="text" :border="true" placeholder="输入搜索关键词" shape="circle"
 				prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399">
 				<template slot="suffix">
 					<view>搜索</view>
@@ -19,7 +19,7 @@
 			</view>
 			<view class="list">
 				<block v-for="(item,index) in pageList" :key="index">
-					<view class="list_item hflex acenter jbetween">
+					<view class="list_item hflex acenter jbetween" @click="toDetail(item.id)">
 						<image :src="item.img" class="item_img" mode="widthFix"></image>
 						<view class="item_right vflex jbetween">
 							<view class="hflex acenter jbetween">
@@ -41,6 +41,7 @@
 	export default {
 		data() {
 			return {
+				serach_value: '',
 				bannerList: [
 					"/static/images/index/class_img1.png",
 					"/static/images/index/class_img1.png"
@@ -99,6 +100,9 @@
 			// 切换tabs
 			changeTabs(id) {
 				that.active = id
+			},
+			toDetail(id) {
+				$api.jump('/pages/tabbar/shipyard/detail?id=' + id)
 			}
 		}
 	}
@@ -109,13 +113,13 @@
 		background-color: #f6f6f6;
 		
 		.search {
-			background: #fff;
+			// background: #fff;
 			width: 100%;
 			height: 88rpx;
 			box-sizing: border-box;
 			padding: 12rpx 30rpx;
 			.u-input {
-				// background-color: ;
+				background-color: #fff;
 				height: 64rpx;
 				padding: 0 0 0 18rpx !important;
 				border: 1rpx solid #506Dff;

pages/tabbar/shop/shop.vue

@@ -1,8 +1,347 @@
 <template>
+	<view class="content">
+		<u-navbar title=" " height="44px" :bgColor="bgColor" :placeholder="true">
+			<view class="navbar_left hflex acenter"  @click="changeCity" slot="left">
+				<view class="city">{{city}}</view>
+				<u-icon name="arrow-down-fill" color="#000" size="10"></u-icon>
+			</view>
+		</u-navbar>
+		<view class="search">
+			<u-input v-model="serach_value" type="text" :border="true" placeholder="热搜榜单" shape="circle"
+				prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399">
+				<template slot="suffix">
+					<view>搜索</view>
+				</template>
+			</u-input>
+		</view>
+		<view class="swiper">
+			<u-swiper :indicator="true" indicatorActiveColor="#506dff" height="160" :list="bannerList" radius="20rpx" @click="toBanner"></u-swiper>
+		</view>
+		<view class="grid">
+			 <u-grid :border="false" @click="clickBase" col="4">
+				<u-grid-item v-for="(baseListItem,baseListIndex) in baseList" :key="baseListIndex">
+					<image :src="baseListItem.src" class="grid_icon"></image>
+					<text class="grid_text">{{baseListItem.title}}</text>
+				</u-grid-item>
+			 </u-grid>
+		</view>
+		<view class="list hflex acenter fwrap">
+			<block v-for="(item,index) in pageList" :key="index">
+				<view class="list_item" @click="toDetail(item.id)">
+					<image :src="item.img" class="item_img"></image>
+					<view style="box-sizing: border-box;padding: 12rpx 10rpx 0;">
+						<view class="item_name">{{item.name}}</view>
+						<view class="hflex acenter " style="padding-top: 12rpx;">
+							<view class="item_type">{{item.material}}</view>
+							<view class="item_type">{{item.parts}}</view>
+						</view>
+						<view class="item_price">￥{{item.price}}</view>
+					</view>
+				</view>
+			</block>
+		</view>
+		<view class="suspension">
+			<view @click="toCart" class="img_box">
+				<u-badge numberType="overflow" max="99" :value="cart_num"></u-badge>
+				<image src="/static/images/shop/cart.png" class="susp_icon"></image>
+			</view>
+			<view @click="toCenter">
+				<image src="/static/images/shop/center.png" class="susp_icon"></image>
+			</view>
+		</view>
+	</view>
 </template>
 
 <script>
+	import $api from '@/static/js/api.js'
+	var that = ''
+	export default {
+		data() {
+			return {
+				cart_num: 12,
+				bgColor: 'rgb(255,255,255,0)',
+				city: '临沂市',
+				serach_value: '',
+				bannerList: [
+					"/static/images/index/class_img1.png",
+					"/static/images/index/class_img1.png"
+				],
+				baseList: [
+					{
+						src: '/static/images/index/class_img3.png',
+						title: '船舶买卖',
+						url: '/page_shop/pages/base/base',
+					},
+					{
+						src: '/static/images/index/class_img4.png',
+						title: '二手船配件',
+						url: '/page_shop/pages/base/base',
+					},
+					{
+						src: '/static/images/index/class_img5.png',
+						title: '新船机配件',
+						url: '/page_shop/pages/base/base',
+					},
+					{
+						src: '/static/images/index/class_img3.png',
+						title: '发动机配件',
+						url: '/page_shop/pages/base/base',
+					},
+					{
+						src: '/static/images/index/class_img3.png',
+						title: '船舶买卖',
+						url: '/page_shop/pages/base/base',
+					},
+					{
+						src: '/static/images/index/class_img4.png',
+						title: '二手船配件',
+						url: '/page_shop/pages/base/base',
+					},
+					{
+						src: '/static/images/index/class_img5.png',
+						title: '新船机配件',
+						url: '/page_shop/pages/base/base',
+					},
+					{
+						src: '/static/images/index/class_img4.png',
+						title: '发动机配件',
+						url: '/page_shop/pages/base/base',
+					},
+				],
+				pageList: [
+					{
+						id: 1,
+						img: '/static/images/index/class_img4.png',
+						name: '王思聪同款王思聪同款豪华游艇大型钓鱼船户外海上滑梯水豪华游艇大型钓鱼船户外海上滑梯水',
+						material: '玻璃钢',
+						parts: '氧气罐',
+						price: '9928.00',
+					},
+					{
+						id: 1,
+						img: '/static/images/index/class_img4.png',
+						name: '王思聪同款王思聪同款豪华游艇大型钓鱼船户外海上滑梯水豪华游艇大型钓鱼船户外海上滑梯水',
+						material: '玻璃钢',
+						parts: '氧气罐',
+						price: '9928.00',
+					},
+					{
+						id: 1,
+						img: '/static/images/index/class_img4.png',
+						name: '王思聪同款王思聪同款豪华游艇大型钓鱼船户外海上滑梯水豪华游艇大型钓鱼船户外海上滑梯水',
+						material: '玻璃钢',
+						parts: '氧气罐',
+						price: '9928.00',
+					},
+					{
+						id: 1,
+						img: '/static/images/index/class_img4.png',
+						name: '王思聪同款王思聪同款豪华游艇大型钓鱼船户外海上滑梯水豪华游艇大型钓鱼船户外海上滑梯水',
+						material: '玻璃钢',
+						parts: '氧气罐',
+						price: '9928.00',
+					},
+					{
+						id: 1,
+						img: '/static/images/index/class_img4.png',
+						name: '王思聪同款王思聪同款豪华游艇大型钓鱼船户外海上滑梯水豪华游艇大型钓鱼船户外海上滑梯水',
+						material: '玻璃钢',
+						parts: '氧气罐',
+						price: '9928.00',
+					},
+					{
+						id: 1,
+						img: '/static/images/index/class_img4.png',
+						name: '王思聪同款王思聪同款豪华游艇大型钓鱼船户外海上滑梯水豪华游艇大型钓鱼船户外海上滑梯水',
+						material: '玻璃钢',
+						parts: '氧气罐',
+						price: '9928.00',
+					},
+					
+				]
+			}
+		},
+		onLoad() {
+			that = this
+		},
+		onPageScroll(e) {
+			console.log(e);
+			if(e.scrollTop != 0) {
+				that.bgColor = "#fff"
+			} else {
+				that.bgColor = 'rgba(255,255,255,0)'
+			}
+		},
+		methods: {
+			// banner图跳转
+			toBanner() {
+				
+			},
+			// 点击base
+			clickBase(e) {
+				var url = that.baseList[e].url + '?name=' + that.baseList[e].title
+				$api.jump(url)
+			},
+			// 商品详情
+			toDetail(id) {
+				$api.jump('/page_shop/pages/good/detail?id=' + id)
+			},
+			// 去购物车
+			toCart() {
+				$api.jump('/page_shop/pages/mine/cart')
+			},
+			// 去个人中心
+			toCenter() {
+				$api.jump('/page_shop/pages/mine/mine')
+			},
+		},
+	}
 </script>
 
-<style>
+<style lang="scss" scoped>
+	.content::v-deep {
+		background: url('/static/images/shop/shop_bg.png') #F5F5F5 no-repeat;
+		background-size: 100%;
+		padding: 0 30rpx;
+		position: relative;
+		.navbar_left {
+			
+			.city {
+				color: #222222;
+				font-size: 32rpx;
+				margin-right: 16rpx;
+			}
+		}
+		.search {
+			// background: #fff;
+			width: 100%;
+			height: 88rpx;
+			box-sizing: border-box;
+			padding: 12rpx 0;
+			.u-input {
+				background-color: #fff;
+				height: 64rpx;
+				padding: 0 0 0 18rpx !important;
+				border: 1rpx solid #506Dff;
+				margin-bottom: 12rpx;
+			}
+			.u-input__content__subfix-icon {
+				width: 128rpx;
+				height: 64rpx;
+				background-color: #506Dff;
+				border-radius: 32rpx;
+				color: #fff;
+				font-size: 28rpx;
+				text-align: center;
+				line-height: 64rpx;
+			}
+		}
+		.swiper {
+			width: 100%;
+			margin-top: 20rpx;
+			height: 320rpx;
+		}
+		.grid {
+			background: #FFFFFF;
+			border-radius: 10px;
+			width: 100%;
+			box-sizing: border-box;
+			padding: 14rpx 40rpx;
+			.u-grid-item {
+				margin: 14rpx 0;
+			}
+			.grid_icon {
+				width: 76rpx;
+				height: 76rpx;
+				border-radius: 12rpx;
+			}
+			.grid_text {
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #222222;
+				line-height: 34rpx;
+				padding-top: 12rpx;
+			}
+		}
+		.list {
+			width: 100%;
+			margin-top: 20rpx;
+			.list_item {
+				width: 334rpx;
+				background: #FFFFFF;
+				border-radius: 20rpx;
+				box-sizing: border-box;
+				padding: 0 0 22rpx;
+				margin: 0 22rpx 20rpx 0;
+				.item_img {
+					width: 334rpx;
+					height: 280rpx;
+					border-radius: 20rpx 20rpx 0px 0px;
+				}
+				.item_name {
+					width: 100%;
+					text-overflow: ellipsis;
+					overflow: hidden;
+					display: -webkit-box;
+					-webkit-box-orient: vertical;
+					box-orient: vertical;
+					line-clamp: 2;
+					-webkit-line-clamp: 2;
+					font-size: 28rpx;
+					font-weight: 400;
+					color: #222222;
+					line-height: 40rpx;
+				}
+				.item_type {
+					
+					height: 28rpx;
+					background: #F5F5F5;
+					border-radius: 4rpx; 
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #999999;
+					line-height: 28rpx;
+					padding: 0 14rpx;
+					margin-right: 12rpx;
+				}
+				.item_price {
+					padding-top: 12rpx;
+					font-size: 28rpx;
+					font-weight: bold;
+					color: #FF4747;
+					line-height: 32rpx;
+				}
+			}
+			.list_item:nth-child(2n+2) {
+				margin: 0 0 20rpx;
+			}
+		}
+		.suspension {
+			position: fixed;
+			bottom: 22rpx;
+			right: 14rpx;
+			.susp_icon {
+				width: 132rpx;
+				height: 132rpx;
+				margin-top: 8rpx;
+			}
+			.img_box {
+				position: relative;
+				.u-badge {
+					position: absolute;
+					right: 16rpx;
+					top: 18rpx;
+					font-size: 20rpx !important;
+					font-weight: 400;
+					color: #FFFFFF !important;
+					line-height: 24rpx !important;
+					width: 28rpx;
+					height: 28rpx;
+					background: #FF4747;
+					box-shadow: 0px 4rpx 8rpx 0px rgba(255,71,71,0.4);
+				}
+			}
+			
+		}
+	}
 </style>