// 采购内转需求
<template>
  <div class="admin">
    <template>
      <div class="admin1">
        <el-tabs v-model="activeName">
          <el-tab-pane label="补录计量实绩" name="first">
            <div class="switch">
                <el-switch
                v-model="switchValue"
                active-text="二次过磅"
                inactive-text="首次过磅"
                @change = "onchange">
                </el-switch>
            </div>
          <div class="admin2">
            <div class="carrier from">
                <el-form
                    :inline="true"
                    class="demo-form-inline"
                    label-width="80px"
                    >
                    <el-form-item label="车牌号:">
                    <el-autocomplete
                    class="inline-input"
                    v-model="capacityName"
                    :fetch-suggestions="querySearchCapacity"
                    placeholder="车牌号"
                    :trigger-on-focus="false"
                    @select="handleSelectCapacity"
                    >
                    <template slot-scope="{ item }">
                    <div class="name">{{ item.capacityNumber }}</div>
                    </template>
                    </el-autocomplete>
                    </el-form-item>
                </el-form>
            </div>
            <div class="material from">
                <span class="text">物资:</span>
                <el-select v-model="materialId" placeholder="请选择">
                <el-option
                    v-for="item in materialList"
                    :key="item.materialId"
                    :label="item.materialName" 
                    :value="item.materialId"
                >
                </el-option>
                </el-select>
            </div>

            <div class="poundNo from">
                <span class="text">磅单号:</span>
                <el-input v-model="poundNo"></el-input>
            </div>
            <div class="block" v-if="first">
                <span class="text">首次称重时间:</span>
                <el-date-picker
                v-model="value1"
                type="datetime"
                placeholder="选择日期时间">
                </el-date-picker>
            </div>
            <div class="firstWeight from " v-if="first">
                <span class="text">首次称重重量(吨):</span>
                <el-input v-model="firstWeight"></el-input>
            </div>
            <div class="truckCalFirst from" v-if="first">
                <span class="text">首次汽车衡:</span>
                <el-select v-model="truckCalFirst" placeholder="请选择" @change="onchange1">
                <el-option
                    v-for="item in truckCalFirstList"
                    :key="item.value"
                    :label="item.label" 
                    :value="item.value"
                >
                </el-option>
                </el-select>
            </div>
            <div class="block" v-if="second">
                <span class="text">二次称重时间:</span>
                <el-date-picker
                v-model="value2"
                type="datetime"
                placeholder="选择日期时间">
                </el-date-picker>
            </div>
            <div class="secondWeight from" v-if="second">
                <span class="text">二次称重重量(吨):</span>
                <el-input v-model="secondWeight"></el-input>
            </div>
            <div class="truckCalSecond from" v-if="second">
                <span class="text">二次汽车衡:</span>
                <el-select v-model="truckCalSecond" placeholder="请选择" @change="onchange2">
                <el-option
                    v-for="item in truckCalSecondList"
                    :key="item.value"
                    :label="item.label" 
                    :value="item.value"
                >
                </el-option>
                </el-select>
            </div>
            <div class="netWeight from" v-if="second">
                <span class="text">净重(吨):</span>
                <el-input v-model="netWeight"></el-input>
            </div>
          </div>
          <div class="button_box">
            <el-button @click="onClickCancel">返回</el-button>
            <el-button type="primary" @click="onClickConfirm" :disabled = "disabled">确认</el-button>
          </div>
          </el-tab-pane>
          <el-tab-pane label="修改路段顺序" name="second">
              <div class="admin2">
            <div class="carrier from">
                <el-form
                    :inline="true"
                    class="demo-form-inline"
                    label-width="80px"
                    >
                    <el-form-item label="车牌号:">
                    <el-autocomplete
                    class="inline-input"
                    v-model="capacityName"
                    :fetch-suggestions="querySearchCapacity"
                    placeholder="车牌号"
                    :trigger-on-focus="false"
                    @select="handleSelectCapacity"
                    >
                    <template slot-scope="{ item }">
                    <div class="name">{{ item.capacityNumber }}</div>
                    </template>
                    </el-autocomplete>
                    </el-form-item>
                </el-form>
            </div>
            <div class="poundNo from">
                <span class="text">运输订单号:</span>
                <el-input v-model="orderNumber" disabled></el-input>
            </div>
            <div class="poundNo from">
                <span class="text">路段顺序号:</span>
                <el-input v-model="lineQuence" @input="oninput"></el-input>
            </div>
            <div class="button_box">
            <el-button type="primary" @click="updateLineSqe" :disabled = "disabled">确认</el-button>
          </div>
          </div>
          </el-tab-pane>
        </el-tabs>
      </div>
    </template>
  </div>
