<template>
  <el-form>
    <div  style="background-color: #ffffff;height: 1200px;padding: 2% 4%;">
      <avue-form :option="option"    ref="myForm" v-model="form">
        <template #input="{row}">
          <el-tag>序号:{{row.$index}}-数据:{{row.input}}</el-tag>
        </template>
        <template #label="{prop, label}">
          <div class="avue-input-wrapper">
            <span>{{ label }}</span>
            <el-button v-if="prop === 'vehiclePhoto'" @click="handleButtonClick">点击按钮</el-button>
          </div>
        </template>
      </avue-form>
      <div style="bottom: 7%;margin-left: 500px;width: 50%">
        <div style="width: 100%">
          <el-button  type="primary" @click="submitForm" style="margin-right: 20%"  :disabled=this.isDis>确定</el-button>
          <el-button  type="primary" @click="cancellation" >取消</el-button>
        </div>
      </div>
    </div>

  </el-form>
</template>

<script>
import {update} from '@/api/basicdata/basicdataVehicle';

import { getDetail as getDetailWarehouse } from '@/api/basicdata/basicdataWarehouse';
export default {
  name: "basicDeLineform",
  props: {
    vehicleformdata:{
      type:Object,
    },
  },
  created(){
    if (!!this.vehicleformdata){this.initData()}
  },
  data() {
    return {
      //防止重复点击
      isDis:false,
      nodequery:{},
      form: {
      },
      // 分页信息
      nodepage: {
        currentPage: 1,
        pageSize: 50,
        total: 40
      },
      option:  {
        emptyBtn: false, //隐藏清空按钮
        submitBtn: false, //隐藏提交按钮
        height:'auto',
        calcHeight: 30,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        disabled:this.vehicleformdata.view,
        index: true,
        viewBtn: false,
        selection: true,
        dialogClickModal: false,
        column: [
          // {
          //   label: "主键",
          //   prop: "id",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "租户号",
          //   prop: "tenantId",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "创建人",
          //   prop: "createUser",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "创建时间",
          //   prop: "createTime",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "更新人",
          //   prop: "updateUser",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "更新时间",
          //   prop: "updateTime",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "状态",
          //   prop: "status",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "是否已删除;1-未删除，2-已删除",
          //   prop: "isDeleted",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "创建部门",
          //   prop: "createDept",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          {
            label: "车牌号",
            prop: "vehicleNub",
            type: "input",
            search: true,
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,

          },
          {
            label: "车辆来源",
            prop: "vehicleSource",
            type: "select",
            search: true,
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=basic_vehicle_source',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "是否车头",
            prop: "isHead",
            type: "select",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=yes_no',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "挂车类型",
            prop: "trailerType",
            type: "select",
            search: true,
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=basic_trailer_type',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "车辆类型",
            prop: "vehicleModel",
            type: "select",
            search: true,
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=basic_vehicle_model',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "车厢类型",
            prop: "carType",
            type: "select",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code= basic_car_type',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "车长(M)",
            prop: "vehicleCommander",
            type: "input",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
          },
          {
            label: "外廓高",
            prop: "vehicleHeight",
            type: "input",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
          },
          {
            label: "付款方式",
            prop: "paymentMethod",
            type: "select",
            search: true,
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            filterable: true,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=basicdata_vehicle_paymentmethod',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "核定体积",
            prop: "approvedVolume",
            type: "input",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
          },
          {
            label: "车牌颜色",
            prop: "licensePlateColor",
            type: "select",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=basic_plate_color',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "车身颜色",
            prop: "vehicleColor",
            type: "select",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=basic_vehicle_color',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "能源类型",
            prop: "energyType",
            type: "select",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=basic_energy_type',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "车牌类型",
            prop: "licensePlateType",
            type: "select",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=basic_plate_type',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "备注",
            prop: "notes",
            type: "input",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
          },
          {
            label: "车辆所属人",
            prop: "vehicleOwner",
            type: "input",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
          },
          {
            label: "品牌型号",
            prop: "vehicleBrand",
            type: "input",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
          },
          {
            label: "车辆代号",
            prop: "vehicleCode",
            type: "input",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
          },
          {
            label: "发动机型号",
            prop: "engineCode",
            type: "input",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
          },
          {
            label: "车辆总质量(T)",
            prop: "vehicleQuality",
            type: "input",
            labelWidth:'150',
            width:"120px",
            align:'center',
            span:6,
          },
          {
            label: "整备质量(T)",
            prop: "curbWeight",
            type: "input",
            labelWidth:'150',
            width:"120px",
            align:'center',
            span:6,
          },
          {
            label: "载荷质量(T)",
            prop: "loadMass",
            type: "input",
            labelWidth:'150',
            width:"120px",
            align:'center',
            span:6,
          },
          {
            label: "外廓宽(M)",
            prop: "outerWidth",
            type: "input",
            labelWidth:'150',
            width:"120px",
            align:'center',
            span:6,
          },
          {
            label: "到期时间",
            prop: "expirationTime",
            type: "input",
            labelWidth:'150',
            width:"100px",
            align:'center',
            span:6,
          },
          {
            label: "道路运输证号",
            prop: "roadTransport",
            type: "input",
            labelWidth:'150',
            width:"150px",
            align:'center',
            span:6,
          },
          {
            label: "经营许可证号",
            prop: "businessLicense",
            type: "input",
            labelWidth:'150',
            width:"150px",
            align:'center',
            span:6,
          },
          {
            label: "车辆所属单位",
            prop: "vehicleUnit",
            type: "input",
            labelWidth:'150',
            width:"150px",
            align:'center',
            span:6,
          },
          {
            label: "车辆所属单位电话",
            prop: "vehicleUnitPhone",
            type: "input",
            labelWidth:'150',
            width:"180px",
            align:'center',
            span:6,
          },
          {
            label: "车辆所属人手机号",
            prop: "vehicleOwnerPhone",
            type: "input",
            labelWidth:'150',
            width:"180px",
            align:'center',
            span:6,
          },
          {
            label: "车辆所属人身份证号",
            prop: "vehicleOwnerCard",
            type: "input",
            labelWidth:'150',
            width:"180px",
            align:'center',
            span:6,
          },
          {
            label: "承运商",
            prop: "carrierId",
            type: "select",
            labelWidth:'150',
            width:"100px",
            align:'center',
            search: true,
            span:6,
            filterable: true,
            dicUrl: '/api/logpm-basicdata/carrier/dictionary',
            props: {
              label: 'number',
              value: 'id',
            },
            rules: [{ required: true, message: '请选择承运商!',trigger: 'blur'}],
          },
          {
            label: "车辆年审时间",
            prop: "reviewTime",
            width:"120px",
            align:'center',
            type: "date",
            format: "YYYY-MM-DD",
            valueFormat: "YYYY-MM-DD",
            labelWidth:'150',
            span:6,
          },
          {
            label: "车辆年审有效期",
            prop: "reviewValidity",
            type: "input",
            labelWidth:'150',
            width:"150px",
            align:'center',
            span:6,
          },
          {
            label: "车辆保险开始时间",
            prop: "insuranceStartTime",
            type: "date",
            format: "YYYY-MM-DD",
            valueFormat: "YYYY-MM-DD",
            labelWidth:'150',
            width:"150px",
            align:'center',
            span:6,
          },
          {
            label: "车辆保险结束时间",
            prop: "insuranceEndTime",
            type: "date",
            format: "YYYY-MM-DD",
            valueFormat: "YYYY-MM-DD",
            labelWidth:'150',
            width:"150px",
            align:'center',
            span:6,
          },
          {
            label: "有无车身广告",
            prop: "bodyAdvertising",
            type: "select",
            labelWidth:'150',
            width:"150px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=yes_no',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "车身广告更新时间",
            prop: "advertisementsNewTimes",
            type: "date",
            format: "YYYY-MM-DD",
            valueFormat: "YYYY-MM-DD",
            labelWidth:'150',
            width:"180px",
            align:'center',
            span:6,
          },
          // {
          //   label: "车辆挂靠公司",
          //   prop: "vehicleParkingCompany",
          //   type: "input",
          //   labelWidth:'150',
          //   width:"150px",
          //   align:'center',
          //   span:6,
          // },
          {
            label: "是否有GPS",
            prop: "withGps",
            type: "select",
            labelWidth:'150',
            width:"150px",
            align:'center',
            span:6,
            dicUrl: '/api/blade-system/dict-biz/dictionary?code=yes_no',
            props: {
              label: 'dictValue',
              value: 'dictKey',
            },
          },
          {
            label: "GPS服务商",
            prop: "gpsServiceProvider",
            type: "input",
            labelWidth:'150',
            width:"120px",
            align:'center',
            span:6,
          },
          {
            label: "GPS型号",
            prop: "gpsModel",
            type: "input",
            labelWidth:'150',
            width:"120px",
            align:'center',
            span:6,
          },
          {
            label: "行驶证正面照片",
            prop: "drivingLicensePhoto",
            type: "upload",
            dataType: 'string',
            listType: 'picture-img',
            hide: true,
            labelWidth:'150',
            span:6,
            multiple:false,
            width:"200px",
            align:'left',
            action: '/blade-resource/oss/endpoint/put-file',
            propsHttp: {
              res: 'data',
              url: 'link',
            },
          },
          {
            label: "行驶证照片反面",
            prop: "drivingLicensePhotoBack",
            type: "upload",
            dataType: 'string',
            listType: 'picture-img',
            hide: true,
            labelWidth:'150',
            span:6,
            multiple:false,
            width:"200px",
            align:'left',
            action: '/blade-resource/oss/endpoint/put-file',
            propsHttp: {
              res: 'data',
              url: 'link',
            },
          },
          {
            label: "许可证照片",
            prop: "licensePhoto",
            type: "upload",
            dataType: 'string',
            listType: 'picture-img',
            hide: true,
            labelWidth:'150',
            span:6,
            multiple:false,
            width:"200px",
            align:'left',
            action: '/blade-resource/oss/endpoint/put-file',
            propsHttp: {
              res: 'data',
              url: 'link',
            },
          },
          {
            label: "车辆照片(最新)",
            prop: "vehiclePhoto",
            type: 'upload',
            listType: 'picture-img',
            dataType: 'string',
            labelWidth:'150',
            span:6,
            multiple:false,
            width:"200px",
            align:'left',
            action: '/blade-resource/oss/endpoint/put-file',
            // limit: 3,
            propsHttp: {
              res: 'data',
              url: 'link',
            },
          },
          {
            label: "车尾照片",
            prop: "vehicleRearPhoto",
            type: 'upload',
            listType: 'picture-img',
            dataType: 'string',
            labelWidth:'150',
            span:6,
            multiple:false,
            width:"200px",
            align:'left',
            action: '/blade-resource/oss/endpoint/put-file',
            // limit: 3,
            propsHttp: {
              res: 'data',
              url: 'link',
            },
          },
          {
            label: "道路运输照片",
            prop: "roadTransportPhoto",
            type: "upload",
            dataType: 'string',
            listType: 'picture-img',
            hide: true,
            labelWidth:'150',
            span:6,
            multiple:false,
            width:"200px",
            align:'left',
            action: '/blade-resource/oss/endpoint/put-file',
            propsHttp: {
              res: 'data',
              url: 'link',
            },
          },
          {
            label: "人车合影照片",
            prop: "vehiclePeoplePhoto",
            type: "upload",
            dataType: 'string',
            listType: 'picture-img',
            hide: true,
            labelWidth:'150',
            span:6,
            multiple:false,
            width:"200px",
            align:'left',
            action: '/blade-resource/oss/endpoint/put-file',
            propsHttp: {
              res: 'data',
              url: 'link',
            },
          },
          {
            label: "保险卡照片",
            prop: "insuranceCardPhoto",
            type: "upload",
            dataType: 'string',
            listType: 'picture-img',
            hide: true,
            labelWidth:'150',
            span:6,
            multiple:false,
            width:"200px",
            align:'left',
            action: '/blade-resource/oss/endpoint/put-file',
            propsHttp: {
              res: 'data',
              url: 'link',
            },
          },
          {
            label: "历史照片",
            prop: "historicPhotos",
            type: 'upload',
            listType: 'picture-card',
            dataType: 'string',
            labelWidth:'150',
            span:12,
            multiple:true,
            width:"200px",
            align:'left',
            action: '/blade-resource/oss/endpoint/put-file',
            limit: 3,
            disabled:true,
            propsHttp: {
              res: 'data',
              url: 'link',
            },
          },

          // {
          //   label: "预留1",
          //   prop: "reserve1",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "预留2",
          //   prop: "reserve2",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "预留3",
          //   prop: "reserve3",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "预留4",
          //   prop: "reserve4",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
          // {
          //   label: "预留5",
          //   prop: "reserve5",
          //   type: "input",
          //   addDisplay: false,
          //   editDisplay: false,
          //   viewDisplay: false,
          //   hide: true,
          // },
        ]
      }
    }


    },
  methods: {
    //点击
    handleButtonClick(){},
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        console.log("type>>>>>>>",type);
      }
      done();
    },
    initData(){
      this.form = this.vehicleformdata;
    },
    cancellation(){
      let str = {
        val: false
      }
      this.$emit("returnvehicle", str);
    },
    submitForm(){
      this.$refs.myForm.validate(valid => {
        if (valid) {
          this.isDis = true;
          let row = this.form
          console.log("更新参数>>>>>>>>",row);
        //  if (!!row.id){
            update(row).then(() => {
              this.$message({
                type: "success",
                message: "操作成功!"
              });
              let str = {
                val: true
              }
              this.isDis = false;
              this.$emit("returnvehicle", str);
            }, error => {
              this.isDis = false;
              console.log(error);
            });
          // }else {
          //   add(row).then(() => {
          //     this.$message({
          //       type: "success",
          //       message: "操作成功!"
          //     });
          //     let str = {
          //       val: true
          //     }
          //     this.isDis = false;
          //     this.$emit("returnDeline", str);
          //   }, error => {
          //     this.isDis = false;
          //     window.console.log(error);
          //   });
          // }
        }
      });
    }
  }
}
</script>

<style scoped>

</style>
