add:粉料计划添加行颜色

mes/qd/src/views/wms/statistics/materPlan/index.vue

@@ -12,7 +12,7 @@
           label-suffix=":"
         >
           <el-form-item label="统计日期">
-            <date-range-picker v-model="query.createTime" class="date-item"/>
+            <date-range-picker v-model="query.createTime" class="date-item" />
           </el-form-item>
           <el-form-item label="所属组织">
             <el-select
@@ -31,49 +31,58 @@
               />
             </el-select>
           </el-form-item>
-          <rrOperation/>
+          <rrOperation />
         </el-form>
       </div>
       <!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
-      <crudOperation :permission="permission">
+      <crudOperation :permission="permission" />
-      </crudOperation>
       <!--表格渲染-->
       <el-table
         ref="table"
         v-loading="crud.loading"
+        :row-class-name="tableRowClassName"
         :data="crud.data"
         size="mini"
         :max-height="590"
         style="width: 100%;"
         @selection-change="crud.selectionChangeHandler"
       >
-        <el-table-column type="index" label="序号" width="100" align="center" fixed/>
+        <el-table-column type="index" label="序号" width="100" align="center" fixed />
         <template v-for="(col,index) in cols">
-          <el-table-column v-if="col.prop !== '1'" :prop="col.prop" :label="col.label" width="120px" show-overflow-tooltip/>
+          <el-table-column v-if="col.prop !== '1'" :prop="col.prop" :label="col.label" width="120px" show-overflow-tooltip />
-          <el-table-column v-if="col.prop === '1'" :prop="col.prop" :label="col.label" width="120px" show-overflow-tooltip fixed/>
+          <el-table-column v-if="col.prop === '1'" :prop="col.prop" :label="col.label" width="120px" show-overflow-tooltip fixed />
         </template>
       </el-table>
 
       <el-table
         ref="dtl_table"
         v-loading="crud.loading"
+        :row-class-name="tableRowClassName"
         :data="dtlList"
         size="mini"
         :max-height="590"
         style="width: 100%;"
         @selection-change="crud.selectionChangeHandler"
       >
-        <el-table-column type="index" label="序号" width="100" align="center" fixed/>
+        <el-table-column type="index" label="序号" width="100" align="center" fixed />
         <template v-for="(col,index) in cols2">
           <el-table-column v-if="!col.option" :prop="col.prop" :label="col.label" width="120px" />
-          <el-table-column v-if="col.option" :prop="col.prop" :label="col.label" width="120px" fixed/>
+          <el-table-column v-if="col.option" :prop="col.prop" :label="col.label" width="120px" fixed />
         </template>
       </el-table>
       <!--分页组件-->
     </div>
   </div>
 </template>
+<style>
+.el-table .warning-row {
+  background: oldlace;
+}
 
+.el-table .success-row {
+  background: #f0f9eb;
+}
+</style>
 <script>
 import report from '@/api/wms/statistics/report'
 import CRUD, { presenter, header, crud } from '@crud/crud'
@@ -132,7 +141,6 @@ export default {
   methods: {
     // 钩子：在获取表格数据之前执行，false 则代表不获取数据
     [CRUD.HOOK.beforeRefresh]() {
-      debugger
       report.getHeader().then(res => {
         this.cols = res
       })
@@ -165,6 +173,12 @@ export default {
           crud.downloadLoading = false
         })
       }
+    },
+    tableRowClassName({ row, rowIndex }) {
+      if (rowIndex % 2 === 1) {
+        return 'success-row'
+      }
+      return ''
     }
   }
 }