合并

src/api/currency.ts

@@ -0,0 +1,41 @@
+import request from '@/benyun/utils/request'
+
+// 分页查询数据
+function pageList(data : any, url : any) {
+	return request({
+		url: '/maindata/' + url + '/page',
+		method: 'GET',
+		data: data
+	})
+}
+
+// 新增数据
+function saveList(data : any, url : any) {
+	return request({
+		url: '/maindata/' + url + '/save',
+		method: 'POST',
+		data: data
+	})
+}
+// 修改数据
+function updateList(data : any, url : any) {
+	return request({
+		url: '/maindata/' + url + '/update',
+		method: 'POST',
+		data: data
+	})
+}
+// 删除数据
+function deleteList(data : any, url : any) {
+	return request({
+		url: '/maindata/' + url + '/delete',
+		method: 'POST',
+		params: data
+	})
+}
+export default {
+	pageList,
+	saveList,
+	updateList,
+	deleteList
+}

src/api/material.ts

@@ -8,10 +8,10 @@ function page(data : any) {
 		params:data
 	})
 }
-// 根据主键id查询物料数据
+// 根据分类id查询数据物料数据
 function single(data : any) {
 	return request({
-		url: '/maindata/maindataMaterial/single',
+		url: '/maindata/maindataMaterial/categoryList',
 		method: 'GET',
 		params:data
 	})
@@ -21,15 +21,15 @@ function save(data : any) {
 	return request({
 		url: '/maindata/maindataMaterial/save',
 		method: 'POST',
-		params: data
+		data: data
 	})
 }
 // 修改物料
 function update(data : any) {
 	return request({
 		url: '/maindata/maindataMaterial/update',
-		method: 'PUT',
-		params: data
+		method: 'POST',
+		data: data
 	})
 }
 // 删除数据
@@ -41,10 +41,55 @@ function materialDelete(data : any) {
 	})
 }
 
+// 分页查询物料sku
+function maindataMaterialSku(data : any) {
+	return request({
+		url: '/maindata/maindataMaterialSku/page',
+		method: 'GET',
+		params: data
+	})
+}
+// 新增物料sku
+function addSku(data : any) {
+	return request({
+		url: '/maindata/maindataMaterialSku/save',
+		method: 'POST',
+		params: data
+	})
+}
+// 修改物料sku
+function updateSku(data : any) {
+	return request({
+		url: '/maindata/maindataMaterialSku/update',
+		method: 'POST',
+		params: data
+	})
+}
+// 删除物料sku
+function deleteSku(data : any) {
+	return request({
+		url: '/maindata/maindataMaterialSku/delete',
+		method: 'POST',
+		params: data
+	})
+}
+// 机构商品分类
+function institutionList(data : any) {
+	return request({
+		url: '/maindata/maindataMaterialOrganizationCategory/treeList',
+		method: 'GET',
+		params: data
+	})
+}
 export default {
 	page,
 	single,
 	save,
 	update,
-	materialDelete
+	materialDelete,
+	maindataMaterialSku,
+	addSku,
+	updateSku,
+	deleteSku,
+	institutionList
 }

src/api/materialClass.ts

@@ -1,48 +1,56 @@
 import request from '@/benyun/utils/request'
 
-// 获取物料商品树形分类
+// 获取物料树形分类
 function treeList() {
 	return request({
-		url: '/maindata/maindataMaterialOrganizationCategory/treeList',
-		method: 'GET'
+		url: '/maindata/maindataMaterialCategory/treeList',
+		method: 'GET',
 	})
 }
 // 根据主键id查询物料分类数据
 function searchTreeList(data : any) {
 	return request({
-		url: '/maindata/maindataMaterialOrganizationCategory/treeList/' + data,
-		method: 'GET'
+		url: '/maindata/maindataMaterialCategory/page',
+		method: 'GET',
+		params: data
 	})
 }
-// 新增机构物料分类
+// 新增物料分类
 function saveCategory(data : any) {
 	return request({
-		url: '/maindata/maindataMaterialOrganizationCategory/saveCategory',
+		url: '/maindata/maindataMaterialCategory/saveCategory',
 		method: 'POST',
-		params: data
+		data: data
 	})
 }
-// 修改机构商品分类
+// 修改物料分类
 function updateCategory(data : any) {
 	return request({
-		url: '/maindata/maindataMaterialOrganizationCategory/updateCategory',
-		method: 'PUT',
-		params: data
+		url: '/maindata/maindataMaterialCategory/update',
+		method: 'POST',
+		data: data
 	})
 }
 // 删除数据
 function classDelete(data : any) {
 	return request({
-		url: '/maindata/maindataMaterialOrganizationCategory/delete',
+		url: '/maindata/maindataMaterialCategory/delete',
 		method: 'POST',
 		params: data
 	})
 }
-
+// 根据父ID查询所有子节点列表
+function childrenTreeList(data : any) {
+	return request({
+		url: '/maindata/maindataMaterialCategory/childrenTreeList/id/'+data,
+		method: 'GET'
+	})
+}
 export default {
 	treeList,
 	searchTreeList,
 	saveCategory,
 	updateCategory,
-	classDelete
+	classDelete,
+	childrenTreeList
 }

src/views/audit/Information/index.vue

@@ -1,60 +1,60 @@
 <template>
 	<div class="information">
-		<div style="margin: 0 0 30px 40px;">
-			<by-tool :propConfig="toolConfig" @clickHandle="clickHandle" />
-		</div>
 		<div class="clearfix">
 			<div class="field-box">
 				<div class="left-field">机构名称：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.name}}</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">机构负责人：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.contacts}}</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">供应商id：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.id}}</div>
 			</div>
-			<div class="field-box">
+			<!-- <div class="field-box">
 				<div class="left-field">分销商id：</div>
-				<div class="right-field">123</div>
-			</div>
+				<div class="right-field">{{baseInfo.name}}</div>
+			</div> -->
 			<div class="field-box">
 				<div class="left-field">联系电话：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.phonenum}}</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">手机号码：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.telephone}}</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">电子邮箱：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.email}}</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">类型(字典)：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.type}}</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">状态：</div>
-				<div class="right-field">123</div>
+				<div class="right-field" style="padding: 0 10px 10px;">
+					<el-tag :type="baseInfo.status===0?'primary':'danger'"
+						disable-transitions>{{baseInfo.status===0?'正常':'禁用'}}</el-tag>
+				</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">邮编：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.postcode}}</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">联系地址：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.address}}</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">纳税人识别号：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.taxnum}}</div>
 			</div>
 			<div class="field-box">
 				<div class="left-field">备注：</div>
-				<div class="right-field">123</div>
+				<div class="right-field">{{baseInfo.remark}}</div>
 			</div>
 		</div>
 