</template>
<script>
import { toDateString } from "../app.js"
export default {
  data() {
    return {
        orderNumber:null,
        first:true,
        second:true,
        activeName:"first",
        capacityName:null,
        stateCapacity:null,
        materialList:[],
        capacityId:null,
        materialId:null,
        value1:null,
        value2:null,
        disabled:false,
        orderId:null,
        firstWeight:null,
        secondWeight:null,
        netWeight:null,
        poundNo:null,
        truckCalFirstList:[],
        truckCalSecondList:[],
        truckCalFirst:null,
        truckCalSecond:null,
        switchValue:true,
        truckCalFirstNum:null,
        truckCalSecondNum:null,
        lineQuence:null
    };
  },
  created(){ 
  },
  mounted(){
      this.information()
  },
  methods: {
    updateLineSqe(){
        let map = {
            orderId:this.orderId,
            orderLineSqe:this.lineQuence
        }
        this.axios.post("/api/v1/uc/updateLineSqe",map).then((res) =>{
            console.log(res.data);
             if(res.data.code == "200"){
                this.$message.success("修改路段顺序号成功")
                this.$router.go(-1)
            }
           
        })
    },
    oninput(){

    },
    onchange(){
        console.log(this.switchValue)
        console.log(typeof(this.switchValue))
        if(this.switchValue){
            this.first = true
            this.second = true
        }else{
            this.second = false
        }
    },
    onchange1(){
        console.log(this.truckCalFirst)
        this.truckCalFirstList.forEach(e => {
            if(this.truckCalFirst == e.value){
                this.truckCalFirstNum = e.label
            }
        });
    },
    onchange2(){
        console.log(this.truckCalSecond)
        this.truckCalSecondList.forEach(e => {
            if(this.truckCalSecond == e.value){
                this.truckCalSecondNum = e.label
            }
        });
    },        
    //运力弹出层
    handleSelectCapacity(item){
      console.log(item)
      this.capacityId = item.capacityId
      this.capacityName = item.capacityNumber
      this.axios.get("/api/v1/uc/getOrderNumber?capacityId=" + this.capacityId).then((res) =>{
          if(res.data.code == "200"){
              console.log("----");
              console.log(res.data)
              console.log("----");
              this.orderId = res.data.data.orderId
              this.orderNumber = res.data.data.orderNumber
              this.axios.get("/api/v1/uc/getMaterialIdByOrderId?orderId=" + this.orderId).then((res) =>{
                  if(res.data.code == "200"){
                      this.materialList = res.data.data
                  }
              })
          }
      })
    },
    //以下是运力边输边查搜索
    querySearchCapacity(queryString, cb) {
        if(queryString.length < 3){
            return
        }
        this.axios.get('/api/v1/uc/getCapacityNumber?index='+queryString).then((res)=>{
        if(res.data.code == "200"){
          var restaurantsCarrier = res.data.data
          console.log(restaurantsCarrier,"restaurantsCarrier");
          var results = queryString ? restaurantsCarrier.filter(this.createFilterCarrier(queryString)) :restaurantsCarrier;
           // 调用 callback 返回建议列表的数据
          cb(results);
        }
        })     
      },
    createFilterCarrier(queryString) {
        return (restaurantsCarrier)  =>  {
          return (restaurantsCarrier.capacityNumber.toLowerCase().indexOf(queryString.toLowerCase()) > -1);
        };
      },
    //以上是承运商边输边查搜索
    information(){
        this.axios.get("/api/v1/uc/getAllCalculateMes").then((res) =>{
            
            this.truckCalFirstList = res.data
            this.truckCalSecondList = res.data
        })
    },
    onClickConfirm(){
        if(this.switchValue){
            if(this.orderNumber==null||this.truckCalFirst==null||this.truckCalSecond==null||
            this.firstWeight==null||this.secondWeight==null||this.netWeight==null||this.value1==null
            ||this.value2==null||this.poundNo==null||this.materialId==null){
                this.$message.warning("请填写所有值!!!")
                return
            }
        }else{
            if(this.orderNumber==null||this.truckCalFirst==null||
            this.firstWeight==null||this.value1==null
            ||this.poundNo==null||this.materialId==null){
                this.$message.warning("请填写所有值!!!")
                return
            }
        }
        let mapFirst = {
            orderNumber:this.orderNumber,
            resultTareCalculateNumber: this.truckCalFirstNum,
            resultTareWeight: this.firstWeight + "",
            resultTareWeightTime: toDateString(this.value1),
            resultPoundNo: this.poundNo,
            materialId: this.materialId + ""
        }
        let mapSecond = {
            orderNumber:this.orderNumber,
            resultTareCalculateNumber: this.truckCalFirstNum,
            resultCrossCalculateNumber: this.truckCalSecondNum,
            resultTareWeight: this.firstWeight + "",
            resultCrossWeight: this.secondWeight + "",
            resultNetWeight: this.netWeight + "",
            resultTareWeightTime: toDateString(this.value1),
            resultCrossWeightTime: toDateString(this.value2),
            resultPoundNo: this.poundNo,
            materialId: this.materialId + ""
        }
        var arr = []
        if(this.switchValue){
            arr.push(mapSecond)
        }else{
            arr.push(mapFirst)
        }
        this.axios.post("http://172.16.33.166:8066/api/v1/join/tmstruckweightresult/receiveTmsTruckWeightResult",arr).then((res) =>{
            if(res.data.code == "200"){
                this.$message.success("补录计量实绩成功")
                this.$router.go(0)
            }
        })
    },
    onClickCancel(){
    },
    
  },
};
</script>
<style lang="scss">
.admin{
  .admin1 {

      margin-top: 40px;
      margin-left: 40px;
      .switch {
          display: flex;
          justify-content: center;
          align-items: center;
          margin-top: 20px;
          color: aqua;
      }
      .button_box {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100px;
        }
      .admin2 {    
        margin-top: 40px; 
        .from {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 20px;
        margin-bottom: 20px;
        }
        .carrier{
            display: flex;
            justify-content: center;
            align-items: center;
            .el-form-item {
                text-align: right;
            }
            .el-autocomplete{
            width: 250px;
            }
        }
        .material {
        display: flex;
        justify-content: center;
        margin-top: 20px;
        margin-right: 100px;
        .text {
            display: inline-block;
            width: 170px;
            text-align: right;
        }
        .el-input {
            width: 250px;
        }
        }
        .poundNo {
            display: flex;
            justify-content: center;
            align-items: center;
            margin-top: 20px;
            margin-right: 100px;
            .text {
            display: inline-block;
            width: 170px;
            text-align: right;
                  }
            .el-input {
            width: 250px;
                    }
        }  
        .block {
            display: flex;
            justify-content: center;
            align-items: center;
            margin-top: 20px;
            margin-right: 100px;
            .el-input {
                width: 250px;
            }
            .text {
            display: inline-block;
            width: 170px;
            text-align: right;
            }
        }
        .truckCalFirst {
            display: flex;
            justify-content: center;
            margin-top: 20px;
            margin-right: 100px;
            .text {
                display: inline-block;
                width: 170px;
                text-align: right;
            }
            .el-input {
                width: 250px;
            }
        }
        .truckCalSecond {
            display: flex;
            justify-content: center;
            margin-top: 20px;
            margin-right: 100px;
            .text {
                display: inline-block;
                width: 170px;
                text-align: right;
            }
            .el-input {
                width: 250px;
            }
        }
        .secondWeight {
           display: flex;
            justify-content: center;
            align-items: center;
            margin-top: 20px;
            margin-right: 100px;
            .text {
            display: inline-block;
            width: 170px;
            text-align: right;
                  }
            .el-input {
            width: 250px;
                    } 
        }
        .firstWeight {
            display: flex;
            justify-content: center;
            align-items: center;
            margin-top: 20px;
            margin-right: 100px;
            .text {
            display: inline-block;
            width: 170px;
            text-align: right;
                  }
            .el-input {
            width: 250px;
                    }
        }
        .netWeight {
            display: flex;
            justify-content: center;
            align-items: center;
            margin-top: 20px;
            margin-right: 100px;
            .text {
            display: inline-block;
            width: 170px;
            text-align: right;
                  }
            .el-input {
            width: 250px;
                    }
        }
      }      
  }
  }
</style>
