<template>
    <div class="head_top">
        <div @click="ccc" :class="aaa?'buts check':'buts'">
            自主配送
        </div>
        <div @click="ddd" :class="bbb?'buts check':'buts'">
            外协
        </div>
    </div>
    <div style="margin: 2%;background-color: #ffffff;padding: 20px;box-sizing: border-box;" v-if="aaa">
        <el-form ref="form" :model="driverForm" label-width="100px" style="margin: 3px">
            <el-row>
                <el-col :span="6">
                    <el-form-item label="配送司机信息:" prop="goodsShelfId">
                        <!--                        @change="changeSlaveDriver"-->
                        <el-select
                                v-model="deliveryDriver"
                                multiple
                                filterable
                                @change="changeDriver"

                                placeholder="请选择司机"
                        >
                            <el-option
                                    v-for="item in driverData"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="配送车辆信息:" prop="vehicleIds">
                        <el-select
                                filterable
                                multiple
                                v-model="vehicleIds"
                                placeholder="请选择车辆"
                                @change="changeVehicle"
                        >
                            <el-option
                                    v-for="item in vehicleData"
                                    :key="item.id"
                                    :label="item.vehicleNub"
                                    :value="item.id"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>

                <el-col :span="6">
          <span>
            <el-form-item label="主司机:" prop="forklift">
              <el-input v-model="driverForm.masterDriverName" :disabled="true"> </el-input>
            </el-form-item>
            <el-form-item label="主车辆:" prop="forklift">
              <el-input v-model="driverForm.masterVehicleNub" :disabled="true"> </el-input>
            </el-form-item>
          </span>
                </el-col>
                <el-col :span="6">
                    <el-button round @click="viewDriverInfo" style="margin-left: 10%">查看司机配置</el-button>
                </el-col>
            </el-row>
        </el-form>
    </div>

    <div style="margin: 2%;background-color: #ffffff;padding: 20px;box-sizing: border-box;" v-if="bbb">
        <el-form ref="form" :model="waixieForm" label-width="100px" style="margin: 3px">
            <el-row>
                <el-col :span="6">
                    <el-form-item label="外协来源:" prop="goodsShelfId">
                        <el-select filterable v-model="waixieForm.tripartiteSource" placeholder="请选择来源">
                            <el-option
                                    v-for="item in tripartiteSourceData"
                                    :key="item.dictKey"
                                    :label="item.dictValue"
                                    :value="item.dictKey"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="司机名称:" prop="goodsShelfId">
                        <el-input v-model="waixieForm.driverName" placeholder="请输入司机名称"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="司机电话:" prop="goodsShelfId">
                        <el-input v-model="waixieForm.driverPhone" placeholder="请输入司机电话"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="车辆车牌:" prop="goodsShelfId">
                        <el-input v-model="waixieForm.vehicleNum" placeholder="请输入本次费用"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="配送费用:" prop="goodsShelfId">
                        <el-input v-model="waixieForm.deliveryFee" placeholder="请输入本次费用"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </div>
    <div style="margin: 2%;background-color: #ffffff;padding: 20px;box-sizing: border-box;">
        <el-form ref="form" :model="stockUpForm" label-width="100px" style="margin: 3px">
            <el-row>
                <el-col :span="6">
                    <el-form-item label="备货人员:" prop="forklift">
                        <el-select filterable v-model="stockUpForm.forklift" placeholder="请选择备货人员">
                            <el-option
                                    v-for="item in this.forkliftData"
                                    :key="item.dictKey"
                                    :label="item.dictValue"
                                    :value="item.dictKey"
                                    :disabled="isDisable"
                            >
                            </el-option>
                            <!--                            {{this.forkliftData}}-->
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="装车班组:" prop="loader">
                        <el-select filterable v-model="stockUpForm.loader" placeholder="请选择装卸班组">
                            <el-option
                                    v-for="item in loaderData"
                                    :key="item.dictKey"
                                    :label="item.dictValue"
                                    :value="item.dictKey"
                                    :disabled="isDisable"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="卸车班组:" prop="loader">
                        <el-select filterable v-model="stockUpForm.unloader" placeholder="请选择装卸班组">
                            <el-option
                                    v-for="item in loaderData"
                                    :key="item.dictKey"
                                    :label="item.dictValue"
                                    :value="item.dictKey"
                                    :disabled="isDisable"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
