feat:UI优化

src/views/goods/infoSet.vue

 <template>
   <div class="app-container">
-    <div class="op-container" style="margin-bottom: 20px">
+    <div ref="top" :class="{fixed: isFixed}" class="op-container" style="margin-bottom: 20px">
       <el-button round @click="handleCancel">取消</el-button>
       <el-button type="primary" style="margin-right: 20px" round @click="handlePublish">发布</el-button>
       <el-button-group>
@@ -254,7 +254,8 @@ export default {
       goodIdList: [],
       currentIndex: 0,
       showLargeDialog: false,
-      imageUrl: ''
+      imageUrl: '',
+      isFixed: false
     }
   },
 
@@ -288,10 +289,18 @@ export default {
     this.initContent()
   },
   mounted() {
-    // this.pictureCut = this.$refs['pictureCut']
-    // this.utils = createUtils(this.pictureCut)
+    window.addEventListener('scroll', this.handleScroll)
   },
   methods: {
+    handleScroll() {
+      const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
+      const testEle = this.$refs.top
+      if (scrollTop > testEle.offsetTop) {
+        this.isFixed = true
+      } else {
+        this.isFixed = false
+      }
+    },
     // 初始化内容
     initContent() {
       if (this.$route.query.id == null) {
@@ -586,6 +595,16 @@ export default {
 
 .op-container {
   text-align: right;
+  background: white;
+}
+.fixed {
+  position: fixed;
+  background: white;
+  top: 20px;
+  left: 0;
+  right: 20px;
+  z-index: 99;
+
 }
 
 .box-card {