ezhizao_yzbh_vue/src/views/business/crm/order/form.vue

<template>
  <!-- 添加或修改项目信息对话框 -->
  <div class="el-drawer__wrapper">
    <el-drawer :title="title" v-model="visible" direction="rtl" size="100%">
      <div class="page-container form-container">
        <div class="form-btns-container">
          <span class="title-label"><el-icon>
              <Document />
            </el-icon>
            合同信息</span>

          <el-button v-if="form.verifyStatus == 0 && !editStatus" type="warning" size="small" icon="Edit"
            @click="editStatus = true">修改</el-button>
          <el-button v-if="form.id && editStatus" type="info" size="small" icon="Close" @click="
              () => {
                editStatus = false;
                getForm();
              }
            ">取消修改</el-button>
          <el-button v-if="form.id" type="success" size="small" icon="refresh" @click="getForm">
            刷新
          </el-button>
          <el-button v-show="form.id && !editStatus && form.verifyStatus == 0"
            v-hasPermi="['business:archive:order:verify']" type="primary" size="small" icon="check"
            @click="verifyHandler">审核通过</el-button>
          <el-button v-show="form.id && !editStatus && form.verifyStatus == 0"
            v-hasPermi="['business:archive:order:verify']" type="danger" size="small" icon="back"
            @click="rejectHandler">驳回</el-button>
          <el-button v-show="form.alterNumber > 0 && !editStatus" v-hasPermi="['business:archive:order:history']"
            type="info" size="small" icon="Notebook" @click="showHistoryList">历史记录</el-button>

          <div class="screen-btn" @click="handleScreen">
            <template v-if="!isFullscreen">
              <i class="fa fa-window-maximize" aria-hidden="true" />
              <!-- <span>全屏</span> -->
            </template>
            <template v-else>
              <i class="fa fa-window-restore" aria-hidden="true" />
              <!-- <span>还原</span> -->
            </template>
          </div>
          <div class="close-btn" @click="cancel">
            <i class="fa fa-times" aria-hidden="true" />
            <!-- <span>关闭</span> -->
          </div>
        </div>
        <div class="Y-scrollbar" style="
            position: absolute;
            top: 32px;
            bottom: 0;
            width: 100%;
            overflow: auto;
          "></div>
        <el-form ref="orderRef" class="master-container" size="small" :model="form" :rules="rules" label-width="100px">
          <el-row :gutter="30">
            <el-col :span="6">
              <el-form-item label="合同编号" prop="contractNo">
                <el-input v-if="editStatus && type !== 'alterOrder'" v-model="form.contractNo" placeholder="请输入合同编号"
                  width="100px" />
                <span v-else>{{ form.contractNo }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="合同类型" prop="contractType">
                <el-radio-group v-if="editStatus || type == 'alterOrder'" v-model="form.contractType"
                  @change="contractTypeChangeHandler">
                  <el-radio :label="0">新签</el-radio>
                  <el-radio :label="1">续签</el-radio>
                </el-radio-group>
                <span v-else>{{
                  form.contractType === 0 ? "新签" : "续签"
                  }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="客户名称" prop="companyId">
                <template v-if="editStatus && type !== 'alterOrder'">
                  <el-autocomplete :fetch-suggestions="querySearchCompanyAsync" :trigger-on-focus="true"
                    v-model="form.companyName" placeholder="请输入客户名称" popper-class="my-autocomplete" clearable
                    @clear="handleClearCompany" @select="handleSelectCompany" style="width: 100%">
                    <template #append>
                      <el-button icon="Plus" @click="showAddCompanyDialog">
                      </el-button>
                    </template>
                    <template #default="{ item }">
                      <div style="
                          display: flex;
                          flex-direction: row;
                          justify-content: space-between;
                        ">
                        <div class="name" style="font-size: 12px">
                          {{ item.name }}
                        </div>
                      </div>
                    </template>
                  </el-autocomplete>
                  <!-- <el-button @click="showAddCompanyDialog">
                    <el-icon class="el-input__icon">
                      <plus />
                    </el-icon>
                  </el-button> -->
                </template>
                <el-link  :underline="false"   type="primary" @click="handleInfo(form)" v-else>{{ form.companyName }}</el-link>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="签约日期" prop="formDate">
                <el-date-picker v-if="editStatus && type !== 'alterOrder'" clearable v-model="form.formDate" type="date"
                  value-format="YYYY-MM-DD" placeholder="请选择签约日期">
                </el-date-picker>
                <span v-else>{{ form.formDate }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="签单人" prop="signerName">
                <el-autocomplete v-if="editStatus && type !== 'alterOrder'" :fetch-suggestions="querySearchAsync"
                  :trigger-on-focus="true" style="width: 100%" v-model="form.signerName" placeholder="请输入签单人"
                  popper-class="my-autocomplete" @select="handleSelectEmployee">
                  <template #default="{ item }">
                    <div style="
                        display: flex;
                        flex-direction: row;
                        justify-content: space-between;
                      ">
                      <div class="name" style="font-size: 12px">
                        {{ item.nickName }}
                      </div>
                      <span class="code" style="font-size: 10px; color: darkgrey">{{ item.userName }}</span>
                    </div>
                  </template>
                </el-autocomplete>
                <span v-else>{{ form.signerName }}</span>
              </el-form-item>
            </el-col>
            <el-col v-if="form.verifyStatus === 4" :span="6">
              <el-form-item label="驳回原因" prop="verifyRemark">
                <span>{{ form.verifyRemark }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8" style="width: 100%">
              <el-form-item label="来源" prop="sourceCategoryName" style="width: 100%">
                <CustomerFormCom ref="CustomerFormComRef" :edit-status="editStatus && type !== 'alterOrder'"
                  :form-data="form" :source-categories="sourceCategories" />
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="客户标签" prop="customerLabelId">
                <span>{{ selectedOptionLabel }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="甲方" prop="boss">
                <el-input v-if="editStatus" v-model="form.boss" style="width: 100%; margin: 0; padding: 0"
                  placeholder="请输入甲方名称" />
                <span v-else>{{ form.boss }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="14">
              <el-form-item label="备注" prop="remark">
                <el-input v-if="editStatus" v-model="form.remark" show-word-limit maxlength="200"
                  style="width: 100%; margin: 0; padding: 0" placeholder="请输入备注" type="textarea" :rows="2" />
                <span v-else>{{ form.remark }}</span>
              </el-form-item>
            </el-col>
            <br />
            <el-col :span="24">
              <el-tabs v-model="form.serviceType" size="small" class="demo-tabs" @tab-change="handleServiceTypeClick">
                <el-tab-pane :disabled="!editStatus" label="循环服务" :name="1">
                  <el-row>
                    <el-col :span="24">
                      <el-checkbox-group v-model="loops" @change="(arg) => changeDetails('loop', arg)">
                        <el-checkbox v-for="(item, index) in loopTasks" :key="index" :label="item.id"
                          :disabled="item.isDisabled || !editStatus">{{ item.name }}</el-checkbox>
                      </el-checkbox-group>
                    </el-col>
                    <el-col :span="24">
                      <el-row v-for="(item, index) in loopDetails" :key="index" style="
                          border-radius: 5px;
                          border-color: rgba(0, 0, 0, 20%);
                          border-style: solid;
                          border-width: 1px;
                          margin-bottom: 10px;
                        ">
                        <el-col :span="4" style="padding-top: 18px">
                          <el-form-item label="服务项目">
                            {{ item.taskTypeName }}
                          </el-form-item>
                        </el-col>
                        <el-col :span="4" style="padding-top: 18px">
                          <el-form-item label="月单价">
                            <el-input-number v-if="editStatus" v-model="item.price" :precision="2" :step="0.1" :min="0"
                              :controls="false" @change="
                                (arg) =>
                                  inputChangeHandler('loop', 'price', item, arg)
                              " />
                            <div v-else>{{ rowNum(item.price) }}</div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="4" style="padding-top: 18px">
                          <el-form-item label="服务月数">
                            <el-input-number v-if="editStatus" v-model="item.serviceNum" :step="1" step-strictly
                              :min="0" :controls="false" @change="
                                (arg) =>
                                  inputChangeHandler(
                                    'loop',
                                    'serviceNum',
                                    item,
                                    arg
                                  )
                              " />
                            <div v-else>{{ item.serviceNum }}</div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="4" style="padding-top: 18px">
                          <el-form-item label="赠送月数">
                            <el-input-number v-if="editStatus" v-model="item.freeNum" :step="1" step-strictly :min="0"
                              :controls="false" @change="
                                (arg) =>
                                  inputChangeHandler(
                                    'loop',
                                    'freeNum',
                                    item,
                                    arg
                                  )
                              " />
                            <div v-else>{{ item.freeNum }}</div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="4" style="padding-top: 18px">
                          <el-form-item label="优惠金额">
                            <el-input-number v-if="editStatus" v-model="item.discountAmount" :precision="2" :step="0.1"
                              :min="0" :controls="false" @change="
                                (arg) =>
                                  inputChangeHandler('loop', 'discountAmount', item, arg)
                              " />
                            <div v-else>{{ rowNum(item.discountAmount) }}</div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="4" style="padding-top: 18px">
                          <el-form-item label="合计金额">
                            <div>{{ rowNum(item.amount) }}</div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="4" style="padding-top: 18px" v-if="item.taskTypeId ==4">

                        </el-col>
                        <el-col :span="4" style="padding-top: 18px" v-if="item.taskTypeId ==4">
                          <el-form-item label="所属区">
                            <el-select v-if="editStatus" v-model="item.belongRegion" style="margin-right: 5px">
                              <el-option v-for="item in belong_region" :key="item.value" :label="item.label"
                                :value="item.id"></el-option>
                            </el-select>
                            <span v-else>{{item.regionName}}</span>
                          </el-form-item>
                        </el-col>
                      </el-row>
                    </el-col>

                    <el-divider />
                  </el-row>
                </el-tab-pane>
                <el-tab-pane :disabled="!editStatus " label="代办服务" :name="2">
                  <el-checkbox-group :disabled="!editStatus" v-model="onces"
                    @change="(arg) => changeDetails('once', arg)">
                    <el-checkbox v-for="(item, index) in onceTasks" :key="index" :label="item.id">{{ item.name
                      }}</el-checkbox>
                  </el-checkbox-group>
                  <el-col :span="24">
                    <el-row v-for="(item, index) in onceDetails" :key="index" style="
                        border-radius: 5px;
                        border-color: rgba(0, 0, 0, 20%);
                        border-style: solid;
                        border-width: 1px;
                        margin-bottom: 10px;
                      ">
                      <el-col :span="4" style="padding-top: 18px">
                        <el-form-item label="服务项目">
                          {{ item.taskTypeName }}
                        </el-form-item>
                      </el-col>
                      <el-col v-if="item.payAddress === 1" :span="9" style="
                          padding-top: 18px;
                          padding-left: 35px;
                          display: flex;
                          flex-direction: column;
                          margin-bottom: 18px;
                        ">
                        <el-radio-group v-if="editStatus" v-model="item.addressStyle" @change="changeProcesses(item)">
                          <el-radio :label="1" style="margin-bottom: 5px">
                            <template #default>
                              <div style="
                                  display: flex;
                                  flex-direction: row;
                                  width: 300px;
                                  justify-content: space-between;
                                ">
                                <div style="
                                    display: inline-block;
                                    height: 24px;
                                    line-height: 24px;
                                    margin-right: 10px;
                                  ">
                                  自有地址
                                </div>
                                <div>
                                  <el-select :disabled="item.addressStyle === 2" v-model="item.provinceCode"
                                    placeholder="省份" style="width: 36%" @change="handleSelectProvince(item, index)">
                                    <el-option v-for="item in provincesArr[index]" :key="item.code" :label="item.name"
                                      :value="item.code" />
                                  </el-select>

                                  <el-select :disabled="item.addressStyle === 2" v-model="item.cityCode"
                                    placeholder="城市" style="width: 37%" @change="handleSelectCity(item, index)">
                                    <el-option v-for="item in citiesArr[index]" :key="item.code" :label="item.name"
                                      :value="item.code" />
                                  </el-select>
                                  <el-select :disabled="item.addressStyle === 2" v-model="item.districtCode"
                                    placeholder="行政区" style="width: 37%" @change="handleSelectDistrict(item, index)">
                                    <el-option v-for="item in districtsArr[index]" :key="item.code" :label="item.name"
                                      :value="item.code" />
                                  </el-select>
                                </div>
                              </div>
                            </template>
                          </el-radio>
                          <el-radio :label="2" style="margin-bottom: 5px">
                            <template #default>
                              <div style="
                                  display: flex;
                                  flex-direction: row;
                                  width: 325px;
                                  justify-content: space-between;
                                ">
                                <div style="
                                    display: inline-block;
                                    height: 24px;
                                    line-height: 24px;
                                    margin-right: 10px;
                                  ">
                                  虚拟地址
                                </div>
                                <el-select :disabled="item.addressStyle !== 2" v-model="item.fictionAddressId"
                                  style="margin-right: 5px">
                                  <el-option v-for="item in virtual_address" :key="item.value" :label="item.label"
                                    :value="item.id"></el-option>
                                </el-select>
                                <div style="
                                    display: inline-block;
                                    height: 24px;
                                    line-height: 24px;
                                  ">
                                  金额：
                                </div>
                                <el-input-number :disabled="item.addressStyle !== 2" v-if="editStatus"
                                  v-model="item.addressAmount" :precision="2" :step="0.01" step-strictly
                                  :controls="false" @change="
                                    (arg) =>
                                      inputChangeHandler(
                                        'once',
                                        'addressAmount',
                                        item,
                                        arg
                                      )
                                  " />
                              </div>
                            </template>
                          </el-radio>
                        </el-radio-group>
                        <div v-else style="
                            display: flex;
                            flex-direction: row;
                            width: 300px;
                            justify-content: space-between;
                            font-size: 12px;
                          ">
                          <div>
                            {{
                            item.addressStyle === 1
                            ? "自有地址"
                            : item.addressStyle === 2
                            ? "虚拟地址"
                            : ""
                            }}
                          </div>
                          <div v-if="item.addressStyle === 1">
                            注册地区：{{ item.province }} - {{ item.city }} -
                            {{ item.district }}
                          </div>
                          <div v-if="item.addressStyle === 2">
                            {{ (item.fictionAddress) }}
                          </div>
                          <div v-if="item.addressStyle === 2">
                            金额：{{ rowNum(item.addressAmount) }}
                          </div>
                        </div>
                      </el-col>
                      <el-col v-if="item.payAddress === 0" :span="9" style="
                          padding-top: 18px;
                          display: flex;
                          flex-direction: column;
                          margin-bottom: 18px;
                        ">
                        <el-form-item v-if="item.taskTypeId === '6'" label="变更类型">
                          <el-select v-if="editStatus" v-model="item.alterType" style="width: 280px">
                            <el-option v-for="alter in alterTypes" :label="alter.label" :key="alter.value"
                              :value="alter.value">
                            </el-option>
                          </el-select>
                          <div v-else>{{ item.alterType }}</div>
                        </el-form-item>
                        <div v-if="item.alterType === '跨区变更'" style="margin-left: 60px">
                          <el-radio-group v-if="editStatus" v-model="item.addressStyle" @change="changeProcesses(item)">
                            <el-radio :label="1" style="margin-bottom: 5px">
                              <template #default>
                                <div style="
                                    display: flex;
                                    flex-direction: row;
                                    width: 300px;
                                    justify-content: space-between;
                                  ">
                                  <div style="
                                      display: inline-block;
                                      height: 24px;
                                      line-height: 24px;
                                      margin-right: 10px;
                                    ">
                                    自有地址
                                  </div>
                                  <div>
                                    <el-select :disabled="item.addressStyle === 2" v-model="item.provinceCode"
                                      placeholder="省份" style="width: 33.33%" @change="
                                        handleSelectProvince(item, index)
                                      ">
                                      <el-option v-for="item in provincesArr[index]" :key="item.code" :label="item.name"
                                        :value="item.code" />
                                    </el-select>
                                    <el-select :disabled="item.addressStyle === 2" v-model="item.cityCode"
                                      placeholder="城市" style="width: 33.33%" @change="handleSelectCity(item, index)">
                                      <el-option v-for="item in citiesArr[index]" :key="item.code" :label="item.name"
                                        :value="item.code" />
                                    </el-select>
                                    <el-select :disabled="item.addressStyle === 2" v-model="item.districtCode"
                                      placeholder="行政区" style="width: 33.33%" @change="
                                        handleSelectDistrict(item, index)
                                      ">
                                      <el-option v-for="item in districtsArr[index]" :key="item.code" :label="item.name"
                                        :value="item.code" />
                                    </el-select>
                                  </div>
                                </div>
                              </template>
                            </el-radio>
                            <el-radio :label="2" style="margin-bottom: 5px">
                              <template #default>
                                <div style="
                                    display: flex;
                                    flex-direction: row;
                                    width: 300px;
                                    justify-content: space-between;
                                  ">
                                  <div style="
                                      display: inline-block;
                                      height: 24px;
                                      line-height: 24px;
                                      margin-right: 10px;
                                    ">
                                    虚拟地址
                                  </div>
                                  <el-select :disabled="item.addressStyle !== 2" v-model="item.fictionAddressId"
                                    style="margin-right: 5px">
                                    <el-option v-for="item in virtual_address" :key="item.value" :label="item.label"
                                      :value="item.id"></el-option>
                                  </el-select>
                                  <div style="
                                      display: inline-block;
                                      height: 24px;
                                      line-height: 24px;
                                    ">
                                    金额：
                                  </div>
                                  <el-input-number :disabled="item.addressStyle !== 2" v-if="editStatus"
                                    v-model="item.addressAmount" :precision="2" :step="0.01" step-strictly
                                    :controls="false" @change="
                                      (arg) =>
                                        inputChangeHandler(
                                          'once',
                                          'addressAmount',
                                          item,
                                          arg
                                        )
                                    " />
                                </div>
                              </template>
                            </el-radio>
                          </el-radio-group>
                          <div v-else style="
                              display: flex;
                              flex-direction: row;
                              width: 300px;
                              justify-content: space-between;
                              font-size: 12px;
                            ">
                            <div>
                              {{
                              item.addressStyle === 1
                              ? "自有地址"
                              : item.addressStyle === 2
                              ? "虚拟地址"
                              : ""
                              }}
                            </div>
                            <div v-if="item.addressStyle === 1">
                              注册地区：{{ item.province }} - {{ item.city }} -
                              {{ item.district }}
                            </div>
                            <div v-if="item.addressStyle === 2">
                              {{ item.fictionAddress }}
                            </div>
                            <div v-if="item.addressStyle === 2">
                              金额：{{ rowNum(item.addressAmount) }}
                            </div>
                          </div>
                        </div>
                        <el-form-item v-else label="办理地区">
                          <div v-if="editStatus" style="
                              display: flex;
                              flex-direction: row;
                              width: 280px;
                              justify-content: space-between;
                            ">
                            <el-select v-model="item.provinceCode" placeholder="省份" style="width: 33.33%"
                              @click.stop="null" @change="handleSelectProvince(item, index)">
                              <el-option v-for="item in provincesArr[index]" :key="item.code" :label="item.name"
                                :value="item.code" />
                            </el-select>
                            <el-select v-model="item.cityCode" placeholder="城市" style="width: 33.33%"
                              @change="handleSelectCity(item, index)" @click.stop="null">
                              <el-option v-for="item in citiesArr[index]" :key="item.code" :label="item.name"
                                :value="item.code" />
                            </el-select>
                            <el-select v-model="item.districtCode" placeholder="行政区" style="width: 33.33%"
                              @change="handleSelectDistrict(item, index)" @click.stop="null">
                              <el-option v-for="item in districtsArr[index]" :key="item.code" :label="item.name"
                                :value="item.code" />
                            </el-select>
                          </div>

                          <div v-else style="
                              display: flex;
                              flex-direction: row;
                              width: 300px;
                              justify-content: space-between;
                            ">
                            {{ item.province }} - {{ item.city }} -
                            {{ item.district }}
                          </div>
                        </el-form-item>
                      </el-col>
                      <el-col :span="7" style="padding-top: 18px; margin-bottom: 18px">
                        <el-checkbox-group :disabled="!editStatus" v-model="item.processes"
                          @change="(arg) => changeProcesses(item, arg)" style="display: flex; flex-direction: column">
                          <el-checkbox v-for="(process, index) in item.defaultProcesses" :key="index" :label="process">
                            <template #default>
                              <div style="
                                  display: flex;
                                  flex-direction: row;
                                  width: 300px;
                                  justify-content: space-between;
                                ">
                                <div style="
                                    display: inline-block;
                                    height: 24px;
                                    line-height: 24px;
                                    margin-right: 10px;
                                    width: 80px;
                                  ">
                                  {{ process.taskTypeDetailName }}
                                </div>
                                <div style="
                                    display: inline-block;
                                    height: 24px;
                                    line-height: 24px;
                                  ">
                                  金额：
                                </div>
                                <el-input-number :disabled="
                                    checkedProcess(
                                      process.taskTypeDetailId,
                                      item
                                    )
                                  " size="small" v-if="editStatus" v-model="process.amount" :precision="2" :step="0.01"
                                  step-strictly :controls="false" style="width: 100px" @click.stop="null" @change="
                                    (arg) =>
                                      inputChangeHandler(
                                        'process',
                                        'amount',
                                        process,
                                        arg,
                                        item
                                      )
                                  " />
                                <div v-else style="
                                    display: inline-block;
                                    height: 24px;
                                    line-height: 24px;
                                    width: 40px;
                                    text-align: right;
                                  ">
                                  {{ rowNum(process.amount) }}
                                </div>
                              </div>
                            </template>
                            <!-- {{ process.name }} -->
                          </el-checkbox>
                        </el-checkbox-group>
                      </el-col>
                      <el-col :span="3" style="
                          padding-top: 18px;
                          display: flex;
                          flex-direction: column;
                          margin-bottom: 18px;
                        ">
                        <div style="
                            display: flex;
                            flex-direction: row;
                            font-size: 12px;
                          ">
                          <div style="
                              display: inline-block;
                              height: 24px;
                              line-height: 24px;
                              margin-left: 10px;
                            ">
                            总金额：
                          </div>
                          <div style="
                              display: inline-block;
                              height: 24px;
                              line-height: 24px;
                            ">
                            {{ rowNum(item.amount) }}
                          </div>
                        </div>
                      </el-col>
                      <el-col :span="4" style="padding-top: 18px">

                      </el-col>
                      <el-col v-if="item.taskTypeId == 9 || item.taskTypeId == 8" :span="9" style="
                          padding-top: 18px;
                          display: flex;
                          flex-direction: column;
                          margin-bottom: 18px;
                        ">
                        <el-form-item label="备注" prop="remark">
                          <el-input v-model="item.remark" v-if="editStatus" />
                          <div v-else>{{ item.remark }}</div>
                        </el-form-item>
                      </el-col>
                    </el-row>
                  </el-col>
                  <el-divider />
                </el-tab-pane>
              </el-tabs>
            </el-col>
            <el-col :span="6">
              <el-form-item label="合计：" prop="remark">
                <span>{{ rowNum(form.amount) }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="优惠金额：">
                <span>{{ rowNum(form.discountAmount) }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="实收：">
                <div>{{ rowNum(form.trueAmount) }}</div>
              </el-form-item>
            </el-col>
            <br />
            <el-col :span="24">
              <div class="details-head" style="font-size: 12px">
                <div class="title">
                  <i class="fa fa-th-list" aria-hidden="true" /> 合同附件
                </div>
                <div class="details-btns-container" style="display: flex">
                  <el-upload v-if="editStatus && type != 'alterOrder'" action="#" :http-request="upload"
                    :with-credentials="true" :show-file-list="false" multiple>
                    <el-button style="margin-top: 10px; margin-bottom:10px;" size="small" type="primary"
                      icon="Upload">点击上传</el-button>
                  </el-upload>
                </div>
              </div>
              <div class="details-body" style="height: 200px">
                <el-table ref="filesTable" :data="form.files" size="small" height="100%" border
                  header-row-class-name="list-header-row">
                  <el-table-column type="index" label="序号" width="47" align="center" />
                  <el-table-column label="文件名" prop="originalFileName" align="center">
                    <template #default="scope">
                      <el-link :href="`${baseUrl}${scope.row.fileUrl}`" :underline="false" target="_blank"
                        type="primary">
                        {{ scope.row.originalFileName }}
                      </el-link>
                    </template>
                  </el-table-column>
                  <el-table-column v-if="editStatus && type !== 'alterOrder'" label="操作" width="70" align="center">
                    <template #default="scope">
                      <el-button link size="small" type="danger" @click="handleDelFile(scope.$index)">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
              <br />
            </el-col>

            <el-col v-if="editStatus" :span="24" style="
                text-align: center;
                display: flex;
                flex-direction: row;
                justify-content: center;
              ">
              <el-button size="small" type="primary" icon="Finished" style="width: 160px"
                @click="submitForm">保存</el-button>
            </el-col>
          </el-row>

          <br />
        </el-form>
      </div>
    </el-drawer>
    <el-dialog title="驳回详情" v-model="rejectOpen" width="500px" append-to-body draggable :close-on-click-modal="false">
      <el-form ref="dictRef" :model="form" label-width="100">
        <el-form-item label="驳回原因" :prop="verifyRemark">
          <el-input v-model.trim="form.verifyRemark" type="textarea" :rows="3" placeholder="请输入驳回原因" maxlength="200"
            show-word-limit />
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" icon="Finished" size="small" @click="verifyUpload(4)">确 定</el-button>
          <el-button icon="close" size="small" @click="rejectCancel">取 消</el-button>
        </div>
      </template>
    </el-dialog>
    <el-dialog title="是否续签" v-model="verifyOpen" width="600px" append-to-body draggable>
      <el-form ref="dictRef" :model="verifyForm" label-width="380" size="small">
        <el-form-item v-for="item in redirectDetails" :key="item.id"
          :label="`${item.taskTypeName}上个任务结束月：${item.endMonth}是否重新开始`">
          <el-checkbox v-model="item.redirect" />
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" icon="Finished" size="small" @click="redirectVerify()">确 定</el-button>
          <el-button icon="close" size="small" @click="verifyFormClose">取 消</el-button>
        </div>
      </template>
    </el-dialog>
    <AddCompanyDialog ref="addCompanyDialogRef" />
    <company-form ref="companyRef" :get-list="getList"></company-form>
    <dialog-history-choice ref="historyChoiceRef" @choice="historyChoiceHandle" />
  </div>
</template>
<script setup>
  import { uploadFile } from "@/api/tool/file";
  import { listLableNoPage } from "@/api/business/lable";
  import AddCompanyDialog from "../AddCompanyDialog";
  import match from "@/utils/match";
  import {
    getOrder,
    initTaskTypes,
    addOrder,
    updateOrder,
    verifyOrder,
    alterOrder,
    dissolutionOrder,
    verifyCheckOrder,
  } from "@/api/business/crm/contract";
  import { listSource } from "@/api/settings/source";
  import { listCompany } from "@/api/business/crm/company";
  import { listUser } from "@/api/system/user";
  import CustomerFormCom from "@/components/CustomerFormCom";
  import DialogHistoryChoice from "@/views/dialog/DialogHistoryChoice.vue";
  import { formatDate, rowNum } from "@/utils/index";
  import { ref } from "vue";
  import companyForm from "@/views/business/crm/company/formView.vue";
  import useUserStore from "@/store/modules/user";
  // import { it } from "element-plus/es/locale";
  const { proxy } = getCurrentInstance();
  const verifyOpen = ref(false);
  const verifyForm = ref({});
  const redirectDetails = ref([]);
  const baseUrl = import.meta.env.VITE_APP_BASE_API;
  const historyChoiceRef = ref(null);
  const alterTypes = ref([
    {
      value: "普通变更",
      label: "普通变更",
    },
    {
      value: "股权变更",
      label: "股权变更",
    },
    {
      value: "减资",
      label: "减资",
    },
    {
      value: "跨区变更",
      label: "跨区变更",
    },
  ]);

  /** 父组件传参 */
  const props = defineProps({
    getList: {
      type: Function,
      default: () => { },
    },
  });
  const { getList } = toRefs(props);
  /** 字典数组区 */
  const { virtual_address } = proxy.useDict("virtual_address");
  const { belong_region } = proxy.useDict("belong_region");

  /** 表单抽屉 页变量 */
  const title = ref("");
  const loading = ref(false);
  const multiple = ref(true);
  const visible = ref(false);
  const editStatus = ref(false);
  const loopTasks = ref([]);
  const onceTasks = ref([]);
  const sourceCategories = ref([]);
  const loops = ref([]);
  const onces = ref([]);
  const type = ref("");
  const addCompanyDialogRef = ref(null);

  const rejectOpen = ref(false);

  // 循环任务明细
  const loopDetails = ref([]);
  // 单次任务明细
  const onceDetails = ref([]);
  const detailEmpty = {
    id: null,
    taskTypeName: "",
    taskTypeId: null,
    serviceNum: undefined,
    freeNum: undefined,
    price: undefined,
    amount: undefined,
    addressStyle: undefined,
    address: undefined,
    fictionAddressId: undefined,
    tenantId: undefined,
    province: "",
    city: "",
    district: "",
    addressStyle: 1,
    provinceId: undefined,
    processes: [],
    defaultProcesses: [],
  };

  //地址数组
  const provincesArr = ref([]);
  const citiesArr = ref([]);
  const districtsArr = ref([]);

  const provinces = ref(proxy.region.getProvinces());
  provinces.value.unshift({ code: "", name: "全部" });
  const cities = ref([]);
  const districts = ref([]);
  const options = ref([]);
  const contractEmpty = {
    serviceType: 1,
    contractType: 0,
    formDate: formatDate(new Date(), "yyyy-MM-dd"),
    signerId: useUserStore().user.userId,
    signerName: useUserStore().user.nickName,
    files: [],
  };
  const isFullscreen = ref(false);
  const webHost = import.meta.env.VITE_APP_BASE_API;
  const data = reactive({
    form: {},
    rules: {
      contractNo: [
        { required: true, message: "合同编号不能为空", trigger: "blur" },
      ],
      companyId: [{ required: true, message: "请选择有效客户", trigger: "blur" }],
      formDate: [
        { required: true, message: "签约日期不能为空", trigger: "blur" },
      ],
      amount: [{ required: true, message: "签约金额不能为空", trigger: "blur" }],
      // signerName: [
      //   { required: true, message: "签单人不能为空", trigger: "change" },
      // ],
      contractType: [
        { required: true, message: "合同类型不能为空", trigger: "change" },
      ],
      serviceType: [
        { required: true, message: "任务类型不能为空", trigger: "change" },
      ],
      // sourceCategoryName: [
      //   { validator: sourceValidator, trigger: "change" },
      //   { required: true, message: "客户来源不能为空", trigger: "change" },
      // ],
    },
  });
  const { form, rules } = toRefs(data);
  /***********************  方法区  ****************************/
  /** 打开抽屉 */
  function open(id) {
    reset();

    visible.value = true;
    if (id) {
      Promise.all([initTaskTypes(), listSource(), getOrder(id)]).then((res) => {
        loopTasks.value = res[0].data.loopTasks;
        onceTasks.value = res[0].data.onceTasks;
        sourceCategories.value = res[1].rows;
        form.value = res[2].data;
        type.value =
          type.value == "" && form.value.status === 8 ? "alterOrder" : type.value;
        parseDetail(form.value.details, form.value);
        // console.log(onceDetails.value)
        editStatus.value = false;
        title.value = "修改订单信息";
        initRegion();
      });
      // getOrder(id).then(response => {
      // })
    } else {
      Promise.all([initTaskTypes(), listSource()]).then((res) => {
        loopTasks.value = res[0].data.loopTasks;
        onceTasks.value = res[0].data.onceTasks;
        sourceCategories.value = res[1].rows;
      });
      editStatus.value = true;
      title.value = "添加订单信息";
    }
    getOption()
  }
  function getOption() {
    listLableNoPage().then(res => {
      options.value = res.data
    })
  }
  const selectedOptionLabel = computed(() => {
    const selectedOption = options.value.find(option => option.id === form.value.customerLabelId);
    return selectedOption ? selectedOption.lable : '';
  });

  function openSimple(id, optionType) {
    reset();
    visible.value = true;
    type.value = optionType || "";

    if (id) {
      Promise.all([initTaskTypes(), listSource(), getOrder(id)]).then((res) => {
        loopTasks.value = res[0].data.loopTasks;
        onceTasks.value = res[0].data.onceTasks;
        sourceCategories.value = res[1].rows;
        form.value = res[2].data;
        console.log("loopTasks.value", loopTasks.value);
        loopTasks.value.forEach(item => {
          form.value.details.forEach(item2 => {
            if (item2.taskTypeId == item.id) {
              item.isDisabled = item2.disabled
            }
          })
        })


        parseDetail(form.value.details, form.value);

        title.value = "合同变更信息";
        if (type.value != "") {
          editStatus.value = true;
        } else {
          editStatus.value = false;
        }
      });
    } else {
      Promise.all([initTaskTypes(), listSource()]).then((res) => {
        loopTasks.value = res[0].data.loopTasks;
        onceTasks.value = res[0].data.onceTasks;
        sourceCategories.value = res[1].rows;
      });
      editStatus.value = true;
      title.value = "添加订单信息";
    }
  }

  /** 取消按钮 */
  function cancel() {
    visible.value = false;
    reset();
  }
  function handleInfo(row) {
    proxy.$refs.companyRef.open(row.companyId);
  }
  /** 表单重置 */
  function reset() {
    form.value = JSON.parse(JSON.stringify(contractEmpty));
    loops.value = [];
    onces.value = [];
    loopDetails.value = [];
    onceDetails.value = [];
    type.value = "";
    // console.log(form)
    proxy.resetForm("orderRef");
  }

  /** 全屏缩放 */
  function handleScreen() {
    const dom = document.querySelector(
      ".list-container > .el-drawer__wrapper > .el-overlay"
    );
    isFullscreen.value = !isFullscreen.value;
    dom.style.position = isFullscreen.value ? "fixed" : "absolute";
  }

  function sourceValidator(rule, value, callback) {
    if (form.value.sourceCategoryName === "") {
      callback(new Error("来源类型不能为空"));
      return;
    }
    if (
      form.value.referrerDataSource !== "" &&
      form.value.referrerDataSource != null &&
      form.value.sourceName === ""
    ) {
      callback(new Error("来源不能为空"));
      return;
    }
    return callback();
  }

  /** 提交按钮 */
  function submitForm() {
    const query = { userId: form.value.signerId };
    const users = [];
    listUser(query).then((res) => {
      users.value = res.rows;
      console.log(form.value.signerId);
      // if (users.value.length == 1) {
      //   if (
      //     form.value.signerId == users.value[0].userId &&
      //     form.value.signerName == users.value[0].nickName
      //   ) {
      //   } else {
      //     proxy.$modal.msgError("请选择有效签单人");
      //     return;
      //   }
      // } else {
      //   proxy.$modal.msgError("请选择有效签单人");
      //   return;
      // }
      const companyQuery = { id: form.value.companyId };
      const companys = [];
      listCompany(companyQuery).then((res) => {
        companys.value = res.rows;
        if (companys.value.length == 1) {
          if (
            form.value.companyId == companys.value[0].id &&
            form.value.companyName == companys.value[0].name
          ) {
          } else {
            proxy.$modal.msgError("请选择有效客户");
            return;
          }
        } else {
          proxy.$modal.msgError("请选择有效客户");
          return;
        }

        proxy.$refs["orderRef"].validate((valid) => {
          if (valid && detailValid() && amountValid()) {
            const formValue = form.value;
            formValue.details =
              form.value.serviceType === 1
                ? loopDetails.value
                : onceDetails.value;
            if (formValue.id != null) {
              if (formValue.companyId !== null) {
                if (type.value == "") {
                  updateOrder(formValue).then((response) => {
                    proxy.$modal.msgSuccess("修改成功");
                    visible.value = false;
                    getList.value();
                  });
                } else if (type.value == "alterOrder") {
                  alterOrder(formValue).then((response) => {
                    proxy.$modal.msgSuccess("修改成功");
                    visible.value = false;
                    getList.value();
                  });
                } else if (type.value == "dissolutionOrder") {
                  dissolutionOrder(formValue).then((response) => {
                    proxy.$modal.msgSuccess("修改成功");
                    visible.value = false;
                    getList.value();
                  });
                } else {
                  proxy.$modal.msgError("请选择有效客户");
                }
              }
            } else {
              addOrder(formValue).then((response) => {
                proxy.$modal.msgSuccess("新增成功");
                visible.value = false;
                getList.value();
              });
            }
          }
        });
      });
    });
  }

  function detailValid() {
    if (form.value.serviceType === 1) {
      // 循环服务
      if (loopDetails.value.length === 0) {
        proxy.$modal.msgError("请选择至少一条任务");
        return false;
      }
      // loopDetails.forEach((item, index) => {
      for (let i = 0; i < loopDetails.value.length; i++) {
        let item = loopDetails.value[i];
        if (
          (item.freeNum ? Number(item.freeNum) : 0) +
          (item.serviceNum ? Number(item.serviceNum) : 0) <=
          0
        ) {
          proxy.$modal.msgError(`${item.taskTypeName}服务月数不能为0`);
          return false;
        }
        if (item.price == null || item.price === "") {
          proxy.$modal.msgError(`${item.taskTypeName}请填写服务单价`);
          return false;
        }
      }
    } else if (form.value.serviceType === 2) {
      // 代账服务
      if (onceDetails.value.length === 0) {
        proxy.$modal.msgError("请选择至少一条任务");
        return false;
      }
      for (let i = 0; i < onceDetails.value.length; i++) {
        let item = onceDetails.value[i];
        if (item.payAddress === 1) {
          if (item.addressStyle == null) {
            proxy.$modal.msgError("请选择注册地址类型");
            return false;
          }
          if (
            item.addressStyle === 1 &&
            (item.province == null || item.city == null || item.district == null)
          ) {
            proxy.$modal.msgError("请选择注册区域");
            return false;
          }
          console.log(item);
          if (item.addressStyle === 2 && item.fictionAddressId == null) {
            proxy.$modal.msgError("请选择虚拟地址");
            return false;
          }
          if (item.addressStyle === 2 && item.addressAmount == undefined) {
            proxy.$modal.msgError("请填写虚拟地址金额");
            return false;
          }
        }
        if (
          item.payAddress === 0 &&
          (item.province == null || item.city == null || item.district == null)
        ) {
          proxy.$modal.msgError("请选择办理地区");
          return false;
        }
        for (let j = 0; j < item.processes.length; j++) {
          let process = item.processes[j];
          if (process.amount == undefined) {
            proxy.$modal.msgError(`${process.taskTypeDetailName}请填写金额`);
            return false;
          }
        }
      }
    }
    return true;
  }

  function amountValid() {
    if (form.value.trueAmount < 0) {
      proxy.$modal.msgError("实收金额不可小于0");
      return false;
    }
    return true;
  }

  /** 查询表单信息  */
  function getForm() {
    proxy.$refs.orderRef.resetFields();
    loading.value = true;
    getOrder(form.value.id).then((response) => {
      loading.value = false;
      form.value = response.data;
      type.value =
        type.value == "" && form.value.status === 8 ? "alterOrder" : type.value;
    });
  }
  function handleServiceTypeClick(tab) {
    computedService();
  }

  function changeDetails(type, arg) {
    switch (type) {
      case "loop":
        arg.forEach((e) => {
          const taskType = loopTasks.value.find((v) => v.id == e);
          if (loopDetails.value.findIndex((v) => v.taskTypeId == e) < 0) {
            const newDetail = JSON.parse(JSON.stringify(detailEmpty));
            newDetail.taskTypeId = e;
            newDetail.taskTypeName = taskType.name;
            loopDetails.value.push(newDetail);
          }
        });
        loopDetails.value = loopDetails.value.filter(
          (v) => arg.findIndex((e) => e == v.taskTypeId) > -1
        );

        computedService()
        break;
      case "once":
        arg.forEach((e) => {
          const taskType = onceTasks.value.find((v) => v.id == e);
          if (onceDetails.value.findIndex((v) => v.taskTypeId == e) < 0) {
            const newDetail = JSON.parse(JSON.stringify(detailEmpty));
            newDetail.taskTypeId = e;
            newDetail.taskTypeName = taskType.name;
            newDetail.payAddress = taskType.payAddress;
            (newDetail.alterType = e === "6" ? "普通变更" : ""),
              (newDetail.defaultProcesses = taskType.processes.map((v) => ({
                taskTypeId: e,
                taskTypeDetailId: v.id,
                taskTypeDetailName: v.name,
                fictionAddressId: null,
                fictionAddress: "",
                addressStyle: 0,
                checked: false,
                amount: undefined,
              })));
            newDetail.processes = [];
            onceDetails.value.push(newDetail);
          }
        });
        onceDetails.value = onceDetails.value.filter(
          (v) => arg.findIndex((e) => e == v.taskTypeId) > -1
        );

        let provincesLength = provincesArr.value.length;

        if (onceDetails.value.length > provincesLength) {
          for (let i = 0; i < onceDetails.value.length - provincesLength; i++) {
            provincesArr.value.push(provinces.value);
            citiesArr.value.push(cities.value);
            districtsArr.value.push(districts.value);
          }
        } else if (onceDetails.value.length < provincesLength) {
          for (let i = 0; i < provincesLength - onceDetails.value.length; i++) {
            provincesArr.value.length--;
            citiesArr.value.length--;
            districtsArr.value.length--;
          }
        }
        break;
      default:
        break;
    }
  }

  function inputChangeHandler(type, field, item, value, parent) {
    console.log(111, type, field, item, value, parent);
    let amount = 0;
    switch (type) {
      case "loop":
        switch (field) {
          case "price":
            amount =
              (item.serviceNum ? Number(item.serviceNum) : 0) *
              (value ? Number(value) : 0) - (item.discountAmount ? Number(item.discountAmount) : 0);
            item.amount = amount;
            break;
          case "serviceNum":
            amount =
              (item.price ? Number(item.price) : 0) * (value ? Number(value) : 0) - (item.discountAmount ? Number(item.discountAmount) : 0);
            item.amount = amount;

            break;
          case "freeNum":
            amount =
              (item.price ? Number(item.price) : 0) *
              (item.serviceNum ? Number(item.serviceNum) : 0) - (item.discountAmount ? Number(item.discountAmount) : 0);
            item.amount = amount;
            break;
          case "discountAmount":
            amount =
              (item.price ? Number(item.price) : 0) *
              (item.serviceNum ? Number(item.serviceNum) : 0) - (value ? Number(value) : 0);
            item.amount = amount;
        }
        break;
      case "once":
        computedItem(item);
        break;
      case "process":
        computedItem(parent);
        break;
      default:
        break;
    }
    computedService();
  }
  function computedItem(parent) {
    let amount = 0;
    amount +=
      parent.payAddress === 1 && parent.addressStyle === 2 && parent.addressAmount
        ? Number(parent.addressAmount)
        : 0;
    amount +=
      parent.taskTypeId === "6" &&
        parent.alterType === "跨区变更" &&
        parent.addressStyle === 2 &&
        parent.addressAmount
        ? Number(parent.addressAmount)
        : 0;
    parent.processes.forEach((l) => {
      amount += l.amount ? Number(l.amount) : 0;
    });
    parent.amount = amount;
  }

  function computedService() {
    //子表中的实际金额
    let amount = 0;
    let discountAmount = 0;
    let trueAmount = 0;
    switch (form.value.serviceType) {
      case 1:
        loopDetails.value.forEach((l) => {
          amount += l.amount;
          discountAmount += l.discountAmount;
          trueAmount += l.trueAmount;
        });
        amount = amount >= 0 ? amount : 0;
        discountAmount = discountAmount >= 0 ? discountAmount : 0;
        break;
      case 2:
        onceDetails.value.forEach((l) => {
          amount +=
            l.payAddress === 1 && l.addressStyle === 2 && l.addressAmount
              ? Number(l.addressAmount)
              : 0;
              if(l.alterType ==="跨区变更" &&  l.addressStyle === 2 && l.addressAmount){
                amount += Number(l.addressAmount)
              }
          l.processes.forEach((v) => {
            amount += v.amount ? Number(v.amount) : 0;
          });
        });
        break;
    }
    form.value.discountAmount = discountAmount;
    form.value.trueAmount = amount
    form.value.amount = match.add(amount, discountAmount);
  }

  /** 输入框输出建议 */
  function querySearchAsync(queryString, cb) {
    const query = { keyword: queryString };
    listUser(query).then((res) => {
      cb(res.rows);
    });
  }

  function querySearchCompanyAsync(queryString, cb) {
    const query =
      queryString.length > 0
        ? {
          keyword: queryString,
          pageSize: 50,
          pageNum: 1,
          orderByColumn: "create_time",
        }
        : { pageSize: 50, pageNum: 1, orderByColumn: "create_time" };
    listCompany(query).then((res) => {
      cb(res.rows);
    });
  }
  function handleSelectEmployee(item) {
    form.value.signerName = item.nickName;
    form.value.signerId = item.userId;
  }

  function handleSelectCompany(item) {
    form.value.companyName = item.name;
    form.value.companyId = item.id;
    form.value.customerLabelId = item.customerLabelId
  }
  function handleClearCompany() {
    form.value.customerLabelId = "";
  }
  function handleSelectProvince(item, index) {
    const _provinceCode = item.provinceCode;
    const _province = provincesArr.value[index].find((i) => {
      return i.code === _provinceCode;
    });

    item.province = _province.name;
    citiesArr.value[index] = proxy.region.getCities(_provinceCode);

    if (citiesArr.value[index].length === 0) {
      // 清空城市数据
      item.cityCode = "";
      item.city = "";
      cities.value = [{ code: "", name: "全部" }];
      // 清空行政区数据
      item.districtCode = "";
      item.district = "";

      districts.value = [{ code: "", name: "全部" }];
    } else {
      citiesArr.value[index].unshift({ code: "", name: "全部" });
      item.cityCode = citiesArr.value[index][0].code;
      item.city = citiesArr.value[index][0].name;
      handleSelectCity(item, index);
    }
  }

  function handleSelectCity(item, index) {
    const _cityCode = item.cityCode;
    const _city = citiesArr.value[index].find((i) => {
      return i.code === _cityCode;
    });
    item.city = _city.name;
    districtsArr.value[index] = proxy.region.getDistricts(_cityCode);
    if (districtsArr.value[index].length === 0) {
      // 清空行政区数据
      item.districtCode = "";
      item.district = "";
      districtsArr.value[index] = [{ code: "", name: "全部" }];
    } else {
      districtsArr.value[index].unshift({ code: "", name: "全部" });
      item.districtCode = districtsArr.value[index][0].code;
      item.district = districtsArr.value[index][0].name;
    }
  }

  function handleSelectDistrict(item, index) {
    const _districtCode = item.districtCode;
    const _district = districtsArr.value[index].find((i) => {
      return i.code === _districtCode;
    });
    item.district = _district.name;
  }

  function getProcess(item) {
    const typeItem = onceTasks.value.find((i) => i.id === item.taskTypeId);
    return typeItem.processes;
  }

  function checkedProcess(processId, item) {
    const processes = item.processes;
    return processes.findIndex((v) => v.taskTypeDetailId == processId) < 0;
  }

  function changeProcesses(item) {
    computedItem(item);
    computedService();
  }

  function parseDetail(details, form) {
    loops.value = [];
    onces.value = [];
    loopDetails.value = [];
    onceDetails.value = [];
    switch (form.serviceType) {
      case 1:
        // 循环任务
        details.forEach((i) => {
          loops.value.push(i.taskTypeId);
          loopDetails.value.push(i);
        });
        break;
      case 2:
        // 代办任务
        details.forEach((i) => {
          onces.value.push(i.taskTypeId);
          const taskType = onceTasks.value.find((j) => j.id === i.taskTypeId);
          onceDetails.value.push({
            ...i,
            defaultProcesses: parseProcess(i, taskType.processes),
          });
          onceDetails.value.forEach((j) => {
            j.processes = j.defaultProcesses.filter((v) => v.checked);
          });
        });
        break;
      default:
        break;
    }
  }

  function parseProcess(item, processes) {
    return processes.map((l) => {
      // console.log(item.processes.find((i) => i.taskTypeDetailId === l.id));
      if (item.processes.findIndex((i) => i.taskTypeDetailId === l.id) < 0) {
        return {
          taskTypeId: item.taskTypeId,
          taskTypeDetailId: l.id,
          taskTypeDetailName: l.name,
          checked: false,
          amount: undefined,
        };
      } else {
        return {
          ...item.processes.find((i) => i.taskTypeDetailId === l.id),
          checked: true,
        };
      }
    });
  }

  function verifyHandler() {
    proxy.$modal
      .confirm("是否确认审核?")
      .then((_) => {
        verifyCheckOrder(form.value).then((res) => {
          if (res.data == null) {
            verifyUpload(1);
          } else {
            verifyOpen.value = true;
            redirectDetails.value = res.data;
          }
        });
      })
      .catch((_) => {
        proxy.$modal.msg("取消审核");
      });
  }

  function verifyFormClose() {
    redirectDetails.value = [];
    verifyForm.value = {};
    verifyOpen.value = false;
  }

  function redirectVerify() {
    redirectDetails.value.forEach((l) => {
      const index = form.value.details.findIndex((v) => v.id === l.id);
      form.value.details[index].redirect = l.redirect;
    });
    verifyUpload(1);
    verifyFormClose();
  }

  function rejectHandler() {
    rejectOpen.value = true;
  }

  function rejectCancel() {
    rejectOpen.value = false;
  }

  function rejectSubmitHandler() {
    if (form.value.verifyRemark === "" || form.value.verifyRemark == null) {
      proxy.$modal.msgError("请填写驳回原因");
      return;
    }
  }

  function verifyUpload(status) {
    const formValue = proxy.deepClone(form.value);
    formValue.verifyStatus = status;
    formValue.status = status;
    verifyOrder(formValue).then((res) => {
      getForm();
      getList.value();
      rejectCancel();
      proxy.$modal.msgSuccess("保存成功");
    });
  }

  /** 文件上传 */
  function upload(param) {
    const formData = new FormData();
    formData.append("file", param.file);
    uploadFile(formData).then((res) => {
      if (res.code === 200) {
        const file = {};
        file.fileName = res.newFileName;
        file.url = res.url;
        file.originalFileName = res.originalFilename;
        file.fileUrl = res.fileName;
        form.value.files.push(file);
      }
    });
  }

  function handleDelFile(index) {
    form.value.files.splice(index, 1);
  }

  function initRegion() {
    console.log("initRegion开始", form.value);

    for (let i = 0; i < form.value.details.length; i++) {
      cities.value = proxy.region.getCities(form.value.details[i].provinceCode);
      cities.value.unshift({ code: "", name: "全部" });
      districts.value = proxy.region.getDistricts(form.value.details[i].cityCode);
      districts.value.unshift({ code: "", name: "全部" });
      console.log("市", cities.value);

      provincesArr.value.push(provinces.value);
      citiesArr.value.push(cities.value);
      districtsArr.value.push(districts.value);
    }
  }

  function showAddCompanyDialog() {
    addCompanyDialogRef.value.open();
  }

  function contractTypeChangeHandler() {
    if (form.value.contractType === 1) {
      form.value.serviceType = 1;
    }
  }

  function showHistoryList() {
    historyChoiceRef.value.open(
      form.value.fromId === "0" ? form.value.id : form.value.fromId
    );
  }

  function historyChoiceHandle(row) {
    open(row.id);
  }

  /** 暴露给父组件的方法 */
  defineExpose({
    open,
    openSimple,
  });
</script>
<style scoped>
  .my-autocomplete .el-input-group__append {
    padding: 0 10px !important;
  }
</style>