<template>
  <div v-loading="loading">
    <!-- 订单详情 -->
    <div v-show="!showSelectClient">
      <el-row :gutter="20">
        <el-col :span="24">
          <el-card shadow="hover" class="mgb20">
            <div class="flex-between">
              <div class="per_title" v-preventReClick @click="back">
                <i class="el-icon-arrow-left"></i>
                <span class="per_back">返回</span>
                <span class="per_school">{{ titlesw }}</span>
              </div>
              <div>
                <el-button v-if="dispose || isAdd" type="primary" round v-preventReClick @click="shipAll">一键发货
                </el-button>
                <el-button v-if="!viewDisabled" type="primary" round v-preventReClick @click="submitOrder">确定
                </el-button>
              </div>
            </div>
          </el-card>

          <el-card shadow="hover" class="mgb20">
            <div>
              <div class="flex-center mgb20 user_header">
                <p class="addhr_tag"></p>
                <span>基本信息</span>
              </div>
              <div>
                <el-form class="info" ref="form" :model="form" :rules="rules" label-width="120px">
                  <el-col :span="6" :offset="5">
                    <el-form-item label="订单编号">
                      <el-input v-model="form.orderNumber" disabled placeholder="自动生成"></el-input>
                    </el-form-item>
                    <el-form-item label="订单时间" prop="createTime">
                      <el-date-picker disabled style="width:100%" v-model="form.createTime" type="date"
                        placeholder="自动生成">
                      </el-date-picker>
                    </el-form-item>
                    <el-form-item label="省份">
                      <el-select disabled v-model="form.provinceId" clearable placeholder="请选择省份" @change="getCity"
                        @clear="clearprovince()">
                        <el-option v-for="(item, index) in provinceList" :key="index" :label="item.provinceName"
                          :value="item.provinceId"></el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label="联系人">
                      <el-input disabled v-model="form.orderContact" placeholder="请输入联系人姓名"></el-input>
                    </el-form-item>
                    <el-form-item label="邮箱">
                      <el-input disabled v-model="form.email" placeholder="请输入邮箱地址"></el-input>
                    </el-form-item>
                    <el-form-item label="团队">
                      <el-select :disabled="viewDisabled" v-model="form.teamId" filterable placeholder="请选择团队"
                        @change="teamChange">
                        <el-option v-for="(item, i) in teams" :key="i" :label="item.partnerClassificationName"
                          :value="item.id"></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>

                  <el-col :span="6" :offset="2">
                    <el-form-item prop="customerName" label="订单客户">
                      <div v-if="!viewDisabled && !editDisabled && !renewDisabled" @click="gotoClient"
                        style="cursor: pointer">
                        <el-input v-model="form.customerName" placeholder="请选择客户"></el-input>
                      </div>
                      <el-input v-if="viewDisabled || editDisabled || renewDisabled" disabled
                        v-model="form.customerName" placeholder="请选择客户"></el-input>
                    </el-form-item>
                    <el-form-item prop="orderType" label="订单类型">
                      <el-select :disabled="viewDisabled" v-model="form.orderType" clearable placeholder="请选择订单类型"
                        @change="orderTypeChange">
                        <el-option v-for="(item, index) in orderTypeList" :key="index" :label="item.name"
                          :value="item.value"></el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label="城市">
                      <el-select disabled v-model="form.cityId" placeholder="请选择">
                        <el-option v-for="(item, index) in cityList" :key="index" :label="item.cityName"
                          :value="item.cityId">
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label="电话">
                      <el-input disabled v-model="form.phone" placeholder="请输入电话号码" maxlength="11"></el-input>
                    </el-form-item>
                    <el-form-item label="订单金额(元)" prop="orderAmount">
                      <el-input disabled oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        type="number" v-model="form.orderAmount" placeholder="请输入订单金额"></el-input>
                    </el-form-item>
                    <el-form-item label="商务经理">
                      <el-input v-if="form.businessManagerName" disabled v-model="form.businessManagerName"></el-input>
                      <el-select v-else :disabled="viewDisabled || !form.teamId" v-model="form.businessManagerId"
                        clearable filterable placeholder="请选择商务经理">
                        <el-option v-for="(item, i) in bmList" :key="i" :label="item.userName"
                          :value="item.partnerId"></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                </el-form>
              </div>
            </div>
          </el-card>
          <!-- 课程 -->
          <el-card shadow="hover" class="mgb20">
            <div>
              <div class="flex-between mgb20 user_header">
                <div class="flex-center">
                  <p class="addhr_tag"></p>
                  <span>实训课程产品权限</span>
                </div>
                <div>
                  <!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
                  <template v-if="!viewDisabled && (dispose || (isAdd && coursePermissions.length))">
                    <el-button v-if="coursePermissions.find(e => !e.ship)" v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(1, 0)">一键发货</el-button>
                    <el-button v-else v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(0, 0)">取消全部发货</el-button>
                  </template>
                  <el-button v-if="!viewDisabled && !isEdit && !renewDisabled" type="primary" round
                    @click="addCourseJurisdiction(1)">添加</el-button>
                </div>
              </div>

              <el-table :data="coursePermissions" class="orderTable" header-align="center">
                <el-table-column type="index" width="60" label="序号" align="center">
                </el-table-column>
                <el-table-column prop="productName" label="产品名称" align="center" min-width="150" show-overflow-tooltip>
                </el-table-column>
                <el-table-column label="使用期限" align="center" min-width="190">
                  <template slot="header" slot-scope="scope">
                    <template v-if="viewDisabled || isEdit">使用期限</template>
                    <template v-else>
                      <el-input class="batch-time" :disabled="viewDisabled || isEdit" maxlength="4" size="small"
                        @change="batchDeadlineChange(0)"
                        @input="productProps[0].deadline = productProps[0].deadline.replace(/[^0-9.]/g, '')"
                        v-model="productProps[0].deadline" placeholder="批量输入时间" />
                      <el-select class="batch-unit" v-model="productProps[0].unit" :disabled="viewDisabled || isEdit"
                        size="small" placeholder="请选择" @change="batchUnitChange(0)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </template>
                  </template>

                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="time-input" :class="!scope.row.periodOfUse && whetherSubmit ? 'red' : ''"
                        :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        @input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g, '')"
                        v-model="scope.row.periodOfUse" placeholder="输入时间"></el-input>
                      <el-select class="time-select" v-model="scope.row.options" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="起止日期" align="center" min-width="240">
                  <template slot-scope="scope">
                    <p v-if="!scope.row.startTime">
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                    </p>
                    <p v-else>
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                      <span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime
                        }}</span>
                    </p>
                  </template>
                </el-table-column>
                <el-table-column label="剩余期限" align="center" min-width="110">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input disabled v-model="scope.row.remainingPeriod" placeholder="" type="text"></el-input>
                      <span style="margin-left:5px">天</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="市场价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="normal" disabled v-model="scope.row.marketValue" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="折扣率 " align="center" min-width="110">
                  <template slot-scope="scope">
                    <el-input class="normal" disabled v-model="scope.row.discountRate" placeholder="" type="text"
                      size="small" style="width: 100%"></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="成交价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        @change="[allAmount(scope.row), calculateDiscountCourse(scope.row)]"
                        v-model="scope.row.finalPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="结算价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="scope.row.settlementPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="端口地址 " align="center" min-width="100">
                  <template slot-scope="scope">
                    <el-button @click="configure(scope.row)">配置</el-button>
                  </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="180">
                  <template slot-scope="scope">
                    <div class="flex-c-c">
                      <el-button v-if="!isEdit && !viewDisabled" type="text"
                        @click="delCourseForm(scope.$index, scope.row)" style="margin-right:10px;">删除</el-button>
                      <!-- 1: 未生效，2：生效中，3：已过期 -->
                      <!-- 
                                              1、查看时不可操作
                                              2、发货和启用不要同时出现，生效前只会显示发货不发货按钮，生效后只显示禁启用按钮
                                              3、处理中的订单显示发货，不显示禁用
                                            -->
                      <el-switch v-if="scope.row.ship === 0 || dispose || isAdd" v-auth="'/order:发货'"
                        style="margin-right:10px;" v-model="scope.row.ship" :active-value="1" :inactive-value="0"
                        :active-text="scope.row.ship ? '已发货' : '未发货'" :disabled="viewDisabled"
                        @change="handleDeliver($event, scope.row, 0)">
                      </el-switch>
                      <el-switch v-else :disabled="viewDisabled" v-model="scope.row.isEnable" :active-value="1"
                        :inactive-value="0" :active-text="scope.row.isEnable ? '启用' : '禁用'"
                        @change="handleEnable($event, scope.row, 0)">
                      </el-switch>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-card>

          <!-- 理论课程 -->
          <el-card shadow="hover" class="mgb20">
            <div>
              <div class="flex-between mgb20 user_header">
                <div class="flex-center">
                  <p class="addhr_tag"></p>
                  <span>理论课程产品权限</span>
                </div>
                <div>
                  <!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
                  <template v-if="!viewDisabled && (dispose || (isAdd && theoryCourseList.length))">
                    <el-button v-if="theoryCourseList.find(e => !e.ship)" v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(1, 5)">一键发货</el-button>
                    <el-button v-else v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(0, 5)">取消全部发货</el-button>
                  </template>
                  <el-button v-if="!viewDisabled && !isEdit && !renewDisabled" type="primary" round
                    @click="addCourseJurisdiction(2)">添加</el-button>
                </div>
              </div>

              <el-table :data="theoryCourseList" class="orderTable" header-align="center">
                <el-table-column type="index" width="60" label="序号" align="center">
                </el-table-column>
                <el-table-column prop="productName" label="产品名称" align="center" min-width="150" show-overflow-tooltip>
                </el-table-column>
                <el-table-column label="使用期限" align="center" min-width="190">
                  <template slot="header" slot-scope="scope">
                    <template v-if="viewDisabled || isEdit">使用期限</template>
                    <template v-else>
                      <el-input class="batch-time" :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="batchDeadlineChange(1)"
                        @input="productProps[1].deadline = productProps[1].deadline.replace(/[^0-9.]/g, '')"
                        v-model="productProps[1].deadline" placeholder="批量输入时间" />
                      <el-select class="batch-unit" v-model="productProps[1].unit" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="batchUnitChange(1)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </template>
                  </template>

                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="time-input" :class="!scope.row.periodOfUse && whetherSubmit ? 'red' : ''"
                        :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        @input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g, '')"
                        v-model="scope.row.periodOfUse" placeholder="输入时间"></el-input>
                      <el-select class="time-select" v-model="scope.row.options" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="起止日期" align="center" min-width="240">
                  <template slot-scope="scope">
                    <p v-if="!scope.row.startTime">
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                    </p>
                    <p v-else>
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                      <span v-if="scope.row.startTime"><span v-if="scope.row.endTime"> - </span>{{ scope.row.endTime
                        }}</span>
                    </p>
                  </template>
                </el-table-column>
                <el-table-column label="剩余期限" align="center" min-width="110">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input disabled v-model="scope.row.remainingPeriod" placeholder="" type="text"></el-input>
                      <span style="margin-left:5px">天</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="市场价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="normal" disabled v-model="scope.row.marketValue" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="折扣率 " align="center" min-width="110">
                  <template slot-scope="scope">
                    <el-input class="normal" disabled v-model="scope.row.discountRate" placeholder="" type="text"
                      size="small" style="width: 100%"></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="成交价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        @change="[allAmount(scope.row), calculateDiscountCourse(scope.row)]"
                        v-model="scope.row.finalPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="结算价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="scope.row.settlementPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="端口地址 " align="center" min-width="100">
                  <template slot-scope="scope">
                    <el-button @click="configure(scope.row)">配置</el-button>
                  </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="180">
                  <template slot-scope="scope">
                    <div class="flex-c-c">
                      <el-button v-if="!isEdit && !viewDisabled" type="text"
                        @click="delCourseDataForm(scope.$index, scope.row)" style="margin-right:10px;">删除</el-button>
                      <!-- 1: 未生效，2：生效中，3：已过期 -->
                      <!-- 
                                              1、查看时不可操作
                                              2、发货和启用不要同时出现，生效前只会显示发货不发货按钮，生效后只显示禁启用按钮
                                              3、处理中的订单显示发货，不显示禁用
                                            -->
                      <el-switch v-if="scope.row.ship === 0 || dispose || isAdd" v-auth="'/order:发货'"
                        style="margin-right:10px;" v-model="scope.row.ship" :active-value="1" :inactive-value="0"
                        :active-text="scope.row.ship ? '已发货' : '未发货'" :disabled="viewDisabled"
                        @change="handleDeliver($event, scope.row, 5)">
                      </el-switch>
                      <el-switch v-else :disabled="viewDisabled" v-model="scope.row.isEnable" :active-value="1"
                        :inactive-value="0" :active-text="scope.row.isEnable ? '启用' : '禁用'"
                        @change="handleEnable($event, scope.row, 5)">
                      </el-switch>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-card>

          <!-- 理实课程 -->
          <el-card shadow="hover" class="mgb20">
            <div>
              <div class="flex-between mgb20 user_header">
                <div class="flex-center">
                  <p class="addhr_tag"></p>
                  <span>理实课程产品权限</span>
                </div>
                <div>
                  <!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
                  <template v-if="!viewDisabled && (dispose || (isAdd && theoryTrialList.length))">
                    <el-button v-if="theoryTrialList.find(e => !e.ship)" v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(1, 6)">一键发货</el-button>
                    <el-button v-else v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(0, 6)">取消全部发货</el-button>
                  </template>
                  <el-button v-if="!viewDisabled && !isEdit && !renewDisabled" type="primary" round
                    @click="addCourseJurisdiction(7)">添加</el-button>
                </div>
              </div>

              <el-table :data="theoryTrialList" class="orderTable" header-align="center">
                <el-table-column type="index" width="60" label="序号" align="center">
                </el-table-column>
                <el-table-column prop="productName" label="产品名称" align="center" min-width="150" show-overflow-tooltip>
                </el-table-column>
                <el-table-column label="使用期限" align="center" min-width="190">
                  <template slot="header" slot-scope="scope">
                    <template v-if="viewDisabled || isEdit">使用期限</template>
                    <template v-else>
                      <el-input class="batch-time" :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="batchDeadlineChange(1)"
                        @input="productProps[6].deadline = productProps[6].deadline.replace(/[^0-9.]/g, '')"
                        v-model="productProps[6].deadline" placeholder="批量输入时间" />
                      <el-select class="batch-unit" v-model="productProps[6].unit" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="batchUnitChange(1)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </template>
                  </template>

                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="time-input" :class="!scope.row.periodOfUse && whetherSubmit ? 'red' : ''"
                        :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        @input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g, '')"
                        v-model="scope.row.periodOfUse" placeholder="输入时间"></el-input>
                      <el-select class="time-select" v-model="scope.row.options" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="起止日期" align="center" min-width="240">
                  <template slot-scope="scope">
                    <p v-if="!scope.row.startTime">
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                    </p>
                    <p v-else>
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                      <span v-if="scope.row.startTime"><span v-if="scope.row.endTime"> - </span>{{ scope.row.endTime
                        }}</span>
                    </p>
                  </template>
                </el-table-column>
                <el-table-column label="剩余期限" align="center" min-width="110">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input disabled v-model="scope.row.remainingPeriod" placeholder="" type="text"></el-input>
                      <span style="margin-left:5px">天</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="市场价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="normal" disabled v-model="scope.row.marketValue" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="折扣率 " align="center" min-width="110">
                  <template slot-scope="scope">
                    <el-input class="normal" disabled v-model="scope.row.discountRate" placeholder="" type="text"
                      size="small" style="width: 100%"></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="成交价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        @change="[allAmount(scope.row), calculateDiscountCourse(scope.row)]"
                        v-model="scope.row.finalPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="结算价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="scope.row.settlementPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="端口地址 " align="center" min-width="100">
                  <template slot-scope="scope">
                    <el-button @click="configure(scope.row)">配置</el-button>
                  </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="180">
                  <template slot-scope="scope">
                    <div class="flex-c-c">
                      <el-button v-if="!isEdit && !viewDisabled" type="text"
                        @click="delTheoryTrialForm(scope.$index, scope.row)" style="margin-right:10px;">删除</el-button>
                      <!-- 1: 未生效，2：生效中，3：已过期 -->
                      <!-- 
                                    1、查看时不可操作
                                    2、发货和启用不要同时出现，生效前只会显示发货不发货按钮，生效后只显示禁启用按钮
                                    3、处理中的订单显示发货，不显示禁用
                                  -->
                      <el-switch v-if="scope.row.ship === 0 || dispose || isAdd" v-auth="'/order:发货'"
                        style="margin-right:10px;" v-model="scope.row.ship" :active-value="1" :inactive-value="0"
                        :active-text="scope.row.ship ? '已发货' : '未发货'" :disabled="viewDisabled"
                        @change="handleDeliver($event, scope.row, 6)">
                      </el-switch>
                      <el-switch v-else :disabled="viewDisabled" v-model="scope.row.isEnable" :active-value="1"
                        :inactive-value="0" :active-text="scope.row.isEnable ? '启用' : '禁用'"
                        @change="handleEnable($event, scope.row, 6)">
                      </el-switch>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-card>

          <!-- 数据平台权限 -->
          <el-card shadow="hover" class="mgb20">
            <div>
              <div class="flex-between mgb20 user_header">
                <div class="flex-center">
                  <p class="addhr_tag"></p>
                  <span>数据前瞻产品权限</span>
                </div>
                <div>
                  <!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
                  <template v-if="!viewDisabled && (dispose || (isAdd && dataPlatformPermissions.length))">
                    <el-button v-if="dataPlatformPermissions.find(e => !e.ship)" v-auth="'/order:发货'" type="primary"
                      round @click="batchDeliver(1, 1)">一键发货</el-button>
                    <el-button v-else v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(0, 1)">取消全部发货</el-button>
                  </template>
                  <el-button v-if="!viewDisabled && !isEdit && !renewDisabled" type="primary" round class="mag"
                    @click="addCourseJurisdiction(5)">添加</el-button>
                </div>
              </div>

              <!--:summary-method="getSummaries"-->
              <el-table :data="dataPlatformPermissions" class="orderTable orderTables" header-align="center">
                <el-table-column type="index" width="60" label="序号" align="center">
                </el-table-column>
                <el-table-column prop="productName" label="产品名称" align="center" min-width="100">
                </el-table-column>
                <el-table-column label="使用期限" align="center" min-width="210">
                  <template slot="header" slot-scope="scope">
                    <template v-if="viewDisabled || isEdit">使用期限</template>
                    <template v-else>
                      <el-input class="batch-time" :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="batchDeadlineChange(4)"
                        @input="productProps[4].deadline = productProps[4].deadline.replace(/[^0-9.]/g, '')"
                        v-model="productProps[4].deadline" placeholder="批量输入时间" />
                      <el-select class="batch-unit" v-model="productProps[4].unit" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="batchUnitChange(4)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </template>
                  </template>

                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="time-input" :class="!scope.row.periodOfUse && whetherSubmit ? 'red' : ''"
                        :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options)"
                        @input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g, '')"
                        v-model="scope.row.periodOfUse" placeholder="输入时间"></el-input>
                      <span style="margin-left:5px">
                        <el-select class="time-select" v-model="scope.row.options" :disabled="viewDisabled || isEdit"
                          placeholder="请选择" @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options)">
                          <el-option v-for="(item, i) in units" :key="i" :label="item.name"
                            :value="item.id"></el-option>
                        </el-select>
                      </span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="起止日期" align="center" min-width="240">
                  <template slot-scope="scope">
                    <p v-if="!scope.row.startTime">
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                    </p>
                    <p v-else>
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                      <span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime
                        }}</span>
                    </p>
                  </template>
                </el-table-column>
                <el-table-column label="剩余期限" align="center" min-width="120">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input disabled v-model="scope.row.remainingPeriod" placeholder="" type="text"></el-input>
                      <span style="margin-left:5px">天</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="市场单价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input disabled v-model="scope.row.marketValue" placeholder="" type="text"></el-input>
                      <span style="margin-left:5px">元&nbsp;/&nbsp;账号</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="成交单价" align="center" min-width="180">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="scope.row.finalValue === '' && whetherSubmit ? 'red' : ''"
                        :disabled="viewDisabled"
                        @input="scope.row.finalValue = scope.row.finalValue.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        @change="[dealComputers($event, scope.row), calculateDiscount($event, scope.row)]"
                        v-model="scope.row.finalValue" type="text"></el-input>
                      <span style="margin-left:5px">元&nbsp;/&nbsp; 账号</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="折扣率" align="center" min-width="120">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="normal" disabled v-model="scope.row.discountRate" placeholder=""
                        type="text"></el-input>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="账号数" align="center" min-width="90">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', !scope.row.accountNum && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.accountNum = scope.row.accountNum.replace(/[^0-9.]/g, '')"
                        v-model="scope.row.accountNum" @change="[dealComputers($event, scope.row)]"
                        type="text"></el-input>
                    </div>
                  </template>
                </el-table-column>
                <!-- 金额自动计算，计算方式：账号数*成交价，且可以手动修改，保留两位小数 -->
                <el-table-column label="成交价" align="center" min-width="120">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input style="width: 80%"
                        :class="['normal', scope.row.finalPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled" @blur="[allAmount(scope.row), dealFinalValue($event, scope.row)]"
                        @input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="scope.row.finalPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="结算价" align="center" min-width="120">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input style="width: 80%"
                        :class="['normal', scope.row.settlementPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="scope.row.settlementPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="250">
                  <template slot-scope="scope">
                    <div class="flex-c-c">
                      <el-button style="margin-right: 10px;" type="text" @click="showShip(scope.row)">{{ viewDisabled ?
                        '' : '编辑' }}发货内容</el-button>
                      <el-button v-if="!isEdit && !viewDisabled" type="text"
                        @click="delDataForm(scope.$index, scope.row)" style="margin-right:10px;">删除</el-button>
                      <el-switch v-if="scope.row.ship === 0 || dispose || isAdd" v-auth="'/order:发货'"
                        style="margin-right:10px;" v-model="scope.row.ship" :active-value="1" :inactive-value="0"
                        :active-text="scope.row.ship ? '已发货' : '未发货'" @change="handleDeliver($event, scope.row, 1)">
                      </el-switch>
                      <el-switch v-else :disabled="viewDisabled" v-model="scope.row.isEnable" :active-value="1"
                        :inactive-value="0" :active-text="scope.row.isEnable ? '启用' : '禁用'"
                        @change="handleEnable($event, scope.row, 1)">
                      </el-switch>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-card>

          <!-- 职站增值模块权限 -->
          <el-card shadow="hover" class="mgb20">
            <div>
              <div class="flex-between mgb20 user_header">
                <div class="flex-center">
                  <p class="addhr_tag"></p>
                  <span>职站增值应用产品权限</span>
                </div>
                <div>
                  <!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
                  <template v-if="!viewDisabled && (dispose || (isAdd && valuePermissions.length))">
                    <el-button v-if="valuePermissions.find(e => !e.ship)" v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(1, 2)">一键发货</el-button>
                    <el-button v-else v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(0, 2)">取消全部发货</el-button>
                  </template>
                  <el-button v-if="!viewDisabled && !isEdit && !renewDisabled" type="primary" round class="mag"
                    @click="addCourseJurisdiction(3)">添加</el-button>
                </div>
              </div>

              <!--:summary-method="getSummaries"-->
              <el-table :data="valuePermissions" class="orderTable orderTables" header-align="center">
                <el-table-column type="index" width="60" label="序号" align="center">
                </el-table-column>
                <el-table-column prop="productName" label="产品名称" align="center" min-width="100">
                </el-table-column>
                <el-table-column label="使用期限" align="center" min-width="190">
                  <template slot="header" slot-scope="scope">
                    <template v-if="viewDisabled || isEdit">使用期限</template>
                    <template v-else>
                      <el-input class="batch-time" :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="batchDeadlineChange(2)"
                        @input="productProps[2].deadline = productProps[2].deadline.replace(/[^0-9.]/g, '')"
                        v-model="productProps[2].deadline" placeholder="批量输入时间" />
                      <el-select class="batch-unit" v-model="productProps[2].unit" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="batchUnitChange(2)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </template>
                  </template>

                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="time-input" :class="!scope.row.periodOfUse && whetherSubmit ? 'red' : ''"
                        :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options)"
                        @input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g, '')"
                        v-model="scope.row.periodOfUse" placeholder="输入时间"></el-input>
                      <span style="margin-left:5px">
                        <el-select class="time-select" v-model="scope.row.options" :disabled="viewDisabled || isEdit"
                          placeholder="请选择" @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options)">
                          <el-option v-for="(item, i) in units" :key="i" :label="item.name"
                            :value="item.id"></el-option>
                        </el-select>
                      </span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="起止日期" align="center" min-width="240">
                  <template slot-scope="scope">
                    <p v-if="!scope.row.startTime">
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                    </p>
                    <p v-else>
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                      <span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime
                        }}</span>
                    </p>
                  </template>
                </el-table-column>

                <el-table-column label="剩余期限" align="center" min-width="120">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input disabled v-model="scope.row.remainingPeriod" placeholder="" type="text"></el-input>
                      <span style="margin-left:5px">天</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="市场价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="normal" disabled v-model="scope.row.marketValue" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="折扣率 " align="center" min-width="110">
                  <template slot-scope="scope">
                    <el-input class="normal" disabled v-model="scope.row.discountRate" placeholder="" type="text"
                      size="small" style="width: 100%"></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="成交价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="scope.row.finalPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="结算价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="scope.row.settlementPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="180">
                  <template slot-scope="scope">
                    <div class="flex-c-c">
                      <el-button v-if="!isEdit && !viewDisabled" type="text"
                        @click="delDataFormList(scope.$index, scope.row)" style="margin-right:10px;">删除</el-button>
                      <el-switch v-if="scope.row.ship === 0 || dispose || isAdd" v-auth="'/order:发货'"
                        style="margin-right:10px;" v-model="scope.row.ship" :active-value="1" :inactive-value="0"
                        :active-text="scope.row.ship ? '已发货' : '未发货'" @change="handleDeliver($event, scope.row, 2)">
                      </el-switch>
                      <el-switch v-else :disabled="viewDisabled" v-model="scope.row.isEnable" :active-value="1"
                        :inactive-value="0" :active-text="scope.row.isEnable ? '启用' : '禁用'"
                        @change="handleEnable($event, scope.row, 2)">
                      </el-switch>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-card>

          <!-- 实训课程 -->
          <el-card shadow="hover" class="mgb20">
            <div>
              <div class="flex-between mgb20 user_header">
                <div class="flex-center">
                  <p class="addhr_tag"></p>
                  <span>实训课程（非集成）</span>
                </div>
                <div>
                  <!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
                  <template v-if="!viewDisabled && (dispose || (isAdd && practicalCourses.length))">
                    <el-button v-if="practicalCourses.find(e => !e.ship)" v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(1, 3)">一键发货</el-button>
                    <el-button v-else v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(0, 3)">取消全部发货</el-button>
                  </template>
                  <el-button v-if="!viewDisabled && !isEdit && !renewDisabled" type="primary" round class="mag"
                    @click="addCourseJurisdiction(4)">添加</el-button>
                </div>
              </div>

              <el-table :data="practicalCourses" class="orderTable orderTables" header-align="center">
                <el-table-column type="index" width="60" label="序号" align="center">
                </el-table-column>
                <el-table-column prop="productName" label="产品名称" align="center" min-width="150" show-overflow-tooltip>
                </el-table-column>
                <el-table-column label="使用期限" align="center" min-width="190">
                  <template slot="header" slot-scope="scope">
                    <template v-if="viewDisabled || isEdit">使用期限</template>
                    <template v-else>
                      <el-input class="batch-time" :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="batchDeadlineChange(3)"
                        @input="productProps[3].deadline = productProps[3].deadline.replace(/[^0-9.]/g, '')"
                        v-model="productProps[3].deadline" placeholder="批量输入时间" />
                      <el-select class="batch-unit" v-model="productProps[3].unit" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="batchUnitChange(3)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </template>
                  </template>

                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="time-input" :class="!scope.row.periodOfUse && whetherSubmit ? 'red' : ''"
                        :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        @input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g, '')"
                        v-model="scope.row.periodOfUse" placeholder="输入时间"></el-input>
                      <el-select class="time-select" v-model="scope.row.options" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="起止日期" align="center" min-width="240">
                  <template slot-scope="scope">
                    <p v-if="!scope.row.startTime">
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                    </p>
                    <p v-else>
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                      <span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime
                        }}</span>
                    </p>
                  </template>
                </el-table-column>
                <el-table-column label="剩余期限" align="center" min-width="110">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input disabled v-model="scope.row.remainingPeriod" placeholder="" type="text"></el-input>
                      <span style="margin-left:5px">天</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="市场价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="normal" disabled v-model="scope.row.marketValue" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="折扣率 " align="center" min-width="110">
                  <template slot-scope="scope">
                    <el-input class="normal" disabled v-model="scope.row.discountRate" placeholder="" type="text"
                      size="small" style="width: 100%"></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="成交价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        @change="[allAmount(scope.row), calculateDiscountCourse(scope.row)]"
                        v-model="scope.row.finalPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="结算价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="scope.row.settlementPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="250">
                  <template slot-scope="scope">
                    <div class="flex-c-c">
                      <el-button style="margin-right: 10px;" type="text" @click="showShip(scope.row)">{{ viewDisabled ?
                        '' : '编辑' }}发货内容</el-button>
                      <el-button v-if="!isEdit && !viewDisabled" type="text"
                        @click="delPracticalCourses(scope.$index, scope.row)" style="margin: 0 10px;">删除</el-button>
                      <!-- 1: 未生效，2：生效中，3：已过期 -->
                      <!-- 
                                              1、查看时不可操作
                                              2、发货和启用不要同时出现，生效前只会显示发货不发货按钮，生效后只显示禁启用按钮
                                              3、处理中的订单显示发货，不显示禁用
                                            -->
                      <el-switch v-if="scope.row.ship === 0 || dispose || isAdd" v-auth="'/order:发货'"
                        style="margin-right:10px;" v-model="scope.row.ship" :active-value="1" :inactive-value="0"
                        :active-text="scope.row.ship ? '已发货' : '未发货'" :disabled="viewDisabled"
                        @change="handleDeliver($event, scope.row, 3)">
                      </el-switch>
                      <el-switch v-else :disabled="viewDisabled" v-model="scope.row.isEnable" :active-value="1"
                        :inactive-value="0" :active-text="scope.row.isEnable ? '启用' : '禁用'"
                        @change="handleEnable($event, scope.row, 3)">
                      </el-switch>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-card>

          <!-- 实验工具 -->
          <el-card shadow="hover" class="mgb20">
            <div>
              <div class="flex-between mgb20 user_header">
                <div class="flex-center">
                  <p class="addhr_tag"></p>
                  <span>实验工具</span>
                </div>
                <div>
                  <!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
                  <template v-if="!viewDisabled && (dispose || (isAdd && expTools.length))">
                    <el-button v-if="expTools.find(e => !e.ship)" v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(1, 4)">一键发货</el-button>
                    <el-button v-else v-auth="'/order:发货'" type="primary" round
                      @click="batchDeliver(0, 4)">取消全部发货</el-button>
                  </template>
                  <el-button v-if="!viewDisabled && !isEdit && !renewDisabled" type="primary" round class="mag"
                    @click="addCourseJurisdiction(6)">添加</el-button>
                </div>
              </div>

              <!--:summary-method="getSummaries"-->
              <el-table :data="expTools" class="orderTable orderTables" header-align="center">
                <el-table-column type="index" width="60" label="序号" align="center">
                </el-table-column>
                <el-table-column prop="productName" label="产品名称" align="center" min-width="150" show-overflow-tooltip>
                </el-table-column>
                <el-table-column label="使用期限" align="center" min-width="190">
                  <template slot="header" slot-scope="scope">
                    <template v-if="viewDisabled || isEdit">使用期限</template>
                    <template v-else>
                      <el-input class="batch-time" :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="batchDeadlineChange(5)"
                        @input="productProps[5].deadline = productProps[5].deadline.replace(/[^0-9.]/g, '')"
                        v-model="productProps[5].deadline" placeholder="批量输入时间" />
                      <el-select class="batch-unit" v-model="productProps[5].unit" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="batchUnitChange(5)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </template>
                  </template>

                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="time-input" :class="!scope.row.periodOfUse && whetherSubmit ? 'red' : ''"
                        :disabled="viewDisabled || isEdit" maxlength="4"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        @input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g, '')"
                        v-model="scope.row.periodOfUse" placeholder="输入时间"></el-input>
                      <el-select class="time-select" v-model="scope.row.options" :disabled="viewDisabled || isEdit"
                        placeholder="请选择" @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)">
                        <el-option v-for="(item, i) in units" :key="i" :label="item.name" :value="item.id"></el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="起止日期" align="center" min-width="240">
                  <template slot-scope="scope">
                    <p v-if="!scope.row.startTime">
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                    </p>
                    <p v-else>
                      <el-date-picker :class="orderRepeat.includes(scope.row.mallId) ? 'red' : ''" style="width:130px"
                        v-model="scope.row.startTime" type="date" :disabled="viewDisabled || isEdit"
                        @change="deadLine(scope.row.periodOfUse, scope.row, scope.row.options, 1)"
                        placeholder="请选择使用日期">
                      </el-date-picker>
                      <span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime
                        }}</span>
                    </p>
                  </template>
                </el-table-column>
                <el-table-column label="剩余期限" align="center" min-width="110">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input disabled v-model="scope.row.remainingPeriod" placeholder="" type="text"></el-input>
                      <span style="margin-left:5px">天</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="市场价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input class="normal" disabled v-model="scope.row.marketValue" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="折扣率 " align="center" min-width="110">
                  <template slot-scope="scope">
                    <el-input class="normal" disabled v-model="scope.row.discountRate" placeholder="" type="text"
                      size="small" style="width: 100%"></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="成交价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        @change="[allAmount(scope.row), calculateDiscountCourse(scope.row)]"
                        v-model="scope.row.finalPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="结算价" align="center" min-width="170">
                  <template slot-scope="scope">
                    <div class="small">
                      <el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit ? 'red' : '']"
                        :disabled="viewDisabled"
                        @input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="scope.row.settlementPrice" type="text"></el-input> 元
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="250">
                  <template slot-scope="scope">
                    <div class="flex-c-c">
                      <el-button style="margin-right: 10px;" type="text" @click="showShip(scope.row)">{{ viewDisabled ?
                        '' : '编辑' }}发货内容</el-button>
                      <el-button v-if="!isEdit && !viewDisabled" type="text"
                        @click="delExpTool(scope.$index, scope.row)" style="margin-right:10px;">删除</el-button>
                      <!-- 1: 未生效，2：生效中，3：已过期 -->
                      <!-- 
                                              1、查看时不可操作
                                              2、发货和启用不要同时出现，生效前只会显示发货不发货按钮，生效后只显示禁启用按钮
                                              3、处理中的订单显示发货，不显示禁用
                                            -->
                      <el-switch v-if="scope.row.ship === 0 || dispose || isAdd" v-auth="'/order:发货'"
                        style="margin-right:10px;" v-model="scope.row.ship" :active-value="1" :inactive-value="0"
                        :active-text="scope.row.ship ? '已发货' : '未发货'" :disabled="viewDisabled"
                        @change="handleDeliver($event, scope.row, 4)">
                      </el-switch>
                      <el-switch v-else :disabled="viewDisabled" v-model="scope.row.isEnable" :active-value="1"
                        :inactive-value="0" :active-text="scope.row.isEnable ? '启用' : '禁用'"
                        @change="handleEnable($event, scope.row, 4)">
                      </el-switch>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-card>
          <!-- 合同 -->
          <el-card shadow="hover" class="mgb20">
            <div>
              <div class="flex-center mgb20 user_header">
                <p class="addhr_tag"></p>
                <span>合同信息</span>
              </div>
              <div>
                <el-form :disabled="viewDisabled" ref="contract" :model="contract" :rules="rules" label-width="80px">
                  <el-col :span="8" :offset="4">
                    <el-form-item label="合同名称">
                      <el-input v-model="contract.contractName" placeholder="请输入合同名称"></el-input>
                    </el-form-item>

                    <el-form-item label="合同金额" prop="contractInformationSum">
                      <el-input oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
                        v-model="contract.contractMoney" placeholder="请输入合同金额"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="8" :offset="2">
                    <el-form-item label="合同编号">
                      <el-input v-model="contract.contractNumber" placeholder="请输入合同编号"></el-input>
                    </el-form-item>
                    <el-form-item label="合同期限">
                      <div class="contractDate">
                        <el-date-picker v-model="contractTime" style="wifth:100%" type="daterange"
                          value-format="yyyy-MM-dd" @change="contractTimeChange" range-separator="至"
                          start-placeholder="开始日期" end-placeholder="结束日期">
                        </el-date-picker>
                      </div>
                    </el-form-item>

                  </el-col>
                  <el-col :span="24" :offset="4" class="flex-start">
                    <el-form-item label="上传合同">
                      <Upload :on-remove="handleRemove" :file-list="uploadList" @onSuccess="uploadSuccess">
                        <div slot="tip"></div>
                      </Upload>
                    </el-form-item>
                    <!-- <el-form-item>
                                            <el-button size="medium" type="plain" style="height:40px">重新上传</el-button>
                                        </el-form-item>                   -->
                  </el-col>
                </el-form>
              </div>
            </div>
          </el-card>
        </el-col>
      </el-row>

      <!-- 选择课程弹框-->
      <el-dialog :visible.sync="practicalCourseVisible" width="50%" center :close-on-click-modal="false"
        @close="closeJCourse">
        <div class="flex-between mgb20">
          <div class="flex-center">
            <p class="addhr_tag"></p>
            <span>{{ classificationId | dialogTitle }}</span>
          </div>
          <div>
            <el-input placeholder="请输入产品名称" prefix-icon="el-icon-search" v-model.trim="practicalCourseName"
              clearable></el-input>
          </div>
        </div>
        <el-table v-loading="dataLoading" :data="practicalCourseList" header-align="center"
          @selection-change="practicalCoursesSelection" row-key="mallId">
          <el-table-column type="selection" :selectable="practicalCoursesSelectable" width="55"
            align="center"></el-table-column>
          <el-table-column type="index" width="100" label="序号" align="center">
          </el-table-column>
          <el-table-column prop="productName" label="产品名称" align="center"></el-table-column>
          <el-table-column prop="typeName" label="产品类型" align="center"></el-table-column>
          <el-table-column prop="supplierName" label="厂商" align="center"></el-table-column>
          <el-table-column prop="professionalClassName" label="专业类" align="center"></el-table-column>
          <el-table-column prop="professionalName" label="专业" align="center"></el-table-column>
        </el-table>
        <div class="pagination">
          <el-pagination background layout="total, prev, pager, next" :total="practicalCourseTotals"
            @current-change="practicalCoursesChange" :current-page="practicalCoursePage">
          </el-pagination>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="practicalCourseVisible = false">取 消</el-button>
          <el-button type="primary" v-preventReClick @click="practicalCourseSubmit">确 定</el-button>
        </span>
      </el-dialog>

      <!-- 选择IP -->
      <el-dialog :visible.sync="ipVisible" width="70%" center>
        <div class="flex-center mgb20">
          <p class="hr_tag"></p>
          <span>地址列表</span>
        </div>
        <el-table :data="IPData" header-align="center">
          <el-table-column type="index" width="100" label="序号" align="center">
          </el-table-column>
          <el-table-column prop="age" label="服务器名称" align="center">
          </el-table-column>
          <el-table-column label="IP" align="center">
            <template slot-scope="scope">
              <div class="tab_temp">
                <div class="flex-center">
                  <label>内网:</label>
                  <el-input v-model="scope.row.Intranet" placeholder="请输入IP地址"></el-input>
                </div>
                <div class="flex-center mar10">
                  <label>外网:</label>
                  <el-input v-model="scope.row.extranet" placeholder="请输入端口号"></el-input>
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="端口" align="center">
            <template slot-scope="scope">
              <div class="tab_temp">
                <div class="flex-center">
                  <label>内网:</label>
                  <el-input v-model="scope.row.Intranet" placeholder="请输入内网IP地址"></el-input>
                </div>
                <div class="flex-center mar10">
                  <label>外网:</label>
                  <el-input v-model="scope.row.extranet" placeholder="请输入外网IP地址"></el-input>
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="选择" align="center">
            <template slot-scope="scope">
              <i class="el-icon-success radio_icon"></i>
            </template>
          </el-table-column>
        </el-table>
        <span slot="footer" class="dialog-footer">
          <el-button @click="ipVisible = false">取 消</el-button>
          <el-button type="primary" @click="IPSure()">确 定</el-button>
        </span>
      </el-dialog>
    </div>
    <!-- 选择客户 -->
    <select-client ref="client" @back="backToOrder" v-show="showSelectClient"
      :refresh="showSelectClient"></select-client>

    <el-dialog title="发货信息填写" :visible.sync="shipVisible" width="380px" class="ship-dia" :close-on-click-modal="false">
      <el-input :disabled="viewDisabled" v-model="shipContent" placeholder="请填写需交付的产品登录地址、账号、密码等内容...（300个字以内）"
        type="textarea" :rows="10" maxlength="300"></el-input>
      <span slot="footer" class="dialog-footer">
        <el-popover v-if="curRow.mallNonAssociatedLinks" placement="bottom" width="200" trigger="click">
          <div class="cursor" v-html="shipInfo" :title="viewDisabled ? '' : '点击复制到文本框'" @click="copyLink"></div>
          <el-button type="text" slot="reference">产品链接</el-button>
        </el-popover>
        <el-button style="margin-left: 10px" @click="shipVisible = false">取消</el-button>
        <el-button v-if="!viewDisabled" type="primary" @click="submitShip">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import selectClient from "./selectClient.vue";
