<template>
  <div>
    <div class="main">
      <div class="maintop">
        <div class="mainbtn">
          <el-button
            size="small"
            class="thebtn2"
            @click="mergeHd(0)"
            v-hasButtons="['DeliveryUnhandledAllMerge']"
            >全部合单</el-button
          >
          <el-button
            size="small"
            class="thebtn3"
            :disabled="multiple"
            @click="mergeHd(1)"
            v-hasButtons="['DeliveryUnhandledMerge']"
            >合单</el-button
          >
          <!-- <el-button
            size="small"
            class="thebtn3"
            :disabled="multiple"
            @click="mergeHd(2)"
            v-hasButtons="['DeliveryUnhandledSelf']"
            >{{ $t("MN_F_T_708") }}</el-button
          > -->
          <!-- <el-button size="small" class="thebtn2" :disabled="multiple"
            >二次发货</el-button
          > -->
          <el-button
            size="small"
            v-hasButtons="['DeliveryUnhandledExport']"
            @click="handleExport"
            class="thebtn1"
          >
            {{ $t("MN_T_8") }}</el-button
          >
          <!-- <el-button
            size="small"
            :disabled="selRow.length == 0 || selRow.length > 1"
            class="thebtn2"
            @click="orderDk"
            v-hasButtons="['OrderDeductionBtn']"
            >订单抵扣</el-button
          > -->
        </div>
      </div>
      <el-table
        :data="tableData"
        height="540px"
        style="width: 100%"
        :header-cell-style="{ background: '#EEEEEE' }"
        @selection-change="handleSelectionChange"
      >
        <!-- :row-class-name="tableRowClassName"
         -->
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column
          align="center"
          min-width="200px"
          prop="orderCode"
          :label="$t('MY_ORD_1')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          prop="orderTypeVal"
          :label="$t('MY_ORD_2')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          min-width="120px"
          prop="memberCode"
          :label="$t('MN_T_1')"
        >
        </el-table-column>

        <el-table-column
          align="center"
          min-width="120px"
          prop="memberName"
          :label="$t('CK_KS_14')"
        >
        </el-table-column>

        <el-table-column
          align="center"
          min-width="120px"
          prop="phone"
          :label="$t('w_0052')"
        >
        </el-table-column>

        <el-table-column
          align="center"
          min-width="120px"
          prop="productCode"
          :label="$t('MN_F_40')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          min-width="120px"
          prop="productName"
          :label="$t('MN_F_39')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          min-width="120px"
          prop="specsName"
          :label="$t('MN_F_41')"
        >
        </el-table-column>
        <el-table-column align="center" prop="unitName" :label="$t('MN_F_42')">
        </el-table-column>
        <el-table-column align="center" prop="quantity" :label="$t('MN_F_43')">
        </el-table-column>
        <el-table-column
          align="center"
          prop="isGiftVal"
          :label="$t('MN_F_T_249')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          prop="orderAmount"
          :label="$t('MY_ORD_6')"
        >
          <template slot-scope="scope">
            {{ scope.row.orderAmount | numFilter }}
          </template>
        </el-table-column>
        <el-table-column align="center" prop="recName" :label="$t('MY_ORD_10')">
        </el-table-column>
        <el-table-column
          align="center"
          min-width="120px"
          prop="recPhone"
          :label="$t('w_0242')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          min-width="180px"
          prop="recAddress"
          :label="$t('w_0068')"
        >
          <template slot-scope="scope">
            {{ scope.row.recProvinceVal }}{{ scope.row.recCityVal
            }}{{ scope.row.recCountyVal }}{{ scope.row.recAddress }}
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="shippingChannelVal"
          :label="$t('MN_F_T_1125')"
          min-width="100px"
        >
        </el-table-column>
        <el-table-column
          min-width="100px"
          align="center"
          prop="storehouseName"
          :label="$t('MN_F_T_251')"
        >
        </el-table-column>
        <el-table-column
          min-width="150px"
          align="center"
          prop="payTime"
          :label="$t('MN_F_T_914')"
        >
        </el-table-column>
        <el-table-column
          min-width="100px"
          align="center"
          prop="orderStatusVal"
          :label="$t('MY_ORD_9')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          min-width="100px"
          prop="deliveryWayVal"
          :label="$t('w_0061')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          min-width="100px"
          prop="operateScopeVal"
          :label="$t('MN_F_T_250')"
        >
        </el-table-column>

        <el-table-column
          align="center"
          min-width="100px"
          prop="tranTypeVal"
          :label="$t('w_0063')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          prop="preSaleStatusVal"
          :label="$t('MN_F_T_253')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          prop="originalOrderCode"
          :label="$t('MN_F_T_1177')"
        >
        </el-table-column>
        <el-table-column
          min-width="100px"
          align="center"
          prop="remark"
          :label="$t('MY_WAL_22')"
        >
        </el-table-column>
        <el-table-column
          align="center"
          prop="vertexName"
          :label="$t('隶属体系')"
        >
        </el-table-column>
        <!-- <el-table-column
          align="center"
          prop="systemType"
          :label="$t('系统类型')"
        >
          <template slot-scope="scope">
            <div
              v-for="item in systemTypes"
              :key="item.value"
              v-if="scope.row.systemType == item.value"
            >
              {{ item.label }}
            </div>
          </template>
        </el-table-column> -->
        <el-table-column
          min-width="150px"
          align="center"
          prop="creationTime"
          :label="$t('PER_DA_9')"
        >
        </el-table-column>
      </el-table>
    </div>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="params.pageNum"
      :limit.sync="params.pageSize"
      @pagination="getList"
      :pageSizes="pageSizes"
    />
    <!-- 合单 -->
    <el-dialog
      :title="$t('CK_KS_128')"
      :close-on-click-modal="false"
      :visible.sync="hdShow"
      width="40%"
      append-to-body
    >
      <div>
        <div class="main_title">
          <div class="bluekuai"></div>
          <div class="title_word">{{ $t("MN_F_T_252") }}</div>
        </div>
        <div>
          <el-form
            ref="hdform"
            :rules="hdrules"
            :model="hdform"
            label-width="80px"
          >
            <el-row>
              <el-col :span="12">
                <el-form-item :label="$t('MY_ORD_10')" prop="recNameBool">
                  <el-radio-group v-model="hdform.recNameBool">
                    <el-radio
                      :label="item.value"
                      v-for="(item, index) in yesornoList"
                      :key="index"
                      >{{ item.label }}</el-radio
                    >
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item :label="$t('w_0242')" prop="recPhoneBool">
                  <el-radio-group v-model="hdform.recPhoneBool">
                    <el-radio
                      :label="item.value"
                      v-for="(item, index) in yesornoList"
                      :key="index"
                      >{{ item.label }}</el-radio
                    >
                  </el-radio-group>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  :label="
                    $t('MY_ORD_11') +
                    '/' +
                    $t('MY_ORD_12') +
                    '/' +
                    $t('MY_ORD_13')
                  "
                  prop="recAreaBool"
                >
                  <el-radio-group v-model="hdform.recAreaBool">
                    <el-radio
                      :label="item.value"
                      v-for="(item, index) in yesornoList"
                      :key="index"
                      >{{ item.label }}</el-radio
                    >
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item :label="$t('S_C_27')" prop="recAddressBool">
                  <el-radio-group v-model="hdform.recAddressBool">
                    <el-radio
                      :label="item.value"
                      v-for="(item, index) in yesornoList"
                      :key="index"
                      >{{ item.label }}</el-radio
                    >
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item :label="$t('MN_F_39')" prop="productNameBool">
                  <el-radio-group v-model="hdform.productNameBool">
                    <el-radio
                      :label="item.value"
                      v-for="(item, index) in yesornoList"
                      :key="index"
                      >{{ item.label }}</el-radio
                    >
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item :label="$t('MN_F_T_250')" prop="operateScope">
                  <el-radio-group v-model="hdform.operateScope">
                    <el-radio :label="''">{{ $t("ENU_GIFT_T_1") }}</el-radio>
                    <el-radio
                      :label="item.value"
                      v-for="(item, index) in supplyWayList"
                      :key="index"
                      >{{ item.label }}</el-radio
                    >
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item :label="$t('MN_F_T_253')" prop="preSaleStatus">
                  <el-radio-group v-model="hdform.preSaleStatus">
                    <el-radio :label="''">{{ $t("ENU_GIFT_T_1") }}</el-radio>
                    <el-radio
                      :label="item.value"
                      v-for="(item, index) in presaleStatusList"
                      :key="index"
                      >{{ item.label }}</el-radio
                    >
                  </el-radio-group>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col>
                <el-form-item
                  required
                  :label="$t('w_0063')"
                  prop="transportTypeList"
                >
                  <el-checkbox-group v-model="hdform.transportTypeList">
                    <el-checkbox
                      v-for="item in transportTypeList"
                      :key="item.value"
                      :label="item.value"
                      >{{ item.label }}</el-checkbox
                    >
                  </el-checkbox-group>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item
                  required
                  :label="$t('w_0061')"
                  prop="deliveryWayList"
                >
                  <el-checkbox-group v-model="hdform.deliveryWayList">
                    <el-checkbox
                      v-for="item in deliveryWayList"
                      :key="item.value"
                      :label="item.value"
                      >{{ item.label }}</el-checkbox
                    >
                  </el-checkbox-group>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <div class="main_title">
          <div class="bluekuai"></div>
          <div class="title_word">{{ $t("MN_F_T_254") }}</div>
        </div>
        <div>
          <el-table
            :data="unproductData"
            style="width: 100%"
            height="300px"
            :header-cell-style="{ background: '#EEEEEE' }"
            @selection-change="handleSelectionChange2"
          >
            <!-- :row-class-name="tableRowClassName"
         -->
            <el-table-column type="selection" width="55"> </el-table-column>
            <el-table-column
              align="center"
              prop="productName"
              :label="$t('MN_F_39')"
            >
            </el-table-column>
            <el-table-column
              align="center"
              prop="specsName"
              :label="$t('MN_F_41')"
            >
            </el-table-column>
            <el-table-column
              align="center"
              prop="quantity"
              :label="$t('MN_F_T_255')"
            >
            </el-table-column>
            <el-table-column
              align="center"
              prop="productStock"
              :label="$t('MN_F_T_256')"
            >
            </el-table-column>
          </el-table>
        </div>
        <div class="footer" style="text-align: center; margin-top: 20px">
          <el-button @click="hdShow = false">
            {{ $t("ENU_P_TYPE0") }}</el-button
          >
          <el-button type="primary" @click="sureHd('hdform')">{{
            $t("w_0035")
          }}</el-button>
        </div>
      </div>
    </el-dialog>

    <!-- 自提 -->
    <el-dialog
      :title="ztTitle"
      :close-on-click-modal="false"
      :visible.sync="zitiShow"
      width="900px"
      append-to-body
    >
      <div>
        <el-form
          label-width="80px"
          :model="ztForm"
          ref="ztForm"
          class="demo-ruleForm"
        >
          <el-form-item :label="$t('MN_F_T_257')" prop="postage">
            <el-input style="width: 166px" v-model="ztForm.postage"></el-input>
          </el-form-item>
        </el-form>
        <div class="menuList">
          <div
            v-for="item in qhList"
            @click="isMenu = item.id"
            :class="['menu_i', isMenu == item.id ? 'actMenu' : '']"
            :key="item.id"
          >
            {{ item.text }}
          </div>
        </div>
        <div>
          <el-table
            v-if="isMenu == 0"
            :data="ztData.productList"
            height="400px"
            style="width: 100%"
            :header-cell-style="{ background: '#EEEEEE' }"
          >
            <el-table-column
              align="center"
              prop="orderCode"
              :label="$t('MY_ORD_1')"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="productName"
              :label="$t('MN_F_39')"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="specsName"
              :label="$t('MN_F_41')"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="quantity"
              :label="$t('MN_F_43')"
            ></el-table-column>
          </el-table>
          <el-table
            v-if="isMenu == 1"
            :data="ztData.barCodeList"
            height="400px"
            style="width: 100%"
            :header-cell-style="{ background: '#EEEEEE' }"
          >
            <!-- :row-class-name="tableRowClassName"
         -->
            <el-table-column
              align="center"
              prop="orderCode"
              :label="$t('MY_ORD_1')"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="productName"
              :label="$t('MN_F_39')"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="specsName"
              :label="$t('MN_F_41')"
            ></el-table-column>
            <el-table-column align="center" prop="" :label="$t('MN_F_43')"
              ><template>
                <span>1</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              prop="barCode"
              :label="$t('MN_F_T_258')"
              ><template slot-scope="scope">
                <el-input v-model="scope.row.barCode"> </el-input>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="footer" style="text-align: center; margin-top: 20px">
          <el-button @click="zitiShow = false">
            {{ $t("ENU_P_TYPE0") }}</el-button
          >
          <el-button type="primary" @click="sureTh">{{
            $t("w_0035")
          }}</el-button>
        </div>
      </div>
    </el-dialog>

    <!-- 订单抵扣弹窗 -->
    <el-dialog
      title="订单抵扣"
      :close-on-click-modal="false"
      :visible.sync="orderDkShow"
      width="900px"
      append-to-body
    >
      <div>
        <div>
          <el-table
            :data="pkOrderNewData"
            height="140px"
            style="width: 100%"
            :header-cell-style="{ background: '#EEEEEE' }"
          >
            <el-table-column
              align="center"
              prop="orderCode"
              :label="$t('MY_ORD_1')"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="orderAmount"
              :label="$t('ENU_TOTAL_V_2')"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="orderAchieve"
              :label="`${$t('ENU_TOTAL_V_1')}($)`"
            ></el-table-column>
            <el-table-column align="center" prop="orderAssAchieve" label="BV">
            </el-table-column>
          </el-table>
        </div>
        <el-form
          label-width="120px"
          :model="orderDkForm"
          ref="orderDkForm"
          class="demo-ruleForm"
        >
          <el-row :gutter="10">
            <el-col :span="12">
              <el-form-item label="抵扣订单编号" prop="orderCode">
                <el-input v-model="orderDkForm.orderCode"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-button type="primary" @click="getOldOrderDk">
                {{ $t("MN_T_2") }}</el-button
              >
            </el-col>
          </el-row>
        </el-form>
        <div>
          <el-table
            :data="pkOrderOldData"
            height="140px"
            style="width: 100%"
            :header-cell-style="{ background: '#EEEEEE' }"
          >
            <el-table-column
              align="center"
              prop="orderCode"
              label="抵扣订单编号"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="orderAmount"
              :label="$t('ENU_TOTAL_V_2')"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="orderAchieve"
              :label="`${$t('ENU_TOTAL_V_1')}($)`"
            ></el-table-column>
            <el-table-column align="center" prop="orderAssAchieve" label="BV">
            </el-table-column>
          </el-table>
        </div>
        <div class="footer" style="text-align: center; margin-top: 20px">
          <el-button @click="orderDkShow = false">
            {{ $t("ENU_P_TYPE0") }}</el-button
          >
          <el-button type="primary" @click="sureOrderDk">{{
            $t("w_0035")
          }}</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