@@ -65,49 +65,57 @@
 	import { Component, Vue } from "vue-property-decorator";
 	@Component
 	export default class Information extends Vue {
-		toolConfig = {
-			tools: {
-				add:true,
-				export: true,
-				search: true,
-				refresh: true
-			}
+		baseInfo : any = {}
+		created() {
+			// 生产厂商
+			// this.getRequest('/maindata/maindataMaterialManufacturer/page');
+			// 供应商
+			this.getRequest('/maindata/maindataMaterialSupplier/page');
+			// 分销商
+			// this.getRequest('/maindata/maindataMaterialDistributor/page');
 		}
-		clickHandle(e : string) {
-			console.log(e);
+		getRequest(url : any) {
+			(this as any).$request({
+				url: url,
+				method: 'get'
+			}).then((res : any) => {
+				// console.log(res);
+				if (res.code === 200) {
+					this.baseInfo = res.data.records[0];
+					console.log(this.baseInfo);
+				}
+			})
 		}
 	}
 </script>
 
 <style lang="scss" scoped>
 	.information {
-		padding: 50px 30px 50px 0px;
+		width: 1200px;
+		min-width: 1200px;
+		margin: 100px auto;
 	}
 
 	.field-box {
-		width: 25%;
+		width: 33.3%;
 		float: left;
 		margin-bottom: 60px;
 	}
 
-	.field-box:nth-of-type(4n) {
-		margin-right: 0;
-	}
-
 	.left-field {
 		float: left;
 		width: 120px;
 		text-align: right;
-		line-height: 22px;
+		line-height: 43px;
 		color: #333;
 		// word-wrap: break-word; // 换行
 	}
 
 	.right-field {
 		float: left;
-		width: calc(100% - 120px);
-		line-height: 22px;
+		width: calc(100% - 150px);
 		color: #333;
+		padding: 10px;
 		border-bottom: 1px solid #ddd;
 	}
 </style>

src/views/audit/archivePage/index.vue

@@ -1,290 +0,0 @@
-<template>
-	<div class="my-container">
-		<div class="bill-left">
-			<div class="bill-tab">
-				<div class="title">导航</div>
-				<el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
-			</div>
-
-		</div>
-		<div class="bill-main">
-			<div class="bill-box" :class="{'on-show':showTab == 'bill'}">
-				<moduleView style="padding: 0 16px 16px;" :propConfig="config" @clickHandle="clickHandle" />
-			</div>
-		</div>
-	</div>
-</template>
-<script lang="ts">
-	import { Component, Prop, Vue, Watch } from "vue-property-decorator";
-	import VueViews from '@/benyun/compVue/VueViews'
-	import moduleView from "@/benyun/components/moduleView/moduleView.vue";
-	@Component({ components: { moduleView } })
-	export default class ArchivePage extends VueViews {
-		showTab = "bill"
-		data : any = [{
-			label: '一级 1',
-			id: '1',
-			children: [{
-				label: '二级 1-1',
-				id: '2',
-				children: [{
-					id: '3',
-					label: '三级 1-1-1'
-				}]
-			}]
-		}, {
-			label: '一级 2',
-			id: '2',
-			children: [{
-				label: '二级 2-1',
-				id: '1',
-				children: [{
-					label: '三级 2-1-1',
-					id: '3',
-				}]
-			}, {
-				label: '二级 2-2',
-				id: '1',
-				children: [{
-					label: '三级 2-2-1',
-					id: '3',
-				}]
-			}]
-		}, {
-			label: '一级 3',
-			id: '3',
-			children: [{
-				label: '二级 3-1',
-				id: '2',
-				children: [{
-					label: '三级 3-1-1',
-					id: '1'
-				}]
-			}, {
-				label: '二级 3-2',
-				id: '1',
-				children: [{
-					label: '三级 3-2-1',
-					id: '2'
-				}]
-			}]
-		}]
-		defaultProps : any = {
-			children: 'children',
-			label: 'label'
-		}
-		config : any = {
-			search: {
-				attr: {
-					size: 'mini',
-					rules: {
-						name: [{
-							required: true, message: '请输入名称', trigger: 'blur'
-						}]
-					}
-				},
-				columns: [
-					[{
-						span: 6,
-						label: '创建时间',
-						prop: 'created',
-						component: 'by-date-picker',
-						compConfig: {
-							format: 'yyyy-MM-dd',
-							type: 'datetime'
-						}
-					}]
-				]
-			},
-			tool: {
-				tools: {
-					add: true,
-					edit: true,
-					delete: true,
-					export: true,
-					search: true,
-					refresh: true
-				},
-				audit: {
-					add: 'audit:collaborationLog:add',
-					edit: 'audit:collaborationLog:edit',
-					delete: 'audit:collaborationLog:remove',
-					export: 'audit:collaborationLog:export'
-				}
-			},
-			table: {
-				attr: {
-					size: 'mini',
-					seq: true,
-					align: 'center',
-					checkbox: true
-				},
-				columns: [{
-					title: '创建时间',
-					field: 'created'
-				},
-				{
-					title: '订单号',
-					field: 'order_no'
-				},
-				{
-					title: '订单类型',
-					field: 'order_type'
-				},
-				{
-					title: '操作',
-					action: true,
-					plugins: [{
-						icon: 'el-icon-edit',
-						name: '编辑',
-						audit: '',
-						event: {
-							click: (item : any) => {
-								console.log('该行数据：', item)
-							}
-						}
-					}, {
-						name: '查看',
-						event: {
-							click: (item : any) => {
-								console.log('该行数据：', item);
-								console.log('this:', this)
-							}
-						}
-					}]
-				}]
-			},
-			request: {
-				url: '/system/audit/collaborationLog'
-			}
-		}
-
-		created() {
-
-		}
-		handleNodeClick(e : any) {
-			if (e.id == '1') {
-
-			}
-		}
-		//左侧tab切换
-		tabChange(t : string) {
-			this.showTab = t;
-		}
-		search(v : any, n : string) {
-			this.$emit('search', {
-				type: n,
-				value: v
-			})
-		}
-		clickHandle(e : any, name : any) {
-			console.log(e, name);
-		}
-
-	}
-</script>
-<style>
-	.my-container .vxe-table--render-default.size--mini {
-		height: 630px;
-		overflow-y: auto;
-	}
-	.my-container .by-table .page{
-		padding-top: 20px !important;
-	}
-</style>
-<style lang="scss" scoped>
-	.my-container {
-		width: 100%;
-		box-sizing: border-box;
-		display: flex;
-		padding: 16px;
-
-		.bill-left {
-			position: relative;
-			border-right: solid #EEE 1px;
-			padding-right: 16px;
-			flex-shrink: 0;
-
-			// box-sizing: border-box;
-			.bill-tab {
-				width: 200px;
-				height: 100%;
-				transition: all .5s;
-				overflow: hidden;
-			}
-
-			.title {
-				font-size: 16px;
-				padding-bottom: 16px;
-				width: 200px;
-			}
-
-			.bill-nav {
-				font-size: 14px;
-				height: 30px;
-				line-height: 30px;
-				width: 200px;
-				box-sizing: border-box;
-				padding: 0 8px;
-				cursor: pointer;
-				margin-bottom: 2px;
-				border-radius: 5px;
-			}
-
-			.onBill {
-				background-color: #bde3f7;
-			}
-
-			.bill-nav:hover {
-				background-color: #bde3f7;
-			}
-
-			.close {
-				height: 22px;
-				width: 22px;
-				border-radius: 50%;
-				border: solid #EEE 1px;
-				position: absolute;
-				top: 30px;
-				right: -11px;
-				background-color: #FFF;
-				display: flex;
-				justify-content: center;
-				align-items: center;
-				cursor: pointer;
-			}
-		}
-
-		.bill-main {
-			width: calc(100% - 16px);
-			box-sizing: border-box;
-			margin-left: 16px;
-			position: relative;
-
-			.bill-box {
-				width: 100%;
-				position: absolute;
-				left: 0;
-				top: 0;
-				opacity: 0;
-				z-index: -1;
-				transition: all .5s;
-
-				.bill-tool,
-				.table-tool {
-					width: 100%;
-					padding-bottom: 16px;
-				}
-
-				.form {
-					margin-bottom: 8px;
-				}
-			}
-
-			.on-show {
-				opacity: 1;
-				z-index: 1;
-			}
-		}
-	}
-</style>

src/views/audit/attribute/index.vue

@@ -0,0 +1,365 @@
+<template>
+	<div class="my-container">
+		<div class="bill-left">
+			<div class="bill-tab">
+				<div class="title">导航</div>
+				<el-tree :data="data" :props="props" @node-click="handleNodeClick"></el-tree>
+			</div>
+		</div>
+		<div class="bill-main">
+			<module-view :propConfig="config" ref="moduleView" @pagination="getDataList" @search="getDataList"
+				@resert="getDataList" @clickHandle="clickHandle" />
+		</div>
+	</div>
+</template>
+<script lang="ts">
+	import { Component, Prop, Vue, Watch } from "vue-property-decorator";
+	import api from "@/api/material";
+	import materialClass from "@/api/materialClass";
+	@Component({})
+	export default class Attribute extends Vue {
+		timeNum = 0;
+		timer : any = null
+		data : any = []
+		props = {
+			label: 'name',
+			children: 'children'
+		}
+		config : any = {
+			search: {
+				attr: {
+					size: 'mini'
+				},
+				columns: [
+					[{
+						span: 6,
+						label: '名称',
+						prop: 'name',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入名称',
+								clearable: true
+							},
+							event: {
+								click: (item : any) => {
+									console.log('该行数据：', item)
+								}
+							}
+						},
+					}, {
+						span: 6,
+						label: '简称',
+						prop: 'shortName',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入简称',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '状态',
+						prop: 'status',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入状态',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '备注',
+						prop: 'remark',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入状态',
+								clearable: true
+							}
+						}
+					},
+					]
+				]
+			},
+			tool: {
+				tools: this.getTools()
+			},
+			table: {
+				attr: {
+					size: 'mini',
+					seq: true,
+					align: 'center',
+					checkbox: true,
+					height:600
+				},
+				columns: [{
+					title: '名称',
+					field: 'name',
+					width: 150,
+				}, {
+					title: '简称',
+					field: 'shortName',
+					width: 100
+				}, {
+					title: '财务编号',
+					field: 'accountingCode'
+				}, {
+					title: '国际码',
+					field: 'nsCode'
+				}, {
+					title: '基本售价',
+					field: 'basePrice'
+				}, {
+					title: '市场价格（统一售价）',
+					field: 'markPrice'
+				}, {
+					title: '单位',
+					field: 'unit'
+				}, {
+					title: '重量',
+					field: 'weight'
+				}, {
+					title: '保质期（天）',
+					field: 'shelfLife'
+				}, {
+					title: '库存',
+					field: 'stock'
+				}, {
+					title: '操作',
+					action: true,
+					plugins: [{
+						icon: 'el-icon-edit',
+						name: '编辑',
+						audit: '',
+						event: {
+							click: (item : any) => {
+								console.log('该行数据：', item)
+							}
+						}
+					}, {
+						name: '删除',
+						event: {
+							click: (item : any) => this.onDelete(item)
+						}
+					}]
+				}]
+			},
+		}
+		getTools() {
+			return {
+				add: true,
+				export: true,
+				delete: true,
+				search: true,
+				refresh: true
+			}
+		}
+		created() {
+			this.getTreeList()
+			this.timer = setInterval(() => {
+				this.getDataList()
+			}, 500)
+		}
+		// 获取树型导航数据
+		getTreeList() {
+			materialClass.treeList().then((res : any) => {
+				// console.log(res.data[0]);
+				if (res.code === 200) {
+					this.data = res.data[0].children;
+				} else this.failHandle(res)
+			})
+		}
+		// 获取列表数据
+		getDataList() {
+			if (!this.$refs.moduleView) {
+				if (this.timeNum > 5) {
+					clearInterval(this.timer)
+				}
+				this.timeNum++;
+				return
+			}
+			clearInterval(this.timer)
+			let query = (this.$refs.moduleView as any).getQuery();
+			// console.log(query);
+			api.page(query).then((res : any) => {
+				// console.log(res.data);
+				if (res.code === 200) {
+					(this.$refs.moduleView as any).setTableValue(res.data.records);
+					let page = {
+						pageNo: res.data.current, //当前页
+						pageSize: res.data.size, //每页条数
+						total: res.data.total //总条数
+					};
+					(this.$refs.moduleView as any).setPage(page)
+				} else this.failHandle(res)
+			})
+		}
+		// 工具栏方法
+		clickHandle(e : any) {
+			console.log(e);
+			if (e === 'onRefresh') (this.$refs.moduleView as any).resert();
+			if (e === 'onAdd') this.onAdd();
+			// if (e === 'onDelete') this.onDelete(e);
+			if (e === 'onExport') this.onExport();
+		}
+		// 新增
+		onAdd(){
+			
+			(this as any).$router.push('/materialFile/detail')
+		}
+		// 删除
+		onDelete(item:any){
+			api.materialDelete({
+				ids:item.id
+			}).then((res:any) => {
+				if(res.code===200){
+					this.getDataList();
+					this.$message({
+						type: 'success',
+						message: '删除成功!'
+					});
+				}else this.failHandle(res)
+			})
+		}
+		// 导航切换
+		handleNodeClick(e : any) {
+			api.single({ categoryId: e.id }).then((res : any) => {
+				if (res.code === 200) {
+					(this.$refs.moduleView as any).setTableValue(res.data.records);
+					let page = {
+						pageNo: res.data.current, //当前页
+						pageSize: res.data.size, //每页条数
+						total: res.data.total //总条数
+					};
+					(this.$refs.moduleView as any).setPage(page)
+				}
+			})
+		}
+		//导出
+		onExport() {
+			let urlArr = '/maindata/maindataMaterial';
+			let query = (this.$refs.moduleView as any).getQuery();
+			(this as any).$download(urlArr + '/export', {
+				...query
+			}, urlArr[urlArr.length - 1] + `_${new Date().getTime()}.xlsx`)
+		}
+		// 运行错误
+		failHandle(err : any) {
+			let msg = err.msg ? err.msg : '运行错误！';
+			this.$message.error(msg)
+		}
+
+	}
+</script>
+<style lang="scss" scoped>
+	.my-container {
+		width: 100%;
+		box-sizing: border-box;
+		display: flex;
+		padding: 16px;
+
+		.search-btn {
+			width: 100%;
+			display: flex;
+			justify-content: flex-end;
+			margin-bottom: 20px;
+		}
+
+		.bill-left {
+			position: relative;
+			border-right: solid #EEE 1px;
+			padding-right: 16px;
+			flex-shrink: 0;
+
+			// box-sizing: border-box;
+			.bill-tab {
+				width: 150px;
+				height: 100%;
+				transition: all .5s;
+				overflow: hidden;
+			}
+
+			.title {
+				font-size: 16px;
+				padding-bottom: 16px;
+				width: 200px;
+			}
+
+			.bill-nav {
+				font-size: 14px;
+				height: 30px;
+				line-height: 30px;
+				width: 200px;
+				box-sizing: border-box;
+				padding: 0 8px;
+				cursor: pointer;
+				margin-bottom: 2px;
+				border-radius: 5px;
+			}
+
+			.onBill {
+				background-color: #bde3f7;
+			}
+
+			.bill-nav:hover {
+				background-color: #bde3f7;
+			}
+
+			.close {
+				height: 22px;
+				width: 22px;
+				border-radius: 50%;
+				border: solid #EEE 1px;
+				position: absolute;
+				top: 30px;
+				right: -11px;
+				background-color: #FFF;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				cursor: pointer;
+			}
+		}
+
+		.bill-main {
+			width: calc(100% - 16px);
+			box-sizing: border-box;
+			margin-left: 16px;
+			position: relative;
+
+			.bill-box {
+				width: 100%;
+				position: absolute;
+				left: 0;
+				top: 0;
+				opacity: 0;
+				z-index: -1;
+				transition: all .5s;
+
+				.bill-tool,
+				.table-tool {
+					width: 100%;
+					padding-bottom: 16px;
+				}
+
+				.form {
+					margin-bottom: 8px;
+				}
+			}
+
+			.on-show {
+				opacity: 1;
+				z-index: 1;
+			}
+		}
+	}
+</style>

