orderlist

pages/produce/orderlist.vue

@@ -9,15 +9,17 @@
       :batch="false"
       type="card"
       :high="false"
-      :span="4"
+      :span="6"
       :lazy="true"
     >
       <template slot="card" slot-scope="{row}">
         <div class="body" @click="toExecute">
           <Row class="title-i">
-            <Col :span="18" class="order-code">工艺编号：{{row.processcode}}</Col>
-            <Col :span="6" class="btn-click">
-              <State code="plan.order.status" :value="row.routing_type" />
+            <Col :span="10" class="order-code">{{row.productName}}</Col>
+            <Col :span="10" class="order-code">{{row.processcode}}</Col>
+            <Col :span="4">
+              <div class="sanjiao"></div>
+              <div class="box"><div class="text" style="font-size:6px;font-weight:normal">新建</div></div>
             </Col>
           </Row>
           <div class="panel-text">
@@ -187,17 +189,19 @@ export default {
   overflow: auto;
   padding: 15px 0 15px 15px;
   .body {
-    border: 1px solid #e4e6ed;
+    background: white;
     border-radius: 4px;
+    border: #cacbd0 solid 1px;
     margin-right: 8px;
     margin-bottom: 8px;
     .title-i {
       padding: 0 8px;
-      height: 35px;
-      line-height: 35px;
-      color: #fff;
-      background: #a7b8cc;
-      font-size: 15px;
+      height: 38px;
+      line-height: 38px;
+      color: #2680eb;
+      font-size: 14px;
+      font-weight: bold;
+      border-bottom: #cacbd0 dotted 1px;
       .btn-click {
         text-align: right;
         a {
@@ -209,7 +213,6 @@ export default {
       }
     }
     .panel-text {
-      background: rgba(167, 184, 204, 0.2);
       padding: 5px 8px;
       .row {
         height: 30px;
@@ -221,4 +224,42 @@ export default {
     }
   }
 }
+.sanjiao {
+  width: 0;
+  height: 0;
+  border-width: 27px 27px 27px;
+  border-style: solid;
+  border-color: transparent transparent green;
+  transform: rotate(45deg);
+  -ms-transform: rotate(45deg); /* Internet Explorer */
+  -moz-transform: rotate(45deg); /* Firefox */
+  -webkit-transform: rotate(45deg); /* Safari 和 Chrome */
+  -o-transform: rotate(45deg); /* Opera */
+
+  position: absolute;
+  right: -35px;
+  top: -27px;
+}
+.box{
+  width:38px;
+  height:38px;
+  color: #fff;
+  /* Rotate div */
+  transform:rotate(45deg);
+  -ms-transform:rotate(45deg); /* Internet Explorer */
+  -moz-transform:rotate(45deg); /* Firefox */
+  -webkit-transform:rotate(45deg); /* Safari 和 Chrome */
+  -o-transform:rotate(45deg); /* Opera */
+
+  position: absolute;
+  right: -19px;
+  top: 0px;
+  .text {
+  position: absolute;
+  bottom: 0;
+  
+}
+}
+
+
 </style>