表头颜色，备注

src/views/iosBasicData/bcntrtypes/index.vue

@@ -1,11 +1,13 @@
+<!--集装箱-->
 <template>
-    <!--集装箱-->
   <basic-container>
     <avue-crud :option="option"
                :table-loading="loading"
                :data="data"
                :page.sync="page"
                :permission="permissionList"
+               id="out-table"
+               :header-cell-class-name="headerClassName"
                :before-open="beforeOpen"
                v-model="form"
                ref="crud"
@@ -21,6 +23,11 @@
                @resetColumn="resetColumnTwo('crud', 'option', 'optionBack', 291)"
                @saveColumn="saveColumnTwo('crud', 'option', 'optionBack', 291)"
                @on-load="onLoad">
+      <template slot="remarks" slot-scope="scope">
+        <avue-text-ellipsis :text="scope.row.remarks" :height="30">
+        <small slot="more">...</small>
+        </avue-text-ellipsis>
+      </template>
       <template slot="menuLeft">
         <el-button type="danger"
                    size="small"
@@ -317,6 +324,9 @@
             {
               label: "备注",
               prop: "remarks",
+              type: 'textarea',
+              width: "180",
+              slot: true,
               rules: [{
                 required: true,
                 message: "请输入备注",
@@ -481,11 +491,36 @@
                 this.$message.success("重置成功");
                 this.$refs[ref].$refs.dialogColumn.columnBox = false;
             }
-        }
+        },
+        // 更改表格颜色
+        headerClassName(tab){
+            //颜色间隔
+            let back = ""
+            if (tab.columnIndex >= 0 && tab.column.level === 1) {
+                if (tab.columnIndex % 2 === 0) {
+                    back = "back-one"
+                } else if (tab.columnIndex % 2 === 1) {
+                    back = "back-two"
+                }
+            }
+            return back;
+        },
 
     }
   };
 </script>
 
-<style>
+<style lang="scss" scoped>
+
+::v-deep#out-table .back-one {
+        background: #ecf5ff !important;
+    }
+    ::v-deep#out-table .back-two {
+        background: #ecf5ff !important;
+    }
+
+/deep/ .el-col-md-8 {
+  width: 24.33333%;
+}
+
 </style>

src/views/iosBasicData/bcommodity/index.vue

@@ -1,3 +1,4 @@
+<!-- 货物 -->
 <template>
   <basic-container>
     <avue-crud :option="option"
@@ -5,6 +6,8 @@
                :data="data"
                :page.sync="page"
                :permission="permissionList"
+               id="out-table"
+               :header-cell-class-name="headerClassName"
                :before-open="beforeOpen"
                v-model="form"
                ref="crud"
@@ -20,6 +23,11 @@
                @resetColumn="resetColumnTwo('crud', 'option', 'optionBack', 290)"
                @saveColumn="saveColumnTwo('crud', 'option', 'optionBack', 290)"
                @on-load="onLoad">
+      <template slot="remarks" slot-scope="scope">
+        <avue-text-ellipsis :text="scope.row.remarks" :height="30">
+        <small slot="more">...</small>
+        </avue-text-ellipsis>
+      </template>
       <template slot="menuLeft">
         <el-button type="danger"
                    size="small"
@@ -194,6 +202,8 @@
               label: "备注",
               prop: "remarks",
                 type: 'textarea',
+                width: "180",
+                slot: true,
                 span: 24,
                 minRows: 3,
             },
@@ -367,11 +377,36 @@
                 this.$message.success("重置成功");
                 this.$refs[ref].$refs.dialogColumn.columnBox = false;
             }
-        }
+        },
+        // 更改表格颜色
+        headerClassName(tab){
+            //颜色间隔
+            let back = ""
+            if (tab.columnIndex >= 0 && tab.column.level === 1) {
+                if (tab.columnIndex % 2 === 0) {
+                    back = "back-one"
+                } else if (tab.columnIndex % 2 === 1) {
+                    back = "back-two"
+                }
+            }
+            return back;
+        },
 
     }
   };
 </script>
 
-<style>
+<style lang="scss" scoped>
+
+::v-deep#out-table .back-one {
+        background: #ecf5ff !important;
+    }
+    ::v-deep#out-table .back-two {
+        background: #ecf5ff !important;
+    }
+
+/deep/ .el-col-md-8 {
+  width: 24.33333%;
+}
+
 </style>