src/views/audit/brand/index.vue

@@ -0,0 +1,331 @@
+<template>
+	<div class="my-container">
+		<!-- 		<div class="bill-left">
+			<div class="bill-tab">
+				<div class="title">导航</div>
+				<el-tree :data="data" :props="props" @node-click="handleNodeClick"></el-tree>
+			</div>
+		</div> -->
+		<div class="bill-main">
+			<module-view :propConfig="config" ref="moduleView" @pagination="getDataList" @search="getDataList"
+				@resert="getDataList" @clickHandle="clickHandle" />
+		</div>
+	</div>
+</template>
+<script lang="ts">
+	import { Component, Prop, Vue, Watch } from "vue-property-decorator";
+	import api from "@/api/currency";
+	@Component
+	export default class Brand extends Vue {
+		timeNum = 0;
+		timer : any = null
+		data : any = []
+		props = {
+			label: 'name',
+			children: 'children'
+		}
+		config : any = {
+			search: {
+				attr: {
+					size: 'mini'
+				},
+				columns: [
+					[{
+						span: 6,
+						label: '名称',
+						prop: 'name',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入名称',
+								clearable: true
+							},
+						},
+					}, {
+						span: 6,
+						label: '简称',
+						prop: 'shortName',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入简称',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '状态',
+						prop: 'status',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入状态',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '备注',
+						prop: 'remark',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入状态',
+								clearable: true
+							}
+						}
+					},
+					]
+				]
+			},
+			tool: {
+				tools: this.getTools()
+			},
+			table: {
+				attr: {
+					size: 'mini',
+					seq: true,
+					align: 'center',
+					checkbox: true,
+					height: 600
+				},
+				columns: [{
+					title: '名称',
+					field: 'name',
+					width: 150,
+				}, {
+					title: '简称',
+					field: 'shortName',
+					width: 100
+				}, {
+					title: '财务编号',
+					field: 'accountingCode'
+				}, {
+					title: '国际码',
+					field: 'nsCode'
+				}, {
+					title: '基本售价',
+					field: 'basePrice'
+				}, {
+					title: '市场价格（统一售价）',
+					field: 'markPrice'
+				}, {
+					title: '单位',
+					field: 'unit'
+				}, {
+					title: '重量',
+					field: 'weight'
+				}, {
+					title: '保质期（天）',
+					field: 'shelfLife'
+				}, {
+					title: '库存',
+					field: 'stock'
+				}, {
+					title: '操作',
+					action: true,
+					plugins: [{
+						icon: 'el-icon-edit',
+						name: '编辑',
+						audit: '',
+						event: {
+							click: (item : any) => {
+								console.log('该行数据：', item)
+							}
+						}
+					}, {
+						name: '删除',
+						event: {
+							click: (item : any) => this.onDelete(item)
+						}
+					}]
+				}]
+			},
+		}
+		getTools() {
+			return {
+				add: true,
+				export: true,
+				delete: true,
+				search: true,
+				refresh: true
+			}
+		}
+		created() {
+			this.timer = setInterval(() => {
+				this.getDataList()
+			}, 500)
+		}
+		// 获取列表数据
+		getDataList() {
+			if (!this.$refs.moduleView) {
+				if (this.timeNum > 5) {
+					clearInterval(this.timer)
+				}
+				this.timeNum++;
+				return
+			}
+			clearInterval(this.timer)
+			let query = (this.$refs.moduleView as any).getQuery();
+			api.pageList(query, 'maindataMaterialBrand').then((res : any) => {
+				if (res.code === 200) {
+					(this.$refs.moduleView as any).setTableValue(res.data.records);
+					let page = {
+						pageNo: res.data.current, //当前页
+						pageSize: res.data.size, //每页条数
+						total: res.data.total //总条数
+					};
+					(this.$refs.moduleView as any).setPage(page)
+				} else this.failHandle(res)
+			})
+		}
+		// 工具栏方法
+		clickHandle(e : any) {
+			console.log(e);
+			if (e === 'onRefresh') (this.$refs.moduleView as any).resert();
+			if (e === 'onAdd') this.onAdd();
+			// if (e === 'onDelete') this.onDelete(e);
+			if (e === 'onExport') this.onExport();
+		}
+		// 新增
+		onAdd() {
+
+			(this as any).$router.push('/materialFile/detail')
+		}
+		// 删除
+		onDelete(item : any) {
+			api.deleteList({ ids: item.id }, 'maindataMaterialBrand').then((res : any) => {
+				if (res.code === 200) {
+					this.getDataList();
+					this.$message({
+						type: 'success',
+						message: '删除成功!'
+					});
+				} else this.failHandle(res)
+			})
+		}
+		//导出
+		onExport() {
+			let urlArr = '/maindata/maindataMaterial';
+			let query = (this.$refs.moduleView as any).getQuery();
+			(this as any).$download(urlArr + '/export', {
+				...query
+			}, urlArr[urlArr.length - 1] + `_${new Date().getTime()}.xlsx`)
+		}
+		// 运行错误
+		failHandle(err : any) {
+			let msg = err.msg ? err.msg : '运行错误！';
+			this.$message.error(msg)
+		}
+
+	}
+</script>
+<style lang="scss" scoped>
+	.my-container {
+		width: 100%;
+		box-sizing: border-box;
+		display: flex;
+		padding: 16px;
+
+		.search-btn {
+			width: 100%;
+			display: flex;
+			justify-content: flex-end;
+			margin-bottom: 20px;
+		}
+
+		.bill-left {
+			position: relative;
+			border-right: solid #EEE 1px;
+			padding-right: 16px;
+			flex-shrink: 0;
+
+			// box-sizing: border-box;
+			.bill-tab {
+				width: 150px;
+				height: 100%;
+				transition: all .5s;
+				overflow: hidden;
+			}
+
+			.title {
+				font-size: 16px;
+				padding-bottom: 16px;
+				width: 200px;
+			}
+
+			.bill-nav {
+				font-size: 14px;
+				height: 30px;
+				line-height: 30px;
+				width: 200px;
+				box-sizing: border-box;
+				padding: 0 8px;
+				cursor: pointer;
+				margin-bottom: 2px;
+				border-radius: 5px;
+			}
+
+			.onBill {
+				background-color: #bde3f7;
+			}
+
+			.bill-nav:hover {
+				background-color: #bde3f7;
+			}
+
+			.close {
+				height: 22px;
+				width: 22px;
+				border-radius: 50%;
+				border: solid #EEE 1px;
+				position: absolute;
+				top: 30px;
+				right: -11px;
+				background-color: #FFF;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				cursor: pointer;
+			}
+		}
+
+		.bill-main {
+			width: calc(100% - 16px);
+			box-sizing: border-box;
+			margin-left: 16px;
+			position: relative;
+
+			.bill-box {
+				width: 100%;
+				position: absolute;
+				left: 0;
+				top: 0;
+				opacity: 0;
+				z-index: -1;
+				transition: all .5s;
+
+				.bill-tool,
+				.table-tool {
+					width: 100%;
+					padding-bottom: 16px;
+				}
+
+				.form {
+					margin-bottom: 8px;
+				}
+			}
+
+			.on-show {
+				opacity: 1;
+				z-index: 1;
+			}
+		}
+	}
+</style>