import Upload from '@/components/upload';
import Oss from '@/components/upload/upload.js'
import Util from '@/libs/util'
export default {
  components: {
    selectClient,
    Upload
  },
  data () {
    return {
      // authority: 权限。0数据平台，1为课程，2职站增值模块，3实训课程（非集成），4实验工具
      deliverShow: ['pageTypes', 'dataPageTypes', 'modelPageTypes', 'practiceCourseTypes', 'expToolTypes', 'theoryCourse'],
      productProps: [
        {
          id: 1,
          name: 'coursePermissions',
          deadline: '',
          unit: '',
        },
        {
          id: 2,
          name: 'theoryCourseList',
          deadline: '',
          unit: '',
        },
        {
          id: 3,
          name: 'valuePermissions',
          deadline: '',
          unit: '',
        },
        {
          id: 4,
          name: 'practicalCourses',
          deadline: '',
          unit: '',
        },
        {
          id: 5,
          name: 'dataPlatformPermissions',
          deadline: '',
          unit: '',
        },
        {
          id: 6,
          name: 'expTools',
          deadline: '',
          unit: '',
        },
        {
          id: 7,
          name: 'theoryTrialList',
          deadline: '',
          unit: '',
        },
      ],
      pageTypes: false,
      dataPageTypes: false,
      modelPageTypes: false,
      practiceCourseTypes: false,
      expToolTypes: false,
      theoryCourse: false,
      loading: false,// 页面加载
      isAdd: false, // 是否添加
      viewDisabled: false,// 查看禁用
      editDisabled: false,// 编辑和处理禁用
      isEdit: false, // 编辑
      renewDisabled: false,// 续费禁用
      dataLoading: false,// 产品弹框加载
      whetherSubmit: false,/* 提交否 */
      dispose: false, // 处理
      showSelectClient: false,// 切换展示选择客户页
      form: {// 基本信息
        // orderNumber: '',// 编号
        provinceId: "",// 省份id
        orderContact: "",// 联系人
        email: "",
        customerId: "",// 客户id
        orderType: "",
        cityId: "",
        phone: "",
        orderAmount: 0,
        customerName: "",// 客户名称
        teamId: '',
        businessManagerId: '',
        profit: 0, // 利润
        purchaseCost: 0, // 采购成本
      },
      coursePermissions: [],// 课程权限
      dataPlatformPermissions: [],// 数据平台权限
      valuePermissions: [],
      practicalCourses: [],
      expTools: [],
      contract: { // 合同信息
        contractName: "",   // 合同名称
        contractFile: "",  // 合同文件
        contractMoney: "", // 合同金额
        contractNumber: "",// 合同编号
        startTime: "",     // 期限-头
        endTime: ""       // 期限-尾
        // orderId: '',       // 绑定订单id
      },
      value1: '',
      contractTime: [],// 合同起止日期绑定值
      token: "",
      orderOther: {// 订单其他数据
      },
      uploadList: [],
      rules: {
        orderNumber: [
          { required: true, message: "请输入订单编号", trigger: "blur" }
        ],
        customerName: [
          { required: true, message: "请选择订单客户", trigger: "change" }
        ],
        orderContact: [
          { required: true, message: "请输入联系人姓名", trigger: "blur" }
        ],
        orderType: [
          { required: true, message: "请选择订单类型", trigger: "change" }
        ],
        phone: [
          { required: true, message: "请输入手机号", trigger: "blur" },
          {
            pattern: /^(?:(?:\+|00)86)?1[3-9]\d{9}$/,
            message: "请输入正确的手机号",
            trigger: "blur"
          }
        ],
        email: [
          { required: true, message: "请输入邮箱地址", trigger: "blur" },
          {
            pattern: /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
            message: "请输入正确的邮箱",
            trigger: "blur"
          }
        ],
        orderAmount: [
          // { pattern: /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/, message: '请输入正确金额格式,可保留两位小数' }
          { required: true, message: "请输入订单金额", trigger: "blur" }
          // { pattern: /(?:^[1-9]([0-9]+)?(?:\.[0-9]{1,2})?$)|(?:^(?:0)$)|(?:^[0-9]\.[0-9](?:[0-9])?$)/, message: '请输入正确金额格式,可保留两位小数', trigger: 'blur'}
        ]
      },
      orderTypeList: [{
        name: "正式",
        value: 1
      },
      {
        name: "试用",
        value: 2
      }],
      provinceList: this.$store.state.provinceList,
      cityList: [],
      schoolList: [],
      teams: [],
      bmList: [],
      yearList: [
        { name: "1个月", value: 30 },
        { name: "2个月", value: 60 },
        { name: "3个月", value: 90 },
        { name: "1年", value: 365 },
        { name: "2年", value: 730 },
        { name: "3年", value: 1095 }
      ],
      // 课程权限弹框
      courseVisible: false,
      courseTotals: 0,
      coursePage: 1,
      courseList: [],
      courseSelection: [],
      curriculumName: "",
      curriculumTypeKeys: {
        0: "理论",
        1: "实训"
      }, // 课程类别
      ipVisible: false,
      IPData: [
        {
          id: 1,
          age: "小额贷系统",
          storeName: "1个月",
          total: "2019.01.02 11:00",
          payamount: "2019.01.02 11:00",
          swtich: true,
          Intranet: "10.20.202.1",
          extranet: "10.20.202.1"
        },
        {
          id: 2,
          age: "小额贷系统",
          storeName: "1个月",
          total: "2019.01.02 11:00",
          payamount: "2019.01.02 11:00",
          swtich: true,
          Intranet: "",
          extranet: ""
        }
      ],
      curArr: "",
      test: [],
      // 数据平台权限弹框
      showPlatform: false,// 弹框显示
      platfromTotals: 0,// 列表条目
      platfromPage: 1,// 页码
      platformList: [],// 数据平台列表
      platformSelect: [],// 数据平台弹框选中
      productName: "",// 搜索产品名称

      valueVisible: false,
      valueCheck: [],

      // 实训课程弹框
      practicalCourseVisible: false,// 弹框显示
      practicalCourseTotals: 0,// 列表条目
      practicalCoursePage: 1,// 页码
      practicalCourseList: [],
      practicalCourseSelect: [],
      practicalCourseName: '',


      // 实验工具弹框
      expToolVisible: false,// 弹框显示
      expToolTotals: 0,// 列表条目
      expToolPage: 1,// 页码
      expToolList: [],
      expToolSelect: [],
      expToolName: '',

      searchTimer: null,
      titlesw: '',
      orderRepeat: [],
      repeatMsg: '',
      clients: [],
      valueList: [],
      rate: '',
      shipVisible: false,
      shipContent: '',
      shipInfo: '',
      curRow: {},
      // 用于区分栏目 1实训课程 2理论课程 3职站增值应用 4实训课程（非集成）5数据前瞻 6实验工具 7理实课程
      classificationId: 0,
      // 理论课程数据
      theoryCourseList: [],
      theoryTrialList: [],
      units: [
        {
          id: 0,
          name: '日'
        },
        {
          id: 1,
          name: '月'
        },
        {
          id: 2,
          name: '年'
        },
      ],
      batchDeadline1: '',
      batchUnit1: 2,
    };
  },
  watch: {
    practicalCourseName (n) {
      clearTimeout(this.searchTimer);
      this.searchTimer = setTimeout(() => {
        this.initCourses();
      }, 500);
    },
  },
  async created () {
    this.getTeam()
    this.getClients()
    this.token = sessionStorage.getItem("token");
    // 处理添加状态
    if (this.$route.query.val == 'isAdd') {
      this.titlesw = '新建订单'
      this.isAdd = true;
      this.getCityData();// 取得城市
    }
    // 处于查看状态
    if (this.$route.query.val == 'watch') {
      this.titlesw = '查看订单'
      this.viewDisabled = true;
      await this.getDetail(this.$route.query.orderId);
    }
    // 处于编辑状态
    if (this.$route.query.val == 'edit') {
      if (this.$route.query.orderStatus == 0) {
        this.titlesw = '处理订单'
        this.dispose = true;
      } else {
        this.titlesw = '修改订单'
        this.isEdit = true
      }
      this.editDisabled = true;
      await this.getDetail(this.$route.query.orderId);
    }
    /* 处于续费状态 */
    if (this.$route.query.val == 'renew') {
      this.titlesw = '订单续费'
      this.renewDisabled = true;
      await this.getDetail(this.$route.query.orderId);
    }
  },
  methods: {
    // 读取页面详情
    getDetail (id) {
      this.$get(this.api.orderDetail, { orderId: +id }).then(res => {
        let form = res.orderDetails.order;// 基本信息
        let contract = res.orderDetails.contractInformation ? res.orderDetails.contractInformation : {}; // 合同
        if (this.renewDisabled) { // 续费状态下，清空上个订单合同信息
          this.contract = {
            contractName: "",
            contractFile: "",
            contractMoney: "",
            contractNumber: "",
            startTime: "",
            endTime: ""
          };
        } else {
          this.contract = {
            contractName: contract.contractName,
            contractMoney: contract.contractMoney,
            contractNumber: contract.contractNumber,
            startTime: contract.startTime ? contract.startTime : "",
            endTime: contract.endTime ? contract.endTime : "",
            contractId: contract.contractId,
            uploadList: {
              name: contract.contractFile ? contract.contractFile.split("/").pop() : "",
              url: contract.contractFile
            }
          };
          if (contract.startTime && contract.endTime) {
            this.contractTime = [contract.startTime, contract.endTime];
          }
        }
        this.form = {
          orderNumber: form.orderNumber,
          createTime: form.createTime,
          provinceId: form.provinceId,
          orderContact: form.orderContact,
          email: form.email,
          customerId: form.customerId,
          customerName: form.customerName,
          orderType: form.orderType,
          cityId: form.cityId,
          phone: form.phone,
          orderAmount: form.orderType === 2 ? 0 : form.orderAmount, // 如果是试用的订单，则订单金额显示为0
          orderId: form.orderId,
          options: form.options,
          teamId: form.teamId,
          profit: form.profit,
          purchaseCost: form.purchaseCost,
          businessManagerId: form.businessManagerId ? +form.businessManagerId : '',
          businessManagerName: form.businessManagerName,
          notification: form.notification
        };
        this.$nextTick(() => {
          form.provinceId && this.getCityData()
          form.teamId && this.getBm()
        });
        const { orderOther } = res.orderDetails
        const promises = []
        const { customerId } = form
        const list = []
        if (orderOther.find(e => e.authority === 1)) {
          promises.push(new Promise((resolve, reject) => {
            this.$post(this.api.renew, {
              authority: 1,
              customerId,
              productId: orderOther.filter(e => e.authority === 1).map(e => e.mallId),
            }).then(({ orderOthers }) => {
              list.push(...orderOthers)
              resolve()
            }).catch(err => { })
          }))
        }
        if (orderOther.find(e => !e.authority)) {
          promises.push(new Promise((resolve, reject) => {
            this.$post(this.api.renew, {
              authority: 0,
              customerId,
              productId: orderOther.filter(e => !e.authority).map(e => e.mallId),
            }).then(({ orderOthers }) => {
              list.push(...orderOthers)
              resolve()
            }).catch(err => { })
          }))
        }
        if (orderOther.find(e => e.authority === 2)) {
          promises.push(new Promise((resolve, reject) => {
            this.$post(this.api.renew, {
              authority: 2,
              customerId,
              productId: orderOther.filter(e => e.authority === 2).map(e => e.mallId),
            }).then(({ orderOthers }) => {
              list.push(...orderOthers)
              resolve()
            }).catch(err => { })
          }))
        }
        if (orderOther.find(e => e.authority === 3)) {
          promises.push(new Promise((resolve, reject) => {
            this.$post(this.api.renew, {
              authority: 3,
              customerId,
              productId: orderOther.filter(e => e.authority === 3).map(e => e.mallId),
            }).then(({ orderOthers }) => {
              list.push(...orderOthers)
              resolve()
            }).catch(err => { })
          }))
        }
        if (orderOther.find(e => e.authority === 4)) {
          promises.push(new Promise((resolve, reject) => {
            this.$post(this.api.renew, {
              authority: 4,
              customerId,
              productId: orderOther.filter(e => e.authority === 4).map(e => e.mallId),
            }).then(({ orderOthers }) => {
              list.push(...orderOthers)
              resolve()
            }).catch(err => { })
          }))
        }
        Promise.all(promises).then(_ => {
          this.setStartDate(list, orderOther)
        })
      });
    },
    /**
     * 订单类型更改触发的事件
     * type 正式为1
     *      试用为2
     */
    orderTypeChange (type) {
      if (type == 1) {
        this.coursePermissions.forEach(e => {
          this.dealSettlePrice(e)
          this.calculateDiscountCourse(e)
        })
      } else {
        this.productProps.map(e => {
          this[e.name].map(n => {
            n.finalPrice = 0
            n.settlementPrice = 0
            // 如果使用期限没填，则默认1月
            if (!n.periodOfUse) {
              n.periodOfUse = 1
              n.options = 1
              this.deadLine(n.periodOfUse, n, n.options, 1)
            }
            this.calculateDiscountCourse(n)
          })
        })
      }
    },
    async setStartDate (renewList, orderOther) {
      const now = await Util.getNow()
      const onTrial = this.form.orderType === 2
      let list = orderOther.map(e => {
        e.settlementPriceUnit = e.settlementPrice
        const item = renewList.find(n => n.dataOrCourseId == e.dataOrCourseId && n.authority == e.authority) // 匹配renew接口返回的数据
        // if (item) {
        // 处于续费
        const cur = item || e
        if (this.renewDisabled) {
          let end = Date.parse(cur.endTime);
          if (now < end) {
            let time = new Date(cur.endTime.split(" ")[0])
            time = new Date(time.setDate(time.getDate() + 1))
            e.startTime = `${time.getFullYear()}-${time.getMonth() + 1}-${time.getDate()}`
          } else {
            const date = new Date()
            // 过期
            e.startTime = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`
          }
          e.endTime = ''
          e.periodOfUse = ''
          // 试用则自动填充1月
          if (onTrial) {
            e.periodOfUse = 1
            e.options = 1
            this.deadLine(e.periodOfUse, e, e.options, 1)
          }
        } else if (!this.viewDisabled) { // 如果不是查看
          // e.startTime = cur.startTime.split(" ")[0];
          // if (cur.endTime) e.endTime = cur.endTime.split(" ")[0];
        }
        // }
        if (item && this.renewDisabled) {
          e.marketValue = item.marketValue
        }
        const startTime = new Date(e.startTime)
        const endTime = new Date(e.endTime)
        // 1: 未生效，2：生效中，3：已过期
        e.status = now < startTime ?
          1 :
          now > startTime && now < endTime ?
            2 :
            3
        if (e.status === 3) e.isEnable = 0 // 已过期的，变成禁用状态，且不能启用
        return e;
      });// 俩列表
      this.coursePermissions = list.filter(i => i.authority === 1 && (i.mallClassificationId == 1 || !i.mallClassificationId));
      this.theoryCourseList = list.filter(i => i.authority === 1 && i.mallClassificationId == 2);
      this.theoryTrialList = list.filter(i => i.authority === 1 && i.mallClassificationId == 7);
      this.dataPlatformPermissions = list.filter(i => i.authority === 0);
      this.valuePermissions = list.filter(i => i.authority === 2);
      this.practicalCourses = list.filter(i => i.authority === 3);
      this.expTools = list.filter(i => i.authority === 4);
    },
    // 获取费率
    getRate () {
      this.$post(this.api.getPartnerTeamRates, {
        teamId: this.form.teamId
      }).then(({ teamRates }) => {
        this.rate = teamRates.annualMarketingFee || 0
      }).catch(res => { })
    },
    // 获取全部客户
    getClients () {
      // const sid = this.$store.state.dataPer.find(e => e.permissionName === '客户管理')
      this.$post(this.api.queryCustomer, {
        countries: this.form.countries,
        provinceId: '',
        cityId: '',
        searchContent: '',
        page: 1,
        size: 1000,
        // supplierId: sid ? sid.supplierId : ''
      }).then(res => {
        this.clients = res.message.list
      }).catch(res => { })
    },
    // 刷新缓存
    refreshCache () {
      const { customerId } = this.form
      const curClient = this.clients.find(e => e.customerId == customerId)
      this.$post(`${this.api.refreshCache}?schoolId=${curClient ? curClient.schoolId : ''}`).then(res => { }).catch(res => { })
    },
    // 一键发货
    shipAll () {
      this.productProps.map(e => {
        this[e.name].map(n => {
          n.ship = 1
          n.isEnable = 1
        })
      })
    },
    // 批量设置产品时间
    batchDeadlineChange (i) {
      this[this.productProps[i].name].map(e => {
        e.periodOfUse = this.productProps[i].deadline
        this.deadLine(e.periodOfUse, e, e.options, 1)
      })
    },
    // 批量设置产品期限单位
    batchUnitChange (i) {
      this[this.productProps[i].name].map(e => {
        e.options = this.productProps[i].unit
        this.deadLine(e.periodOfUse, e, e.options, 1)
      })
    },
    // 新增订单
    submitOrder () {
      let purchase = 0 // 总采购成本
      let profit = 0 // 总利润
      if (!this.coursePermissions.length && !this.theoryCourseList.length && !this.theoryTrialList.length && !this.dataPlatformPermissions.length && !this.valuePermissions.length && !this.practicalCourses.length && !this.expTools.length) {
        return this.$message.error("请选择产品权限后再确认订单");
      } else {
        // 课程权限参数校验
        if (this.coursePermissions.length) {
          let courseVerify =
            this.coursePermissions.some(e => {
              // if (!e.periodOfUse || e.finalPrice === '') {
              if (!e.periodOfUse || e.finalPrice === '' || !e.startTime) {
                return false;
              } else {
                const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
                purchase += curPurchase
                profit += +e.finalPrice - curPurchase
                return true;
              }
            });
          if (!courseVerify) {
            this.whetherSubmit = true;
            setTimeout(() => {
              this.whetherSubmit = false;
            }, 4000);
            return this.$message.error("请把课程参数输入完整");
          }
        }
        if (this.theoryCourseList.length) {
          let courseVerify =
            this.theoryCourseList.some(e => {
              // if (!e.periodOfUse || e.finalPrice === '') {
              if (!e.periodOfUse || e.finalPrice === '' || !e.startTime) {
                return false;
              } else {
                const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
                purchase += curPurchase
                profit += +e.finalPrice - curPurchase
                return true;
              }
            });
          if (!courseVerify) {
            this.whetherSubmit = true;
            setTimeout(() => {
              this.whetherSubmit = false;
            }, 4000);
            return this.$message.error("请把课程参数输入完整");
          }
        }
        if (this.theoryTrialList.length) {
          let courseVerify =
            this.theoryTrialList.some(e => {
              // if (!e.periodOfUse || e.finalPrice === '') {
              if (!e.periodOfUse || e.finalPrice === '' || !e.startTime) {
                return false;
              } else {
                const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
                purchase += curPurchase
                profit += +e.finalPrice - curPurchase
                return true;
              }
            });
          if (!courseVerify) {
            this.whetherSubmit = true;
            setTimeout(() => {
              this.whetherSubmit = false;
            }, 4000);
            return this.$message.error("请把课程参数输入完整");
          }
        }
        // 数据平台权限参数校验
        if (this.dataPlatformPermissions.length) {
          let dataVerify =
            this.dataPlatformPermissions.some(e => {
              if (!e.periodOfUse || e.finalPrice === '' || !e.accountNum || e.settlementPrice === '') {
                return false;
              } else {
                const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
                purchase += curPurchase
                profit += +e.finalPrice - curPurchase
                return true;
              }
            });
          if (!dataVerify) {
            this.whetherSubmit = true;
            setTimeout(() => {
              this.whetherSubmit = false;
            }, 4000);
            return this.$message.error("请把产品参数输入完整");
          }
        }
        if (this.valuePermissions.length) {
          let courseVerify =
            this.valuePermissions.some(e => {
              if (!e.periodOfUse || e.finalPrice === '') {
                return false;
              } else {
                const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
                purchase += curPurchase
                profit += +e.finalPrice - curPurchase
                return true;
              }
            });
          if (!courseVerify) {
            this.whetherSubmit = true;
            setTimeout(() => {
              this.whetherSubmit = false;
            }, 4000);
            return this.$message.error("请把课程参数输入完整");
          }
        }
        if (this.practicalCourses.length) {
          let courseVerify =
            this.practicalCourses.some(e => {
              if (!e.periodOfUse || e.finalPrice === '') {
                return false;
              } else {
                const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
                purchase += curPurchase
                profit += +e.finalPrice - curPurchase
                return true;
              }
            });
          if (!courseVerify) {
            this.whetherSubmit = true;
            setTimeout(() => {
              this.whetherSubmit = false;
            }, 4000);
            return this.$message.error("请把课程参数输入完整");
          }
        }
        if (this.expTools.length) {
          let courseVerify =
            this.expTools.some(e => {
              if (!e.periodOfUse || e.finalPrice === '') {
                return false;
              } else {
                const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
                purchase += curPurchase
                profit += +e.finalPrice - curPurchase
                return true;
              }
            });
          if (!courseVerify) {
            this.whetherSubmit = true;
            setTimeout(() => {
              this.whetherSubmit = false;
            }, 4000);
            return this.$message.error("请把课程参数输入完整");
          }
        }
      }
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.orderRepeat.length) return this.$message.error(this.repeatMsg)
          let tempArr = [...this.dataPlatformPermissions, ...this.coursePermissions, ...this.valuePermissions, ...this.practicalCourses, ...this.expTools, ...this.theoryCourseList, ...this.theoryTrialList];
          let renew = tempArr.some(e => e.renew);
          if (this.renewDisabled || renew) {/* 续费状态下 */
            this.form.orderNature = 2;
            if (renew) {
              tempArr.forEach(e => {
                if (e.renew) delete e.renew
              });
            }
          }
          tempArr.forEach(e => {
            const time = new Date(e.startTime)
            e.startTime = `${time.getFullYear()}-${time.getMonth() + 1}-${time.getDate()}`
          })
          const { form } = this
          form.purchaseCost = Math.round(purchase)
          form.profit = Math.round(profit)
          let param = {
            contractInformation: this.contract,//合同信息
            order: form,// 订单基本数据
            orderOther: tempArr//俩列表
          };
          this.loading = true;
          if (this.editDisabled) {
            this.$post(this.api.orderUpdate, param).then(res => {
              this.refreshCache()
              this.$message.success("修改成功");
              this.loading = false;
              this.back();
            }).catch(err => {
              this.loading = false;
            });
          } else {
            this.$post(this.api.orderAdd, param).then(res => {
              this.refreshCache()
              this.$message.success("添加订单成功");
              this.loading = false;
              this.$router.push('/order')
            }).catch(err => {
              this.loading = false;
            });
          }
        } else {
          this.$message("请填上必填项");
          return false;
        }
      });
    },
    // 处理orderRepeat里的id
    handleOrderRepeat (id) {
      const i = this.orderRepeat.findIndex(e => e == id)
      i !== -1 && this.orderRepeat.splice(i, 1)
    },
    /* 处理0开头的期限 */
    zero (e, row) {
      if (e[0] == "0") {
        row.periodOfUse = e.substring(1);
        this.zero(row.periodOfUse, row);
      }
    },
    // 订单客户框触发选择页面
    gotoClient () {
      this.showSelectClient = !this.showSelectClient;
    },
    // 选择客户返回传值
    backToOrder (val) {
      this.showSelectClient = !this.showSelectClient;
      if (val.customerId) {
        this.form.customerName = val.customerName;
        this.form.customerId = val.customerId;
        this.form.phone = val.phone;
        this.form.email = val.email;
        this.form.orderContact = val.name;
        this.$get(this.api.queryCustomerDetails, { customerId: val.customerId }).then(res => {
          this.form.provinceId = res.result.customer.provinceId;
          this.form.cityId = res.result.customer.cityId;
          this.getCityData();
          this.getSettlemennt()
        });
        this.$forceUpdate();
        // 每次选择完客户后要重新判断产品是否有重叠
        this.productProps.map(e => {
          this[e.name].map(n => {
            this.deadLine(n.periodOfUse, n, n.options, 1)
          })
        })
      }
    },
    // 更换了订单客户后重新获取结算价
    getSettlemennt () {
      const list = []
      this.productProps.map(e => e.name).forEach(e => {
        list.push(...this[e])
      })

      list.map(e => {
        this.$post(`${this.api.queryCitySettlementPrice}?mallId=${e.mallId}&provinceId=${this.form.provinceId}&cityId=${this.form.cityId}`).then(res => {
          const mall = res.mallPrice
          if (mall) {
            e.settlementPrice = mall.discountRate
          }
        }).catch((res) => { })
      })
    },
    closeJCourse () { // 关闭课程选择对话框
      this.curriculumName = "";
      this.courseVisible = false;
    },
    // 删除课程权限
    delCourseForm (index, row) {
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning"
      }).then(() => {
        // if (this.renewDisabled && this.coursePermissions.length === 1) {
        //   return this.$message.warning("续费至少保留一条课程权限");
        // } else {
        this.handleOrderRepeat(row.mallId)
        this.coursePermissions.splice(index, 1);
        // }
      });
    },
    //删除理论课程
    delCourseDataForm (index, row) {
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning"
      }).then(() => {
        // if (this.renewDisabled && this.theoryCourseList.length === 1) {
        //   return this.$message.warning("续费至少保留一条课程权限");
        // } else {
        this.handleOrderRepeat(row.mallId)
        this.theoryCourseList.splice(index, 1);
        // }
      });
    },
    //删除理实课程
    delTheoryTrialForm (index, row) {
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning"
      }).then(() => {
        // if (this.renewDisabled && this.theoryCourseList.length === 1) {
        //   return this.$message.warning("续费至少保留一条课程权限");
        // } else {
        this.handleOrderRepeat(row.mallId)
        this.theoryTrialList.splice(index, 1);
        // }
      });
    },

    // 删除数据平台权限
    delDataForm (index, row) {
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning"
      }).then(() => {
        // if (this.renewDisabled && this.dataPlatformPermissions.length === 1) {
        //   return this.$message.warning("续费至少保留一条产品信息");
        // } else {
        this.handleOrderRepeat(row.mallId)
        this.dataPlatformPermissions.splice(index, 1);
        // }
      });
    },

    // 删除职站增值应用产品权限
    delDataFormList (index, row) {
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning"
      }).then(() => {
        // if (this.renewDisabled && this.valuePermissions.length === 1) {
        //   return this.$message.warning("续费至少保留一条产品信息");
        // } else {
        this.handleOrderRepeat(row.mallId)
        this.valuePermissions.splice(index, 1);
        // }
      });
    },



    // 获取选择课程弹框列表
    getPracticalCourses () {
      this.dataLoading = true;
      this.$post(this.api.listOfGoods, {
        pageNum: this.practicalCoursePage,
        productClassification: this.classificationId,
        pageSize: 10,
        isShelves: 0,
        productName: this.practicalCourseName,
        hotTag: 1
      }).then(({ page }) => {
        this.practicalCourseList = page.records;
        this.practicalCourseTotals = page.total;
        this.dataLoading = false;
      }).catch(err => {
        this.dataLoading = false;
      });
    },
    // 初始化选择课程列表
    initCourses () {
      this.practicalCoursePage = 1
      this.getPracticalCourses()
    },
    practicalCoursesSelectable (row, index) { // 禁止勾选已经选过的数据平台
      let boolean = true;
      const { name } = this.productProps.find(e => e.id == this.classificationId)
      this[name].length && this[name].some(e => {
        if (e.mallId == row.mallId) {
          boolean = false;
        }
      });
      return boolean;
    },
    // 课程--弹框列表选中
    practicalCoursesSelection (val) {
      this.practicalCoursesSelect = val;
    },
    // 课程弹框--确定
    async practicalCourseSubmit () {
      if (this.practicalCoursesSelect.length > 0) {
        let that = this;
        let authority
        switch (that.classificationId) {
          case 1:
            authority = 1
            break;
          case 2:
            authority = 1
            break;
          case 3:
            authority = 2
            break;
          case 4:
            authority = 3
            break;
          case 5:
            authority = 0
            break;
          case 6:
            authority = 4
            break;
          case 7:
            authority = 1
            break;
          default:
            break;
        }
        const { orderType } = this.form
        const { name } = this.productProps.find(e => e.id == that.classificationId)
        let createProduct = function (e) {
          const row = {
            dataOrCourseId: e.associatedProduct,// id
            mallId: e.mallId,
            productName: e.productName,// 名称
            periodOfUse: orderType === 2 ? 1 : '',// 使用期限
            startTime: new Date(),// 开始
            endTime: "", // 终止
            remainingPeriod: "",// 剩余期限
            marketValue: '', // 市场价
            marketPrice: e.marketUnitPrice, // 市场单价
            finalPrice: orderType === 2 ? 0 : '',// 成交价
            finalValue: orderType === 2 ? 0 : '', // 成交单价
            discountRate: "",// 折扣率
            accountNum: "",// 账号数
            totalAmount: "",// 总价
            isEnable: 0, // 启用否：1启用，0禁用
            ship: 0,// 发货否（0未发货，1已发货，默认不发货）
            authority, // 区分权限
            options: orderType === 2 ? 1 : 2,
            settlementPrice: orderType === 2 ? 0 : '', // 结算价
            settlementPriceUnit: e.settlementPrice || 0, // 结算单价
            mallNonAssociatedLinks: e.mallNonAssociatedLinks // 产品链接
          }
          that[name].push(row)
        }
        const productId = []
        const promises = []
        this.practicalCoursesSelect.map(async (e) => {// 取得选中的值，进行赋值
          productId.push(e.mallId)
          let find = this[name].some(i => e.mallId === i.mallId);// 判断已有的相同的id不进行处理
          if (!find) {
            promises.push(new Promise(async (resolve, reject) => {
              // 查询产品管理设置的平台结算价
              const res = await this.$post(`${this.api.queryCitySettlementPrice}?mallId=${e.mallId}&provinceId=${this.form.provinceId}&cityId=${this.form.cityId}`)
              const mall = res.mallPrice
              if (mall) e.settlementPrice = mall.discountRate
              createProduct(e)
              resolve()
            }))
          }
        })
        this.practicalCourseVisible = false
        this.practicalCourseName = ''
        this.practicalCoursesSelect = []

        Promise.all(promises).then(async () => {
          /* 调接口，判断是否为客户已有的产品功能 */
          if (productId.length) {
            const res = await this.$post(this.api.renew, {
              authority,
              customerId: this.form.customerId,
              productId,
            })
            this[name].map(e => {
              const cur = res.orderOthers.find(n => n.mallId === e.mallId && n.dataOrCourseId == e.dataOrCourseId && n.authority == authority)
              if (cur) {
                let time = new Date(cur.endTime)
                time = new Date(time.setDate(time.getDate() + 1))
                e.startTime = `${time.getFullYear()}-${time.getMonth() + 1}-${time.getDate()}`
                e.endTime = ''
                // e.periodOfUse = orderType === 2 ? 0 : ''
                e.renew = true
              }
              if (orderType === 2) {
                this.deadLine(e.periodOfUse, e, e.options, 1)
                this.calculateDiscountCourse(e)
              }
            })
          }
        }).catch(err => { })

      } else {
        return this.$message.warning("请选择数据");
      }
    },
    // 实训课程弹框--页数变更
    practicalCoursesChange (val) {
      this.practicalCoursePage = val;
      this.getPracticalCourses();
    },
    // 删除实训课程权限
    delPracticalCourses (index, row) {
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning"
      }).then(() => {
        // if (this.renewDisabled && this.practicalCourses.length === 1) {
        //   return this.$message.warning("续费至少保留一条产品信息");
        // } else {
        this.handleOrderRepeat(row.mallId)
        this.practicalCourses.splice(index, 1);
        // }
      });
    },

    // 删除实训课程权限
    delExpTool (index, row) {
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning"
      }).then(() => {
        if (this.renewDisabled && this.expTools.length === 1) {
          return this.$message.warning("续费至少保留一条产品信息");
        } else {
          this.handleOrderRepeat(row.mallId)
          this.expTools.splice(index, 1);
        }
      });
    },


    // 启用
    handleEnable (e, row, type) {
      this[this.deliverShow[type]] = !this[this.deliverShow[type]]
    },
    // 一键发货
    batchDeliver (ship, data) {
      this[this.deliverShow[data]] = !this[this.deliverShow[data]]
      // data即各个课程的分类id，详见data里的注释
      const list = data == 1 ?
        this.dataPlatformPermissions :
        data == 2 ?
          this.valuePermissions :
          data == 3 ?
            this.practicalCourses :
            data == 4 ?
              this.expTools :
              data === 5 ?
                this.theoryCourseList :
                data === 6 ?
                  this.theoryTrialList :
                  this.coursePermissions
      list.map(e => {
        e.ship = ship
        if (e.ship === 1) {
          e.isEnable = 1
        }
      })
      if (this.editDisabled) {
        // this.refreshCache()
        // this.$post(this.api.bulkShipping, {
        //   orderOthers: list
        // }).then(res => {})
      }
    },
    // 发货
    handleDeliver (e, row, type) {
      this[this.deliverShow[type]] = row.ship === 1
      if (row.ship === 1) {
        row.isEnable = 1
      }
      if ((type == 1 || type == 3 || type == 4) && row.ship) this.showShip(row) // 非集成课程发货了后显示填写发货信息弹框
    },
    // 如果非数字，则返回0
    handleNaN (val) {
      return isNaN(val) ? 0 : val
    },
    // 课程计算折扣率
    calculateDiscountCourse (row) {
      const { finalPrice, marketValue } = row
      // (原价-现价)÷原价 x100%
      if (finalPrice !== '') row.discountRate = marketValue == 0 ? '0%' : ((marketValue - finalPrice) / marketValue * 100).toFixed(2) + "%";
    },
    // 数据计算折扣率
    calculateDiscount (val, row) {
      const { finalValue, marketValue } = row
      // (原价-现价)÷原价 x100%
      if (finalValue) row.discountRate = marketValue == 0 ? '0%' : ((marketValue - finalValue) / marketValue * 100).toFixed(2) + "%";
    },
    //  合同起止日期选择
    contractTimeChange (val) {
      if (val.length > 0) {
        this.contract.startTime = val[0];
        this.contract.endTime = val[1];
      }
    },
    // 计算订单总额
    allAmount (row) {
      this.dealSettlePrice(row)
      let total = 0
      const list = [...this.coursePermissions, ...this.dataPlatformPermissions, ...this.practicalCourses, ...this.expTools]
      list.map(e => total += +e.finalPrice)
      this.form.orderAmount = total
    },
    // 成交价修改后，计算成交单价 计算规则：成交价/账号数/时间（成交单价为元/账号/年，所以时间要换算成年的单位去计算）
    dealFinalValue (val, row) {
      const { periodOfUse, options, accountNum, finalPrice } = row
      if (periodOfUse && accountNum && finalPrice) {
        row.finalValue = (finalPrice / accountNum / periodOfUse).toFixed(2)
        this.calculateDiscount(val, row)
      }
    },
    // 计算成交价。计算规则：成交单价*账号数*时间（成交单价为元/账号/年，所以时间要换算成年的单位去计算）
    dealComputers (e, row) {
      const { finalValue, accountNum, periodOfUse, finalPrice } = row
      if (periodOfUse) {
        if (accountNum) {
          // 有成交单价，则成交价=成交单价*账号数*时间
          if (finalValue) {
            row.finalPrice = Math.round(finalValue * periodOfUse * accountNum)
          } else if (!finalValue && finalPrice) {
            // 有成交价，没有成交单价，则成交单价=成交价/账号数/时间
            row.finalValue = (finalPrice / periodOfUse / accountNum).toFixed(2)
            this.calculateDiscount(e, row)
          }
        } else if (finalValue && finalValue) {
          // 有成交价、成交单价，没有数量，则数量=成交价/时间/成交单价
          row.accountNum = Math.floor(finalPrice / periodOfUse / finalValue)
        }
      }
      this.dealSettlePrice(row)
      this.allAmount(row)
    },
    // 计算结算价
    dealSettlePrice (row) {
      const unit = row.options // 使用期限单位
      const useUnit = row.periodOfUse // 使用期限
      if (this.form.orderType !== 2) {
        // 结算单价。计算规则：结算单价（**元/年）*购买时长（单位年）*数量(课程为1，数据为账号数量)（单位是万）
        const priceUnit = row.settlementPriceUnit
        const sPrice = ((!unit ?
          priceUnit / 365 * useUnit :
          unit === 1 ?
            priceUnit / 12 * useUnit :
            priceUnit * useUnit) * (row.authority ?
              1 :
              row.accountNum)).toFixed(2)

        row.settlementPrice = this.handleNaN(sPrice)
      }
    },
    // 使用期限转换以及计算剩余天数
    deadLine (e, row, options, isDate) {
      let optionsData = ''
      if (e > 0) {
        if (options == 1) {
          optionsData = e === '12' ? 31536000000 : e * 30 * 24 * 60 * 60 * 1000
        } else if (options == 2) {
          optionsData = e * 365 * 24 * 60 * 60 * 1000
        } else {
          optionsData = e * 24 * 60 * 60 * 1000
        }
      } else {
        optionsData = 0
      }
      let time = new Date(row.startTime).getTime();

      let endTime = time + optionsData
      var timestamp = endTime;
      var dt = new Date(timestamp);    //根据时间戳生成的时间对象
      row.endTime = (dt.getFullYear()) + "-" + (dt.getMonth() + 1) + "-" + (dt.getDate())
      let endYear = timestamp - time
      let endYears = endYear / 1000 / 60 / 60 / 24
      row.remainingPeriod = endYears
      const unit = row.options // 使用期限单位
      const useUnit = row.periodOfUse // 使用期限
      let price = row.marketPrice // 市场单价
      // 结算单价是元/年，所以如果选择的不是年，要进行换算（日：/365,月：/12)
      if (useUnit && price) row.marketValue = ((!unit ?
        price / 365 * useUnit :
        unit === 1 ?
          price / 12 * useUnit :
          price * useUnit)).toFixed(2)
      this.dealComputers(e, row)

      row.authority ? this.calculateDiscountCourse(row) : this.calculateDiscount(e, row)

      // 只有改变了起止日期才需要调接口查询订单，该接口作用是把开始时间传过去，会返回一个提示或者时间，如果是时间，则把时间+1天，如果是提示，则无法保存
      if (isDate) {
        const cId = row.mallId
        const date = new Date(row.startTime)
        const { orderRepeat } = this
        this.$post(this.api.getOrderOtherTime, {
          customerId: this.form.customerId,
          id: row.mallId,
          startTime: date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate(),
          endTime: row.endTime,
          authority: row.authority
        }).then(res => {
          orderRepeat.includes(cId) && orderRepeat.splice(orderRepeat.findIndex(e => e === cId), 1)
          if (res.endTime) {
            let time = new Date(res.endTime)
            time = new Date(time.setDate(time.getDate() + 1))
            row.startTime = `${time.getFullYear()}-${time.getMonth() + 1}-${time.getDate()}`
          }
        }).catch(res => {
          this.repeatMsg = res.message
          orderRepeat.includes(cId) || orderRepeat.push(cId)
        })
      }
    },
    // 打开填写发货信息弹框
    showShip (row) {
      this.curRow = row
      let val = ''
      // 产品管理那里设置了链接的则要显示到发货内容输入框里
      row.mallNonAssociatedLinks && row.mallNonAssociatedLinks.forEach(e => {
        val += e.urlName + '：' + e.url + '\n'
      })
      this.shipInfo = val
      this.shipContent = row.shipContent || val
      this.shipVisible = true
    },
    copyLink () {
      if (!this.viewDisabled) this.shipContent += this.shipInfo
    },
    // 发货信息弹框提交
    submitShip () {
      if (this.shipContent.length > 300) return this.$message.error('请填写300个字以内！')
      this.curRow.shipContent = this.shipContent
      this.shipVisible = false
    },
    // 清除省份
    clearprovince () {
      this.form.cityId = "";
      this.form.customerId = "";
      this.form.orderContact = "";
      this.form.phone = "";
      this.form.email = "";
    },
    // 获取城市
    getCity () {
      this.clearprovince();
      this.getCityData();
    },
    getCityData () {
      let data = {
        provinceId: this.form.provinceId
      };
      return this.$get(this.api.queryCity, data).then(res => {
        this.cityList = res.list;
      }).catch(res => { })
    },
    // 清除城市
    clearcity () {
      this.form.customerId = "";
      this.form.orderContact = "";
      this.form.phone = "";
      this.form.email = "";
    },
    // 获取学校/客户名称
    getSchool () {
      this.clearcity();
      this.getSchoolData();
    },
    getSchoolData () {
      let data = {
        provinceId: this.form.provinceId,
        cityId: this.form.cityId
      };
      this.$get(this.api.queryOrderCustomer, data).then(res => {
        this.schoolList = res.message;
      }).catch(res => {
      });
    },
    // 团队
    getTeam () {
      this.$get(this.api.getAllTeam).then(({ team }) => {
        this.teams = team
      }).catch(err => { })
    },
    // 团队选择回调
    teamChange () {
      this.form.businessManagerId = ''
      this.form.businessManagerName = ''
      this.getBm()
      this.getRate()
    },
    // 城市合伙人人员
    getBm () {
      this.$post(this.api.partnerAccountList, {
        type: 1,
        partnerClassificationId: this.form.teamId,
        keyWord: '',
        pageNum: 1,
        pageSize: 100000
      }).then(({ pageList }) => {
        this.bmList = pageList.records
      }).catch(err => { })
    },
    clearcustomer () {
      this.form.orderContact = "";
      this.form.phone = "";
      this.form.email = "";
    },
    // 获取学校/客户信息
    getcustomer () {
      let data = {
        customerId: this.form.customerId
      };
      this.$get(this.api.queryOrderCustomerContact, data).then(res => {
        this.form.orderContact = res.message[0].adminName;
        this.form.phone = res.message[0].adminPhone;
        this.form.email = res.message[0].email;
      }).catch(res => {
      });
    },
    discountChange (row) {
      let reg = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/;
      if (!(reg.test(row.transactionPrice))) {
        this.$message.error("请输入正确金额格式,可保留两位小数");
        row.transactionPrice = "";
      } else {
        row.discount = this.Percentage(row.transactionPrice, row.marketPrice);
      }
    },
    getSummaries (param) { // 自定义的合计计算方法
      const { columns, data } = param;
      var sums = 0;
      data.map(e => {
        sums += Number(e.transactionPrice);
      });
      this.form.orderAmount = sums;
      return sums;
    },
    // 上传文件超出
    handleExceed (files, fileList) {
      this.$message.warning(
        `当前限制选择 1 个文件，如需更换，请删除上一个文件再重新选择`
      );
    },
    // 上传前
    beforeAvatarUpload (file) {
      const size = file.size / 1024 / 1024 < 10;
      let type = file.name.split(".").pop();
      let str = ["jpg", "jpeg", "gif", "png", "doc", "docx", "pdf"].includes(type.toLowerCase());
      if (!str) {
        this.$message.error("只能上传图片，word文件和pdf文件");
      } else if (!size) {
        this.$message.error("上传头像图片大小不能超过 10MB!");
      }
      return str && size;
    },
    // 上传成功
    uploadSuccess (file) {
      this.contract.contractFile = file.url
    },
    // 上传报错
    uploadError (err, file, fileList) {
      this.$message({
        message: "上传出错，请重试",
        type: "error",
        center: true
      });
    },
    // 删除上传文件前的确认
    beforeRemove (file, fileList) {
      let type = file.name.split(".").pop();
      let str = ["jpg", "jpeg", "gif", "png", "doc", "pdf"].includes(type.toLowerCase());
      const size = file.size / 1024 / 1024 < 10;
      if (!size || !str) {
        return true;
      } else {
        return this.$confirm(`确定移除 ${file.name}？`);
      }
    },
    // 删除文件钩子
    handleRemove () {
      Oss.del(this.contract.contractFile)
      this.contract.contractFile = ''
    },
    configure () {
      this.ipVisible = true;
    },
    IPSure () {
      this.ipVisible = false;
    },
    back () {
      // this.$router.push(this.$store.state.referrer || '/order')
      this.$router.back()
    },
    /**
     *  添加实训课程产品权限,理论课程 ,数据前瞻平台权限,职站增值应用产品权限,实训课程（非集成）,实验工具
     * type
     */
    addCourseJurisdiction (type) {
      if (!this.form.customerId) return this.$message.warning("请先选择客户");
      this.classificationId = type
      this.practicalCourseVisible = true;
      this.initCourses();
    },

  },
  filters: {
    dialogTitle (options) {
      switch (options) {
        case 1:
          return '实训课程产品列表'
        case 2:
          return '理论课程列表'
        case 3:
          return '职站增值应用列表'
        case 4:
          return '实训课程（非集成）列表'
        case 5:
          return '数据前瞻平台权限列表'
        case 6:
          return '实验工具列表'
        case 7:
          return '理实课程列表'
        default:
          break;
      }
    }
  }
};
</script>

<style lang="scss" scoped>
/deep/ .course-input .el-input__inner {
  width: 100px;
}

.batch-time {
  width: 100px !important;

  /deep/.el-input__inner {
    padding: 0 10px;
  }
}

.batch-unit {
  width: 77px !important;
  margin-left: 5px;

  /deep/.el-input {
    width: auto !important;
  }

  /deep/.el-input__inner {
    padding: 0 10px;
  }
}

.time-input {
  width: 90px !important;
}

/deep/.time-select {
  margin-left: 5px;

  .el-input {
    width: 70px !important;
  }
}

/deep/.orderTables .el-select>.el-input {
  width: 35%;
}

/deep/ .course-input .red .el-input__inner,
/deep/ .small .red .el-input__inner,
/deep/ .red .el-input__inner {
  border: 1px solid red;
}

/deep/ .small .el-input__inner {
  width: 100%;
  margin-right: 5px;
}

/deep/ .discountRate .el-input__inner {
  width: 85px;
}

/deep/ .contractDate .el-date-editor--daterange.el-input__inner {
  width: 100%;
}

.info .el-select {
  width: 100%;
}

.mag {
  margin-right: 20px;
}

.small {
  display: flex;
  align-items: center;

  .el-input {
    margin-right: 5px;
  }
}

.uploadTitle {
  width: 100%;
  height: 40px;
  font-size: 16px;
}

.application_input {
  width: 250px;
}

.contract .el-upload {
  width: 100% !important;
}

.downcol .el-form-item__content {
  margin-left: 0 !important;
}

.down {
  // margin-top: 60px;
  height: 40px;
}

/* 选择IP */
.tab_temp label {
  width: 60px;
}

.mar10 {
  margin-top: 10px;
}

.radio_icon {
  font-size: 26px;
  color: #062c87;
}

.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/deep/.ship-dia {
  .el-dialog__body {
    padding: 0 20px;
  }

  .ship {
    cursor: pointer;
  }
}
</style>
