修改

src/components/Supplier/roomQuery2.vue

@@ -20,7 +20,7 @@
         <div style="display:inline-block;color:red">注意事项:每次导出数据最好不要超过一个月。</div>
         <div class="rq_comSpan" style="display:inline-block;">颜色说明:
           <span class="rq_span1">未操作</span><span class="rq_span2">操作中</span><span class="rq_span3">操作完成</span><span
-            class="rq_span4">机位数和人数不相符</span>
+            class="rq_span4">机位数和人数不相符</span><span class="rq_span4">取消个数</span>
         </div>
       </div><br />
       <table border="0" cellspacing="1" cellpadding="0" class="roomQuery_SupplierTable" v-loading='loading'>
@@ -39,15 +39,6 @@
             <td style="position:relative;">
               {{item.NewCombinationNum}}
               <div class="Add_triangle" v-if="item.IsBookTeam==1&&todayDate==getDateYear(item.HotelBookTimeStr)"></div>
-              {{item.IsBookTeam}}
-              {{item.HotelBookTimeStr}}
-              <div class="rQ_HtList">
-                  <span></span>
-                  <span></span>
-                  <span></span>
-                  <span></span>
-                  <span></span>
-              </div>
             </td>
             <td>
               {{item.TCNUMS}}({{item.TCID}})
@@ -165,7 +156,10 @@
           </tr>
           <tr>
             <td colspan="8" style="text-align:left;padding-left:5px;">
-              注意事项： {{item.SupplierRemarks}}
+              <div class="rQ_HtList" v-if="item.IsBookTeam==2">
+                  <span v-for="subItem in item.Numbers"></span>
+              </div>
+              <div>注意事项： {{item.SupplierRemarks}}</div>
             </td>
           </tr>
           <tr>
@@ -230,6 +224,7 @@
         //是否为今天
         isToday:false,
         todayDate:'',
+        showNum:0,
       }
     },
     methods: {
@@ -251,12 +246,24 @@
           this.loading = false;
           if (res.data.resultCode == 1) {
             this.dataList = res.data.data;
-            console.log("Supplier_V2",this.dataList);
+            this.dataList.forEach(x=>{
+                if(x.HotelBookTimeStr){
+                  x.Numbers = 5- this.DateMinus(x.HotelBookTimeStr);
+                }
+            })
+            console.log(this.dataList,'datalist');
           } else {
             this.Error(res.data.message)
           }
         }, err => {})
       },
+      DateMinus(sDate){ 
+      　　var sdate = new Date(sDate.replace(/-/g, "/")); 
+      　　var now = new Date(); 
+      　　var days = sdate.getTime()-now.getTime(); 
+      　　var day = parseInt(days / (1000 * 60 * 60 * 24)); 
+      　　return day; 
+      },
       //获取酒店列表
       getHotelList(TCID, NewCombinationNum) {
         this.hotelLoading = true;
@@ -468,25 +475,27 @@
       left:0;
       top:0;
       border-style: solid;
-      border-width: 40px 40px 0 0;
+      border-width: 45px 45px 0 0;
       border-color: red transparent transparent 
   }
   .Add_triangle::after {
     content: '新增';
     position: absolute;
-    top: -35px;
+    top: -42px;
     right: -27px;
     white-space: nowrap;
     color: #FFFFFF;
     font-size: 12px;
 }
 .rQ_HtList{
-  margin-top:10px;
+  margin-top:5px 0 3px 0;
 }
 .rQ_HtList span{
   display:inline-block;
   width:15px;
   height:15px;
+  margin-right:5px;
+  background-color: red;
   border:1px solid #d1d1d1;
 }
 </style>