预订优化

ghs/src/views/item/components/stock-detail.vue

@@ -1,9 +1,12 @@
 <template>
 	<div>
-		<el-drawer :visible.sync="showArea" size="1000px" :before-close="closeFn" custom-class="order-draw-wrap" direction="ltr">
+		<el-drawer :visible.sync="showArea" size="55vw" :before-close="closeFn" custom-class="drawer-class" direction="ltr">
 			<div>
+				<div style="margin-left:2px;font-weight:bold;">【{{ itemData.name?itemData.name:'' }}】库存明细</div>
                 <x-crud @load="onLoad">
-
+					<template #table-column-bigNumOrder="{scope}">
+						{{ scope.row.io == 1 ? '+' : '-' }}<span>{{ scope.row.bigNumOrder }}</span>
+					</template>
                 </x-crud>
 			</div>
 		</el-drawer>
@@ -20,15 +23,15 @@ export default {
 	},
 	data() {
 		return {
-			showArea: false,
-			data: [],
-			loading:true
+			showArea: false
 		};
 	},
 	methods: {
 		init() {
 			this.showArea = true
-			this.app.refresh({id:this.itemData.id})
+			if(this.app){
+				this.app.refresh({id:this.itemData.id})
+			}
 		},
 		closeFn() {
 			this.showArea = false;
@@ -85,43 +88,8 @@ export default {
 	}
 };
 </script>
-
-<style lang="scss">
-.order-draw-wrap {
-	.el-drawer__header {
-		margin-bottom: 2px;
-	}
-	.el-table__header-wrapper {
-		.el-table__header tr,
-		.el-table__header th {
-			background-color: #f7f7f7;
-		}
-	}
-}
-</style>
 <style lang="scss" scoped>
-.order-draw-wrap {
-	.title-status-wrap {
-		@include disFlex(center, flex-start);
-		.title-text {
-			margin-right: 200px;
-		}
-		.title-status {
-			color: red;
-			&.success {
-				color: green;
-			}
-		}
-	}
-}
-.card-wrap {
-	margin: 20px;
-	.card-tit {
-		font-size: 16px;
-		margin-bottom: 8px;
-	}
-	.card-body {
-		border: 1px solid $borderColor;
-	}
+.drawer-class{
+	height:100vh;
 }
 </style>

ghs/src/views/item/list.vue

@@ -278,7 +278,7 @@ export default {
 				key: '2'
 			},
 			{
-				text: '已停用',
+				text: '已删除',
 				key: '3'
 			}
 		],
@@ -388,7 +388,7 @@ export default {
   },
   methods: {
 	getStockList(item){
-		this.itemData = item;
+		this.itemData = {id:item.id,name:item.name}
 		setTimeout(() => {
 			this.$refs.stockDetail.init()
 		})

ghs/src/views/order/book.vue

@@ -47,24 +47,26 @@
         <el-button @click.stop="" size="medium" type="primary">上下架记录</el-button>
         <el-button @click.stop="" size="medium" type="primary">路上记录</el-button>
         <el-button @click.stop="" size="medium" type="primary">待采记录</el-button>
-        <el-button @click.stop="" size="medium" type="primary">库存明细</el-button>
+        <el-button @click.stop="getStock(scope.row)" size="medium" type="primary">库存明细</el-button>
       </template>
 
     </x-crud>
 
+    <stock-detail ref="stockDetail" :itemData="itemData" />
+
   </div>
 </template>
 
 <script>
 import SelOrder from './components/sel-order';
-import OrderDetail from './components/order-detail';
 import { getLodop } from '@/utils/lodop';
 import { mapGetters } from 'vuex';
 import {hiprint, defaultElementTypeProvider} from 'vue-plugin-hiprint'
+import stockDetail from './components/stock-detail';
 export default {
   components: {
     SelOrder,
-    OrderDetail
+    stockDetail
   },
   computed: {
         ...mapGetters(['shopInfo', 'userInfo'])
@@ -117,7 +119,8 @@ export default {
       printData:{},
       shop:{},
       T:null,
-      search:''
+      search:'',
+      itemData:{id:0}
     };
   },
   created() {
@@ -131,6 +134,12 @@ export default {
 
   },
   methods: {
+    getStock(info){
+      this.itemData = {id:info.itemId,name:info.name}
+      setTimeout(() => {
+        this.$refs.stockDetail.init()
+      })
+    },
     myCgOrder(){
       let staffId = this.shopInfo && this.shopInfo.staff.id ? this.shopInfo.staff.id: 0
       let staffName = this.shopInfo && this.shopInfo.staff.name ? this.shopInfo.staff.name: ''
@@ -240,7 +249,7 @@ export default {
             op: {
               visible: true,
               props: {
-                width: 900,
+                width: 750,
                 align: 'left',
                 fixed: 'right',
                 label: '操作'

ghs/src/views/order/components/stock-detail.vue

@@ -0,0 +1,95 @@
+<template>
+	<div>
+		<el-drawer :visible.sync="showArea" size="55vw" :before-close="closeFn" custom-class="drawer-class" direction="ltr">
+			<div>
+				<div style="margin-left:2px;font-weight:bold;">【{{ itemData.name?itemData.name:'' }}】库存明细</div>
+                <x-crud @load="onLoad">
+					<template #table-column-bigNumOrder="{scope}">
+						{{ scope.row.io == 1 ? '+' : '-' }}<span>{{ scope.row.bigNumOrder }}</span>
+					</template>
+                </x-crud>
+			</div>
+		</el-drawer>
+	</div>
+</template>
+<script>
+export default {
+	name: 'stock-detail',
+	props: {
+		itemData: {
+			type: Object,
+			default: () => {}
+		}
+	},
+	data() {
+		return {
+			showArea: false
+		};
+	},
+	methods: {
+		init() {
+			this.showArea = true
+			if(this.app){
+				this.app.refresh({id:this.itemData.id})
+			}
+		},
+		closeFn() {
+			this.showArea = false;
+		},
+		onLoad({ ctx, app }) {
+			this.app = app;
+			ctx.service(this.$service.stock)
+			.set('table', {
+				columns: [
+					{
+						label: '日期',
+						prop: 'addTime',
+						align: 'center',
+					},
+					{
+						label: '名称',
+						prop: 'relateName',
+						align: 'center',
+					},
+					{
+						label: '事项',
+						prop: 'typeName',
+						align: 'center',
+					},
+					{
+						label: '变动',
+						prop: 'bigNumOrder',
+						align: 'center',
+					},
+					{
+						label: '剩余',
+						prop: 'bigNumStock',
+						align: 'center',
+					}
+				],
+				op: {
+					visible: true,
+					props: {
+						width: 160,
+						align: 'center',
+						fixed: 'right',
+						label: '操作'
+					},
+					layout: []
+				}
+			})
+			.set('layout', [
+				[ 'data-table' ],
+				['flex1', 'pagination']
+			])
+			.done()
+			app.refresh({id:this.itemData.id})
+		}
+	}
+};
+</script>
+<style lang="scss" scoped>
+.drawer-class{
+	height:100vh;
+}
+</style>