// import { getDeliveryUnhandledList } from "@/api/delivery";
import * as del from "@/api/delivery";
import { Loading } from "element-ui";
export default {
  name: "Unhandeled",
  props: {
    params: {
      type: Object,
      default: null,
    },
  },
  filters: {
    numFilter(value) {
      // 截取当前数据到小数点后两位
      let realVal = parseFloat(value).toFixed(2);
      return realVal;
    },
  },
  data() {
    return {
      qhList: [
        {
          text: this.$t("MN_F_T_259"),
          id: 0,
        },
        {
          text: this.$t("MN_F_T_260"),
          id: 1,
        },
      ],
      tableData: [],
      total: 0,
      // 非多个禁用
      multiple: true,
      hdShow: false, //合单弹框
      hdform: {
        mergeType: "", //合单类型
        recNameBool: 0, //收货人
        recPhoneBool: 0, //收货电话
        recAreaBool: 0, //收货省市区
        recAddressBool: 0, //收货详细地址
        operateScope: 0, //供应方式
        preSaleStatus: 0, //预售状态
        productNameBool: 1,
        transportTypeList: [], //运输方式
        deliveryWayList: [], //发货方式
        idList: [], //订单明细ID列表
        excludeIdList: [], //排序产品ID
      },
      hdrules: {
        transportTypeList: [
          { required: true, message: this.$t("w_0064"), trigger: "change" },
        ],
        deliveryWayList: [
          { required: true, message: this.$t("w_0062"), trigger: "change" },
        ],
      },
      yesornoList: [],
      supplyWayList: [], //供应方式
      deliveryWayList: [], //发货方式
      transportTypeList: [], //运输方式
      presaleStatusList: [], //预售状态
      unproductData: [],
      zitiShow: false,
      ztTitle: this.$t("MN_F_T_708"),
      isMenu: "0",
      ztData: {},
      ztForm: {
        postage: "",
      },
      orderIdList: [], //自提用到orderIdList
      pageSizes: [100, 500, 1000, 2000, 4000],
      selRow: [],
      orderDkShow: false,
      orderDkForm: {
        orderCode: "",
      },
      pkOrderNewData: [],
      pkOrderOldData: [],
    };
  },
  created() {
    this.getList();
    this.getOther();
  },
  methods: {
    sureOrderDk() {
      if (this.pkOrderNewData.length > 0 && this.pkOrderOldData.length > 0) {
        let theform = {
          pkOrderNewData: this.pkOrderNewData,
          pkOrderOldData: this.pkOrderOldData,
        };
        //发起签呈
        this.$router.push({
          path: "deductionZxqc",
          query: {
            data: JSON.stringify(theform),
            index: 254,
          },
        });
      }
    },
    //订单抵扣
    orderDk() {
      this.orderDkShow = true;
      del
        .getNewDeductionData({ pkOrder: this.selRow[0].pkOrder })
        .then((res) => {
          if (res.code == 200) {
            this.pkOrderNewData = [res.data];
          }
        });
    },
    getOldOrderDk() {
      del
        .getOldDeductionData({
          orderCode: this.orderDkForm.orderCode,
        })
        .then((res) => {
          if (res.code == 200) {
            this.pkOrderOldData = [res.data];
          }
        });
    },
    getOther() {
      del.getDealerYesNo().then((res) => {
        this.yesornoList = res.data;
      });
      del.getSupplyWay().then((res) => {
        this.supplyWayList = res.data;
      });
      del.getPresaleStatus().then((res) => {
        this.presaleStatusList = res.data;
      });
      del.getDeliveryWayList().then((res) => {
        this.deliveryWayList = res.data;
        if (this.deliveryWayList.length > 0) {
          this.hdform.deliveryWayList = [this.deliveryWayList[0].value];
        }
      });
      del.getTransportType().then((res) => {
        this.transportTypeList = res.data;
        if (this.transportTypeList.length > 0) {
          this.hdform.transportTypeList = [this.transportTypeList[0].value];
        }
      });
    },
    //确定提货
    sureTh() {
      this.$router.push({
        path: "ztZxqc",
        query: {
          postage: this.ztForm.postage,
          itemIdList: JSON.stringify(this.hdform.idList),
          barCodeList: JSON.stringify(this.ztData.barCodeList),
          productList: JSON.stringify(this.ztData.productList),
          businessType: 251,
        },
      });
    },
    //合单
    mergeHd(index) {
      this.hdform.mergeType = index;

      if (index == 1) {
        this.hdShow = true;
        // const theidList = this.hdform.idList.join()
        del
          .getExcludeProduct({ mergeType: 1, idList: this.hdform.idList })
          .then((res) => {
            this.unproductData = res.data;
          });
      } else if (index == 0) {
        this.$confirm(this.$t("MN_F_T_261")).then((_) => {
          del
            .deliverUnhandeldMerge(
              Object.assign({}, this.params, {
                mergeType: this.hdform.mergeType,
              })
            )
            .then((res) => {
              this.$message({
                message: res.msg,
                type: "success",
              });
              this.getList();
            });
          const loading = Loading.service({
            lock: true,
            text: "处理中...",
            background: "rgba(0, 0, 0, 0.7)",
          });
          setTimeout(() => {
            loading.close();
          }, 2000);
        });
      } else if (index == 2) {
        this.zitiShow = true;
        del
          .getUnhandeldSelfData({ orderIdList: this.orderIdList.join() })
          .then((res) => {
            this.ztData = res.data;
          });
      }
    },
    //确认合单
    sureHd(formName) {
      const loading = Loading.service({
        lock: true,
        text: "处理中...",
        background: "rgba(0, 0, 0, 0.7)",
      });
      setTimeout(() => {
        loading.close();
      }, 2000);
      this.$refs[formName].validate((valid) => {
        this.hdform.recAddressBool = Boolean(!this.hdform.recAddressBool);
        this.hdform.recAreaBool = Boolean(!this.hdform.recAreaBool);
        this.hdform.recNameBool = Boolean(!this.hdform.recNameBool);
        this.hdform.recPhoneBool = Boolean(!this.hdform.recPhoneBool);
        this.hdform.productNameBool = Boolean(!this.hdform.productNameBool);
        if (valid) {
          del.deliverUnhandeldMerge(this.hdform).then((res) => {
            if (res.code == 200) {
              this.$message({
                message: res.msg,
                type: "success",
              });
              this.getList();
              this.hdShow = false;
            }
          });
        }
      });
    },
    handleSelectionChange(selection) {
      this.hdform.idList = selection.map((item) => item.pkId);
      this.orderIdList = selection.map((item) => item.pkOrder);
      this.multiple = !selection.length;
      this.selRow = selection;
    },
    handleSelectionChange2(sele) {
      this.hdform.excludeIdList = sele.map((item) => item.pkProduct);
    },
    //导出
    handleExport() {
      this.params.pkIdList = this.hdform.idList;
      this.$confirm(this.$t("MN_F_T_407"), this.$t("MN_F_T_304"), {
        confirmButtonText: this.$t("w_0035"),
        cancelButtonText: this.$t("ENU_P_TYPE0"),
        type: "warning",
      }).then((_) => {
        this.download(
          "/sale/manage/deliver-unhandled/export",
          // {pkIdList:this.hdform.idList},
          { ...this.params },
          `${this.$t("MN_F_T_1178")}${new Date().getTime()}.xlsx`
        );
      });
    },
    getList() {
      this.params.pkIdList = [];
      del.getDeliveryUnhandledList(this.params).then((res) => {
        this.tableData = res.rows;
        this.total = res.total;
      });
    },
  },
};
</script>