src/views/audit/materialAdd/index.vue

@@ -0,0 +1,486 @@
+<template>
+	<div class="detil">
+		<div class="box-shadow">
+			<by-form :propConfig="config" ref="form">
+				<template v-slot:description>
+					<el-input type="textarea" :rows="5" placeholder="请输入内容" v-model="textarea">
+					</el-input>
+				</template>
+				<template v-slot:pic>
+					<el-upload :limit='1' :action="baseURL+'/file/upload'" list-type="picture-card"
+						:on-preview="handlePictureCardPreview" :on-remove="handleRemove">
+						<i class="el-icon-plus"></i>
+					</el-upload>
+				</template>
+				<template v-slot:radio>
+					<el-radio v-model="radio" :label="1">单规格</el-radio>
+					<el-radio v-model="radio" :label="2">多规格</el-radio>
+				</template>
+
+				<template v-slot:status>
+					<el-radio v-model="radioStatus" :label="1">启用</el-radio>
+					<el-radio v-model="radioStatus" :label="2">备用</el-radio>
+					<el-radio v-model="radioStatus" :label="3">禁用</el-radio>
+				</template>
+				<template v-slot:ismakeup>
+					<el-radio v-model="ismakeup" :label="1">是</el-radio>
+					<el-radio v-model="ismakeup" :label="2">否</el-radio>
+				</template>
+				<template v-slot:issued>
+					<el-radio v-model="issued" :label="1">是</el-radio>
+					<el-radio v-model="issued" :label="2">否</el-radio>
+				</template>
+			</by-form>
+			<div style="padding: 0 100px;">
+				<el-button type="primary" @click="doSave">保存</el-button>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script lang="ts">
+	import { Component, Prop, Vue, Watch } from "vue-property-decorator";
+	import api from '@/api/material'
+	// import myInput from './input.vue'
+	@Component
+	export default class DemoForm extends Vue {
+		baseURL : any = process.env.VUE_APP_BASE_API
+		radio : any = 1
+		radioStatus : any = 1
+		ismakeup : any = 1
+		issued : any = 1
+		textarea : any = ''
+		config = {
+			attr: {
+				size: 'small',
+				rules: {
+					name: [{
+						required: true, message: '请输入名称', trigger: 'blur'
+					}],
+					shortName: [{
+						required: true, message: '请输入简称', trigger: 'blur'
+					}]
+				}
+			},
+			columns: [
+				[
+					{
+						span: 6,
+						label: '名称',
+						prop: 'name',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入名称',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '简称',
+						prop: 'shortName',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入简称',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '财务编号',
+						prop: 'accountingCode',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入财务编号',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '国际码',
+						prop: 'nsCode',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入国际码',
+								clearable: true
+							}
+						}
+					},
+				],
+				[
+					{
+						span: 6,
+						label: '基本售价',
+						prop: 'basePrice',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入基本售价',
+								clearable: true
+							}
+						}
+					}, {
+						span: 6,
+						label: '市场价格',
+						prop: 'markPrice',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入市场价格',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '价格',
+						prop: 'price',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入价格(成交、成本价)',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '单位',
+						prop: 'unit',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入单位',
+								clearable: true
+							}
+						}
+					},
+				],
+
+				[
+					{
+						span: 6,
+						label: '重量',
+						prop: 'weight',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入重量',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '保质期(天)',
+						prop: 'shelfLife',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入保质期(天)',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '库存',
+						prop: 'stock',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入库存',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '安全库存',
+						prop: 'warningStock',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入安全库存',
+								clearable: true
+							}
+						}
+					}
+				],
+				[
+					{
+						span: 6,
+						label: '货号',
+						prop: 'itemNumber',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入货号',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '分类id',
+						prop: 'select',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '虚拟分类id',
+						prop: 'select',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '厂家物料id',
+						prop: 'factoryId',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					}
+				],
+				[
+					{
+						span: 6,
+						label: '机构商品分类',
+						prop: 'select',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '物料属性表id',
+						prop: 'select',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					}
+				],
+				[
+					{
+						span: 10,
+						label: '描述',
+						slot: true,
+						prop: 'description',
+					}
+				],
+				[
+					{
+						span: 20,
+						label: '物料封面图',
+						slot: true,
+						prop: 'pic',
+					}
+				],
+				[
+					{
+						span: 20,
+						label: '商品规格',
+						slot: true,
+						prop: 'radio',
+					}
+				],
+				// [
+				// 	{
+				// 		span: 20,
+				// 		component:myInput
+				// 	}
+				// ],
+				[
+					{
+						span: 20,
+						label: '物料状态',
+						slot: true,
+						prop: 'status',
+					}
+				],
+				[
+					{
+						span: 20,
+						label: '是否组合商品',
+						slot: true,
+						prop: 'ismakeup',
+					}
+				],
+				[
+					{
+						span: 20,
+						label: '是否公布',
+						slot: true,
+						prop: 'issued',
+					}
+				],
+			],
+		}
+		created() {
+			// 获取机构商品分类
+			api.institutionList({}).then((res : any) => {
+				console.log('机构商品分类 ==> ', res);
+			})
+		}
+		handleRemove(file : any, fileList : any) {
+			console.log(file, fileList);
+		}
+		handlePictureCardPreview(file : any) {
+			console.log(file);
+		}
+		doSave() {
+			this.getFormData()
+		}
+		getFormData() {
+			let data : any = (this as any).$refs.form.getValue();
+			data.description = this.textarea;
+			data.pic = '';
+			data.status = this.radioStatus;
+			data.ismakeup = this.ismakeup;
+			data.issued = this.issued;
+			console.log('表单数据：', data);
+			api.save(data).then((res : any) => {
+				console.log(res);
+				if (res.code === 200) {
+					(this as any).$tab.closeOpenPage('/materialFile/productManagement')
+					this.$message({ type: 'success', message: res.msg })
+				}
+			})
+		}
+
+		getFormVali() {
+			(this as any).$refs.form.validate().then(() => {
+				console.log('验证通过')
+			}).catch(() => {
+				console.log('验证不通过')
+			});
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.detil {
+		padding: 20px;
+
+		.box-shadow {
+			box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
+			padding: 20px;
+			border-radius: 4px;
+			border: 1px solid #e6ebf5;
+			background-color: #fff;
+			overflow: hidden;
+			color: #303133;
+			-webkit-transition: .3s;
+			transition: .3s;
+		}
+	}
+</style>

src/views/audit/materialAdd/input.vue

@@ -0,0 +1,67 @@
+<template>
+  <div>
+		<by-table :propConfig="config" ref="table"></by-table>
+	</div>
+</template>
+
+<script lang="ts">
+	import { Component, Prop, Vue} from "vue-property-decorator";
+	
+	@Component
+	export default class Input extends Vue {
+		@Prop()
+		propValue:any
+		config:any={
+		  attr:{
+		    size:'mini',
+		    height:240,
+		    seq:true,
+		    align:'center',
+		    checkbox:true
+		  },
+		  columns:[{
+		    title:'id',
+		    field:'id',
+		    width:50
+		  },
+		  {
+		    title:'姓名',
+		    field:'name',
+		    isDetail:true,
+		    width:100
+		  },
+		  {
+		    title:'日期',
+		    field:'time'
+		  },
+		  {
+		    title:'插槽',
+		    field:'slotField',
+		    slot:true
+		  },
+		  {
+		    title:'操作',
+		    action:true,
+		    plugins:[{
+		      icon:'el-icon-edit',
+		      name:'编辑',
+		      audit:'',
+		      event:{
+		        click:(item:any) => {
+		          console.log('该行数据：',item)
+		        }
+		      }
+		    },{
+		      name:'查看',
+		      event:{
+		        click:(item:any) => {
+		          console.log('该行数据：',item)
+		          console.log('this:',this)
+		        }
+		      }
+		    }]
+		  }]
+		}
+		
+	}
+</script>

src/views/audit/materialEdit/index.vue

@@ -0,0 +1,473 @@
+<template>
+	<div class="detil">
+		<div class="box-shadow">
+			<by-form :propConfig="config" ref="form">
+				<template v-slot:description="option">
+					<el-input type="textarea" :rows="5" placeholder="请输入内容" v-model="textarea">
+					</el-input>
+				</template>
+				<template v-slot:pic="option">
+					<el-upload :limit='1' :action="baseURL+'/file/upload'" list-type="picture-card"
+						:on-preview="handlePictureCardPreview" :on-remove="handleRemove">
+						<i class="el-icon-plus"></i>
+					</el-upload>
+				</template>
+				<template v-slot:radio="option">
+					<el-radio v-model="radio" :label="1">单规格</el-radio>
+					<el-radio v-model="radio" :label="2">多规格</el-radio>
+				</template>
+				<template v-slot:status="option">
+					<el-radio v-model="radioStatus" :label="1">启用</el-radio>
+					<el-radio v-model="radioStatus" :label="2">备用</el-radio>
+					<el-radio v-model="radioStatus" :label="3">禁用</el-radio>
+				</template>
+				<template v-slot:ismakeup="option">
+					<el-radio v-model="ismakeup" :label="1">是</el-radio>
+					<el-radio v-model="ismakeup" :label="2">否</el-radio>
+				</template>
+				<template v-slot:issued="option">
+					<el-radio v-model="issued" :label="1">是</el-radio>
+					<el-radio v-model="issued" :label="2">否</el-radio>
+				</template>
+			</by-form>
+			<div style="padding: 0 100px;">
+				<el-button type="primary" @click="getFormData">保存</el-button>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script lang="ts">
+	import { Component, Prop, Vue, Watch } from "vue-property-decorator";
+	import api from "@/api/material";
+	@Component
+	export default class MaterialEdit extends Vue {
+		baseURL : any = process.env.VUE_APP_BASE_API
+		radio : any = 1
+		radioStatus : any = 1
+		ismakeup : any = 1
+		issued : any = 1
+		textarea : any = ''
+		config = {
+			attr: {
+				size: 'small',
+				height: 720,
+				rules: {
+					name: [{
+						required: true, message: '请输入名称', trigger: 'blur'
+					}],
+					shortName: [{
+						required: true, message: '请输入简称', trigger: 'blur'
+					}]
+				}
+			},
+			columns: [
+				[
+					{
+						span: 6,
+						label: '名称',
+						prop: 'name',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入名称',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '简称',
+						prop: 'shortName',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入简称',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '财务编号',
+						prop: 'accountingCode',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入财务编号',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '国际码',
+						prop: 'nsCode',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入国际码',
+								clearable: true
+							}
+						}
+					},
+				],
+				[
+					{
+						span: 6,
+						label: '基本售价',
+						prop: 'basePrice',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入基本售价',
+								clearable: true
+							}
+						}
+					}, {
+						span: 6,
+						label: '市场价格',
+						prop: 'markPrice',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入市场价格',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '价格',
+						prop: 'price',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入价格(成交、成本价)',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '单位',
+						prop: 'unit',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入单位',
+								clearable: true
+							}
+						}
+					},
+				],
+
+				[
+					{
+						span: 6,
+						label: '重量',
+						prop: 'weight',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入重量',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '保质期(天)',
+						prop: 'shelfLife',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入保质期(天)',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '库存',
+						prop: 'stock',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入库存',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '安全库存',
+						prop: 'warningStock',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入安全库存',
+								clearable: true
+							}
+						}
+					}
+				],
+				[
+					{
+						span: 6,
+						label: '货号',
+						prop: 'itemNumber',
+						component: 'by-input',
+						compConfig: {
+							attr: {
+								placeholder: '请输入货号',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '分类id',
+						prop: 'select',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '虚拟分类id',
+						prop: 'select',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '厂家物料id',
+						prop: 'factoryId',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					}
+				],
+				[
+					{
+						span: 6,
+						label: '机构商品分类',
+						prop: 'select',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					},
+				],
+				[
+					{
+						span: 6,
+						label: '物料属性表id',
+						prop: 'select',
+						component: 'by-select',
+						compConfig: {
+							attr: {
+								placeholder: '请选择数据',
+								clearable: true,
+								data: [{
+									value: '选项1',
+									label: '黄金糕'
+								}, {
+									value: '选项2',
+									label: '双皮奶'
+								}, {
+									value: '选项3',
+									label: '蚵仔煎'
+								}, {
+									value: '选项4',
+									label: '龙须面'
+								}, {
+									value: '选项5',
+									label: '北京烤鸭'
+								}]
+							}
+						}
+					}
+				],
+				[
+					{
+						span: 10,
+						label: '描述',
+						slot: true,
+						prop: 'description',
+					}
+				],
+				[
+					{
+						span: 20,
+						label: '物料封面图',
+						slot: true,
+						prop: 'pic',
+					}
+				],
+				[
+					{
+						span: 20,
+						label: '商品规格',
+						slot: true,
+						prop: 'radio',
+					}
+				],
+				[
+					{
+						span: 20,
+						label: '物料状态',
+						slot: true,
+						prop: 'status',
+					}
+				],
+				[
+					{
+						span: 20,
+						label: '是否组合商品',
+						slot: true,
+						prop: 'ismakeup',
+					}
+				],
+				[
+					{
+						span: 20,
+						label: '是否公布',
+						slot: true,
+						prop: 'issued',
+					}
+				],
+			],
+		}
+		created() {
+			setTimeout(() => {
+				if (this.$route.params) (this as any).$refs.form.setValue(this.$route.params.baseInfo)
+			}, 300)
+		}
+		getMaterialData(e : any) {
+			console.log(e);
+		}
+		handleRemove(file : any, fileList : any) {
+			console.log(file, fileList);
+		}
+		handlePictureCardPreview(file : any) {
+			console.log(file);
+		}
+		getFormData() {
+			let data = (this as any).$refs.form.getValue();
+			api.update(data).then((res : any) => {
+				if (res.code === 200) {
+					(this as any).$tab.closeOpenPage('/materialFile/productManagement')
+					this.$message({ type: 'success', message: res.msg })
+				}
+			})
+		}
+
+		getFormVali() {
+			(this as any).$refs.form.validate().then(() => {
+				console.log('验证通过')
+			}).catch(() => {
+				console.log('验证不通过')
+			});
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.detil {
+		padding: 20px;
+
+		.box-shadow {
+			box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
+			padding: 20px;
+			border-radius: 4px;
+			border: 1px solid #e6ebf5;
+			background-color: #fff;
+			overflow: hidden;
+			color: #303133;
+			-webkit-transition: .3s;
+			transition: .3s;
+		}
+	}
+</style>

src/views/audit/orderTask/index.vue

@@ -1,11 +1,220 @@
 <template>
 	<div>
-		123
+		<by-bill :propConfig="config" @search="search" @onSmt="onSmt" ref="bill" @onAdd="onAdd">
+			<template v-slot:cus>我是插槽</template>
+		</by-bill>
+		<div style="clear: both;"></div>
+		<div>
+			<el-button type="primary" plain @click="setSmtValue">设置已提交数据</el-button><br />
+			<el-button type="primary" plain @click="setdraftsBoxValue">设置草稿箱数据</el-button>
+		</div>
+
 	</div>
 </template>
 
-<script>
-</script>
+<script lang="ts">
+	import { Component, Prop, Vue, Watch } from "vue-property-decorator";
+	@Component
+	export default class BillDemo extends Vue {
+		config : any = {
+			bill: {
+				tool: {
+					tools: {
+						add: true,
+						edit: true
+					}
+				},
+				form: {
+					attr: {
+						size: 'small'
+					},
+					columns: [
+						[{
+							span: 6,
+							label: '创建时间',
+							prop: 'created',
+							component: 'by-date-picker',
+							compConfig: {
+								format: 'yyyy-MM-dd HH:mm:ss',
+								type: 'datetime'
+							}
+						}]
+					]
+				},
+				tableTool: {
+					tools: {
+						add: true
+					}
+				},
+				table: {
+					attr: {
+						size: 'mini',
+						height: 240,
+						seq: true,
+						align: 'center',
+						checkbox: true
+					},
+					columns: [{
+						title: 'id',
+						field: 'id',
+						width: 50
+					},
+					{
+						title: '姓名',
+						field: 'name',
+						width: 100
+					}, {
+						title: '操作',
+						action: true,
+						plugins: [{
+							icon: 'el-icon-edit',
+							name: '编辑',
+							audit: '',
+							event: {
+								click: (item : any) => {
+									console.log('该行数据：', item)
+								}
+							}
+						}]
+					}]
+				}
+			},
+			smt: {
+				search: {
+					attr: {
+						size: 'mini',
+						rules: {
+							name: [{
+								required: true, message: '请输入名称', trigger: 'blur'
+							}]
+						}
+					},
+					columns: [
+						[{
+							span: 6,
+							label: '创建时间',
+							prop: 'created',
+							component: 'by-date-picker',
+							compConfig: {
+								format: 'yyyy-MM-dd',
+								type: 'datetime'
+							}
+						}]
+					]
+				},
+				tool: {
+					tools: {
+						smt: true,
+						export: true,
+						search: true,
+						refresh: true
+					}
+				},
+				table: {
+					attr: {
+						size: 'mini',
+						seq: true,
+						align: 'center',
+						checkbox: true
+					},
+					columns: [{
+						title: 'id',
+						field: 'id',
+						width: 50
+					},
+					{
+						title: '姓名',
+						field: 'name',
+						width: 100
+					},
+					{
+						title: '日期',
+						field: 'time',
+						// width:200
+					}]
+				}
+			},
+			draftsBox: {
+				search: {
+					attr: {
+						size: 'mini',
+						rules: {
+							name: [{
+								required: true, message: '请输入名称', trigger: 'blur'
+							}]
+						}
+					},
+					columns: [
+						[{
+							span: 6,
+							label: '名称',
+							prop: 'name',
+							component: 'by-input'
+						}]
+					]
+				},
+				tool: {
+					tools: {
+						smt: true,
+						export: true,
+						search: true,
+						refresh: true
+					}
+				},
+				table: {
+					attr: {
+						size: 'mini',
+						seq: true,
+						align: 'center',
+						checkbox: true
+					},
+					columns: [
+						{
+							title: '姓名',
+							field: 'name',
+							width: 100
+						},
+						{
+							title: '日期',
+							field: 'time',
+							// width:200
+						}]
+				}
+			},
+
+		}
 
-<style>
-</style>
+		search(parames : any) {
+			console.log('搜索回传参数', parames);
+		}
+		onSmt(n : string) {
+			console.log(n + ':工具栏执行操作onSmt')
+		}
+		onAdd(n : string) {
+			console.log(n);
+		}
+		setSmtValue() {
+			let data : Array<any> = [{
+				id: 1,
+				name: '张三',
+				time: '2023-02-02'
+			}, {
+				id: 2,
+				name: '李四',
+				time: '2023-02-02'
+			}];
+			console.log(data);
+			(this.$refs.bill as any).setTabTableValue('smt', data);
+		}
+		setdraftsBoxValue() {
+			let data : Array<any> = [{
+				name: '王五',
+				time: '2023-02-02'
+			}, {
+				name: '赵六',
+				time: '2023-02-02'
+			}];
+			(this.$refs.bill as any).setTabTableValue('draftsBox', data);
+		}
+	}
+</script>

src/views/audit/productClassification/index.vue

@@ -1,5 +1,11 @@
 <template>
 	<div class="my-container">
+		<div class="bill-left">
+			<div class="bill-tab">
+				<div class="title">导航</div>
+				<el-tree :data="data" :props="props" @node-click="handleNodeClick"></el-tree>
+			</div>
+		</div>
 		<div class="bill-main">
 			<div v-show="!hideSearch">
 				<by-form :propConfig="config" ref="formId" />
@@ -12,30 +18,35 @@
 			<el-table :data="tableData" v-loading="loading" style="width: 100%;margin: 20px 0;" :show-overflow-tooltip="true"
 				row-key="id" ref="tableId" :tree-props="{children: 'children'}" @cell-click="doClick">
 				<!-- <el-table-column type="selection" width="55" /> -->
-				<el-table-column prop="name" label="类别名称" width="200" />
-				<el-table-column prop="shortName" label="类别简称" width="200" />
-				<el-table-column prop="status" label="状态" />
+				<el-table-column prop="name" label="名称" width="200" @click="clickMy" />
+				<el-table-column prop="shortName" label="简称" width="200" />
+				<el-table-column prop="status" label="状态">
+					<template slot-scope="scope">
+						<el-tag :type="scope.row.status===0?'primary':'danger'"
+							disable-transitions>{{scope.row.status===0?'正常':'禁用'}}</el-tag>
+					</template>
+				</el-table-column>
 				<el-table-column prop="remark" label="备注" />
 				<el-table-column label="操作" width="100" style="text-align: center;">
-					<template slot-scope="scope">
+					<template>
 						<el-button type="text" size="small" icon="el-icon-edit" @click="dialogEdit">编辑</el-button>
 						<el-button type="text" size="small" @click="doDelete">删除</el-button>
 					</template>
 				</el-table-column>
 			</el-table>
 			<!-- 新增/编辑弹窗 -->
-			<el-dialog :title="title" :visible.sync="dialogFormVisible" width="30%">
+			<el-dialog :title="title+'分类'" :visible.sync="dialogFormVisible" width="30%">
 				<by-form :propConfig="addConfig" ref="addFormId" style="height:250px;">
 					<!-- 					<template v-slot:uploadImg>
 						<div class="upload-img">+</div>
 					</template> -->
 					<template v-slot:status class="clearfix">
-						<el-radio class="fl" style="margin-top: 8px;" v-model="radio" label="1">显示</el-radio>
-						<el-radio class="fl" style="margin-top: 8px;" v-model="radio" label="0">隐藏</el-radio>
+						<el-radio class="fl" style="margin-top: 8px;" v-model="radio" label="0">显示</el-radio>
+						<el-radio class="fl" style="margin-top: 8px;" v-model="radio" label="1">禁用</el-radio>
 					</template>
 					<template v-slot:category>
 						<el-cascader style="width: 100%;" v-model="cascaderValue" :options="options" :props="props"
-							:show-all-levels="false" clearable />
+							:show-all-levels="false" clearable @change="getChange" />
 					</template>
 				</by-form>
 
@@ -49,19 +60,20 @@
 </template>
 <script lang="ts">
 	import { Component, Prop, Vue, Watch } from "vue-property-decorator";
-	import VueViews from '@/benyun/compVue/VueViews'
 	import api from "@/api/materialClass";
 	@Component({})
-	export default class ProductClassification extends VueViews {
+	export default class ProductClassification extends Vue {
 		hideSearch = false
-		title = '新增分类'
+		title = '新增'
 		loading : boolean = true
 		dialogFormVisible : boolean = false
-		cascaderValue = ''
-		radio = '1'
+		cellsData : any = ''
+		cascaderValue : any = ''
+		radio = '0'
+		data : any = []
 		props = {
 			label: 'name',
-			value: 'name',
+			value: 'id',
 			children: 'children',
 			checkStrictly: true
 		}
@@ -87,95 +99,127 @@
 			columns: [
 				[{
 					span: 6,
-					label: '类别名称',
+					label: '名称',
 					prop: 'name',
 					component: 'by-input',
 					labelWidth: '70px',
 					compConfig: {
 						attr: {
-							placeholder: '请输入类别名称',
+							placeholder: '请输入名称',
 							clearable: true
 						}
-					}
+					},
 				}, {
 					span: 6,
-					label: '类别简称',
+					label: '简称',
 					prop: 'shortName',
 					component: 'by-input',
 					labelWidth: '70px',
 					compConfig: {
 						attr: {
-							placeholder: '请输入类别简称',
+							placeholder: '请输入简称',
 							clearable: true
 						}
 					}
-				}]
-			]
-		}
-		addConfig = {
-			attr: {
-				size: 'small',
-				height: 60
-			},
-			columns: [
-				[{
-					span: 20,
-					label: '分类名称',
-					prop: 'name',
-					component: 'by-input',
-					labelWidth: '80px',
 				},
 				{
-					span: 20,
-					label: '类别简称',
-					prop: 'shortName',
-					component: 'by-input',
-					labelWidth: '80px',
-				},
-				{
-					span: 30,
+					span: 6,
 					label: '状态',
-					slot: true,
 					prop: 'status',
+					component: 'by-input',
+					labelWidth: '70px',
+					compConfig: {
+						attr: {
+							placeholder: '请输入状态',
+							clearable: true
+						}
+					}
 				},
-				// {
-				// 	span: 10,
-				// 	label: '分类图片',
-				// 	slot: true,
-				// 	prop: 'uploadImg',
-				// }, 
 				{
-					span: 20,
+					span: 6,
 					label: '备注',
 					prop: 'remark',
 					component: 'by-input',
-					labelWidth: '80px',
+					labelWidth: '70px',
+					compConfig: {
+						attr: {
+							placeholder: '请输入状态',
+							clearable: true
+						}
+					}
 				},
-				{
-					span: 20,
-					label: '上级分类',
-					slot: true,
-					prop: 'category',
-				},]
+				]
+			]
+		}
+		addConfig = {
+			attr: {
+				size: 'small',
+				height: 60
+			},
+			columns: [
+				[
+					{
+						labelWidth: '80px',
+						span: 20,
+						label: '上级分类',
+						slot: true,
+						prop: 'category',
+					},
+					{
+						span: 20,
+						label: '分类名称',
+						prop: 'name',
+						component: 'by-input',
+						labelWidth: '80px',
+					},
+					{
+						span: 20,
+						label: '简称',
+						prop: 'shortName',
+						component: 'by-input',
+						labelWidth: '80px',
+					},
+					{
+						span: 20,
+						label: '显示状态',
+						slot: true,
+						prop: 'status',
+					},
+					{
+						span: 20,
+						label: '备注',
+						prop: 'remark',
+						component: 'by-input',
+						labelWidth: '80px',
+					},]
 			]
 		}
 		created() {
 			this.getDataList()
 		}
