2026-03-27

优化【结束卷】对话框样式

src/views/modules/yieldReport/com_finish_roll.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="customer-css produce-report">
     <el-dialog :title="titleCon" v-drag v-bind="$attrs" v-on="$listeners" width="1050px" custom-class="machine-workbench-dialog">
-      <div class="dialog-content-container" style="height: 680px; overflow-y: auto; overflow-x: hidden;">
+      <div class="dialog-content-container">
         <!-- 顶部操作栏 -->
         <div class="top-action-bar-wrapper">
           <div class="top-action-bar">
@@ -17,12 +17,12 @@
               <button class="action-btn primary" :disabled="buttonTags.finishRollFlag" @click="finishRollBun">
                 <i class="el-icon-check"></i> {{ buttons.finishRoll }}
               </button>
-              <button class="action-btn secondary" @click="closeDialog">
-                <i class="el-icon-close"></i> {{ buttons.closeButton }}
-              </button>
               <button class="action-btn warning" @click="openAttendanceModal">
                 <i class="el-icon-user"></i> 考勤修改
               </button>
+              <button class="action-btn secondary" @click="closeDialog">
+                <i class="el-icon-close"></i> {{ buttons.closeButton }}
+              </button>
             </div>
           </div>
         </div>
@@ -1619,13 +1619,32 @@ export default {
 </script>
 
 <style scoped lang="scss">
+.dialog-content-container {
+  height: 650px;
+  overflow-y: auto;
+  overflow-x: hidden;
+  padding: 0 20px 20px 20px;
+}
+
+/* 自定义滚动条 */
+.dialog-content-container::-webkit-scrollbar {
+  width: 6px;
+}
+.dialog-content-container::-webkit-scrollbar-thumb {
+  background: #c0c4cc;
+  border-radius: 3px;
+}
+.dialog-content-container::-webkit-scrollbar-track {
+  background: #f4f6f9;
+}
+
 .top-action-bar-wrapper {
   position: sticky;
   top: 0;
   z-index: 10;
   background: #ffffff;
-  padding: 10px 5px 15px 5px;
-  margin: 0 -5px;
+  padding: 20px 20px 15px 20px;
+  margin: 0 -20px;
 }
 
 .top-action-bar {
@@ -1741,7 +1760,7 @@ export default {
 }
 
 .machine-workbench-dialog /deep/ .el-dialog__body {
-  padding: 16px;
+  padding: 0;
   background: #f5f7fa;
 }