<template>
  <div class="page1">
    <topBar
      v-if="topList.length > 0"
      :top-list="topList"
      :moren="moren"
    />
    <div class="thetopbox">
      <el-form
        ref="form"
        :model="queryParams"
        label-width="auto"
      >
        <el-row :gutter="40">
          <el-col :span="4">
            <el-form-item
              :label="'会员编号'"
              prop="memberCode"
            >
              <el-input
                v-model="queryParams.memberCode"
                clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item
              :label="'会员姓名'"
              prop="memberName"
            >
              <el-input
                v-model="queryParams.memberName"
                clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item
              :label="'订单编号'"
              prop="orderCode"
            >
              <el-input
                v-model="queryParams.orderCode"
                clearable
              />
            </el-form-item>
          </el-col>

          <el-col :span="4">
            <el-form-item
              :label="'订单类型'"
              prop="orderType"
            >
              <el-select
                v-model="queryParams.orderType"
                clearable
                :placeholder="'请选择'"
              >
                <el-option
                  v-for="(item, index) in orderTypeList"
                  :key="index"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item
              :label="'商品名称'"
              prop="productName"
            >
              <el-input
                v-model="queryParams.productName"
                clearable
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="40">
          <el-col :span="4">
            <el-form-item
              class="dizhi"
              :label="'详细地址'"
              prop=""
            >
              <el-cascader
                v-model="queryParams.shoppingAddress"
                style="width: 100%"
                clearable
                :options="areaData"
                :props="regionParams"
                @change="handleChange1"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item
              label=""
              prop="recAddress"
              label-width="0px"
            >
              <el-input
                v-model="queryParams.recAddress"
                clearable
              />
            </el-form-item>
          </el-col>

          <el-col :span="8">

            <el-form-item
              :label="'支付日期'"
              prop="code"
            >
              <el-date-picker
                v-model="queryParams.payTime"
                type="daterange"
                range-separator="——"
                :start-placeholder="'开始日期'"
                :end-placeholder="'结束日期'"
                value-format="yyyy-MM-dd"
                :unlink-panels="true"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-collapse-transition>
          <div v-show="isActive">
            <el-row :gutter="40">
              <el-col :span="8">
                <el-form-item
                  :label="'创建日期'"
                  prop="code"
                >
                  <el-date-picker
                    v-model="queryParams.creationTime"
                    type="datetimerange"
                    range-separator="——"
                    :start-placeholder="'开始日期'"
                    :end-placeholder="'结束日期'"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    :unlink-panels="true"
                  />
                </el-form-item>
              </el-col>
            </el-row>
          </div>
        </el-collapse-transition>
        <el-row style="">
          <el-col :span="4">
            <div class="searchbox">
              <el-button
                size="medium"
                class="searchbtn"
                @click="getSearch"
              > {{ '搜索' }}</el-button>
              <el-button @click="reChongzhi"> {{ '重置' }}</el-button>
            </div>
          </el-col>
          <div
            class="openClose"
            @click="changeActive"
          >
            <i :class="isActive ? 'el-icon-arrow-up' : 'el-icon-arrow-down'" />
            <div>{{ isActive ? '点击收起' : '点击展开' }}</div>
          </div>
        </el-row>
      </el-form>
    </div>
    <div class="maintop">
      <div class="mainbtn">
        <el-button
          v-hasButtons="['OrderBusinessProduct']"
          size="small"
          class="thebtn4"
          :disabled="this.orderCodes.length != 1"
          @click="changeGoods(1)"
        >{{ '调换货物' }}</el-button>
        <el-button
          v-hasButtons="['OrderBusinessAddress']"
          size="small"
          class="thebtn1"
          :disabled="multiple"
          @click="updateAdress(1)"
        >{{ '修改' }}{{ '地址' }}</el-button>
        <!-- <el-button size="small"
                                         class="thebtn2"
                                         :disabled="multiple">撤销订单</el-button>
                              <el-button size="small"
                                         class="thebtn3"
                                         :disabled="multiple">撤销产品</el-button> -->
        <el-button
          size="small"
          class="thebtn5"
          @click="importTemplate"
        > {{ '下载模板' }}</el-button>
        <el-button
          v-hasButtons="['OrderBusinessImport']"
          size="small"
          class="thebtn6"
          @click="handleImport"
        > {{ '导入' }}</el-button>
      </div>
    </div>
    <div class="main">

      <div class="maintable">
        <el-table
          :data="tableData"
          height="600px"
          style="width: 100%"
          :header-cell-style="{ background: '#EEEEEE' }"
          :span-method="objectSpanMethod"
          :row-class-name="tableRowClassName"
          @select-all="handleSelectionChangeAll"
          @selection-change="handleSelectionChange"
        >
          <!-- <el-table-column type="selection"
                                                   width="55"> </el-table-column> -->

          <el-table-column
            type="selection"
            width="55"
          />
          <el-table-column
            align="center"
            width="170"
            prop="orderCode"
            :label="'订单编号'"
          />
          <el-table-column
            align="center"
            prop="orderTypeVal"
            :label="'订单类型'"
          />
          <el-table-column
            align="center"
            width="150"
            prop="memberCode"
            :label="'会员编号'"
          />

          <el-table-column
            align="center"
            prop="memberName"
            :label="'会员姓名'"
          />
          <el-table-column
            align="center"
            prop="recName"
            :label="'收货人'"
          />
          <el-table-column
            align="center"
            prop="recPhone"
            width="120"
            :label="'联系方式'"
          />
          <el-table-column
            align="center"
            prop="recProvinceVal"
            :label="'省'"
          />
          <el-table-column
            align="center"
            prop="recCityVal"
            :label="'市'"
          />
          <el-table-column
            align="center"
            prop="recCountyVal"
            :label="'区/县'"
          />
          <el-table-column
            align="center"
            prop="recAddress"
            width="220"
            :label="'详细地址'"
          />

          <el-table-column
            align="center"
            prop="orderAmount"
            width="120"
            :label="'商品总价'+`(${isLocalSymbol()})`"
          >
            <template slot-scope="scope">
              {{ scope.row.orderAmount
                |numberToCurrency }}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="120"
            prop="orderAchieve"
            :label="'商品业绩'+`(${isLocals()})`"
          >
            <template slot-scope="scope">
              {{ scope.row.orderAchieve |numberToCurrency }}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="120"
            prop="orderAssAchieve"
            :label="'商品业绩'+`(BV)`"
          >
            <template slot-scope="scope">
              {{ scope.row.orderAssAchieve |numberToCurrency }}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="creationTime"
            width="160"
            :label="'创建日期'"
          />
          <el-table-column
            align="center"
            prop="payTime"
            width="160"
            :label="'支付日期'"
          />
          <el-table-column
            align="center"
            prop="productName"
            width="160"
            :label="'产品名称'"
          />
          <el-table-column
            align="center"
            prop="specsName"
            width="160"
            :label="'产品规格'"
          />
          <el-table-column
            align="center"
            prop="price"
            width="120"
            :label="`${'产品单价'}(${isLocalSymbol()})`"
          >
            <template slot-scope="scope">
              {{ scope.row.price |numberToCurrency }}
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            width="120"
            prop="achievement"
            :label="`${'产品业绩'}`+`($)`"
          >
            <template slot-scope="scope">
              {{ scope.row.achievement |numberToCurrency }}
            </template>
          </el-table-column>

          <el-table-column
            align="center"
            prop="quantity"
            :label="'数量'"
          />

          <el-table-column
            align="center"
            fixed="right"
            prop=""
            width="150"
            :label="'操作'"
          >
            <template slot-scope="scope">
              <el-button
                v-if="scope.row.orderType !== 26"
                v-hasButtons="['OrderBusinessProduct']"
                style="color: rgba(167, 116, 176, 1);margin-left:10px"
                type="text"
                size="small"
                @click="changeGoods(scope.row.orderCode)"
              >
                调换货物</el-button>
              <el-button
                v-hasButtons="['OrderBusinessAddress']"
                style="color: rgba(243, 169, 0, 1)"
                type="text"
                size="small"
                @click="updateAdress(scope.row.orderCode)"
              >{{ '修改' }}{{ '地址' }}</el-button>
              <el-button
                v-show="(scope.row.orderType == 1||scope.row.orderType == 24||scope.row.orderType == 7) && scope.row.howLong < 7 && scope.row.orderType != 30"
                v-hasButtons="['OrderBusinessCancel']"
                style="color: rgba(72, 178, 253, 1)"
                type="text"
                size="small"
                @click="backOrder(scope.row.orderCode, 1)"
              >单次撤单</el-button>
              <el-button
                v-show="(scope.row.orderType == 1||scope.row.orderType == 24||scope.row.orderType == 7) && scope.row.howLong < 7 && scope.row.orderType != 30"
                v-hasButtons="['OrderBusinessCancel']"
                style="color: rgba(72, 178, 253, 1)"
                type="text"
                size="small"
                @click="backOrder(scope.row.orderCode, 2, scope.row)"
              >合并撤单</el-button>
              <el-button
                v-show="scope.row.orderType != 1 && scope.row.orderType != 24 &&
                  // scope.row.orderType != 25&&
                  scope.row.orderType != 7 && scope.row.howLong < 7 && scope.row.orderType != 30"
                v-hasButtons="['OrderBusinessCancel']"
                style="color: rgba(72, 178, 253, 1)"
                type="text"
                size="small"
                @click="backOrder(scope.row.orderCode, 3)"
              >撤销订单</el-button>
              <!-- v-show="
                  scope.row.orderType != 1 &&
                    scope.row.orderType != 24 &&
                    scope.row.orderType != 25 &&
                    scope.row.orderType != 2 &&
                    scope.row.orderType != 7 &&
                    scope.row.howLong < 7
                    && scope.row.orderType != 30
                " -->
              <el-button
                v-if="![1, 2, 7, 24, 25, 26, 30].includes(scope.row.orderType) && scope.row.howLong < 7"
                v-hasButtons="['OrderBusinessCancel']"
                style="color: rgba(72, 178, 253, 1)"
                type="text"
                size="small"
                @click="backOrder(scope.row.orderCode, 4)"
              >撤销产品</el-button>
              <el-button
                v-show="(scope.row.orderType == 1 || scope.row.orderType == 24 || scope.row.orderType == 7) && scope.row.returnFlag ==0 && scope.row.orderType != 30"
                v-hasButtons="['OrderBusinessReturn']"
                style="color: rgba(228, 27, 27, 1)"
                type="text"
                size="small"
                @click="cancelOrder(scope.row.orderCode, 2)"
              >退单
              </el-button>

              <el-button
                v-show="(scope.row.orderType != 1 && scope.row.orderType != 24 && scope.row.orderType != 7) && scope.row.returnFlag ==0 && scope.row.orderType != 30"
                v-hasButtons="['OrderBusinessReturn']"
                style="color: rgba(228, 27, 27, 1)"
                type="text"
                size="small"
                @click="cancelOrder(scope.row.orderCode, 2)"
              >退单
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
    <pagination
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getSearch"
    />
    <el-dialog
      :title="upload.title"
      :close-on-click-modal="false"
      :visible.sync="upload.open"
      width="600px"
      append-to-body
    >
      <el-upload
        ref="upload"
        :limit="1"
        accept=".xlsx, .xls"
        :headers="upload.headers"
        :action="upload.url"
        :disabled="upload.isUploading"
        :on-progress="handleFileUploadProgress"
        :on-success="handleFileSuccess"
        :on-exceed="handleExceed"
        :auto-upload="false"
        drag
      >
        <i class="el-icon-upload" />
        <div class="el-upload__text">
          {{ '将文件拖到此处，或' }}
          <em>{{ '点击上传' }}</em>
        </div>
        <!-- <div class="el-upload__tip"
             slot="tip">
          <el-link type="info"
                   style="font-size: 12px"
                   @click="importTemplate"> {{ '下载模板' }}</el-link>
        </div> -->
        <div
          slot="tip"
          class="el-upload__tip"
          style="color: red"
        >
          {{ '提示：仅允许导入“xls”或“xlsx”格式文件！' }}
        </div>
      </el-upload>
      <div
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          type="primary"
          @click="submitFileForm"
        >{{ '确认' }}</el-button>
        <el-button @click="upload.open = false">{{ '取消' }}</el-button>
      </div>
    </el-dialog>
    <!-- 修改地址 -->
    <el-dialog
      :title="'修改地址'"
      :visible.sync="checkAdress"
      width="80%"
      :close-on-click-modal="false"
      center
    >
      <el-table
        :data="checkAdressList"
        height="400px"
        style="width: 100%"
        :header-cell-style="{ background: '#EEEEEE' }"
        :row-class-name="tableRowClassName"
      >
        <el-table-column
          align="center"
          prop="orderCode"
          :label="'订单编号'"
        />
        <el-table-column
          align="center"
          prop="productName"
          :label="'收货人'"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.recName"
              clearable
            />
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="productName"
          :label="'联系方式'"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.recPhone"
              clearable
            />
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="productName"
          label="省、市、区/县"
        >
          <template slot-scope="scope">
            <el-cascader
              v-model="scope.row.ssq"
              clearable
              :options="areaData"
              :props="regionParams"
              @change="handleChange2"
            />
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="productName"
          :label="'详细地址'"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.recAddress"
              clearable
            />
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="accountKeyVal"
          :label="'扣款币种'"
        />
        <el-table-column
          align="center"
          prop="cost"
          :label="'扣款金额'+'(￥)'"
        />
      </el-table>
      <!-- <span slot="footer"
            class="dialog-footer">
        <el-button @click="checkAdress = false">{{'取消'}}</el-button>
        <el-button type="primary"
                   @click="saveAdress">{{'确认'}}</el-button>
      </span> -->
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="checkAdress = false">{{ '取消' }}</el-button>
        <el-button
          v-hasButtons="['orderAdressMq']"
          class="thebtn4"
          @click="saveAdress(1)"
        >{{ '免签' }}</el-button>
        <el-button
          v-hasButtons="['orderAdressMf']"
          class="thebtn2"
          @click="saveAdress(2)"
        >{{ '免付' }}</el-button>
        <el-button
          v-hasButtons="['orderAdressQm']"
          class="thebtn5"
          @click="saveAdress(3)"
        >{{ '全免' }}</el-button>
        <el-button
          v-hasButtons="['orderAdressQr']"
          type="primary"
          class="thebtn3"
          @click="saveAdress(0)"
        >{{ '确认' }}</el-button>
      </span>
    </el-dialog>
    <!-- 调换货 -->
    <el-dialog
      :title="'调换货物'"
      :visible.sync="isChangeGoods"
      width="90%"
      :close-on-click-modal="false"
      center
    >
      <el-table
        :data="oldGoodsList"
        style="width: 100%"
        :span-method="objectSpanMethod1"
        :header-cell-style="{ background: '#EEEEEE' }"
        :row-class-name="tableRowClassName"
      >
        <el-table-column
          align="center"
          prop="productName"
          :label="'产品名称'"
        />
        <el-table-column
          align="center"
          prop="productCode"
          :label="'产品编号'"
        />
        <el-table-column
          align="center"
          prop="specsName"
          :label="'产品规格'"
        />

        <el-table-column
          align="center"
          prop="quantity"
          :label="'数量'"
        />
        <el-table-column
          align="center"
          prop="price"
          :label="'产品单价'+'(￥)'"
        />

        <el-table-column
          align="center"
          prop="achievement"
          :label="`${'产品业绩'}`+`($)`"
        />
        <el-table-column
          align="center"
          prop="achievementRmb"
          :label="`${'产品业绩'}`+`(￥)`"
        />
        <el-table-column
          align="center"
          prop="assAchievement"
          :label="'产品业绩'+'(BV)'"
        />
        <el-table-column
          align="center"
          prop="isGiftVal"
          label="是否赠品"
        />

        <el-table-column
          align="center"
          prop="postage"
          :label="'邮费'"
        />
        <el-table-column
          align="center"
          prop="orderCode"
          :label="'订单编号'"
        />
        <el-table-column
          align="center"
          prop="orderAmount"
          :label="'商品总价'+`(${isLocalSymbol()})`"
        />
        <el-table-column
          align="center"
          prop="orderAchieve"
          :label="'商品业绩'+`(${isLocalSymbol()})`"
        />
        <el-table-column
          align="center"
          prop="orderAssAchievement"
          :label="'商品业绩'+`(BV)`"
        />
        <el-table-column
          align="center"
          prop="accountKeyVal"
          :label="'扣款币种'"
        />
        <el-table-column
          align="center"
          prop="cost"
          :label="'扣款金额'+'(￥)'"
        />
      </el-table>
      <div
        class="delBtn"
        @click="delTableList"
      > {{ '删除' }}</div>
      <el-table
        :data="newGoodsList"
        style="width: 100%"
        :header-cell-class-name="headerCell"
        :span-method="objectSpanMethod3"
        :header-cell-style="{ background: '#EEEEEE' }"
        :row-class-name="tableRowClassName"
        @selection-change="newListSelect"
      >
        <el-table-column
          type="selection"
          width="55"
        />
        <el-table-column
          align="center"
          prop="productName"
          width="120"
          :label="'产品名称'"
        >
          <template slot-scope="scope">
            <el-select
              v-model="scope.row.productCode"
              size="medium"
              :disabled="scope.row.editFlag == 1"
              filterable
              :placeholder="'请选择'"
              @change="changeProduct($event, scope.$index)"
            >
              <el-option
                v-for="item in productList"
                :key="item.productCode"
                :label="item.productName"
                :value="item.productCode"
              />
            </el-select>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="productCode"
          :label="'产品编号'"
        />
        <el-table-column
          align="center"
          prop="specsName"
          width="150"
          :label="'产品规格'"
        >
          <template slot-scope="scope">
            <el-popover
              v-model="scope.row.visible"
              placement="bottom"
              width="300"
            >
              <div
                v-for="item,index in scope.row.specs"
                :key="index"
              >
                <div class="tit">{{ item.typeName }}</div>
                <el-radio-group v-model="item.radio">
                  <el-radio
                    v-for="ctem,cindex in item.specsList"
                    :key="cindex"
                    :label="ctem.specsId"
                  >{{ ctem.value }}</el-radio>
                </el-radio-group>
              </div>
              <div style="text-align: right; margin: 0">
                <el-button
                  size="mini"
                  type="text"
                  @click="scope.row.visible = false"
                > {{ '取消' }}</el-button>
                <el-button
                  type="primary"
                  size="mini"
                  @click="sureSpecs(scope.$index)"
                >{{ '确定' }}</el-button>
              </div>
              <el-button
                slot="reference"
                :disabled="scope.row.editFlag == 1"
              >{{ scope.row.specsName || '选择产品规格' }}</el-button>
            </el-popover>
          </template>
        </el-table-column>

        <el-table-column
          align="center"
          prop="quantity"
          width="150"
          :label="'数量'"
        >
          <template slot-scope="scope">
            <el-input-number
              v-model="scope.row.quantity"
              :disabled="scope.row.editFlag == 1"
              :min="0"
              size="mini"
              :label="'描述文字'"
            />
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="price"
          width="120"
          :label="'产品单价'+'(￥)'"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.price"
              clearable
              :disabled="scope.row.editFlag == 1"
              size="medium"
            />
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="achievement"
          width="120"
          :label="`${'产品业绩'}`+`($)`"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.achievement"
              clearable
              :disabled="scope.row.editFlag == 1"
              size="medium"
            />
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          width="120"
          prop="assAchievement"
          :label="'产品业绩'+'(BV)'"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.assAchievement"
              clearable
              size="medium"
              :disabled="scope.row.editFlag == 1"
            />
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="isGiftVal"
          label="是否赠品"
        >
          <template slot-scope="scope">
            <el-select
              v-model="scope.row.isGift"
              clearable
              :disabled="scope.row.editFlag == 1"
              :placeholder="'请选择'"
            >
              <el-option
                v-for="(item, index) in yesNoList"
                :key="index"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          width="120"
          prop="postage"
          :label="'邮费'"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.postage"
              clearable
              size="medium"
            />
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="orderCode"
          :label="'订单编号'"
        />
        <el-table-column
          align="center"
          prop="orderAmount"
          :label="'商品总价'+`(${isLocalSymbol()})`"
        >
          <template slot-scope="scope">
            <!-- <el-input clearable size="medium" v-model="totalMont">
                </el-input> -->
            <div>{{ totalMont }}</div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="orderAchieve"
          :label="'商品业绩'+`(${isLocals()})`"
        >
          <template slot-scope="scope">
            <!-- <el-input clearable size="medium" v-model="totalPv">
                </el-input> -->
            <div>{{ totalPv }}</div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="orderAssAchieve"
          :label="'商品业绩'+`(BV)`"
        >
          <template slot-scope="scope">
            <!-- <el-input clearable size="medium" v-model="totalBv">
                </el-input> -->
            <div>{{ totalBv }}</div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="accountKeyVal"
          :label="'扣款币种'"
        />
        <el-table-column
          align="center"
          prop="cost"
          :label="'扣款金额'+'(￥)'"
        />
      </el-table>
      <div class="addList">
        <i
          class="el-icon-circle-plus"
          @click="addNewItem"
        />
      </div>
      <!-- <span slot="footer"
            class="dialog-footer">
        <el-button @click="isChangeGoods = false">{{'取消'}}</el-button>
        <el-button type="primary"
                   @click="saveGoods">{{'确认'}}</el-button>
      </span> -->
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="isChangeGoods = false">{{ '取消' }}</el-button>
        <el-button
          v-hasButtons="['orderChangeMq']"
          class="thebtn4"
          @click="saveGoods(1)"
        >{{ '免签' }}</el-button>
        <el-button
          v-hasButtons="['orderChangeMf']"
          class="thebtn2"
          @click="saveGoods(2)"
        >{{ '免付' }}</el-button>
        <el-button
          v-hasButtons="['orderChangeQm']"
          class="thebtn5"
          @click="saveGoods(3)"
        >{{ '全免' }}</el-button>
        <el-button
          v-hasButtons="['orderChangeQr']"
          type="primary"
          class="thebtn3"
          @click="saveGoods(0)"
        >{{ '确认' }}</el-button>
      </span>
    </el-dialog>
    <!-- 退单 -->
    <el-dialog
      title="退单"
      :visible.sync="returnOrder"
      width="60%"
      :close-on-click-modal="false"
      center
    >
      <el-table
        :data="returnCodeList.orderItemsExtList"
        height="400px"
        style="width: 100%"
        :span-method="objectSpanMethod2"
        :header-cell-style="{ background: '#EEEEEE' }"
        :row-class-name="tableRowClassName"
      >
        <el-table-column
          align="center"
          prop="orderCode"
          :label="'订单编号'"
        />
        <el-table-column
          align="center"
          prop="productName"
          :label="'产品名称'"
        />
        <el-table-column
          align="center"
          prop="quantity"
          :label="'产品数量'"
        />
        <el-table-column
          align="center"
          prop="price"
          label="订单价格(￥)"
        />
        <el-table-column
          align="center"
          prop="achievement"
          :label="`${'产品业绩'}`+`(${isLocalSymbol()})`"
        />
        <el-table-column
          align="center"
          prop="assAchievement"
          :label="'产品业绩'+'(BV)'"
        />
      </el-table>
      <div style="height: 20px" />
      <el-form
        ref="returnForm"
        :model="returnForm"
        label-width="auto"
      >
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="退还金额">
              <el-input
                v-model="returnForm.returnAmount"
                clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="退单备注">
              <el-input
                v-model="returnForm.returnRemark"
                clearable
                type="textarea"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="returnOrder = false">{{ '取消' }}</el-button>
        <el-button
          type="primary"
          @click="saveReturnCode(1)"
        >{{ '确认' }}</el-button>
      </span>
    </el-dialog>
    <!-- 合并退单 -->
    <el-dialog
      title="退单"
      :visible.sync="returnOrderMerge"
      width="80%"
      :close-on-click-modal="false"
      center
    >
      <el-table
        :data="returnCodeList"
        height="400px"
        style="width: 100%"
        :span-method="objectSpanMethod2"
        :header-cell-style="{ background: '#EEEEEE' }"
        :row-class-name="tableRowClassName"
      >
        <el-table-column
          align="center"
          prop="memberCode"
          :label="'会员编号'"
        />
        <el-table-column
          align="center"
          prop="memberName"
          :label="'会员姓名'"
        />
        <el-table-column
          align="center"
          prop="orderCode"
          :label="'订单编号'"
        />
        <el-table-column
          align="center"
          prop="productName"
          :label="'产品名称'"
        >
          <template slot-scope="scope">
            <div
              v-for="item in scope.row.orderItemsExtList"
              :key="item.pkId"
            >
              {{ item.productName }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="quantity"
          :label="'产品数量'"
        >
          <template slot-scope="scope">
            <div
              v-for="item in scope.row.orderItemsExtList"
              :key="item.pkId"
            >
              {{ item.quantity }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="price"
          label="订单价格(￥)"
        >
          <template slot-scope="scope">
            <div
              v-for="item in scope.row.orderItemsExtList"
              :key="item.pkId"
            >
              {{ item.price }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="achievement"
          :label="`${'产品业绩'}`+`(${isLocalSymbol()})`"
        >
          <template slot-scope="scope">
            <div
              v-for="item in scope.row.orderItemsExtList"
              :key="item.pkId"
            >
              {{ item.achievement }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="assAchievement"
          :label="'产品业绩'+'(BV)'"
        >
          <template slot-scope="scope">
            <div
              v-for="item in scope.row.orderItemsExtList"
              :key="item.pkId"
            >
              {{ item.assAchievement }}
            </div>
          </template>
        </el-table-column>
        <!-- <el-table-column align="center"
                         prop="returnAmount"
                         label="返还金额(￥)">
<template slot-scope="scope">
  <el-input clearable
            v-model="scope.row.returnAmount"> </el-input>
</template>
        </el-table-column> -->
        <!-- <el-table-column align="center"
                         prop="returnRemark"
                         label="返还备注">
<template slot-scope="scope">
  <el-input clearable
            type="textarea"
            :rows="2"
            v-model="scope.row.returnRemark">
  </el-input>
</template>
        </el-table-column> -->
      </el-table>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="returnOrderMerge = false">{{ '取消' }}</el-button>
        <el-button
          type="primary"
          @click="saveReturnCode(2)"
        >{{ '确认' }}</el-button>
      </span>
    </el-dialog>
    <!-- 撤销订单 -->
    <el-dialog
      title="撤销订单"
      :visible.sync="isBackOrder"
      width="60%"
      :close-on-click-modal="false"
      center
    >
      <el-table
        :data="backCodeList.orderCancelDetailVOList"
        height="400px"
        style="width: 100%"
        :span-method="objectSpanMethod4"
        :header-cell-style="{ background: '#EEEEEE' }"
        :row-class-name="tableRowClassName"
      >
        <el-table-column
          align="center"
          prop="orderCode"
          :label="'订单编号'"
        />
        <el-table-column
          align="center"
          prop="productName"
          :label="'产品名称'"
        />
        <el-table-column
          align="center"
          prop="number"
          :label="'产品数量'"
        />
        <el-table-column
          align="center"
          prop="orderAmount"
          label="订单价格(￥)"
        />
        <el-table-column
          align="center"
          prop="achievement"
          :label="`${'产品业绩'}`+`(${isLocalSymbol()})`"
        />
        <el-table-column
          align="center"
          prop="assAchievement"
          :label="'产品业绩'+'(BV)'"
        />
        <el-table-column
          align="center"
          prop="accountKeyVal"
          :label="'扣款币种'"
        />
        <el-table-column
          align="center"
          prop="cost"
          :label="'扣款金额'+'(￥)'"
        />
      </el-table>
      <div style="height: 20px" />
      <el-form
        ref="backForm"
        :model="backForm"
        label-width="auto"
      >
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="撤单备注">
              <el-input
                v-model="backForm.returnRemark"
                clearable
                type="textarea"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="isBackOrder = false">{{ '取消' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelMq']"
          class="thebtn4"
          @click="saveBackkOrder(1)"
        >{{ '免签' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelMf']"
          class="thebtn2"
          @click="saveBackkOrder(2)"
        >{{ '免付' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelQm']"
          class="thebtn5"
          @click="saveBackkOrder(3)"
        >{{ '全免' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelQr']"
          type="primary"
          class="thebtn3"
          @click="saveBackkOrder(0)"
        >{{ '确认' }}</el-button>
      </span>
    </el-dialog>
    <!-- 撤销产品 -->
    <el-dialog
      title="撤销产品"
      :visible.sync="isBackProduct"
      width="60%"
      :close-on-click-modal="false"
      center
    >
      <el-table
        :data="backProductList.orderCancelDetailVOList"
        height="400px"
        style="width: 100%"
        :header-cell-style="{ background: '#EEEEEE' }"
        :row-class-name="tableRowClassName"
        @selection-change="selProduct"
      >
        <el-table-column
          type="selection"
          width="55"
        />
        <el-table-column
          align="center"
          prop="productName"
          :label="'产品名称'"
        />
        <el-table-column
          align="center"
          prop="number"
          :label="'产品数量'"
        />
        <el-table-column
          align="center"
          prop="orderAmount"
          label="订单价格(￥)"
        />
        <el-table-column
          align="center"
          prop="achievement"
          :label="`${'产品业绩'}`+`(${isLocalSymbol()})`"
        />
        <el-table-column
          align="center"
          prop="assAchievement"
          :label="'产品业绩'+'(BV)'"
        />
      </el-table>
      <div style="height: 20px" />
      <el-form
        ref="backForm"
        :model="backForm"
        label-width="auto"
      >
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="撤单备注">
              <el-input
                v-model="backForm.returnRemark"
                clearable
                type="textarea"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="isBackProduct = false">{{ '取消' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelMq']"
          class="thebtn4"
          @click="saveBackkProduct(1)"
        >{{ '免签' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelMf']"
          class="thebtn2"
          @click="saveBackkProduct(2)"
        >{{ '免付' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelQm']"
          class="thebtn5"
          @click="saveBackkProduct(3)"
        >{{ '全免' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelQr']"
          type="primary"
          class="thebtn3"
          @click="saveBackkProduct(0)"
        >{{ '确认' }}</el-button>
      </span>
    </el-dialog>
    <!-- 合并撤销订单 -->
    <el-dialog
      title="伞下会员信息"
      :visible.sync="mergeBackOrder"
      width="60%"
      :close-on-click-modal="false"
      center
    >
      <el-table
        :data="mergebackCodeList.memberList"
        height="400px"
        style="width: 100%"
        :header-cell-style="{ background: '#EEEEEE' }"
        :row-class-name="tableRowClassName"
      >
        <el-table-column
          align="center"
          prop="memberCode"
          :label="'会员编号'"
        />
        <el-table-column
          align="center"
          prop="memberName"
          :label="'会员姓名'"
        />
        <el-table-column
          align="center"
          prop="accountKeyVal"
          :label="'扣款币种'"
        />
        <el-table-column
          align="center"
          prop="cost"
          :label="'扣款金额'+'(￥)'"
        />
      </el-table>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="mergeBackOrder = false">{{ '取消' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelMq']"
          class="thebtn4"
          @click="savemergeBackOrder(1)"
        >{{ '免签' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelMf']"
          class="thebtn2"
          @click="savemergeBackOrder(2)"
        >{{ '免付' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelQm']"
          class="thebtn5"
          @click="savemergeBackOrder(3)"
        >{{ '全免' }}</el-button>
        <el-button
          v-hasButtons="['ordercancelQr']"
          type="primary"
          class="thebtn3"
          @click="savemergeBackOrder(0)"
        >{{ '确认' }}</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import topBar from '@/components/topBar/checked'
import * as log from '@/api/logistics'
import * as api from '@/api/site.js'
import * as del from '@/api/delivery.js'
import * as pro from '@/api/product.js'
import { getRouters } from '@/api/settle'

import {
  getOrderBusinessList,
  getOrderBusinessAddressData,
  checkHassign,
  addressCheck,
  productData,
  returnData,
  returnDataMerge,
  toCancelOrder
} from '@/api/business'
import { mapGetters } from 'vuex'

import { getToken } from '@/utils/auth'
import { isLocals, isLocalSymbol } from '@/utils/numberToCurrency'
export default {
  name: 'Ddyw',
  components: {
    topBar
  },
  data() {
    return {
      selProdyctList: [],
      mergeBackOrder: false,
      mergebackCodeList: '',
      backCodeList: '',
      backProductList: '',
      backForm: {},
      isBackOrder: false,
      isBackProduct: false,
      returnCodeList: '',
      returnForm: {},
      checkAdress: false,
      isChangeGoods: false,
      returnOrder: false,
      returnOrderMerge: false,
      checkAdressList: [],
      oCheckAdressList: [],
      oldGoodsList: [],
      newGoodsList: [],
      // 选中的调换货的table_i
      newGoodsSelList: [],
      allGoodsList: [],
      productList: [],
      colSpanArr: [],
      rowIndexArr: [],
      colSpanArr1: [],
      rowIndexArr1: [],
      colSpanArr2: [],
      rowIndexArr2: [],
      colSpanArr3: [],
      rowIndexArr3: [],
      colSpanArr4: [],
      rowIndexArr4: [],
      torderCodeList: '',
      moren: 'ddyw',
      topList: [
        {
          name: '基础业务',
          path: 'jcyw',
          url: 'BasicBusiness'
        },
        {
          name: '订单业务',
          path: 'ddyw',
          url: 'OrderBusiness'
        }
        // {
        //     name: '确认业务',
        //     path: 'shyw',
        // },
        // {
        //     name: '在线签呈',
        //     path: 'zxqc',
        // },
      ],
      tableData: [],
      queryParams: {
        pageNum: 1,
        pageSize: 50,
        memberCode: '',
        memberName: '',
        productName: '',
        orderType: '',
        recProvince: '',
        recCity: '',
        recCounty: '',
        recAddress: '',
        shoppingAddress: [],
        creationTime: [],
        payTime: []
      },
      isActive: false,
      total: 0,
      areaData: [],
      orderTypeList: [],
      regionParams: {
        label: 'name',
        value: 'id',
        children: 'children',
        expandTrigger: 'hover'
      },
      upload: {
        // 是否显示弹出层（物流导入）
        open: false,
        // 弹出层标题（物流导入）
        title: '',
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的物流数据
        updateSupport: 0,
        // 设置上传的请求头部
        headers: { Authorization: 'Bearer ' + getToken() },
        // 上传的地址
        url:
          process.env.VUE_APP_BASE_API + '/sale/manage/order-business/import'
      },
      // 非多个禁用
      multiple: true,
      orderCodes: [],
      totalMont: 0,
      totalPv: 0,
      totalBv: 0,
      yesNoList: [],
      multipleSelection: []
    }
  },
  watch: {
    newGoodsList: {
      handler(n) {
        // totalMont
        let total = 0
        let totalPv = 0
        let totalBv = 0
        n.forEach((item) => {
          total += item.price * item.quantity
          totalPv += item.achievement * item.quantity
          totalBv += item.assAchievement * item.quantity
        })
        this.totalMont = total
        this.totalPv = totalPv
        this.totalBv = totalBv
      },
      deep: true
    }
  },
  created() {
    this.getData()
    this.getUserRoute()
    // this.getPayTime()
    // this.getSearch()
  },
  computed: {
    ...mapGetters(['getUser'])
  },
  methods: {
    getUserRoute() {
      getRouters().then((res) => {
        res.data.forEach((item) => {
          this.topList.forEach((items) => {
            if (item.routeName == items.url) {
              this.$set(items, 'changed', true)
            }
          })
        })
      })
    },
    headerCell(row) {
      if (row.columnIndex === 0 && row.rowIndex === 0) {
        this.removeCheckedAllDom(row)
      }
    },

    removeCheckedAllDom(row) {
      this.$nextTick(() => {
        // 每次触发 headerCell 判断如果是第一个 单元格 调用该方法
        // row.column.id 是该单元格的 class 样式
        // 通过 class 样式连续找两层 children 节点 如果存在 执行 remove()
        var selectBox = document.querySelector(`.${row.column.id}`)
        selectBox.children[0].children[0]?.remove()
      })
    },
    isLocalSymbol,
    getPayTime() {
      const date = new Date()
      const year = date.getFullYear()
      let month = date.getMonth() + 1
      month = month >= 10 ? month : '0' + month
      let day = date.getDate()
      day = day >= 10 ? day : '0' + day
      this.$set(this.queryParams, 'payTime', [
        `${year}-${month}-01`,
        `${year}-${month}-${day}`
      ])
      // this.getSearch()
    },
    yesNo() {
      api.yes_no().then((res) => {
        this.yesNoList = res.data
      })
    },
    isLocals,
    saveAdress(index) {
      addressCheck({ orderList: this.torderCodeList }).then((res) => {
        if (res.code != 200) return false
        // 把地址id转成汉字地址
        const arr = this.flatten(this.areaData)
        this.checkAdressList.forEach((btem) => {
          btem.nameList = ''
          arr.forEach((item) => {
            btem.ssq.forEach((ctem) => {
              if (ctem == item.id) {
                btem.nameList += item.name
              }
            })
          })
          btem.recProvince = Number(btem.ssq[0])
          btem.recCity = Number(btem.ssq[1]) || ''
          btem.recCounty = Number(btem.ssq[2]) || ''
        })
        let obj
        if (index == 0) {
          obj = {
            itemList: this.checkAdressList,
            payFlag: 1
          }
          this.$router.push({
            path: '/information/business/addressZxqc',
            query: {
              data: JSON.stringify(obj),
              index: 231
            }
          })
          // 免签 payFlag == 1
        } else if (index == 1) {
          obj = {
            itemList: this.checkAdressList,
            payFlag: 1
          }
          api.addressFree([obj]).then((res) => {
            if (res.code == 200) {
              this.$message({
                message: res.msg,
                type: 'success'
              })
              this.checkAdress = false
              this.getSearch()
            }
          })
          // 免付 payFlag == 0
        } else if (index == 2) {
          obj = {
            itemList: this.checkAdressList,
            payFlag: 0
          }
          this.$router.push({
            path: '/information/business/addressZxqc',
            query: {
              data: JSON.stringify(obj),
              index: 231
            }
          })
          // 全免 payFlag == 0
        } else if (index == 3) {
          obj = {
            itemList: this.checkAdressList,
            payFlag: 0
          }
          api.addressFree([obj]).then((res) => {
            if (res.code == 200) {
              this.$message({
                message: res.msg,
                type: 'success'
              })
              this.checkAdress = false
              this.getSearch()
            }
          })
        }
      })
    },
    // 修改地址
    updateAdress(order) {
      if (order == 1) {
        this.torderCodeList = this.orderCodes.join(',')
      } else {
        this.torderCodeList = order
      }
      getOrderBusinessAddressData({ orderList: this.torderCodeList }).then(
        (res) => {
          // ssq
          res.data.forEach((item) => {
            if (item.recCounty) {
              this.$set(item, 'ssq', [
                item.recProvince + '',
                item.recCity + '',
                item.recCounty + ''
              ])
            } else {
              this.$set(item, 'ssq', [item.recProvince + '', item.recCity + ''])
            }
          })
          this.checkAdressList = res.data
          this.oCheckAdressList = JSON.parse(JSON.stringify(res.data))
          // 把地址id转成汉字地址
          const arr = this.flatten(this.areaData)
          this.oCheckAdressList.forEach((btem) => {
            btem.nameList = ''
            arr.forEach((item) => {
              btem.ssq.forEach((ctem) => {
                if (ctem == item.id) {
                  btem.nameList += item.name
                }
              })
            })
          })
          // 把旧地址放入新地址列表
          this.checkAdressList.forEach((item) => {
            this.oCheckAdressList.forEach((ctem) => {
              item.oldList = ctem
            })
          })
          this.$forceUpdate()
          this.checkAdress = true
        }
      )
    },
    // 调换货
    changeGoods(order) {
      if (order == 1) {
        this.torderCodeList = this.orderCodes[0]
      } else {
        this.torderCodeList = order
      }
      productData({ orderCode: this.torderCodeList }).then((res) => {
        res.data.detailList.forEach((item, index) => {
          item.memberCode = res.data.memberCode
          item.memberName = res.data.memberName
          item.orderAchieve = res.data.orderAchieve
          item.orderAmount = res.data.orderAmount
          item.orderAssAchievement = res.data.orderAssAchievement
          item.orderCode = res.data.orderCode
          item.pkAccount = res.data.pkAccount
          item.postage = res.data.postage
          item.cost = res.data.cost
          item.visible = false
          item.index = index
          item.accountKeyVal = res.data.accountKeyVal
        })
        this.allGoodsList = res.data
        this.oldGoodsList = JSON.parse(JSON.stringify(res.data.detailList))
        this.newGoodsList = JSON.parse(JSON.stringify(res.data.detailList))
        const arr = this.newGoodsList.map((item) => {
          return item.productCode
        })
        if (arr.length > 0) {
          this.getSku(arr)
        }
        // 根据orderCode合并列
        this.getColSpanData('orderCode', this.oldGoodsList, 1)
        this.getColSpanData('orderCode', this.newGoodsList, 3)
        this.getProduct()
        this.isChangeGoods = true
      })
    },
    // 获取规格
    getSku(arr, index) {
      pro.getProductCodeSpecs({ productCodes: arr }).then((res) => {
        this.newGoodsList.forEach((item) => {
          arr.forEach((ctem) => {
            res.data.forEach((stem) => {
              if (item.productCode == ctem && ctem == stem.productCode) {
                // item.specs = stem.specsTypeData
                this.$set(item, 'specs', stem.specsTypeData)
              }
            })
          })
        })
        // 选择产品时默认选中规格
        if (index != undefined) {
          this.sureSpecs1(index)
        }
        this.$forceUpdate()
      })
    },
    // 付默认规格（第一个）
    sureSpecs1(index) {
      this.newGoodsList[index].specs.forEach((item) => {
        // item.specsList.forEach((ctem) => {
        //   if (item.radio == ctem.specsId) {
        //     item.radioVal = ctem.value
        //   }
        // })
        // item.radio = item.specsList[0].specsId
        // item.radioVal = item.specsList[0].value
        this.$set(item, 'radio', item.specsList[0].specsId)
        this.$set(item, 'radioVal', item.specsList[0].value)
      })
      this.newGoodsList[index].specsNameArr = []
      this.newGoodsList[index].specificationsArr = []
      this.newGoodsList[index].specs.forEach((item) => {
        this.newGoodsList[index].specsNameArr.push(item.radioVal)
        this.newGoodsList[index].specificationsArr.push(item.radio)
      })
      this.newGoodsList[index].specsNameId = this.newGoodsList[
        index
      ].specificationsArr
        .sort()
        .join(',')
      this.newGoodsList[index].specsName =
        this.newGoodsList[index].specsNameArr.join(',')
      this.newGoodsList[index].visible = false
      console.log(
        '%c [ this.newGoodsList ]-1553',
        'font-size:13px; background:#8c96af; color:#d0daf3;',
        this.newGoodsList
      )
    },
    sureSpecs(index) {
      this.newGoodsList[index].specs.forEach((item) => {
        item.specsList.forEach((ctem) => {
          if (item.radio == ctem.specsId) {
            item.radioVal = ctem.value
          }
        })
      })
      this.newGoodsList[index].specsNameArr = []
      this.newGoodsList[index].specificationsArr = []
      this.newGoodsList[index].specs.forEach((item) => {
        this.newGoodsList[index].specsNameArr.push(item.radioVal)
        this.newGoodsList[index].specificationsArr.push(item.radio)
      })
      this.newGoodsList[index].specsNameId = this.newGoodsList[
        index
      ].specificationsArr
        .sort()
        .join(',')
      this.newGoodsList[index].specsName =
        this.newGoodsList[index].specsNameArr.join(',')
      this.newGoodsList[index].visible = false
    },
    changeProduct(e, index) {
      this.productList.forEach((item) => {
        if (item.productCode == e) {
          this.$set(this.newGoodsList[index], 'productName', item.productName)
          this.$set(this.newGoodsList[index], 'pkProduct', item.pkId)
          // this.$set(this.newGoodsList[index], 'specsName', '')
        }
      })
      this.getSku([e], index)
    },
    addNewItem() {
      const obj = {
        achievement: 0,
        assAchievement: 0,
        cost: this.allGoodsList.memberCode.cost,
        memberCode: this.allGoodsList.memberCode,
        memberName: this.allGoodsList.memberName,
        orderAchieve: this.allGoodsList.orderAchieve,
        orderAmount: this.allGoodsList.orderAmount,
        orderAssAchievement: this.allGoodsList.orderAssAchievement,
        orderCode: this.allGoodsList.orderCode,
        orderStatus: '',
        pkAccount: 0,
        pkId: '',
        pkProduct: '',
        postage: this.allGoodsList.postage,
        price: 0,
        productCode: '',
        productName: '',
        quantity: 1,
        specs: [],
        specsName: '',
        visible: false
      }
      this.newGoodsList.push(obj)
      this.getColSpanData('orderCode', this.newGoodsList, 3)
    },
    newListSelect(e) {
      this.newGoodsSelList = e
    },
    // 删除指定数组
    delTableList() {
      const single = this.newGoodsSelList.some((item) => item.editFlag == 1)
      if (single) {
        this.$message({
          message: '所选行含有不可编辑项',
          type: 'warning'
        })
      } else {
        this.newGoodsSelList.forEach((item) => {
          this.newGoodsList.splice(this.newGoodsList.indexOf(item), 1)
        })
        this.getColSpanData('orderCode', this.newGoodsList, 3)
      }
    },
    saveGoods(index) {
      // this.newGoodsList
      console.log(
        '%c [  this.newGoodsList ]-1597',
        'font-size:13px; background:#4c010f; color:#904553;',
        this.newGoodsList
      )
      addressCheck({ orderList: this.torderCodeList }).then((res) => {
        if (res.code != 200) return false
        const arr = []
        if (this.oldGoodsList.length > this.newGoodsList.length) {
          for (let i = 0; i < this.oldGoodsList.length; i++) {
            arr.push({
              oldList: '',
              newList: ''
            })
          }
        } else {
          for (let i = 0; i < this.newGoodsList.length; i++) {
            arr.push({
              oldList: '',
              newList: ''
            })
          }
        }
        arr.forEach((item, index) => {
          this.oldGoodsList.forEach((ctem, cndex) => {
            arr[index].oldList = this.oldGoodsList[index] || {}
          })
          this.newGoodsList.forEach((ctem, cndex) => {
            arr[index].newList = this.newGoodsList[index] || {}
          })
        })
        this.allGoodsList.detailList = arr
        this.allGoodsList.postage = arr[0].newList.postage
        let obj
        if (index == 0) {
          obj = {
            itemList: this.newGoodsList,
            tableList: [this.allGoodsList],
            payFlag: 1
          }
          this.$router.push({
            path: '/information/business/dhZxqc',
            query: {
              data: JSON.stringify(obj),
              index: 232
            }
          })
        } else if (index == 1) {
          obj = {
            itemList: this.newGoodsList,
            orderCode: this.allGoodsList.orderCode,
            postage: this.allGoodsList.postage,
            tableList: [this.allGoodsList],
            payFlag: 1
          }
          api.productFree([obj]).then((res) => {
            if (res.code == 200) {
              this.$message({
                message: res.msg,
                type: 'success'
              })
              this.isChangeGoods = false
              this.getSearch()
            }
          })
        } else if (index == 2) {
          obj = {
            itemList: this.newGoodsList,
            tableList: [this.allGoodsList],
            payFlag: 0
          }
          this.$router.push({
            path: '/information/business/dhZxqc',
            query: {
              data: JSON.stringify(obj),
              index: 232
            }
          })
        } else if (index == 3) {
          obj = {
            itemList: this.newGoodsList,
            orderCode: this.allGoodsList.orderCode,
            postage: this.allGoodsList.postage,
            tableList: [this.allGoodsList],
            payFlag: 0
          }
          api.productFree([obj]).then((res) => {
            if (res.code == 200) {
              this.$message({
                message: res.msg,
                type: 'success'
              })
              this.isChangeGoods = false
              this.getSearch()
            }
          })
        }
      })
    },
    getProduct() {
      del.getProductAll().then((res) => {
        this.productList = res.data
      })
    },
    flatten(arr) {
      return arr.reduce((result, item) => {
        return result.concat(
          item,
          Array.isArray(item.children) ? this.flatten(item.children) : []
        )
      }, [])
    },
    // 合并行数据处理
    getColSpanData(prop, datas, index) {
      const rowIndexArr = []
      const colSpanArr = []
      let colLength = 1
      datas.forEach((element, index) => {
        if (index == 0) {
          // rowIndex开始合并的位置为0,合并单元格数量默认为1
          rowIndexArr.push(0)
          colLength = 1
        } else {
          if (element[prop] == datas[index - 1][prop]) {
            // 当相邻两条数据相等时，rowspan+1,即colLength+1
            colLength += 1
            // 当最后一条数据与倒数第2条不等式，在colSpanArr中push(1)
            if (index == datas.length - 1) {
              colSpanArr.push(colLength)
            }
          } else {
            //  相邻两条不等时push index和合并的长度
            colSpanArr.push(colLength)
            rowIndexArr.push(index)
            if (index == datas.length - 1) {
              colSpanArr.push(1)
            }
            colLength = 1
          }
        }
      })
      rowIndexArr.push(datas.length)
      if (index == 0) {
        this.rowIndexArr = rowIndexArr
        this.colSpanArr = colSpanArr
      }
      if (index == 1) {
        this.rowIndexArr1 = rowIndexArr
        this.colSpanArr1 = colSpanArr
      }
      if (index == 2) {
        this.rowIndexArr2 = rowIndexArr
        this.colSpanArr2 = colSpanArr
      }
      if (index == 3) {
        this.rowIndexArr3 = rowIndexArr
        this.colSpanArr3 = colSpanArr
      }
      if (index == 4) {
        this.rowIndexArr4 = rowIndexArr
        this.colSpanArr4 = colSpanArr
      }
    },
    // 合并行
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex <= 15 || columnIndex == 21) {
        for (let i = 0; i < this.colSpanArr.length; i++) {
          if (rowIndex == this.rowIndexArr[i]) {
            return {
              rowspan: this.colSpanArr[i],
              colspan: 1
            }
          } else {
            if (
              rowIndex > this.rowIndexArr[i] &&
              rowIndex < this.rowIndexArr[i + 1]
            ) {
              return {
                rowspan: 0,
                colspan: 0
              }
            }
          }
        }
      }
    },
    // 调换货合并列
    objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
      if (columnIndex >= 8) {
        for (let i = 0; i < this.colSpanArr1.length; i++) {
          if (rowIndex == this.rowIndexArr1[i]) {
            return {
              rowspan: this.colSpanArr1[i],
              colspan: 1
            }
          } else {
            if (
              rowIndex > this.rowIndexArr1[i] &&
              rowIndex < this.rowIndexArr1[i + 1]
            ) {
              return {
                rowspan: 0,
                colspan: 0
              }
            }
          }
        }
      }
    },
    // 调换货合并列
    objectSpanMethod3({ row, column, rowIndex, columnIndex }) {
      if (columnIndex >= 9) {
        for (let i = 0; i < this.colSpanArr3.length; i++) {
          if (rowIndex == this.rowIndexArr3[i]) {
            return {
              rowspan: this.colSpanArr3[i],
              colspan: 1
            }
          } else {
            if (
              rowIndex > this.rowIndexArr3[i] &&
              rowIndex < this.rowIndexArr3[i + 1]
            ) {
              return {
                rowspan: 0,
                colspan: 0
              }
            }
          }
        }
      }
    },
    // 退单合并列
    objectSpanMethod2({ row, column, rowIndex, columnIndex }) {
      if (columnIndex == 0) {
        for (let i = 0; i < this.colSpanArr2.length; i++) {
          if (rowIndex == this.rowIndexArr2[i]) {
            return {
              rowspan: this.colSpanArr2[i],
              colspan: 1
            }
          } else {
            if (
              rowIndex > this.rowIndexArr2[i] &&
              rowIndex < this.rowIndexArr2[i + 1]
            ) {
              return {
                rowspan: 0,
                colspan: 0
              }
            }
          }
        }
      }
    },
    // 撤销订单
    objectSpanMethod4({ row, column, rowIndex, columnIndex }) {
      if (columnIndex == 0 || columnIndex > 5) {
        for (let i = 0; i < this.colSpanArr4.length; i++) {
          if (rowIndex == this.rowIndexArr4[i]) {
            return {
              rowspan: this.colSpanArr4[i],
              colspan: 1
            }
          } else {
            if (
              rowIndex > this.rowIndexArr4[i] &&
              rowIndex < this.rowIndexArr4[i + 1]
            ) {
              return {
                rowspan: 0,
                colspan: 0
              }
            }
          }
        }
      }
    },
    /** 导入按钮操作 */
    handleImport() {
      this.upload.title = '订单业务导入'
      this.upload.open = true
    },
    // 下载模板
    importTemplate() {
      this.download(
        '/sale/manage/order-business/template',
        {},
        `订单业务模板${new Date().getTime()}.xlsx`
      )
    },
    getSearch() {
      this.queryParams.recProvince = this.queryParams.shoppingAddress[0]
      this.queryParams.recCity = this.queryParams.shoppingAddress[1]
      this.queryParams.recCountry = this.queryParams.shoppingAddress[2]
      getOrderBusinessList(this.queryParams).then((res) => {
        this.tableData = res.rows
        this.tableData.forEach((item) => {
          item.howLong = this.$moment().diff(item.cancelTime, 'days')
        })
        // 根据orderCode合并列
        this.getColSpanData('orderCode', this.tableData, 0)
        this.total = res.total
      })
    },
    reChongzhi() {
      this.queryParams = {
        pageNum: 1,
        pageSize: 50,
        memberCode: '',
        memberName: '',
        productName: '',
        orderType: '',
        recProvince: '',
        recCity: '',
        recCounty: '',
        recAddress: '',
        shoppingAddress: [],
        creationTime: [],
        payTime: []
      }
      // this.getSearch()
      this.tableData = []
    },
    handleChange1() {},
    handleChange2() {},
    getData() {
      api.areaList().then((res) => {
        this.areaData = res.data
      })
      log.getOrderType().then((res) => {
        this.orderTypeList = res.data
      })
      this.yesNo()
    },
    // 展开折叠
    changeActive() {
      this.isActive = !this.isActive
    },
    tableRowClassName({ row, rowIndex }) {
      if (rowIndex % 2 == 1) {
        return 'warning-row'
      } else if (rowIndex % 2 == 0) {
        return 'success-row'
      }
      return ''
    },
    handleSelectionChangeAll(selection) {
      this.orderCodes = selection.map((item) => item.orderCode)
      this.orderCodes = [...new Set(this.orderCodes)]
      if (this.orderCodes == 1) {
        this.multiple = !selection.length
      }
    },
    handleSelectionChange(selection) {
      this.multipleSelection = selection
      this.orderCodes = selection.map((item) => item.orderCode)
      this.multiple = !selection.length
    },
    /** 导入按钮操作 */
    handleImport() {
      this.upload.title = '翻译导入'
      this.upload.open = true
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      var fileName = response.fileName
      if (fileName != undefined && fileName != '') {
      }
      if (response.code == 200) {
        this.tableData = response.data
      }

      this.upload.open = false
      this.upload.isUploading = false
      this.$refs.upload.clearFiles()
      this.$alert(response.msg, '导入结果', {
        dangerouslyUseHTMLString: true
      })
      // this.getList();
    },
    // 上传文件数量超出后的动作
    handleExceed() {
      this.upload.isUploading = false
      this.msgInfo('仅可上传一个文件哦')
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit()
    },
    // 退单详情
    cancelOrder(order, index) {
      if (index == 1) {
        returnData({
          orderCode: order
        }).then((res) => {
          this.returnCodeList = res.data
          this.getColSpanData(
            'orderCode',
            this.returnCodeList.orderItemsExtList,
            2
          )
          this.returnForm.orderCode = this.returnCodeList.orderCode
          this.returnOrder = true
        })
      } else {
        returnDataMerge({
          orderCode: order
        }).then((res) => {
          this.returnCodeList = res.data
          this.getColSpanData('orderCode', this.returnCodeList, 2)
          this.returnForm.orderCode = this.returnCodeList.orderCode
          this.returnOrderMerge = true
        })
      }
    },
    // 退单确定
    saveReturnCode(index) {
      if (index == 1) {
        checkHassign(233).then((res) => {
          if (res.code == 200) {
            const obj = {
              form: this.returnForm,
              returnCodeList: this.returnCodeList
            }
            this.$router.push({
              path: '/information/business/tdZxqc',
              query: {
                data: JSON.stringify(obj),
                index: 233
              }
            })
          }
        })
      } else {
        // hbtdZxqc
        checkHassign(233).then((res) => {
          if (res.code == 200) {
            this.$router.push({
              path: '/information/business/hbtdZxqc',
              query: {
                data: JSON.stringify(this.returnCodeList),
                index: 233
              }
            })
          }
        })
      }
    },
    // 撤单
    backOrder(order, index, row) {
      // api.validateBind()
      toCancelOrder({ cancelType: index, orderCode: order }).then((res) => {
        if (res.code == 200) {
          // 合并撤单
          if (index == 2) {
            this.mergeBackOrder = true
            this.mergebackCodeList = res.data
            this.mergebackCodeList.memberList.forEach((item) => {
              // item.orderCode = row.orderCode
              item.productName = row.productName
              item.accountKeyVal = res.data.accountKeyVal
              item.cost = res.data.cost
            })
            this.mergebackCodeList.cancelType = index
          }
          // 撤单
          if (index == 3 || index == 1) {
            this.isBackOrder = true
            // this.backCodeList = res.data
            res.data.orderCancelDetailVOList.forEach((item) => {
              item.orderCode = res.data.orderCode
              item.accountKeyVal = res.data.accountKeyVal
              item.cost = res.data.cost
            })
            this.getColSpanData(
              'orderCode',
              res.data.orderCancelDetailVOList,
              4
            )
            this.backCodeList = res.data
            this.backCodeList.cancelType = index
          }
          // 撤销产品
          if (index == 4) {
            this.isBackProduct = true
            // this.backCodeList = res.data
            res.data.orderCancelDetailVOList.forEach((item) => {
              item.orderCode = res.data.orderCode
            })
            this.backProductList = res.data
            this.backProductList.cancelType = index
            this.backProductList.selProdyctList = []
          }
        }
      })
    },
    // 合并确定
    savemergeBackOrder(index) {
      api
        .validateBind({
          orderCode: this.mergebackCodeList.orderCode
        })
        .then((res) => {
          if (res.code == 200) {
            if (index == 1 || index == 3) {
              api
                .freeCancelOrder({
                  cancelType: this.mergebackCodeList.cancelType,
                  cancelRoad: index,
                  orderCode: this.mergebackCodeList.orderCode,
                  signType: 1
                })
                .then((response) => {
                  if (response.code == 200) {
                    this.$message({
                      message: res.msg,
                      type: 'success'
                    })
                    this.mergeBackOrder = false
                    this.getSearch()
                  }
                })
            } else {
              this.$router.push({
                path: '/information/business/cdZxqc',
                query: {
                  data: JSON.stringify([this.mergebackCodeList]),
                  index: 234,
                  cancelRoad: index
                }
              })
            }
          } else {
            this.$confirm(res.msg, '警告', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then((_) => {
              if (index == 1 || index == 3) {
                api
                  .freeCancelOrder({
                    cancelType: this.mergebackCodeList.cancelType,
                    cancelRoad: index,
                    orderCode: this.mergebackCodeList.orderCode,
                    signType: 1
                  })
                  .then((response) => {
                    if (response.code == 200) {
                      this.$message({
                        message: res.msg,
                        type: 'success'
                      })
                      this.mergeBackOrder = false
                      this.getSearch()
                    }
                  })
              } else {
                this.$router.push({
                  path: '/information/business/cdZxqc',
                  query: {
                    data: JSON.stringify([this.mergebackCodeList]),
                    index: 234,
                    cancelRoad: index
                  }
                })
              }
            })
          }
        })
    },
    // 撤销订单确认
    saveBackkOrder(index) {
      api
        .validateBind({
          orderCode: this.backCodeList.orderCode
        })
        .then((res) => {
          if (res.code == 200) {
            if (index == 1 || index == 3) {
              api
                .freeCancelOrder({
                  cancelType: this.backCodeList.cancelType,
                  cancelRoad: index,
                  orderCode: this.backCodeList.orderCode,
                  signType: 1,
                  remark: this.backForm.returnRemark
                })
                .then((response) => {
                  if (response.code == 200) {
                    this.$message({
                      message: res.msg,
                      type: 'success'
                    })
                    this.isBackOrder = false
                    this.getSearch()
                  }
                })
            } else {
              this.$router.push({
                path: '/information/business/cdZxqc',
                query: {
                  data: JSON.stringify([this.backCodeList]),
                  index: 234,
                  cancelRoad: index
                }
              })
            }
          } else {
            this.$confirm(res.msg, '警告', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then((_) => {
              if (index == 1 || index == 3) {
                api
                  .freeCancelOrder({
                    cancelType: this.backCodeList.cancelType,
                    cancelRoad: index,
                    orderCode: this.backCodeList.orderCode,
                    signType: 1,
                    remark: this.backForm.returnRemark
                  })
                  .then((response) => {
                    if (response.code == 200) {
                      this.$message({
                        message: res.msg,
                        type: 'success'
                      })
                      this.isBackOrder = false
                      this.getSearch()
                    }
                  })
              } else {
                this.$router.push({
                  path: '/information/business/cdZxqc',
                  query: {
                    data: JSON.stringify([this.backCodeList]),
                    index: 234,
                    cancelRoad: index
                  }
                })
              }
            })
          }
        })
    },
    // 撤销产品235
    saveBackkProduct(index) {
      if (this.backProductList.selProdyctList.length == 0) {
        this.$message({
          message: '请选择需要撤销的产品',
          type: 'warning'
        })
        return false
      }
      const arr = this.backProductList.selProdyctList.map((res) => {
        return res.pkId
      })
      api
        .validateBind({
          orderCode: this.backProductList.selProdyctList[0].orderCode,
          itemIdList: arr
        })
        .then((res) => {
          if (res.code == 200) {
            if (index == 1 || index == 3) {
              api
                .freeCancelOrder({
                  cancelType: this.backProductList.cancelType,
                  cancelRoad: index,
                  orderCode: this.backProductList.orderCode,
                  signType: 1,
                  remark: this.backForm.returnRemark,
                  orderCancelDetailParamList:
                    this.backProductList.selProdyctList
                })
                .then((response) => {
                  if (response.code == 200) {
                    this.$message({
                      message: res.msg,
                      type: 'success'
                    })
                    this.isBackProduct = false
                    this.getSearch()
                  }
                })
            } else {
              this.$router.push({
                path: '/information/business/ccZxqc',
                query: {
                  data: JSON.stringify([this.backProductList]),
                  index: 235,
                  cancelRoad: index
                }
              })
            }
          } else {
            this.$confirm(res.msg, '警告', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then((_) => {
              if (index == 1 || index == 3) {
                api
                  .freeCancelOrder({
                    cancelType: this.backProductList.cancelType,
                    cancelRoad: index,
                    orderCode: this.backProductList.orderCode,
                    signType: 1,
                    remark: this.backForm.returnRemark,
                    orderCancelDetailParamList:
                      this.backProductList.selProdyctList
                  })
                  .then((response) => {
                    if (response.code == 200) {
                      this.$message({
                        message: res.msg,
                        type: 'success'
                      })
                      this.isBackProduct = false
                      this.getSearch()
                    }
                  })
              } else {
                this.$router.push({
                  path: '/information/business/ccZxqc',
                  query: {
                    data: JSON.stringify([this.backProductList]),
                    index: 235,
                    cancelRoad: index
                  }
                })
              }
            })
          }
        })
    },
    selProduct(e) {
      this.backProductList.selProdyctList = e
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-table .warning-row {
  background: #f9f9f9;
}

::v-deep .el-table .success-row {
  background: #ffffff;
}

::v-deep .el-table thead {
  color: #000000;
}

::v-deep .el-form-item {
  margin-bottom: 10px;
}

.openClose {
  margin-top: 10px;
  margin-right: 10px;
  color: #666666;
  text-align: center;
}

.page1 {
  padding: 0px 20px 0 20px;
  background: #f9f9f9;
  font-size: 14px;
  height: 93vh;
  .thetopbox {
    background: #ffffff;
    border-radius: 8px;
    padding: 0 20px;
    .searchbox {
      display: flex;
      align-items: center;
      .searchtitle {
        margin-right: 10px;
      }
      .searchbtn {
        background: #c8161d;
        color: #ffffff;
      }
    }
  }
  .footer {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px 0;
    .thebtn {
      width: 120px;
      height: 38px;
    }
  }
  .maintop {
    display: flex;
    padding: 0px 0; // padding: 10px 20px;
    justify-content: space-between;
    align-items: center;
    .mainbtn {
      .thebtn1 {
        color: #ffffff;
        background: rgba(243, 169, 0, 1);
      }
      .thebtn2 {
        color: #ffffff;
        background: rgba(72, 178, 253, 1);
      }
      .thebtn3 {
        color: #ffffff;
        background: rgba(1, 143, 243, 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);
      }
    }
  }
  .main {
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0px 2px 20px 0px rgba(238, 238, 238, 0.5);
    .main_title {
      display: flex;
      align-items: center;
      padding: 10px 0;
      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_content {
      padding: 20px 25px;
    }
  }
}

::v-deep .el-range-editor {
  width: 100%;
}

.delBtn {
  width: 68px;
  height: 32px;
  background: #c73030;
  border-radius: 4px 4px 4px 4px;
  font-size: 14px;
  font-family: PingFang SC-Regular, PingFang SC;
  font-weight: 400;
  color: #ffffff;
  line-height: 32px;
  text-align: center;
  margin: 20px 0;
}

.tit {
  font-size: 14px;
  font-family: PingFang SC-Semibold, PingFang SC;
  font-weight: 600;
  color: #333333;
  margin: 5px 0;
}

.addList {
  text-align: center;
  margin-top: 10px;
  font-size: 28px;
}

::v-deep .el-input__suffix {
  margin-top: 4px;
}
.thebtn2 {
  background: rgba(243, 169, 0, 1);
  border: none;
  color: #ffffff;
}
.thebtn3 {
  color: #ffffff;
  border: none;
  background: rgba(72, 178, 253, 1);
}
.thebtn4 {
  background: rgba(0, 155, 88, 1);
  color: #ffffff;
  border: none;
}

.thebtn5 {
  border: none;
  color: #ffffff;
  background: rgba(228, 27, 27, 1);
}
</style>