+		clickMy(e:any){
+			console.log(e);
+		}
 		// 获取列表数据
 		getDataList() {
 			api.treeList().then((res : any) => {
 				// console.log(res.data[0]);
 				if (res.code === 200) {
 					this.tableData = res.data[0].children;
-					this.options = res.data;
+					this.data = res.data[0].children;
+					let arr : any = [{
+						name: '顶级',
+						id: 0,
+						children: res.data
+					}]
+					this.options = arr;
 					this.loading = false;
 				} else this.failHandle(res)
 			})
 		}
 		// 工具栏方法
 		clickHandle(e : any) {
-			console.log(e)
+			console.log('工具栏方法 ==> ', e);
 			if (e === 'toggleSearch') this.toggleSearch();
 			if (e === 'onRefresh') this.onRefresh();
 			if (e === 'onExport') this.onExport();
@@ -183,71 +227,126 @@
 		}
 		// 单元格点击
 		doClick(e : any) {
-			console.log(e);
-			(this as any).$refs.addFormId.setValue(e)
-		}
-		handleNodeClick(e : any) {
-			console.log(e.id);
+			console.log('单元格点击 ==> ', e);
+			this.cellsData = e;
+			this.radio = e.status.toString();
+			if ((this as any).$refs.addFormId) (this as any).$refs.addFormId.setValue(e);
 		}
 		// 新增
 		onAdd() {
-			this.title = '新增分类';
-			this.dialogFormVisible = true;
+			this.title = '新增';
+			this.radio = '0';
+			this.cascaderValue = [0];
+			setTimeout(() => {
+				if ((this as any).$refs.addFormId) (this as any).$refs.addFormId.setValue({});
+				this.dialogFormVisible = true;
+			}, 0)
 		}
 		// 编辑
 		dialogEdit() {
-			this.title = '编辑分类';
+			this.title = '编辑';
+			this.cascaderValue = [0];
 			this.dialogFormVisible = true;
 		}
