diff --git a/pages/material/material.vue b/pages/material/material.vue
index 6c2a017..a0ace4b 100644
--- a/pages/material/material.vue
+++ b/pages/material/material.vue
@@ -45,7 +45,7 @@
 	import gress from './component/gress.vue'
 	import crkval from './component/crkval.vue'
 	import information from './component/information.vue'
-	const percent = ref(0);
+	 const percent = ref(0);
 	 const crkit = ref(false)
 	 const transition = ref(false)
 	 const crkshow = ref(false)
diff --git a/pages/procure/component/filter.vue b/pages/procure/component/filter.vue
new file mode 100644
index 0000000..d00bcd0
--- /dev/null
+++ b/pages/procure/component/filter.vue
@@ -0,0 +1,44 @@
+<template>
+	<view>
+		<view class="boxa" :style="!transition?'opacity: 0':'opacity: 1'" >
+			
+		</view>
+	</view>
+</template>
+
+<script setup lang="ts">
+	import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent, inject, watch } from 'vue';
+	 const props = defineProps({
+	 	isShow: {
+	 		type: Boolean
+	 	},
+	 });
+	 const transition = ref(false)
+	 watch(
+	 	() => props.isShow,
+	 	(newVal, oldVal) => {
+	 		if (!oldVal && newVal) {
+	 			transition.value = false;
+	 			setTimeout(() => {
+	 				transition.value = true;
+	 			}, 50)
+	 		} else {
+	 			transition.value = false;
+	 		}
+	 	}
+	 )
+</script>
+
+<style lang="less" scoped>
+.boxa{
+	width: 50vw;
+	height: 60vw;
+	position: fixed;
+	z-index: 130;
+	top: 1vw;
+	right: 25vw;
+	background: #FFFFFF;
+	box-shadow: 0px 0 0.7vw 0px rgba(136,141,153,0.15);
+	border-radius: 1.6vw;
+}
+</style>
diff --git a/pages/procure/component/procurement.vue b/pages/procure/component/procurement.vue
index a4ea48a..4b8cad8 100644
--- a/pages/procure/component/procurement.vue
+++ b/pages/procure/component/procurement.vue
@@ -101,12 +101,14 @@
 				</view>
 			</view>
 		</view>
-		
+		<view class="mengban" v-if="ification" @click="ification = false"> </view>
+		<filtere :isShow="ification"></filtere>
 	</view>
 </template>
 
 <script setup lang="ts">
 	import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent, inject, watch } from 'vue';
+	import filtere from './filter.vue'
 	 const emit = defineEmits(['link' ])
 	 const search = (x : number) => {
 	 	if (x === 0) { form.wlParamInfo = '' }
@@ -154,6 +156,15 @@
 </script>
 
 <style lang="less" scoped>
+	.mengban{
+		width: 100vw;
+		height: 100vh;
+		position: fixed;
+		background: RGBA(240, 240, 240, 0.64);
+		top: 0;
+		left: 0;
+		z-index: 99;
+	}
 .caigou{
 	width: 100%;
 	height: 100%;