代办图标&颜色

pages/crm/statistical/card.less

@@ -59,14 +59,42 @@
                 width: 40px;
                 height: 40px;
                 border-radius: 50%;
-                background: #249e91;
+                // background: #249e91;
                 float: left;
                 margin: 12px 10px 0 5px;
+                .img_bg01 {
+                    display: inline-block;
+                    width: 40px;
+                    height: 40px;
+                    border-radius: 50%;
+                    background: #249e91;
+                  }
+                  .img_bg02 {
+                    display: inline-block;
+                    width: 40px;
+                    height: 40px;
+                    border-radius: 50%;
+                    background: #0099FF;
+                  }
+                  .img_bg03 {
+                    display: inline-block;
+                    width: 40px;
+                    height: 40px;
+                    border-radius: 50%;
+                    background: #FF7A8B;
+                  }
+                  .img_bg04 {
+                    display: inline-block;
+                    width: 40px;
+                    height: 40px;
+                    border-radius: 50%;
+                    background: #FFC300;
+                  }
                 .Icon_bg {
                     text-align: center;
                     padding: 10px 0 0;
                     img.Icon_icon {
-                        width: 18px;
+                        width: 20px;
                     }
                 }
             }

pages/crm/statistical/costomer/todolist.vue

@@ -18,8 +18,10 @@
           :key="index"
         >
           <div class="leftIcon">
-            <div class="Icon_bg">
-              <img class="Icon_icon" :src="imgUrl + item.image" alt />
+            <div class="Icon_bg" :class="item.name=='物料复验' ? 'img_bg02':(item.name=='产品合格证' ? 'img_bg03':(item.name=='生产执行' ? 'img_bg04' : 'img_bg01'))" >
+            <!-- <div > -->
+              <img class="Icon_icon" src="@/assets/imgicon/u1640.png" alt="">
+              <!-- <img class="Icon_icon" :src="imgUrl + item.image" alt /> -->
             </div>
           </div>
           <div class="h60">

pages/handle/task.vue

 
-<style>
-/* @font-face {
-  font-family: 'iconfont';
-  src: url('./iconfont/iconfont.eot');
-  src: url('./iconfont/iconfont.eot?#iefix') format('embedded-opentype'),
-      url('./iconfont/iconfont.woff2') format('woff2'),
-      url('./iconfont/iconfont.woff') format('woff'),
-      url('./iconfont/iconfont.ttf') format('truetype'),
-      url('./iconfont/iconfont.svg#iconfont') format('svg');
-}
-.iconfont {
-  font-family: "iconfont" !important;
-  font-size: 32px;
-  font-weight: bold;
-  /* font-style: normal;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  color:#249e91;
-} */
-.img_bg {
-  display: inline-block;
-  width: 48px;
-  height: 48px;
-  border-radius: 50%;
-  background: #249e91;
-}
-.img_icon {
-  width: 24px;
-  margin: 23% 0 0 0;
-}
-</style>
+
 <template>
   <div style="width:100%">
     <Card
@@ -41,9 +11,9 @@
       <div class="leftIco">
         <!-- color:rgba(36, 158, 145, 1) -->
         <!-- <span class="iconfont">&#xe607;</span> -->
-        <div class="img_bg">
-          <img class="img_icon" :src="imgUrl + item.image" alt />
-          <!-- <img class="img_icon" src="@/assets/imgicon/u1650.png" alt=""> -->
+        <div :class="item.name=='物料复验' ? 'img_bg02':(item.name=='产品合格证' ? 'img_bg03':(item.name=='生产执行' ? 'img_bg04' : 'img_bg01'))" >
+          <!-- <img class="img_icon" :src="imgUrl + item.image" alt /> -->
+          <img class="img_icon" src="@/assets/imgicon/u1640.png" alt="">
         </div>
         <!-- <command icon="@/assets/imgicon/u1638.png"> -->
         <!-- <Icon type="md-analytics" size="36" color="#249e91" /> -->
@@ -82,6 +52,7 @@ export default {
             return (data.totalUrl = r.result)
           })
         })
+        console.log(list)
         this.listTask = list
       })
     },
@@ -93,6 +64,38 @@ export default {
 }
 </script>
 <style lang="less" scoped>
+.img_bg01 {
+  display: inline-block;
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  background: #249e91;
+}
+.img_bg02 {
+  display: inline-block;
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  background: #0099FF;
+}
+.img_bg03 {
+  display: inline-block;
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  background: #FF7A8B;
+}
+.img_bg04 {
+  display: inline-block;
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  background: #FFC300;
+}
+.img_icon {
+  width: 24px;
+  margin: 23% 0 0 0;
+}
 .waitTask {
   cursor: pointer;
   margin-bottom: 10px;