+		// 获取选择节点
+		getChange(e : any) {
+			console.log('获取选择节点 ==> ', e);
+			// this.cascaderValue = e;
+		}
 		// 确认新增/编辑
 		confirm() {
 			let query = (this as any).$refs.addFormId.getValue();
-			if (!this.cascaderValue[this.cascaderValue.length - 1]) return this.$message({
+			let pareteId : any = this.cascaderValue[this.cascaderValue.length - 1];
+			if (pareteId !== 0) if (!this.cascaderValue[this.cascaderValue.length - 1]) return this.$message({
 				type: 'error',
 				message: '请输入完整字段'
 			})
 			if (query.name?.length > 0 && query.shortName?.length > 0 && query.remark?.length > 0) {
-				console.log(this.cascaderValue[this.cascaderValue.length - 1], this.radio);
+				// console.log(pareteId, this.radio);
 				this.dialogFormVisible = false;
-				this.$message({
-					type: 'success',
-					message: '编辑成功!'
-				});
+				if (this.title === '新增') {
+					api.saveCategory({
+						name: query.name,
+						shortName: query.shortName,
+						status: this.radio,
+						remark: query.remark,
+						parentId: pareteId// 父级id
+					}).then((res : any) => {
+						if (res.code === 200) {
+							this.$message({
+								type: 'success',
+								message: this.title + '成功!'
+							});
+							this.getDataList();
+						} else this.failHandle(res)
+					})
+				} else if (this.title === '编辑') {
+					api.updateCategory({
+						id: this.cellsData.id,
+						name: query.name,
+						shortName: query.shortName,
+						status: this.radio,
+						remark: query.remark,
+						parentId: pareteId // 父级id
+					}).then((res : any) => {
+						if (res.code === 200) {
+							this.$message({
+								type: 'success',
+								message: this.title + '成功!'
+							});
+							this.getDataList();
+						} else this.failHandle(res)
+					})
+				}
+
 			} else this.$message({
 				type: 'error',
 				message: '请输入完整字段'
 			})
 		}
-		// 搜索
-		searchHandle() {
-			this.loading = true;
-			let query : any = (this.$refs.formId as any).getValue();
-			if(!query.name) return this.getDataList();
-			api.searchTreeList(query.name || query.shortName).then((res : any) => {
-				if (res.code === 200) {
-					this.tableData = res.data
-					this.loading = false;
-				};
-			})
-		}
+
 		// 删除
 		doDelete() {
-			this.$confirm('确定删除吗,如果存在下级节点则一并删除，此操作不能撤销！', '提示', {
-				confirmButtonText: '确定',
-				cancelButtonText: '取消',
-				type: 'warning',
-				center: true
-			}).then(() => {
-				this.$message({
-					type: 'success',
-					message: '删除成功!'
+			setTimeout(() => {
+				if (this.cellsData.children.length > 0) return this.$message({
+					type: 'error',
+					message: '此节点还有子集，不能做此操作'
 				});
-			}).catch(() => {
-				this.$message({
-					type: 'info',
-					message: '已取消删除'
+				this.$confirm('确定删除吗,此操作不能撤销！', '提示', {
+					confirmButtonText: '确定',
+					cancelButtonText: '取消',
+					type: 'warning',
+					center: true
+				}).then(() => {
+					api.classDelete({
+						ids: this.cellsData.id
+					}).then((res : any) => {
+						if (res.code === 200) {
+							this.getDataList();
+							this.$message({
+								type: 'success',
+								message: '删除成功!'
+							});
+						}
+					})
+				}).catch(() => {
+					this.$message({
+						type: 'info',
+						message: '已取消删除'
+					});
 				});
-			});
+			}, 0)
+		}
+		// 导航切换
+		handleNodeClick(e : any) {
+			console.log('导航切换id ==> ',e.id);
+			this.loading = true;
+			api.childrenTreeList(e.id).then((res : any) => {
+				if (res.code === 200) {
+					this.tableData = res.data;
+					this.loading = false;
+				}
+			})
 		}
 		//重置
 		resertHandle() {
@@ -259,10 +358,23 @@
 		//刷新
 		onRefresh() {
 			this.loading = true;
-			(this.$refs.formId as any).setValue({});
+			// (this.$refs.formId as any).setValue({});
 			// (this.$refs.tableId as any).setPage({ pageNo: 1, total: 0 });
 			this.getDataList();
 		}
+		// 搜索
+		searchHandle() {
+			this.loading = true;
+			let query : any = (this.$refs.formId as any).getValue();
+			if (!query.name) return this.getDataList();
+			api.searchTreeList({ name: query.name || query.shortName }).then((res : any) => {
+				if (res.code === 200) {
+					this.tableData = [];
+					this.tableData = res.data.records;
+					this.loading = false;
+				};
+			})
+		}
 		//获取查询值
 		getQuery() {
 			let query : any = (this.$refs.formId as any).getValue();
@@ -301,7 +413,7 @@
 			margin-right: 20px;
 		}
 
-		.el-table__cell {
+		.has-gutter .is-leaf.el-table__cell:nth-of-type(5) {
 			text-align: center;
 		}
 
@@ -325,6 +437,62 @@
 		display: flex;
 		padding: 16px;
 
+		.bill-left {
+			position: relative;
+			border-right: solid #EEE 1px;
+			padding-right: 16px;
+			flex-shrink: 0;
+
+			// box-sizing: border-box;
+			.bill-tab {
+				width: 150px;
+				height: 100%;
+				transition: all .5s;
+				overflow: hidden;
+			}
+
+			.title {
+				font-size: 16px;
+				padding-bottom: 16px;
+				width: 200px;
+			}
+
+			.bill-nav {
+				font-size: 14px;
+				height: 30px;
+				line-height: 30px;
+				width: 200px;
+				box-sizing: border-box;
+				padding: 0 8px;
+				cursor: pointer;
+				margin-bottom: 2px;
+				border-radius: 5px;
+			}
+
+			.onBill {
+				background-color: #bde3f7;
+			}
+
+			.bill-nav:hover {
+				background-color: #bde3f7;
+			}
+
+			.close {
+				height: 22px;
+				width: 22px;
+				border-radius: 50%;
+				border: solid #EEE 1px;
+				position: absolute;
+				top: 30px;
+				right: -11px;
+				background-color: #FFF;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				cursor: pointer;
+			}
+		}
+
 		.bill-main {
 			width: calc(100% - 16px);
 			box-sizing: border-box;

src/views/audit/productManagement/index.vue

@@ -7,101 +7,217 @@
 			</div>
 		</div>
 		<div class="bill-main">
-			<div v-show="!hideSearch">
-				<by-form :propConfig="config" ref="formId" />
-				<div class="search-btn">
-					<el-button type="primary" size="mini" icon="el-icon-search" @click="searchHandle">搜索</el-button>
-					<el-button size="mini" icon="el-icon-refresh" @click="resertHandle">重置</el-button>
-				</div>
-			</div>
-			<by-tool :propConfig="toolConfig" ref="toolId" @clickHandle="clickHandle" />
-			<el-table :data="tableData" v-loading="loading" style="width: 100%;margin: 20px 0;" :show-overflow-tooltip="true"
-				row-key="id" ref="tableId" :tree-props="{children: 'children'}">
-				<el-table-column type="selection" width="55" />
-				<el-table-column prop="name" label="名称" />
-				<el-table-column prop="shortName" label="简称" />
-				<el-table-column prop="pic" label="物料封面图" />
-				<!-- <img :src="tableData.pic" alt=""> -->
-				</el-table-column>
-				<!-- <el-table-column prop="accountingCode" label="财务编号" /> -->
-				<!-- <el-table-column prop="nsCode" label="国标码" /> -->
-				<el-table-column prop="basePrice" label="基本售价" />
-				<el-table-column prop="markPrice" label="市场价格" />
-				<el-table-column prop="price" label="价格" />
-				<el-table-column prop="unit" label="单位" />
-				<el-table-column prop="weight" label="重量" />
-				<el-table-column prop="status" label="状态" />
-				<el-table-column prop="remark" label="备注" />
-				<el-table-column fixed="right" label="操作" width="100">
-					<template slot-scope="scope">
-						<el-button type="text" size="small" icon="el-icon-edit">查看</el-button>
-						<el-button type="text" size="small">删除</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
+			<module-view :propConfig="config" ref="moduleView" @pagination="getDataList" @search="getDataList"
+				@resert="getDataList" @clickHandle="clickHandle" />
 		</div>
 	</div>
 </template>
 <script lang="ts">
 	import { Component, Prop, Vue, Watch } from "vue-property-decorator";
-	import VueViews from '@/benyun/compVue/VueViews'
 	import api from "@/api/material";
 	import materialClass from "@/api/materialClass";
 	@Component({})
-	export default class productManagement extends VueViews {
+	export default class productManagement extends Vue {
+		timeNum = 0;
+		timer : any = null
 		data : any = []
-		pageNo : number = 1
-		pageSize : number = 1
-		loading : boolean = true
-		defaultProps : any = {
-			children: 'children',
-			label: 'label'
+		props = {
+			label: 'name',
+			children: 'children'
 		}
-
-		hideSearch = false
-		toolConfig = {
-			tools: {
-				add: true,
-				delete: true,
-				export: true,
-				search: true,
-				refresh: true
+		config : any = {
+			search: {
+				attr: {
+					size: 'mini'
+				},
+				columns: [
+					[{
+						span: 6,
+						label: '名称',
+						prop: 'name',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入名称',
+								clearable: true
+							}
+						},
+					}, {
+						span: 6,
+						label: '简称',
+						prop: 'shortName',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入简称',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '财务编号',
+						prop: 'accountingCode',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入财务编号',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '国际码',
+						prop: 'nsCode',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入国际码',
+								clearable: true
+							}
+						}
+					},
+					],
+					[{
+						span: 6,
+						label: '基本售价',
+						prop: 'basePrice',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入基本售价',
+								clearable: true
+							}
+						},
+					}, {
+						span: 6,
+						label: '价格',
+						prop: 'price',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入价格(成交、成本价)',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '保质期',
+						prop: 'shelfLife',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入保质期',
+								clearable: true
+							}
+						}
+					},
+					{
+						span: 6,
+						label: '库存',
+						prop: 'stock',
+						component: 'by-input',
+						labelWidth: '70px',
+						compConfig: {
+							attr: {
+								placeholder: '请输入库存',
+								clearable: true
+							}
+						}
+					},
+					]
+				]
 			},
-			audit: {
-				add: 'audit:collaborationLog:add',
-				delete: 'audit:collaborationLog:remove',
-				export: 'audit:collaborationLog:export'
-			}
-		}
-		config = {
-			attr: {
-				size: 'small',
-				height: 40
+			tool: {
+				tools: this.getTools()
 			},
-			columns: [
-				[{
-					span: 6,
-					label: '名称',
-					prop: 'name',
-					component: 'by-input',
-					labelWidth: '70px',
-					compConfig: {
-						attr: {
-							placeholder: '请输入名称',
-							clearable: true
+			table: {
+				attr: {
+					size: 'mini',
+					seq: true,
+					align: 'center',
+					checkbox: true,
+					height: 560,
+				},
+				columns: [{
+					title: '名称',
+					field: 'name'
+				}, {
+					title: '简称',
+					field: 'shortName'
+				}, {
+					title: '财务编号',
+					field: 'accountingCode'
+				}, {
+					title: '国际码',
+					field: 'nsCode'
+				}, {
+					title: '基本售价',
+					field: 'basePrice'
+				}, {
+					title: '市场价格（统一售价）',
+					field: 'markPrice'
+				},
+				{
+					title: '价格(成交、成本价)',
+					field: 'price'
+				}, {
+					title: '单位',
+					field: 'unit'
+				}, {
+					title: '重量',
+					field: 'weight'
+				}, {
+					title: '保质期（天）',
+					field: 'shelfLife'
+				}, {
+					title: '库存',
+					field: 'stock'
+				}, {
+					title: '操作',
+					action: true,
+					plugins: [{
+						icon: 'el-icon-edit',
+						name: '编辑',
+						audit: '',
+						event: {
+							click: (item : any) => {
+								(this as any).$router.push({ name: 'MaterialEdit', params: { baseInfo: item } });
+								console.log('该行数据：', item)
+							}
+						}
+					}, {
+						name: '删除',
+						event: {
+							click: (item : any) => this.doDelete2(item)
 						}
-					}
+					}]
 				}]
-			]
+			},
 		}
-		props = {
-			label: 'name',
-			children: 'children'
+		getTools() {
+			return {
+				add: true,
+				export: true,
+				delete: true,
+				search: true,
+				refresh: true
+			}
 		}
-		tableData : Array<any> = []
 		created() {
 			this.getTreeList()
-			this.getDataList()
+			this.timer = setInterval(() => {
+				this.getDataList()
+			}, 500)
 		}
 		// 获取树型导航数据
 		getTreeList() {
@@ -114,79 +230,96 @@
 		}
 		// 获取列表数据
 		getDataList() {
-			api.page({ pageNo: this.pageNo, pageSize: this.pageSize }).then((res : any) => {
-				console.log(res.data);
+			if (!this.$refs.moduleView) {
+				if (this.timeNum > 5) {
+					clearInterval(this.timer)
+				}
+				this.timeNum++;
+				return
+			}
+			clearInterval(this.timer)
+			let query = (this.$refs.moduleView as any).getQuery();
+			// console.log(query);
+			api.page(query).then((res : any) => {
+				// console.log(res.data);
 				if (res.code === 200) {
-					this.tableData = res.data.records;
-					this.loading = false;
+					(this.$refs.moduleView as any).setTableValue(res.data.records);
+					let page = {
+						pageNo: res.data.current, //当前页
+						pageSize: res.data.size, //每页条数
+						total: res.data.total //总条数
+					};
+					(this.$refs.moduleView as any).setPage(page)
 				} else this.failHandle(res)
 			})
 		}
 		// 工具栏方法
 		clickHandle(e : any) {
-			console.log(e)
-			if (e === 'toggleSearch') this.toggleSearch();
-			if (e === 'onRefresh') this.onRefresh();
+			// console.log(e);
+			if (e === 'onRefresh') (this.$refs.moduleView as any).resert();
+			if (e === 'onAdd') this.onAdd();
+			if (e === 'onDelete') this.doDelete();
 			if (e === 'onExport') this.onExport();
 		}
-		// handleNodeClick
-		handleNodeClick(e : any) {
-			console.log(e.id);
-			this.loading = true;
-			api.single({ id: e.id }).then((res : any) => {
-				console.log(res);
+		// 新增
+		onAdd() {
+			(this as any).$router.push('/materialFile/materialAdd')
+		}
+		// 工具栏删除
+		doDelete() {
+			let selectData = (this.$refs.moduleView as any).getSelectData()
+			let ids = '';
+			if (selectData.length>0) selectData.map((v : any) => {
+				ids += v.id + ','
+			})
+			ids = ids.slice(0,ids.length-1);
+			api.materialDelete({
+				ids: ids
+			}).then((res : any) => {
 				if (res.code === 200) {
-					this.tableData = res.data;
-					this.loading = false;
-				}
+					this.getDataList();
+					this.$message({
+						type: 'success',
+						message: '删除成功!'
+					});
+				} else this.failHandle(res)
 			})
 		}
-		//搜索
-		searchHandle() {
-			this.loading = true;
-			let query : any = (this.$refs.formId as any).getValue() || '';
-			if(!query.name) return this.getDataList();
-			api.single({ id: query.name }).then((res : any) => {
+		// 操作删除
+		doDelete2(item:any){
+			api.materialDelete({
+				ids: item.id
+			}).then((res : any) => {
 				if (res.code === 200) {
-					this.tableData = res.data
-					this.loading = false;
-				};
+					this.getDataList();
+					this.$message({
+						type: 'success',
+						message: '删除成功!'
+					});
+				} else this.failHandle(res)
 			})
 		}
-		//重置
-		resertHandle() {
-			this.loading = true;
-			(this.$refs.formId as any).setValue({});
-			// (this.$refs.tableId as any).setPage({ pageNo: 1, total: 0 });
-			this.getDataList();
-		}
-		//刷新
-		onRefresh() {
-			this.loading = true;
-			(this.$refs.formId as any).setValue({});
-			// (this.$refs.tableId as any).setPage({ pageNo: 1, total: 0 });
-			this.getDataList();
-		}
-		//获取查询值
-		getQuery() {
-			let query : any = (this.$refs.formId as any).getValue();
-			// const page:any = (this.$refs.tableId as any).getPage();
-			// query.pageNum = page.pageNo;
-			// query.pageSize = page.pageSize;
-			return query;
+		// 导航切换
+		handleNodeClick(e : any) {
+			api.single({ categoryId: e.id }).then((res : any) => {
+				if (res.code === 200) {
+					(this.$refs.moduleView as any).setTableValue(res.data.records);
+					let page = {
+						pageNo: res.data.current, //当前页
+						pageSize: res.data.size, //每页条数
+						total: res.data.total //总条数
+					};
+					(this.$refs.moduleView as any).setPage(page)
+				}
+			})
 		}
 		//导出
 		onExport() {
-			let urlArr = '/maindata/maindataMaterialOrganizationCategory';
-			let query = this.getQuery();
+			let urlArr = '/maindata/maindataMaterial';
+			let query = (this.$refs.moduleView as any).getQuery();
 			(this as any).$download(urlArr + '/export', {
 				...query
 			}, urlArr[urlArr.length - 1] + `_${new Date().getTime()}.xlsx`)
-
-		}
-		//显示/隐藏搜索
-		toggleSearch() {
-			this.hideSearch = !this.hideSearch
 		}
 		// 运行错误
 		failHandle(err : any) {
@@ -196,21 +329,6 @@
 
 	}
 </script>
-<style lang="scss">
-	.my-container {
-		.el-form-item__label {
-			text-align: center;
-		}
-
-		.el-form-item__content {
-			margin-right: 20px;
-		}
-
-		.el-table .el-table__cell {
-			text-align: center;
-		}
-	}
-</style>
 <style lang="scss" scoped>
 	.my-container {
 		width: 100%;

src/views/demo/a.vue

@@ -1,3 +1,13 @@
 <template>
   <div>组件测试</div>
-</template>
+</template>
+
+<script lang="ts">
+	import { Component, Prop, Vue, Watch,Mixins } from "vue-property-decorator";
+	
+	@Component
+	export default class A extends Vue {
+		@Prop()
+		propValue:any
+	}
+</script>

src/views/demo/form.vue

@@ -13,7 +13,7 @@
 
 <script lang="ts">
 import { Component, Prop, Vue, Watch } from "vue-property-decorator";
-import a from './a.vue'
+import zujian from './a.vue'
 @Component
 export default class DemoForm extends Vue {
   config={
@@ -53,7 +53,7 @@ export default class DemoForm extends Vue {
         label:'测试',
         prop:'name3',
         // required:true,
-        component:a
+        component:zujian
       }],
       [{
         span:6,

src/views/demo/moduleView.vue

@@ -86,7 +86,6 @@ export default class ModuleViewDemo extends Vue {
           event:{
             click:(item:any) => {
               console.log('该行数据：',item);
-              this.fun();
               console.log('this:',this)
             }
           }
@@ -97,9 +96,6 @@ export default class ModuleViewDemo extends Vue {
       url:'/system/audit/collaborationLog'
     }
   }
-  fun(){
-    console.log(this)
-  }
   clickHandle(e:string){
     console.log(e+'操作')
   }