<!--                <el-col :span="6">-->
<!--                    <el-form-item label="班组职能:" prop="goodsAreaId">-->
<!--                        <el-checkbox-group v-model="loadAndUnload">-->
<!--                            <el-checkbox-->
<!--                                    v-for="item in loadAndUnloadData"-->
<!--                                    :label="item.dictKey"-->
<!--                                    :value="item.dictKey"-->
<!--                                    :disabled="isDisable"-->
<!--                            >-->
<!--                                <span>{{ item.dictValue }}</span>-->
<!--                            </el-checkbox>-->
<!--                        </el-checkbox-group>-->
<!--                    </el-form-item>-->
<!--                </el-col>-->
                <el-col :span="6">
                    <el-form-item label="配送类型:" prop="goodsAreaId">
                        <el-radio-group v-model="stockUpForm.deliveryType">
                            <el-radio :label="'2'" :value="'2'">市配&emsp;</el-radio>
                        </el-radio-group>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="6">
                    <el-form-item label="备货区域:" prop="goodsAreaId">
                        <el-select filterable v-model="stockUpForm.goodsAreaId" placeholder="请选择备货区域">
                            <el-option
                                    v-for="item in goodsAreaData"
                                    :key="item.dictKey"
                                    :label="item.dictValue"
                                    :value="item.dictKey"
                                    :disabled="isDisable"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="备货时间:" prop="goodsShelfId">
                        <el-date-picker v-model="stockUpForm.stockupDate"
                                        type="datetime"
                                        placeholder="请选择备货时间"
                                        :disabled="isDisable"
                                        format="YYYY-MM-DD HH:mm:ss"
                                        value-format="YYYY-MM-DD HH:mm:ss"
                        >
                        </el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="出库时间:" prop="outboundDate" label-width="100px">
                        <!--            <el-date-picker v-model="form.taskTime"-->
                        <!--                            type="datetime"-->
                        <!--                            placeholder="请选择配车时间"-->
                        <!--                            value-format="YYYY-MM-DD HH:mm:ss"-->
                        <!--            >-->
                        <!--            </el-date-picker>-->
                        <el-date-picker v-model="stockUpForm.outboundDate"
                                        type="datetime"
                                        placeholder="请选择配车时间"
                                        format="YYYY-MM-DD HH:mm:ss"
                                        value-format="YYYY-MM-DD HH:mm:ss"
                        >
                        </el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="配送时间:" prop="taskTime" label-width="100px">
                        <!--            <el-date-picker v-model="form.taskTime"-->
                        <!--                            type="datetime"-->
                        <!--                            placeholder="请选择配车时间"-->
                        <!--                            value-format="YYYY-MM-DD HH:mm:ss"-->
                        <!--            >-->
                        <!--            </el-date-picker>-->
                        <el-date-picker v-model="stockUpForm.taskTime"
                                        type="data"
                                        placeholder="请选择配车时间"
                                        format="YYYY-MM-DD"
                                        value-format="YYYY-MM-DD"
                        >
                        </el-date-picker>
                    </el-form-item>
                </el-col>

            </el-row>

            <el-row>
                <el-col :span="12">
                    <el-form-item label="其他费用:" prop="collectFee" label-width="100px">
                        <el-input v-model="stockUpForm.otherFee" placeholder="请输入其他费用"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="备注:" prop="remarks">
                        <el-input type="textarea" :rows="1" placeholder="请输入内容" v-model="stockUpForm.remarks">
                        </el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </div>
    <h3>预约列表</h3>
    <div>
        <el-row>
          <tablecmt
          :columnList="columnList"
          :tableData="reservationData"
          :loading="loading"
          @inputTxt="inputsc"
          @timeCheck="timesc"
          @btnCheck="btnsc"
          @selectCheck="selectsc"
          @selection="selectionChange"
        >
          <template #default="slotProps">
            <el-text v-if="isoperation" type="primary" link icon="el-icon-edit" @click="removeStockArticle(slotProps.scope.row)">移除</el-text>
          </template>
        </tablecmt>
        </el-row>
        <el-form-item style="margin-left: 45%;margin-top: 10px">
            <el-button type="primary" icon="el-icon-circle-close" @click="onSubmitOrder">提交(配送内容)</el-button>
            <el-button icon="el-icon-circle-close" @click="this.$router.go(-1)">返 回</el-button>
        </el-form-item>
    </div>

    <el-dialog title="司机配置" v-model="isDriverShow" width="50%">
        <div style="display: flex">
            <div style="flex: 1">
                <el-table
                        ref="multipleTable"
                        v-loading="loading"
                        :data="driverInfo"
                        style="width: 100%"
                        :border="option.border"
                        @select-all="handleSelect"
                        @select="handleSelect"
                >
                    <el-table-column
                            type="selection"
                            v-if="option.selection"
                            width="55"
                            align="center"

                    ></el-table-column>
                    <template v-for="(item, index) in option.columnDriverInfo">
                        <!-- table字段 -->
                        <el-table-column
                                v-if="item.hide !== true"
                                :prop="item.prop"
                                :label="item.label"
                                :width="item.width"
                                :key="index"
                                style="height: 50px"

                        >
                        </el-table-column>
                    </template>
                    <!-- 操作栏模块 -->
                </el-table>
            </div>
            <div style="flex: 1">
                <el-table
                        ref="table"
                        v-loading="loading"
                        :data="vehticleInfo"
                        style="width: 100%"
                        :border="option.border"
                >
                    <el-table-column type="expand" v-if="option.expand" align="center"></el-table-column>
                    <template v-for="(item, index) in option.columnVehicleInfo">
                        <!-- table字段 -->
                        <el-table-column
                                v-if="item.hide !== true"
                                :prop="item.prop"
                                :label="item.label"
                                :width="item.width"
                                :key="index"
                                style="height: 50px"
                        >
                        </el-table-column>
                    </template>
                    <!-- 操作栏模块 -->
                    <el-table-column label="预约数量" type="index" width="200px">
                        <template #="{ row }">
              <span>
                <el-button type="primary" text size="small" @click="moveUpVehictle(row)"
                >上移
                </el-button>
              </span>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
        </div>

        <el-form-item style="margin-left: 45%; margin-top: 10px">
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="confirmDriver">确 定</el-button>
        <el-button @click="isDriverShow = false">取 消</el-button>
      </span>
        </el-form-item>
    </el-dialog>


    <el-dialog
            title="提示"
            v-model="dialogVisible"
            width="30%"
            >
        <h4>是否进行配送计划取消!?</h4>
        <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="qqq">确 定</el-button>
  </span>
    </el-dialog>

    <el-dialog
            title="提示"
            v-model="dialogVisibleLoading"
            width="30%"
    >

        <h4>检测到已装车包件,是否继续移除?</h4>
