diff --git a/common/api.js b/common/api.js
index 953cc23..e279477 100644
--- a/common/api.js
+++ b/common/api.js
@@ -1,8 +1,8 @@
 // appId: 正式 null | 测试 null
 export const DEV = "dev"; // dev 测试 | prod 正式
 export const VERSION = '1.0.0'; // 版本号
-export const DEVURL = 'http://192.168.3.78'; // 测试服请求地址
-// export const DEVURL = 'http://192.168.3.5'; // 测试服请求地址
+// export const DEVURL = 'http://192.168.3.78'; // 测试服请求地址
+export const DEVURL = 'http://192.168.3.5'; // 测试服请求地址
 export const PRODURL = ''; // 正式服请求地址
 
 /* 供应商相关接口 */
@@ -32,4 +32,5 @@ export const API_CANTEEN_WAREHOUSEOUT = '/api/canteen/warehouseOut'; // 出库
 export const API_CANTEEN_WAREHOUSEOUTLIST = '/api/canteen/warehouseOutList'; // 出库申请列表
 export const API_CANTEEN_PURCHASEDETAIL = '/api/canteen/purchaseDetail'; // 采购单详情
 export const API_CANTEEN_SUPPLIERLIST = '/api/canteen/supplierList'; // 供应商列表
-export const API_CANTEEN_MATERIALLISTBYWAREHOUSE = '/api/canteen/materialListByWarehouse'; // 仓库物资列表
\ No newline at end of file
+export const API_CANTEEN_MATERIALLISTBYWAREHOUSE = '/api/canteen/materialListByWarehouse'; // 仓库物资列表
+export const API_CANTEEN_PURCHASEUPDATE = '/api/canteen/purchaseUpdate'; // 改变采购单状态
\ No newline at end of file
diff --git a/pages/canteen/delivery/order.vue b/pages/canteen/delivery/order.vue
index 1160bd2..36a837e 100644
--- a/pages/canteen/delivery/order.vue
+++ b/pages/canteen/delivery/order.vue
@@ -6,7 +6,12 @@
 		<swiper :style="{height: 'calc('+ windowHeight +'px - 110rpx)', width: '750rpx'}" 
 			:current="current" @change="swiperChange">
 			<swiper-item v-for="(tabItem, tabIndex) in tab_list" :key="tabIndex">
-				<scroll-view class="lf-w-100 lf-h-100 lf-p-l-32 lf-p-r-32 lf-border-box" :scroll-y="true">
+				<scroll-view class="lf-w-100 lf-h-100 lf-p-l-32 lf-p-r-32 lf-border-box" 
+					:scroll-y="true" :refresher-enabled="true"
+					refresher-background="#f6f6f6"
+					@scrolltolower="scrolltolower"
+					:refresher-triggered="tabItem.isRefresher" 
+					@refresherrefresh="onRefresherrefresh">
 					<view class="card" v-for="(item, index) in tabItem.list" :key="item.id" @click="$url('/pages/canteen/delivery/detail?id='+ item.id)">
 						<view class="lf-row-between item">
 							<view class="lf-color-gray">申请人</view>
