表单样式修改

2 years ago · 0721af7b96
3 changed files with 113 additions and 200 deletions
--- a/src/components/360View/commonForm/deveopmentFIle.vue
+++ b/src/components/360View/commonForm/deveopmentFIle.vue
@ -679,27 +679,28 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-#threeFunc {
-  .el-input__suffix, .el-input__prefix {
-    //display: none;
-  }
-  .width-100 {
-    .el-input {
-      width: 100px;
-    }
-  }
-  .width-140 {
-    .el-input {
-      width: 125px;
-    }
-  }
-}
 .flex{
  display: flex;
 }
 .j-c{
  justify-content: center;
 }
+::v-deep .el-table__cell{
+  padding: 5px 0 !important;
+}
+::v-deep .el-input-group__prepend{
+  background-color: transparent;
+  color: #606266;
+  border: none;
+}
+::v-deep .el-table__header-wrapper{
+  display: none;
+}
+.width-140 {
+  ::v-deep .el-input {
+    width: 125px;
+  }
+}
 .operation-record-table{
  .el-input__inner {
    border: none;
@ -746,11 +747,6 @@ export default {
      line-height: 26px !important;
      text-align: center;
    }
-    .el-input__inner {
-      border-bottom: 1px solid #ccc;
-      border-radius: 0;
-      padding: 0;
-    }
    .el-icon-arrow-up {
      display: none;
    }
--- a/src/components/360View/commonForm/optometryForm.vue
+++ b/src/components/360View/commonForm/optometryForm.vue
@ -1103,91 +1103,5 @@ export default {
    -webkit-print-color-adjust: exact;
  }
 }
-#threeFunc{
-  .operation-record-table{
-    .el-input__inner {
-      padding: 0;
-      border: none;
-      text-align: center;
-      border-radius: 0;
-    }
-    .machineBox{
-      .el-table__cell {
-        height: 24px;
-      }
-      .el-table td {
-        border-color: #cbc8c8;
-      }
-      .el-table tr{
-        td:nth-child(1) {
-          border-right: 1px solid #212020;
-        }
-        td:nth-child(2) {
-          border-right: 1px solid #212020;
-        }
-
-      }
-      .el-table tbody {
-        tr:nth-child(2) {
-          td{
-            border-bottom: 1px solid #212020;
-          }
-        }
-        tr:nth-child(4) {
-          td{
-            border-bottom: 1px solid #212020;
-          }
-        }
-        tr:nth-child(6) {
-          td{
-            border-bottom: 1px solid #212020;
-          }
-        }
-      }
-
-    }
-  }
-  .el-table__cell{
-    padding: 6px 0 !important;
-  }
-  .el-input-group__append, .el-input-group__prepend{
-    padding: 0 5px !important;
-  }
-  .el-input__prefix {
-    //display: none;
-  }
-  .el-icon-arrow-up{
-    display: none;
-  }
-  .el-textarea__inner{
-    border: none;
-  }
-  .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
-    background: none !important;
-  }
-  .has-gutter {
-    display: none;
-    .cell {
-      font-weight: 700;
-    }
-    .el-table__cell {
-      background: #ced4d9;
-    }
-  }
-  .el-table__header-wrapper{
-    display: none;
-  }
-  .el-table th {
-    border-color: #8e8c8c;
-  }
-  .el-table td {
-    border-color: #8e8c8c;
-  }
-  .el-table--group,
-  .el-table--border {
-    border: 1px solid #8e8c8c !important;
-    border-bottom: none !important;
-  }
-}
 </style>

--- a/src/components/360View/commonForm/threeVision.vue
+++ b/src/components/360View/commonForm/threeVision.vue
@ -29,6 +29,7 @@
                </div>
                <div style="display: flex;">
                  <el-table
+                    id="tableItem"
                    border
                    :show-header="false"
                    :data="machineData"
@ -270,6 +271,7 @@
                    </el-table-column>
                  </el-table>
                  <el-table
+                    id="tableItem"
                    border
                    :show-header="false"
                    :data="machineData"