<!--        <div>-->
<!--            <el-table :data="gridData">-->
<!--                <el-table-column property="date" label="日期" width="150"></el-table-column>-->
<!--                <el-table-column property="name" label="姓名" width="200"></el-table-column>-->
<!--                <el-table-column property="address" label="地址"></el-table-column>-->
<!--            </el-table>-->
<!--        </div>-->
        <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="ooo">确 定</el-button>
  </span>
    </el-dialog>

</template>

<script>
  import { getDictionaryBiz } from '@/api/system/dict';
  import option from '@/option/distribution/distributionReservation';
  import { getListTeamInfo } from '@/api/basicdata/basicdataTeamGroup';
  import { deliveryTask, getReservationAddr } from '@/api/distribution/distributionReservation';
  import { getMarketDeliveryList, updateMarketDelivery,cancelDeliveryListTask } from '@/api/distribution/distributionDeliveryList';
  import { getListUser } from '@/api/distribution/distributionStockup';
  import { getPostList } from '@/api/system/post';
  import { getListOwn } from '@/api/system/user';
  import { stockUpInfo } from '@/api/basicdata/basicdataGoodsArea';
  import { getVehicleList } from '@/api/basicdata/basicdataVehicle';
  import { getDriverList } from '@/api/basicdata/basicdataDriverArtery';
  import { mapGetters } from 'vuex';
  import dayjs from 'dayjs';

  export default {
    data() {
      return {
        columnList: [
        {
          prop: '',
          label: '序号',
          type: 0,
          values: '',
          width: 55,
          checkarr: [],
          fixed: true,
        },
        {
          prop: 'stockArticleId',
          label: '订单自编号',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'consignee',
          label: '收货人',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'deliveryAddress',
          label: '收件地址',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'deliveryPhone',
          label: '收件人电话',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'reservationDate',
          label: '预约时间',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'periodOfTimeName',
          label: '时段',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'deliveryWayName',
          label: '配送方式',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'loadingStatusName',
          label: '装车状态',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'signingStatusName',
          label: '签收状态',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'deliveryTypeName',
          label: '配送类型',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'collectFee',
          label: '到付运费',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'otherFee',
          label: '其他费用',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'replaceFee',
          label: '代付运费',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'fee',
          label: '总费用',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'reservationStatusName',
          label: '预约信息状态',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'stockupStatusName',
          label: '备货状态',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'reservationNum',
          label: '包件数量',
          type: 2,
          values: '',
          width: '200',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
          {
            prop: '',
            label: '操作',
            type: 6,
            values: '',
            width: '150',
            checkarr: [],
            fixed: 'right',
            hide: true,
          },
      ],
        height: 0,
        loading: false,
        error: null,
        form: {},
        driverForm: {},
        stockUpForm: {},
        waixieForm: {},
        reservationData: [],
        // 分页信息
        page: {
          currentPage: 1,
          pageSize: 30,
          total: 40
        },

        query: {},
        aaa: true,
        bbb: false,
        option: option,
        deliveryTypeData: [],
        //配送类型字典列表
        resvervationStatusData: [],
        //备货状态
        stockupStatusData: [],
        //订单来源
        orderSourceData: [],
        //预约时段
        periodOfTimeData: [],
        //配送方式
        deliveryWayData: [],
        //服务内容
        addvalueServeTypeData: [],
        //基础车辆信息
        vehicleData: [],
        //叉车信息
        forkliftData: [],
        //班组信息
        loaderData: [],
        //备货区信息
        goodsAreaData: [],
        //部门信息
        deptId: '',
        //司机信息
        driverData: [],
        //装卸班组
        loadAndUnloadData: [],
        //装卸
        tripartiteSourceData: [],
        //装卸只能
        loadAndUnload: [],
        //车辆信息
        vehicleIds: [],
        //配送司机信息
        deliveryDriver: [],
        //司机配置
        isDriverShow: false,
        //车辆表格信息
        driverInfo: [],
        //司机表格信息
        vehticleInfo: [],
        //主司机
        masterDriverName: '',
        //主车辆
        masterVehictleName: '',
        //司机配置选中行信息
        multipleSelection: [],
        //
        multipleTable: {},
        stockArticleTable: [],
        stockArticleList: [],
        driverList: [],
        vehticleList: [],
        packageList: [],
        //订单数据
        orderData: [],
        //库存品数据
        inventoryData: [],
        //
        selectionList: [],
        addvalue: {},
        //订单弹窗
        orderShow: false,
        //库存品弹窗
        stockListShow: false,
        //在库订单数据
        stockArticleInfo: [],
        //库存品信息列表
        inventoryInfo: [],
        //包件弹窗控制
        isShowPackage: false,
        //包件数据
        packageData: [],
        //班组职能
        loadAndUnload: [],
        //服务类型
        serveType: [],
        //外协数据来源
        tripartiteSourceData: [],
        deliveryListId: '',
        isDisable: false,
        checked: true,
        reservationIds: '',
        obj: {
          type: Object,
          default: () => ({})
        },
        isInitialized: false,
        isUpdate: false,
        isoperation: false,
        dialogVisible: false,
        dialogVisibleLoading:false
      };
    },
    watch: {
      '$route.query.deliveryId': {
        handler(newVal, oldVal) {
          console.log(newVal, oldVal);
          this.fetchData();
          this.onLoad(this.page);
        },
        deep: true,
        immediate: true
      }

    },
    created() {
      this.$watch(
        () => this.$route.params,
        () => {
          this.fetchData();
        },
        // 组件创建完后获取数据，
        // 此时 data 已经被 observed 了
        { immediate: true }
      );
      this.getDictionary();
      this.getFork();
      this.getTeam();
      this.getvehicleData();
      this.getMasterDriverData();
      this.onLoad(this.page);
    },
    computed: {
      ...mapGetters(['permission']),
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(',');
      }
    },
    mounted() {
      // this.onLoad(this.page);
    },
    methods: {
      //查询叉车人员
      async getFork() {
        let ides = '';
        let ide = {};
        await getListUser().then(res => {
          console.log('res>>>', res.data.data);
          ides = res.data.data.tenantId;
          this.deptId = res.data.data.deptId;
        });
        await getPostList(ides).then(res => {
          console.log('>>>>', res.data.data);
          // this.forkliftData = res.data.data;
          res.data.data.forEach(i => {
            if (i.postName == '叉车') {
              ide = i;
            }
          });
        });
        // console.log("ied>>>>>",ide);
        let params = {
          postId: ide.id, //岗位
          deptId: this.deptId //部门
          // roleId: '', //角色
        };
        getListOwn(Object.assign(params, this.query)).then(res => {
          // console.log(".............",res.data.data);
          let fo = [];
          res.data.data.forEach(i => {
            let a = {
              dictKey: i.id,
              dictValue: i.name
            };
            fo.push(a);
          });
          this.forkliftData = fo;
        });
        await this.getStorageArea();
        await this.getTeam();
      },
      //查询班组
      async getTeam() {
        let params = this.deptId;
        console.log('%%%%%%%%%', params);
        getListTeamInfo(params).then(res => {
          console.log('aaaaaaaaa', res.data.data);
          let fo = [];
          res.data.data.forEach(i => {
            let a = {
              dictKey: i.id,
              dictValue: i.groupName
            };
            fo.push(a);
          });
          this.loaderData = fo;
        });
      },
      //备货区
      async getStorageArea() {
        let params = this.deptId;
        console.log('^^^^^^^^^^^^^', params);
        stockUpInfo(params).then(res => {
          console.log('=========================》', res);
          let fo = [];
          res.data.data.forEach(i => {
            let v = {
              dictKey: i.id,
              dictValue: i.headline
            };
            fo.push(v);
          });
          this.goodsAreaData = fo;
        });
      },
      //查询司机信息
      getMasterDriverData() {
        return new Promise((rv, rev) => {
          getDriverList(1, 10, '').then(res => {
            this.driverData = res.data.data.records;
            console.log('===============>', res.data.data);
            rv(res.data.data.records);
          });
        });
      },
      selectionChange(list) {
        //只要这个触发就认定为该包件进行了重新勾选，不论数据是否发生变化
        this.selectionList = list;
        console.log(' this.selectionList = list', this.selectionList);
        this.orderData.forEach(item => {
          if (item.id === this.obj.id) {
            item.isUpdate = true;
          }
        });
        //这里就为当前选择的订单进行包件信息的添加
        // this.obj.
      },
      selectionStockArticleChange(list) {
        this.stockArticleList = list;
      },


      //查询车辆信息
      getvehicleData() {
        return new Promise((rv, rev) => {
          getVehicleList(1, 10, '').then(res => {
            this.vehicleData = res.data.data.records;
            console.log('^^^^^^^^^^^^^^^^', res.data.data);
            rv(res.data.data.records);
          });
        });
      },
      fetchData() {
        this.error = this.post = null;
        this.loading = true;
        console.log('this.$route.query', this.$route.query);
        if (this.$route.query.id) {
          this.reservationIds = this.$route.query.id;
        }
        if (this.$route.query.deliveryId) {
          this.deliveryListId = this.$route.query.deliveryId;
        }
        this.loading = false;


      },
      removeStockArticle(row) {
        // if (row.loadingStatusName === '部分装车'
        //   || row.loadingStatus === '20' ){
        //   //发起请求查询装车包件有哪些，进行页面提示
        //   this.dialogVisibleLoading = true;
        //   return;
        // }
        console.log('row------------->', row);
        if (row.signingStatusName === '已签收'
          || row.signingStatusName === '部分签收'
          || row.signingStatus !== '10'
          || row.loadingStatusName === '已装车'
          || row.loadingStatus === '30' ){
          this.$message({
            message: '无法移除该预约单!!!',
            type: 'warning'
          });
          return;
        }
        let data = this.reservationData;
        data.forEach((item, index) => {
          if (item.id === row.id) {
            data.splice(index, 1);
          }
        });
        this.data = data;
      },
      handleClose(done) {
        this.$confirm('是否删除该配送任务!!!')
          .then(_ => {
            done();
          })
          .catch(_ => {
          });
      },
      viewDriverInfo() {
        console.log(this.driverInfo.length);
        console.log(this.vehticleInfo.length);
        if (this.driverList.length !== this.vehticleList.length) {
          this.$message({
            message: '司机车辆数量有误!!!',
            type: 'warning'
          });
          return;
        }
        this.isDriverShow = true;
      },
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {
          });
      },
      onSubmitOrder() {
        let stockup = {};
        let tripartite = {};
        let data = {};
        if (this.driverForm) {
          let allocationInfo = [];
          //这里就表示司机信息存在，那么就需要构建司机的信息
          //自主配送数据构建
          if (this.driverList.length !== this.vehticleList.length) {
            this.$message({
              message: '司机车辆数量有误!!!',
              type: 'warning'
            });
            return;
          } else {
            let info = [];
            for (let i = 0; i < this.driverInfo.length; i++) {
              let obj = {};
              obj.driver = this.driverInfo[i].name;
              obj.driverName = this.driverInfo[i].name;
              obj.driverId = this.driverInfo[i].id;
              obj.driverPhone = this.driverInfo[i].phone;
              obj.vehicleNub = this.vehticleInfo[i].vehicleNub;
              obj.vehicleId = this.vehticleInfo[i].id;
              info.push(obj);
              this.driverInfo[i].name;
            }
            allocationInfo = info;
          }
          data.allocationInfo = allocationInfo;
          data.masterDriverName = this.driverForm.masterDriverName;
          data.masterVehicleNub = this.driverForm.masterVehicleNub;
        }
        if (this.waixieForm.tripartiteSource) {
          tripartite = this.waixieForm;
          data.tripartite = tripartite;
        }
        if (this.stockUpForm) {
          let params = this.stockUpForm;
          if (params.tripartiteSource) {
            //三方配送数据构建
            if (params.driverName) {
              tripartite.driverName = params.driverName;
            }
            if (params.deiverPhone) {
              tripartite.deiverPhone = params.deiverPhone;
            }
            if (params.vehicleNum) {
              tripartite.vehicleNum = params.vehicleNum;
            }
            if (params.deliveryFee) {
              tripartite.deliveryFee = params.deliveryFee;
            }
            if (params.tripartiteSource) {
              this.tripartiteSourceData.forEach(item => {
                if (params.tripartiteSource === item.dictValue) {
                  tripartite.distributionCompanyId = item.dictKey;
                  tripartite.distributionCompany = item.dictValue;
                }
              });
            }
            data.tripartite = tripartite;
          } else {
            // 自主配送
            if (params.loader) {
              this.loaderData.forEach(a => {
                if (params.loader === a.dictKey) {
                  stockup.loaderName = a.dictValue;
                  stockup.loaderId = a.dictKey;
                }
              });
            }

            if (params.unloader) {
              this.loaderData.forEach(a => {
                if (params.loader === a.dictKey) {
                  stockup.unloaderName = a.dictValue;
                  stockup.unloaderId = a.dictKey;
                }
              });
            }
            if (params.forklift) {
              this.forkliftData.forEach(b => {
                if (params.forklift === b.dictKey) {
                  stockup.forkliftName = b.dictValue;
                  stockup.forkliftId = b.dictKey;
                }
              });
            }
            if (params.goodsAreaId) {
              this.goodsAreaData.forEach(c => {
                if (params.goodsAreaId === c.dictKey) {
                  stockup.goodsAreaId = c.dictKey;
                  stockup.goodsAreaName = c.dictValue;
                }
              });
            }
            if (params.stockupDate) {
              stockup.stockupDate = params.stockupDate;
            }
            if (params.remarks) {
              data.remarks = params.remarks;
            }
            // if (this.loadAndUnload.length > 0) {
            //   stockup.loadAndUnload = this.loadAndUnload.join(',');
            // }
            if (params.outboundDate) {
              stockup.outboundDate = params.outboundDate.toString();
            }
            data.stockup = stockup;
          }
          if (this.stockUpForm.taskTime) {
            data.taskTime = this.stockUpForm.taskTime.toString();
          }
        }
        console.log('this.data------------>', this.data);
        if (!this.deliveryListId) {
          data.reservationIds = this.reservationIds;
          if (this.reservationData.length < 1) {
            this.$message({
              message: '无效的配送计划',
              type: 'warning'
            });
            return;
          }
          console.log('>>>>>>>>>>>>', data);
          deliveryTask(data).then((res) => {
            this.$router.push({
              path: '/distribution/deliverylist/distributionDeliveryListmar',
              name: '配送市配列表'
            });
          });
        } else {
          let updateDate = {};
          updateDate.reservationInfos = this.reservationData;
          updateDate.id = this.deliveryListId;
          updateDate.stockupInfo = stockup;
          updateDate.remarks = data.remarks;
          console.log('->>>>>>>', this.waixieForm.tripartiteSource);
          if (this.waixieForm.tripartiteSource) {
            updateDate.tripartite = data.tripartite;
          } else {
            updateDate.allocationInfo = data.allocationInfo;
            updateDate.masterDriverName = data.masterDriverName;
            updateDate.masterVehicleNub = data.masterVehicleNub;
          }
          console.log('----------------->updateDate', updateDate);
          console.log('----------------->this.orderData.length', this.orderData.length);
          if (this.reservationData.length === 0) {
            this.dialogVisible = true;
            return;
          }
          updateMarketDelivery(updateDate).then(res => {
            this.$message({
              type: 'success',
              message: '操作成功!'
            });
            this.$router.go(-1);
            return;
          });
        }
      },
      qqq(params={}) {
        console.log('--------------->', '执行了..................');
        //这里就对这个配送任务进行取消的操作
        params.deliveryListId = this.deliveryListId
        cancelDeliveryListTask(params).then(res=>{
          this.$message({
            type: 'success',
            message: '操作成功!'
          });
          this.$router.push({
            path: '/distribution/deliverylist/distributionDeliveryListmar',
            name: '配送市配列表'
          });
        })
        this.dialogVisible = false;
      },
      changeVehicle(params) {
        console.log(params);
        this.vehticleList = params;
        let b = [];
        if (params) {
          this.vehicleData.forEach(item => {
            this.vehticleList.forEach(p => {
              if (p == item.id) {
                b.push(item);
                console.log(this.driverInfo);
              }
            });
            if (params[0] === item.id) {
              this.driverForm.masterVehicleNub = item.vehicleNub;
            }
          });
          this.vehticleInfo = b;
        }
      },
      changeDriver(params) {
        this.driverList = params;
        let a = [];
        if (params) {
          this.driverData.forEach(item => {
            this.driverList.forEach(p => {
              if (p == item.id) {
                a.push(item);
                console.log(this.driverInfo);
              }
            });
            if (params[0] === item.id) {
              this.driverForm.masterDriverName = item.name;
            }
          });
          this.driverInfo = a;
        }
      },
      //上移
      moveUpVehictle(row) {
        let i = 0;
        this.vehticleInfo.forEach((item, index) => {
          if (item.id === row.id) {
            i = index;
          }
        });
        //获取当当前选中的下标，如果下标为第一个则不能上移
        if (i > 0) {
          let a = this.vehticleInfo[i - 1];
          this.vehticleInfo.splice(i - 1, 1);
          this.vehticleInfo.splice(i, 0, a);
        } else {
          this.$message({
            message: '已经是第一条，上移失败',
            type: 'warning'
          });
        }
        console.log(this.vehticleInfo);
      },
      handleSelect(selection, row) {
        // 阻止全选框原有逻辑
        this.$refs.multipleTable.clearSelection();
        if (row) {
          if (selection.length === 1) {
            this.multipleSelection = row;
            this.$refs.multipleTable.toggleRowSelection(row, true);
          } else if (selection.length > 1) {
            let a = {};
            selection.forEach((s, index) => {
              if (s.id === row.id) {
                selection.splice(index, 1);
                a = s;
              }
            });
            this.multipleSelection = selection;
            this.$refs.multipleTable.toggleRowSelection(a, true);
          }
        }
      },
      confirmDriver() {
        if (this.multipleSelection.length === 0) {
          this.$message.warning('请选择至少一条数据');
          return;
        }
        console.log('this.adada', this.multipleSelection);
        this.isDriverShow = false;
        //获取到表格的行坐标
        let a = 0;
        this.driverInfo.forEach((item, index) => {
          if (item.id === this.multipleSelection.id) {
            a = index;
          }
        });
        this.driverForm.masterDriverName = this.driverInfo[a].name;
        this.driverForm.masterVehicleNub = this.vehticleInfo[a].vehicleNub;
      },
      // //数据字典数据获取
      getDictionary() {
        getDictionaryBiz('addvalue_serve_type').then(res => {
          this.addvalueServeTypeData = res.data.data;
        });
        // getDictionaryBiz('load_and_unload').then(res => {
        //   this.loadAndUnloadData = res.data.data;
        // });
        getDictionaryBiz('delivery_way').then(res => {
          this.deliveryWayData = res.data.data;
        });
        //三方外协来源
        getDictionaryBiz('tripartite_source').then(res => {
          this.tripartiteSourceData = res.data.data;
        });
      },

      ccc() {
        if (this.deliveryListId) {
          //清空司机、车辆信息
          this.driverForm.tripartiteSource = '';
          this.driverForm.driverName = '';
          this.driverForm.driverPhone = '';
          this.driverForm.vehicleNum = '';
          this.driverForm.deliveryFee = '';
        } else {
          // this.loadAndUnload = [];
          this.serveType = [];
          this.driverForm = {};
          this.waixieForm = {};
        }
        this.aaa = true;
        this.bbb = false;
        this.stockUpForm.deliveryType = '2';
        // this.stockUpForm.deliveryWay = '2';
        this.stockUpForm.stockupDate = dayjs().format('YYYY-MM-DD HH:mm:ss');
        this.form.taskTime = dayjs().format('YYYY-MM-DD');
        this.stockUpForm.outboundDate = dayjs().format('YYYY-MM-DD HH:mm:ss');
      },
      ddd() {
        if (this.deliveryListId) {
          this.vehicleIds = [];
          this.deliveryDriver = [];
          this.driverForm.masterDriverName = '';
          this.driverForm.masterVehicleNub = '';
          this.driverForm = {};
        } else {
          // this.loadAndUnload = [];
          this.serveType = [];
          this.driverForm = {};
          this.waixieForm = {};
        }
        this.aaa = false;
        this.bbb = true;
        this.stockUpForm.deliveryType = '2';
        // this.stockUpForm.deliveryWay = '2';
        this.form.taskTime = dayjs().format('YYYY-MM-DD HH:mm:ss');
        this.stockUpForm.stockupDate = dayjs().format('YYYY-MM-DD HH:mm:ss');
        this.stockUpForm.outboundDate = dayjs().format('YYYY-MM-DD');
      },
      selectionClear() {
        this.selectionList = [];
        this.query = {};
      },

      onLoad(page, params = {}) {
        //初始化页面数据
        this.stockUpForm.deliveryType = '2';
        // this.stockUpForm.deliveryWay = '2';
        this.stockUpForm.stockupDate = dayjs().format('YYYY-MM-DD HH:mm:ss');
        this.stockUpForm.outboundDate = dayjs().format('YYYY-MM-DD HH:mm:ss');
        this.stockUpForm.taskTime = dayjs().format('YYYY-MM-DD');
        this.stockUpForm.otherFee = 0;
        // this.loadAndUnload = ['1', '2'];
        if (this.reservationIds) {
          this.isoperation = false;
          console.log('》》》》》》》》》》》》》》》', this.reservationIds);
          let ids = this.reservationIds;
          getReservationAddr(ids).then(res => {
            console.log('------------->', res);
            const data = res.data.data;
            this.page.total = data.total;
            this. reservationData= data.records;
            console.log('>>>>>>>>>>>', this.data);
            this.loading = false;
          });
        }
        if (this.deliveryListId) {
          this.isoperation = true;
          console.log('<<<<<<<<<<', this.deliveryListId);

          //市配计划编辑回显
          getMarketDeliveryList(this.deliveryListId).then(async res => {
            console.log('--------------->', res.data.data);
            const deliveryData = res.data.data;
            this.stockUpForm.outboundDate = deliveryData.stockupInfo.outboundDate;
            this.stockUpForm.taskTime = deliveryData.stockupInfo.taskTime;
            this.stockUpForm.goodsAreaId = deliveryData.stockupInfo.goodsAreaId;
            this.stockUpForm.forklift = deliveryData.stockupInfo.forkliftId;
            this.stockUpForm.loader = deliveryData.stockupInfo.loaderId;
            this.stockUpForm.taskTime = deliveryData.taskTime;
            this.stockUpForm.stockupDate = deliveryData.stockupInfo.stockupDate;
            this.stockUpForm.remarks = deliveryData.remarks;
            // if (deliveryData.stockupInfo.teamResponsibility) {
            //   this.loadAndUnload = deliveryData.stockupInfo.teamResponsibility.split(',');
            // }
            console.log('reservationInfo--------------->', res.data.data.reservationInfo);
            this.reservationData = deliveryData.reservationInfos;
            if (deliveryData.kind === '1') {
              //自主配送
              let self = deliveryData.deliverySelfVO;
              let vehicle = await this.getvehicleData();
              console.log('___________________-->', vehicle);
              let driver = await this.getMasterDriverData();
              let a = [];
              let b = [];
              let vehicleInfo = [];
              vehicle.forEach(item => {
                self.forEach(s => {
                  if (item.id === s.vehicleId) {
                    a.push(s.vehicleId);
                    vehicleInfo.push(item);
                  }
                  if (s.isMaster === 2) {
                    this.driverForm.masterVehicleNub = s.vehicleNub;
                  }
                });
              });
              this.vehticleList = a;
              this.vehicleIds = a;
              console.log(' this.vehicleIds', this.vehicleIds);
              this.vehticleInfo = vehicleInfo;
              let driverInfo = [];
              driver.forEach(item => {
                self.forEach(s => {
                  if (item.id === s.driverId) {
                    b.push(s.driverId);
                    driverInfo.push(item);
                  }
                  if (s.isMaster === 2) {
                    this.driverForm.masterDriverName = s.driverName;
                  }
                });
              });
              this.deliveryDriver = b;
              this.driverList = b;
              this.driverInfo = driverInfo;
            } else {
              let deliveryTripartiteVO = deliveryData.deliveryTripartiteVO;
              this.aaa = false;
              this.bbb = true;
              // this.form.tripartiteSource = deliveryTripartiteVO.distributionCompanyId;
              this.waixieForm.tripartiteSource = '1';
              this.waixieForm.driverName = deliveryTripartiteVO.driverName;
              this.waixieForm.vehicleNum = deliveryTripartiteVO.vehicleNum;
              this.waixieForm.driverPhone = deliveryTripartiteVO.driverPhone;
              this.waixieForm.deliveryFee = deliveryTripartiteVO.deliveryFee;
            }
          });
        }
        this.loading = false;
      }
    }
  };
</script>

<style lang="scss" scoped>
    .head_top {
        width: 100%;
        display: flex;
        align-items: center;
        background-color: #ffffff;
        // border-bottom: 1px solid rgb(228, 228, 228);
        padding-left: 10px;

        > .buts {
            padding: 10px 20px;
            cursor: pointer;
            margin-right: 10px;
            font-size: 18px;
            border-bottom: 4px solid #ffffff;
            // background-color: #ffffff;
        }

        .check {
            color: #D3832A;
            border-bottom: 4px solid #D3832A;
        }
    }

    .minaxbox {
        display: flex;
        flex-direction: column;

        .tophed {
            display: flex;
            flex-wrap: wrap;

        }
    }
</style>