<style lang="scss" scoped>
::v-deep .el-dialog {
  margin-top: 6vh !important;
}
::v-deep .el-table .warning-row {
  background: #f9f9f9;
}

::v-deep .el-table .success-row {
  background: #ffffff;
}
::v-deep .el-table thead {
  color: #000000;
}
.menuList {
  display: flex;
  box-sizing: border-box;

  .menu_i {
    margin-right: 70px;
    line-height: 50px;
    cursor: pointer;
  }
  .actMenu {
    border-bottom: 5px solid #b42b2a;
  }
}
// .xian {
//   height: 5px;
//   background: rgba(0, 0, 0, 0.05);
//   margin-top: -5px;
// }
.main_title {
  display: flex;
  align-items: center;
  padding: 10px 0;
  // padding-bottom: 10px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  .bluekuai {
    width: 5px;
    height: 19px;
    background: #4391fd;
    margin-right: 20px;
  }
  .title_word {
    font-size: 14px;
    font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
    font-weight: bold;
    color: #333333;
  }
}
.main {
  // margin-top: 20px;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0px 2px 20px 0px rgba(238, 238, 238, 0.5);

  .main_content {
    padding: 20px 25px;
  }

  .maintop {
    display: flex;
    // padding: 10px 20px;
    padding-bottom: 10px;
    justify-content: space-between;
    align-items: center;
    .mainbtn {
      .thebtn1 {
        color: #ffffff;
        background: rgba(243, 169, 0, 1);
      }
      .thebtn2 {
        color: #ffffff;
        background: rgba(16, 142, 233, 1);
      }
      .thebtn3 {
        color: #ffffff;
        background: rgba(0, 155, 88, 1);
      }
      .thebtn4 {
        color: #ffffff;
        background: rgba(167, 116, 176, 1);
      }
      .thebtn5 {
        color: #ffffff;
        background: rgba(0, 155, 88, 1);
      }
      .thebtn6 {
        color: #ffffff;
        background: rgba(236, 108, 0, 1);
      }
    }
  }
}
</style>
