添加模型遮罩

src/pages/components/In03.vue

@@ -5,7 +5,7 @@
             style="cursor: pointer;position: absolute;right: 40px;top: 32px;height: 38px;width: 38px;text-align: center;"
             @click.stop="backMasterViewByFac"><img src="../../assets/image/view.png"></div>
     </div>
-    <div class="bg2"></div>
+    <div class="bg20"></div>
     <template v-if="showIndexData=='index'">
         <div class="abs" style="left:50%;top:10%;width: 210px;margin-left:-105px;text-align: center;">
             <div>请选择要查看的产线</div>
@@ -676,7 +676,7 @@ export default {
 }
 </script>
 <style scope="IN03">
-.bg2{
+.bg20{
     z-index: 1; pointer-events: none;position: absolute;
     top: calc(22px * var(--hRate));
     left: 0;
@@ -685,7 +685,9 @@ export default {
     margin-left: 19px;
     border: 2px solid #17666e;
     border-top: 0px;
-    
+    background:url('../../assets/image/bg.png');
+    -webkit-mask-image: linear-gradient(to top, #0b313de5 10%, transparent 20%,transparent 50%, #0b313de5 100%);
+    mask-image: linear-gradient(to top, #0b313de5 10%,transparent 20%,transparent 50%, #0b313de5 100%);
     /*
     
     background:url('../../assets/image/000.png');