@@ -39,50 +44,111 @@
 <script>
 	export default {
 		data(){
+			let _public = {
+				loading_class: true,
+				loading_text: '正在加载中...',
+				page: 1,
+				isPage: true,
+				isRefresher: false
+			};
 			return {
 				current: 0,
 				tab_list: [{
 					name: '全部',
-					loading_class: true,
-					loading_text: '正在加载中...',
-					page: 1,
-					isPage: true,
-					list: []
+					list: [],
+					..._public
 				},{
 					name: '申请中',
-					loading_class: true,
-					loading_text: '正在加载中...',
-					page: 1,
-					isPage: true,
-					list: []
+					list: [],
+					..._public
 				},{
 					name: '已出库',
-					loading_class: true,
-					loading_text: '正在加载中...',
-					page: 1,
-					isPage: true,
-					list: []
+					list: [],
+					..._public
 				}],
 				page_size: 10,
 				windowHeight: 0
 			}
 		},
+		computed: {
+			// TODO 动态设置class，对不同的状态设置不同的展示颜色
+			stateClass(){
+				return function(val){
+					let class_name = {
+						'等待接单': 'quoted-price',
+						'等待发货': 'wait',
+						'已完成': 'passed',
+						'已退单': 'refuse'
+					}
+					return class_name[val];
+				}
+			}
+		},
 		onLoad(){
 			this.windowHeight = uni.getSystemInfoSync().windowHeight;
 			this.getData();
 		},
 		methods: {
-			getData(){
+			// 获取数据 TODO 目前接口还没有数据
+			getData(options){
+				let item = this.tab_list[this.current];
 				this.$http(this.API.API_CANTEEN_WAREHOUSEOUTLIST).then(res => {
 					console.log("getData", res);
 					this.tab_list[this.current].list = res.data.list || [];
+					
+					let list = res.data.list || [];
+					// let isPage res.data.isPage;
+					// if(!isPage){
+					// 	item.loading_class = false;
+					// 	item.loading_text = '已加载全部数据~';
+					// }
+					// item.isPage = isPage;
+					
+					if(options && options.refresh){
+						item.isRefresher = false;
+					}
+					if(item.page == 1){
+						item.list = list;
+					}else{
+						item.list.push(...list);
+					}
 				});
 			},
+			// tabs切换
 			tabsChange(current){
 				this.current = current;
+				if(this.tab_list[this.current].list.length <= 0){
+					this.getData();
+				}
 			},
+			// swiper页面切换
 			swiperChange(event){
 				this.current = event.detail.current;
+				if(event.detail.source == '') return; // 如果是被动出发，没有事件类型则不做处理
+				if(this.tab_list[this.current].list.length <= 0){
+					this.getData();
+				}
+			},
+			// 页面触底
+			scrolltolower(){
+				let item = this.tab_list[this.current];
+				if(item.isPage){
+					item.page++;
+					this.getData();
+				}
+			},
+			// 下拉刷新
+			onRefresherrefresh(){
+				this.$u.throttle(() => {
+					let item = this.tab_list[this.current];
+					item.isRefresher = true;
+					item.page = 1;
+					item.isPage = true;
+					item.loading_class = true;
+					item.loading_text = '正在加载中...';
+					item.list = [];
+					this.getData({refresh: true});
+				}, 200);
 			}
 		}
 	}
diff --git a/pages/canteen/index/index.vue b/pages/canteen/index/index.vue
index c2a5c78..9d3d767 100644
--- a/pages/canteen/index/index.vue
+++ b/pages/canteen/index/index.vue
@@ -1,6 +1,6 @@
 <template>
 	<view>
-		<view class="lf-row-center lf-flex-column head">
+		<view class="lf-row-center lf-flex-column head" v-if="$isRight(canteen)">
 			<image :src="canteen.avatar"></image>
 			<view class="lf-m-t-20 lf-font-32 lf-font-bold lf-color-black">{{ canteen.name }}</view>
 			<view class="lf-font-28 lf-color-555 lf-m-t-10">{{ canteen.user.canteen.remark }}</view>
@@ -19,7 +19,7 @@
 			</view>
 		</view>
 		<view style="height: 170rpx;"></view>
-		<view class="btn-bottom exit">
+		<view class="btn-bottom exit" v-if="$isRight(canteen)">
 			<button class="lf-w-100" @click="loginOut">退出登录</button>
 		</view>
 	</view>
diff --git a/pages/canteen/purchase/detail.vue b/pages/canteen/purchase/detail.vue
index 70ce537..2724903 100644
--- a/pages/canteen/purchase/detail.vue
+++ b/pages/canteen/purchase/detail.vue
@@ -1,52 +1,66 @@
 <template>
 	<view>
-		<view class="head">
+		<view class="head" v-if="$isRight(order)">
 			<view class="lf-row-between lf-color-gray list">
 				<view>采购单 {{ order.p_sn }}</view>
 			</view>
 			<view class="lf-row-between list">
-				<image src="../../../static/logo.png" class="image"></image>
+				<image :src="order.supplier.logo" class="image"></image>
 				<view class="info">
-					<view class="lf-font-32 lf-color-black lf-font-bold">广西美味生活有限公司</view>
-					<view class="lf-font-24 lf-color-555">广西南宁青秀区民族大道118号可爱大厦A座0930室</view>
+					<view class="lf-font-32 lf-color-black lf-font-bold">{{ order.supplier.supplier_name }}</view>
+					<view class="lf-font-24 lf-color-555">{{ order.supplier.address }}</view>
 				</view>
 			</view>
 		</view>
 		<self-line></self-line>
 		<view class="lf-p-l-32 lf-p-r-32 lf-border-box lf-bg-white">
-			<lf-ysteps :stepList="stepList" color="#11D189"></lf-ysteps>
+			<!-- <lf-ysteps :stepList="stepList" color="#11D189"></lf-ysteps> -->
+			<lf-stepbar :list="order.state_log" v-if="order.state_log"></lf-stepbar>
 		</view>
 		<self-line></self-line>
 		<view class="head">
 			<view class="lf-row-between list">
 				<view>车辆</view>
-				<view class="lf-font-bold">桂AX2738</view>
+				<view class="lf-font-bold"></view>
 			</view>
 			<view class="lf-row-between list">
 				<view>司机</view>
-				<view class="lf-font-bold">李师傅</view>
+				<view class="lf-font-bold"></view>
 			</view>
 			<view class="lf-row-between list">
 				<view>联系电话</view>
-				<view class="lf-font-bold">{{ order.contact_phone }}</view>
+				<view class="lf-font-bold"></view>
 			</view>
 			<view class="list">
 				<view>证明材料</view>
 				<view class="lf-flex-wrap lf-m-t-10">
-					<image src="../../../static/logo.png" class="ms-img" v-for="(item, index) in 4" :key="index"></image>
+					<image :src="item.voucher_pic" @click="lookImage(index)" class="ms-img" v-for="(item, index) in order.voucher" :key="item.id"></image>
 				</view>
 			</view>
 		</view>
 		<self-line></self-line>
 		<view class="lf-m-t-30 lf-m-l-32">
 			<view class="lf-font-32 lf-color-black lf-font-bold lf-m-b-20">物资明细</view>
-			<wyb-table :first-line-fixed="true" contentBgColor="#ecfaf5" :headers="headers" :contents="contents" @onButtonClick="onButtonClick" width="max-content" height="350rpx"></wyb-table>
+			<wyb-table :first-line-fixed="true" contentBgColor="#ecfaf5" :headers="headers" :contents="contents" width="max-content" height="350rpx"></wyb-table>
 		</view>
 		<view style="height: 100rpx;"></view>
 		<!-- 操作按钮 -->
-		<view class="fixed-bottom">
-			<button class="btn btn1">退单</button>
-			<button class="btn btn2" @click="$url('/pages/canteen/purchase/receipt')">确认收货</button>
+		<view class="fixed-bottom" v-if="type != 3">
+			<view v-if="type == 1" class="lf-row-flex-end">
+				<button class="btn btn1">编辑</button>
+				<button class="btn btn2">立即发单</button>
+			</view>
+			<view v-else-if="type == 2" class="lf-row-flex-end">
+				<button class="btn btn2" style="background-color: #FF0000;">撤销订单</button>
+			</view>
+			<view v-else-if="type == 4" class="lf-row-flex-end">
+				<button class="btn btn1">退单</button>
+				<button class="btn btn2" @click="$url('/pages/canteen/purchase/receipt?p_sn='+ order.p_sn)">确认收货</button>
+			</view>
+			<view v-else-if="type == 5" class="lf-row-between">
+				<button class="btn btn1">复用采购单</button>
+				<view class="lf-font-32" style="color: #11D189;">已完成</view>
+			</view>
 		</view>
 	</view>
 </template>
@@ -58,36 +72,6 @@
 		components: { lfYsteps, wybTable },
 		data(){
 			return {
-				stepList: [
-				    {
-				        time: '2021-07-23 13:23:52', // 左侧时间 -- 必选
-				        info: '订单创建', // 右侧内容 -- 可选
-				        isFinished: false, // 是否已完成（完成 index 为 √）-- 可选
-				        isActive: true, // 是否为当前节点 Active（当前节点 即使完成 index 也不会显示 √）-- 可选
-				        isShowSlot: false // 右侧是否有 Slot（显示在 右侧内容下方）-- 可选
-				    },
-				    {
-				        time: '2021-07-23 13:23:52',
-				        info: '采购订单发起，等待供应商接单',
-				        isFinished: false,
-				        isActive: true,
-				        isShowSlot: true
-				    },
-					{
-					    time: '2021-07-23 13:23:52',
-					    info: '供应商已接单，正在装车运输中',
-					    isFinished: false,
-					    isActive: true,
-					    isShowSlot: true
-					},
-					{
-					    time: '2021-07-23 13:23:52',
-					    info: '您的包裹已到，已被本人签收',
-					    isFinished: true,
-					    isActive: false,
-					    isShowSlot: true
-					}
-				],
 				headers: [{
 						key: 'name',
 						label: '菜名'
@@ -102,16 +86,20 @@
 						label: '税后价格'
 					}],
 				contents: [],
-				order: {}
+				order: {},
+				p_sn: '',
+				type: 4
 			}
 		},
 		onLoad(options){
-			this.getData(options.p_sn);
+			this.p_sn = options.p_sn || '';
+			// TODO 显示车辆等信息，显示table信息
+			this.getData();
 		},
 		methods: {
-			getData(p_sn){
+			getData(){
 				this.$http(this.API.API_CANTEEN_PURCHASEDETAIL, {
-					p_sn: p_sn
+					p_sn: this.p_sn
 					// p_sn: '802316269455228606'
 				}).then(res => {
 					console.log("xxx",res)
@@ -130,17 +118,24 @@
 					this.contents = contents;
 				})
 			},
-			onButtonClick(event){
-				uni.showModal({
-					title: '温馨提示',
-					content: '您确定移除该项吗?',
-					success: result => {
-						if(result.confirm){
-							console.log("移除某一项", event);
-							let { contentIndex } = event;
-							this.contents.splice(contentIndex, 1);
-						}
-					}
+			// 预览图片
+			lookImage(index){
+				this.$u.throttle(() => {
+					let images = this.order.voucher.map(item => item.voucher_pic);
+					uni.previewImage({
+						urls: images,
+						current: index
+					})
+				}, 200);
+			},
+			// 改变订单状态 TODO 
+			orderStateChange(state){
+				this.$http(this.API.API_CANTEEN_PURCHASEUPDATE, {
+					p_sn: this.p_sn,
+					state: state
+				}).then(res => {
+					console.log("orderStateChange", res);
+					this.$msg('操作成功');
 				})
 			}
 		}
@@ -165,6 +160,7 @@
 				width: 140rpx;
 				height: 140rpx;
 				border-radius: 10rpx;
+				background-color: #EEEEEE;
 			}
 			.info{
 				display: flex;
@@ -183,7 +179,7 @@
 		width: 750rpx;
 		height: 98rpx;
 		display: flex;
-		justify-content: flex-end;
+		// justify-content: flex-end;
 		align-items: center;
 		border-top: 1rpx solid #E5E5E5;
 		background-color: #FFFFFF;
@@ -210,11 +206,15 @@
 			margin-left: 20rpx;
 		}
 	}
+	.fixed-bottom>view{
+		width: 100%;
+	}
 	.ms-img{
 		width: 160rpx;
 		height: 160rpx;
 		margin-right: 15rpx;
 		margin-top: 15rpx;
+		background-color: #EEEEEE;
 		&:nth-of-type(4n){
 			margin-right: 0rpx;
 		}
diff --git a/pages/canteen/purchase/order.vue b/pages/canteen/purchase/order.vue
index 6729835..04d628a 100644
--- a/pages/canteen/purchase/order.vue
+++ b/pages/canteen/purchase/order.vue
@@ -6,11 +6,20 @@
 		<swiper :style="{height: 'calc('+ windowHeight +'px - 110rpx)', width: '750rpx'}" 
 			:current="current" @change="swiperChange">
 			<swiper-item v-for="(tabItem, tabIndex) in tab_list" :key="tabIndex">
-				<scroll-view class="lf-w-100 lf-h-100 lf-p-l-32 lf-p-r-32 lf-border-box" :scroll-y="true">
+				<scroll-view class="lf-w-100 lf-h-100 lf-p-l-32 lf-p-r-32 lf-border-box" 
+					:scroll-y="true" :refresher-enabled="true" 
+					refresher-background="#f6f6f6"
+					@scrolltolower="scrolltolower" 
+					:refresher-triggered="tabItem.isRefresher" 
+					@refresherrefresh="onRefresherrefresh">
 					<view class="card" v-for="(item, index) in tabItem.list" :key="item.id" @click="$url('/pages/canteen/purchase/detail?p_sn='+ item.p_sn)">
 						<view class="lf-row-between item">
-							<view class="lf-color-gray">采购方</view>
-							<view class="lf-color-black">{{ item.contact_name }}</view>
+							<view class="lf-color-gray">供应商</view>
+							<view class="lf-color-black">{{ item.supplier.supplier_name }}</view>
+						</view>
+						<view class="lf-row-between item">
+							<view class="lf-color-gray">批次号</view>
+							<view class="lf-color-black"></view>
 						</view>
 						<view class="lf-row-between item">
 							<view class="lf-color-gray">发单时间</view>
@@ -22,11 +31,11 @@
 						</view>
 						<view class="lf-row-between item">
 							<view class="lf-color-gray">商品种类</view>
-							<view class="lf-color-black">8类</view>
+							<view class="lf-color-black"></view>
 						</view>
 						<view class="lf-row-between item">
 							<view class="lf-color-gray">订单状态</view>
-							<view class="quoted-price">{{ item.state }}</view>
+							<view :class="stateClass(item.state)">{{ item.state }}</view>
 						</view>
 					</view>
 					<view class="loading-more">
@@ -42,71 +51,123 @@
 <script>
 	export default {
 		data(){
+			let _public = {
+				loading_class: true,
+				loading_text: '正在加载中...',
+				page: 1,
+				isPage: true,
+				isRefresher: false
+			};
 			return {
 				current: 0,
 				tab_list: [{
 					name: '全部',
-					loading_class: true,
-					loading_text: '正在加载中...',
-					page: 1,
-					isPage: true,
-					list: []
+					list: [],
+					..._public
 				},{
 					name: '未发单',
-					loading_class: true,
-					loading_text: '正在加载中...',
-					page: 1,
-					isPage: true,
-					list: []
+					list: [],
+					..._public
 				},{
 					name: '待接单',
-					loading_class: true,
-					loading_text: '正在加载中...',
-					page: 1,
-					isPage: true,
-					list: []
+					list: [],
+					..._public
 				},{
 					name: '备货中',
-					loading_class: true,
-					loading_text: '正在加载中...',
-					page: 1,
-					isPage: true,
-					list: []
+					list: [],
+					..._public
 				},{
 					name: '已发货',
-					loading_class: true,
-					loading_text: '正在加载中...',
-					page: 1,
-					isPage: true,
-					list: []
+					list: [],
+					..._public
 				},{
 					name: '已入库',
-					loading_class: true,
-					loading_text: '正在加载中...',
-					page: 1,
-					isPage: true,
-					list: []
+					list: [],
+					..._public
 				}],
 				page_size: 10,
 				windowHeight: 0
 			}
 		},
+		computed: {
+			stateClass(){
+				return function(val){
+					let class_name = {
+						'等待接单': 'quoted-price',
+						'等待发货': 'wait',
+						'已完成': 'passed',
+						'已退单': 'refuse'
+					}
+					return class_name[val];
+				}
+			}
+		},
 		onLoad(){
 			this.windowHeight = uni.getSystemInfoSync().windowHeight;
 			this.getData();
 		},
 		methods: {
-			getData(){
-				this.$http(this.API.API_CANTEEN_PURCHASEORDERLIST).then(res => {
+			// 获取数据
+			getData(options){
+				let item = this.tab_list[this.current];
+				this.$http(this.API.API_CANTEEN_PURCHASEORDERLIST, {
+					page: item.page,
+					page_size: this.page_size,
+					state: ''
+				}).then(res => {
 					console.log("getData", res);
-					this.tab_list[this.current].list = res.data.list || [];
+					let list = res.data.list || {};
+					let isPage = this.$isRight(list.next_page_url);
+					item.isPage = isPage;
+					if(!isPage){
+						item.loading_class = false;
+						item.loading_text = '已加载全部数据~';
+					}
+					if(options && options.refresh){
+						item.isRefresher = false;
+					}
+					if(item.page == 1){
+						item.list = list.data;
+					}else{
+						item.list.push(...list.data);
+					}
 				});
 			},
+			// 切换tabs
 			tabsChange(current){
 				this.current = current;
+				if(this.tab_list[this.current].list.length <= 0){
+					this.getData();
+				}
 			},
+			// 切换swiper
 			swiperChange(event){
 				this.current = event.detail.current;
+				if(event.detail.source == '') return; // 如果是被动出发，没有事件类型则不做处理
+				if(this.tab_list[this.current].list.length <= 0){
+					this.getData();
+				}
+			},
+			// 页面滚动到底部，触发分页
+			scrolltolower(){
+				let item = this.tab_list[this.current];
+				if(item.isPage){
+					item.page++;
+					this.getData();
+				}
+			},
+			// 下拉刷新
+			onRefresherrefresh(){
+				this.$u.throttle(() => {
+					let item = this.tab_list[this.current];
+					item.isRefresher = true;
+					item.page = 1;
+					item.isPage = true;
+					item.loading_class = true;
+					item.loading_text = '正在加载中...';
+					item.list = [];
+					this.getData({refresh: true});
+				}, 200);
 			}
 		}
 	}
diff --git a/pages/canteen/purchase/receipt.vue b/pages/canteen/purchase/receipt.vue
index d468b6d..8ecbbea 100644
--- a/pages/canteen/purchase/receipt.vue
+++ b/pages/canteen/purchase/receipt.vue
@@ -3,7 +3,8 @@
 		<view class="card" v-for="(item, index) in list" :key="index">
 			<view class="lf-row-between">
 				<view class="lf-color-black lf-font-bold">{{ item.title }}</view>
-				<view style="color: #11D189;" @click="showEdit">修改</view>
+				<!-- 修改功能先隐藏 -->
+				<!-- <view style="color: #11D189;" @click="showEdit">修改</view> -->
 			</view>
 			<view class="lf-row-between lf-m-t-30">
 				<view>订购数</view>