src/views/iosBasicData/bcountrys/index.vue

@@ -1,3 +1,4 @@
+<!-- 国家 -->
 <template>
     <basic-container>
         <avue-crud :option="option"
@@ -5,6 +6,8 @@
                    :data="data"
                    :page.sync="page"
                    :permission="permissionList"
+                   id="out-table"
+                   :header-cell-class-name="headerClassName"
                    :before-open="beforeOpen"
                    v-model="form"
                    ref="crud"
@@ -20,6 +23,11 @@
                    @resetColumn="resetColumnTwo('crud', 'option', 'optionBack', 287)"
                    @saveColumn="saveColumnTwo('crud', 'option', 'optionBack', 287)"
                    @on-load="onLoad" >
+            <template slot="remarks" slot-scope="scope">
+                <avue-text-ellipsis :text="scope.row.remarks" :height="30">
+                <small slot="more">...</small>
+                </avue-text-ellipsis>
+            </template>
             <template slot="menuLeft">
                 <el-button type="danger"
                            size="small"
@@ -184,6 +192,8 @@ export default {
                         label: "备注",
                         prop: "remarks",
                         type: 'textarea',
+                        width: "180",
+                        slot: true,
                         span: 24,
                         minRows: 3,
                     },
@@ -359,11 +369,36 @@ export default {
                 this.$message.success("重置成功");
                 this.$refs[ref].$refs.dialogColumn.columnBox = false;
             }
-        }
+        },
+        // 更改表格颜色
+        headerClassName(tab){
+            //颜色间隔
+            let back = ""
+            if (tab.columnIndex >= 0 && tab.column.level === 1) {
+                if (tab.columnIndex % 2 === 0) {
+                    back = "back-one"
+                } else if (tab.columnIndex % 2 === 1) {
+                    back = "back-two"
+                }
+            }
+            return back;
+        },
 
     }
 };
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
+
+::v-deep#out-table .back-one {
+        background: #ecf5ff !important;
+    }
+    ::v-deep#out-table .back-two {
+        background: #ecf5ff !important;
+    }
+
+/deep/ .el-col-md-8 {
+  width: 24.33333%;
+}
+
 </style>

src/views/iosBasicData/bpackages/index.vue

@@ -1,3 +1,4 @@
+<!-- 包装 -->
 <template>
   <basic-container>
     <avue-crud :option="option"
@@ -5,6 +6,8 @@
                :data="data"
                :page.sync="page"
                :permission="permissionList"
+               id="out-table"
+               :header-cell-class-name="headerClassName"
                :before-open="beforeOpen"
                v-model="form"
                ref="crud"
@@ -20,6 +23,11 @@
                @resetColumn="resetColumnTwo('crud', 'option', 'optionBack', 289)"
                @saveColumn="saveColumnTwo('crud', 'option', 'optionBack', 289)"
                @on-load="onLoad">
+      <template slot="remarks" slot-scope="scope">
+        <avue-text-ellipsis :text="scope.row.remarks" :height="30">
+        <small slot="more">...</small>
+        </avue-text-ellipsis>
+      </template>
       <template slot="menuLeft">
         <el-button type="danger"
                    size="small"
@@ -283,6 +291,8 @@
               label: "备注",
               prop: "remarks",
                 type: 'textarea',
+                width: "180",
+                slot: true,
                 span: 24,
                 minRows: 3,
 
@@ -506,11 +516,36 @@
                 this.$message.success("重置成功");
                 this.$refs[ref].$refs.dialogColumn.columnBox = false;
             }
-        }
+        },
+        // 更改表格颜色
+        headerClassName(tab){
+            //颜色间隔
+            let back = ""
+            if (tab.columnIndex >= 0 && tab.column.level === 1) {
+                if (tab.columnIndex % 2 === 0) {
+                    back = "back-one"
+                } else if (tab.columnIndex % 2 === 1) {
+                    back = "back-two"
+                }
+            }
+            return back;
+        },
 
     }
   };
 </script>
 
-<style scoped>
-</style>
+<style lang="scss" scoped>
+
+::v-deep#out-table .back-one {
+        background: #ecf5ff !important;
+    }
+    ::v-deep#out-table .back-two {
+        background: #ecf5ff !important;
+    }
+
+/deep/ .el-col-md-8 {
+  width: 24.33333%;
+}
+
+</style>