@ -1392,52 +1394,47 @@ export default {
 </script>

 <style lang="scss" scoped>
-#operation-record{
-  height: 100%;
-  overflow: auto;
-  .flex{
-    display: flex;
-  }
-  .j-c{
-    justify-content: center;
-  }
-  .weight7{
-    font-weight: 700;
-  }
-  .btnBox{
-    display: flex;
-    justify-content: flex-end;
-  }
-  .width-50 {
-    .el-input {
-      width: 50px;
-    }
-  }
-  .width-70 {
-    .el-input {
-      width: 70px;
-    }
+.flex{
+  display: flex;
+}
+.j-c{
+  justify-content: center;
+}
+.weight7{
+  font-weight: 700;
+}
+.btnBox{
+  display: flex;
+  justify-content: flex-end;
+}
+.width-50 {
+  .el-input {
+    width: 50px;
  }
-  .width-100 {
-    .el-input {
-      width: 100px;
-    }
+}
+.width-70 {
+  .el-input {
+    width: 70px;
  }
-  .width-120 {
-    .el-input {
-      width: 120px;
-    }
+}
+.width-100 {
+  .el-input {
+    width: 100px;
  }
-  .width-180 {
-    .el-input {
-      width: 180px;
-    }
+}
+.width-120 {
+  .el-input {
+    width: 120px;
  }
-  .operation-record-table {
-    width: 840px !important;
-    padding-right: 8px;
+}
+.width-180 {
+  .el-input {
+    width: 180px;
  }
-
+}
+.operation-record-table {
+  width: 840px !important;
+  padding-right: 8px;
 }
 #threeFunc{
  ::v-deep .el-input__inner {
@ -1456,6 +1453,7 @@ export default {
  }
  .center {
    display: flex;
+    align-items: center;
    text-align: left;
  }
  .left {
@ -1637,66 +1635,31 @@ export default {
    font-weight: 400;
  }
 }
+
+::v-deep .el-input-group__append, ::v-deep .el-input-group__prepend{
+  border: none;
+  padding: 0 5px !important;
+}
+
 #threeFunc{
  .operation-record-table{
-    .el-input__inner {
+    ::v-deep .el-input__inner {
      padding: 0;
      border: none;
      text-align: center;
      border-radius: 0;
    }
-    .machineBox{
-      .el-table__cell {
-        height: 24px;
-      }
-      .el-table td {
-        border-color: #cbc8c8;
-      }
-      .el-table tr{
-        td:nth-child(1) {
-          border-right: 1px solid #212020;
-        }
-        td:nth-child(2) {
-          border-right: 1px solid #212020;
-        }
-
-      }
-      .el-table tbody {
-        tr:nth-child(2) {
-          td{
-            border-bottom: 1px solid #212020;
-          }
-        }
-        tr:nth-child(4) {
-          td{
-            border-bottom: 1px solid #212020;
-          }
-        }
-        tr:nth-child(6) {
-          td{
-            border-bottom: 1px solid #212020;
-          }
-        }
-      }
-
-    }
-  }
-  .el-table__cell{
-    padding: 6px 0 !important;
-  }
-  .el-input-group__append, .el-input-group__prepend{
-    padding: 0 5px !important;
  }
-  .el-input__prefix {
-    //display: none;
+  ::v-deep .el-table__cell{
+    padding: 3px 0 !important;
  }
-  .el-icon-arrow-up{
+  ::v-deep .el-icon-arrow-up{
    display: none;
  }
-  .el-textarea__inner{
+  ::v-deep .el-textarea__inner{
    border: none;
  }
-  .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
+  ::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
    background: none !important;
  }
  .has-gutter {
@ -1704,23 +1667,63 @@ export default {
    .cell {
      font-weight: 700;
    }
-    .el-table__cell {
+    ::v-deep .el-table__cell {
      background: #ced4d9;
    }
  }
-  .el-table__header-wrapper{
+  ::v-deep .el-table__header-wrapper{
    display: none;
  }
-  .el-table th {
+  ::v-deep .el-table th {
    border-color: #8e8c8c;
  }
-  .el-table td {
+  ::v-deep .el-table td {
    border-color: #8e8c8c;
  }
-  .el-table--group,
-  .el-table--border {
+  .machineBox{
+    ::v-deep .el-table__cell {
+      height: 24px;
+    }
+    ::v-deep .el-table td {
+      border-color: #cbc8c8;
+    }
+    ::v-deep .el-table tr{
+      td:nth-child(1) {
+        border-right: 1px solid #212020;
+      }
+      td:nth-child(2) {
+        border-right: 1px solid #212020;
+      }
+
+    }
+    ::v-deep .el-table tbody {
+      tr:nth-child(2) {
+        td{
+          border-bottom: 1px solid #212020;
+        }
+      }
+      tr:nth-child(4) {
+        td{
+          border-bottom: 1px solid #212020;
+        }
+      }
+      tr:nth-child(6) {
+        td{
+          border-bottom: 1px solid #212020;
+        }
+      }
+    }
+
+  }
+  ::v-deep .el-table--group,
+  ::v-deep .el-table--border {
    border: 1px solid #8e8c8c !important;
    border-bottom: none !important;
  }
 }
+#tableItem{
+  ::v-deep .el-table__cell{
+    padding: 0 !important;
+  }
+}
 </style>