logpm_page/src/views/aftersales/aftersalesWorkOrder.vue

<template>
  <div class="content_max">
    <!-- 菜单  -->
    <el-tabs type="border-card" v-model="tabValue" @tab-change="tabChenge" class="el_tabs">
      <div></div>
      <el-tab-pane :name="item.name" :label="item.label" v-for="item in TabList" :key="item.name">
      </el-tab-pane>
      <div class="content_right">
        <basic-container>
          <div class="avue-crud">
            <!-- 搜索模块 -->
            <el-row v-if="search">
              <!-- 查询模块 -->
              <el-form :inline="true" :model="query" class="el-fr-d">
                <div class="el_tims_box">
                  <div class="topText">
                    <el-input
                      v-model="query.workOrderNumber"
                      :rows="4"
                      type="textarea"
                      placeholder="请输入工单号"
                    />
                  </div>

                  <div class="el_times">
                    <el-form-item label="上报日期" class="el-times">
                      <el-date-picker
                        v-model="value1"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :size="size"
                      />
                    </el-form-item>
                    <el-form-item label="处理时间" class="el-times">
                      <el-date-picker
                        v-model="value1"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :size="size"
                      />
                    </el-form-item>
                    <el-form-item label="送货时间" class="el-times">
                      <el-date-picker
                        v-model="value1"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :size="size"
                      />
                    </el-form-item>
                    <el-form-item label="运损发现" class="el-times">
                      <el-date-picker
                        v-model="value1"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :size="size"
                      />
                    </el-form-item>
                  </div>
                </div>
                <!-- 查询按钮 -->
                <el-form-item class="el-btn">
                  <el-button type="primary" icon="el-icon-search" @click="searchChange"
                    >搜 索</el-button
                  >
                  <el-button icon="el-icon-delete" @click="searchReset()">清 空</el-button>
                </el-form-item>
              </el-form>
            </el-row>

            <!-- 控件模块 -->
            <el-row>
              <div class="avue-crud__header">
                <!-- 头部左侧按钮模块 -->
                <div class="avue-crud__left">
                  <!-- v-if="ButtonPermissions.add" -->
                  <el-button v-if="PermissionButton.workAdd" type="primary" @click="AddInfo">
                    <el-icon><Plus /></el-icon>新 增</el-button
                  >
                  <!-- <el-button type="primary" @click="BatchDelete">
                    <el-icon><Delete /></el-icon>批量删除</el-button
                  > -->

                  <!-- v-if="ButtonPermissions.batchReject" -->
                  <el-button
                    v-if="PermissionButton.batch_return"
                    type="primary"
                    @click="BatchReturn"
                    >批量打回</el-button
                  >
                  <!-- v-if="ButtonPermissions.assignment" -->
                  <el-button v-if="PermissionButton.assign" type="primary" @click="assign"
                    >工单指派</el-button
                  >

                  <!-- v-if="ButtonPermissions.applyArbitration" -->
                  <el-button
                    v-if="PermissionButton.apply_arbitration"
                    type="primary"
                    @click="arbitrate"
                    >申请仲裁</el-button
                  >

                  <!-- v-if="ButtonPermissions.batchFinish" -->
                  <el-button
                    v-if="PermissionButton.batch_completion"
                    type="primary"
                    @click="Batchcompletion"
                    >批量完结</el-button
                  >

                  <!-- v-if="ButtonPermissions.appeal" -->
                  <el-button v-if="PermissionButton.representations" type="primary" @click="appeal"
                    >申诉</el-button
                  >
                  <!-- v-if="details.query.workOrderStatus == 30" -->
                  <!-- <el-button type="primary" @click="ProcessingParty"> 处理方信息</el-button> -->
                </div>
                <!-- 头部右侧按钮模块 -->
                <div class="avue-crud__right">
                  <el-button icon="el-icon-refresh" @click="searchChangeS" circle></el-button>
                  <el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
                  <!-- <el-button icon="Search" @click="searchHide" circle></el-button> -->
                </div>
              </div>
            </el-row>
            <!-- 申诉列表展示 -->
            <el-tabs
              type="border-card"
              v-if="details.query.workOrderStatus == 30"
              @tab-change="AppealTab"
            >
              <el-tab-pane label="处理完毕"></el-tab-pane>
              <el-tab-pane label="申诉列表"></el-tab-pane>
            </el-tabs>
            <!-- 首页表格 -->
            <el-row>
              <!-- 列表模块 -->
              <tablecmt
                :columnList="publicColumnList"
                :tableData="data"
                :loading="loadingObj.list"
                @inputTxt="inputsc"
                @timeCheck="timesc"
                @btnCheck="btnsc"
                @selectCheck="selectsc"
                @selection="selectionChange"
              >
                <template #default="slotProps">
                  <template v-if="slotProps.scope.column.label === '操作'">
                    <div class="ElBtnClass">
                      <div>
                        <!-- <el-button @click="addingRecord(slotProps.scope)">新增记录</el-button> -->
                        <el-button v-if="TabPermissions != '4'" @click="view(slotProps.scope)"
                          >查看</el-button
                        >
                        <!-- <el-button @click="ViewEvent(slotProps.scope)">编辑</el-button> -->
                        <!-- <el-button @click="reply(slotProps.scope)">回复</el-button> -->
                        <!-- <el-button @click="ViewDelete(slotProps.scope)">删除</el-button> -->
                        <!-- <el-button @click="CompletionButton(slotProps.scope)">完结</el-button> -->
                        <!-- <el-button v-if="ClaimStatus" @click="appeal(slotProps.scope)"
                          >申诉</el-button
                        > -->
                      </div>
                      <el-button
                        v-if="TabPermissions == 7"
                        @click="BtnModifyAmount(slotProps.scope)"
                        >修改金额</el-button
                      >
                    </div>
                  </template>
                </template>
              </tablecmt>
            </el-row>

            <!-- 分页模块 -->
            <el-row class="el-fy">
              <div class="avue-crud__pagination flex-c-sb" style="width: 100%">
                <div></div>
                <el-pagination
                  align="right"
                  background
                  @size-change="sizeChange"
                  @current-change="currentChange"
                  :current-page="page.currentPage"
                  :page-sizes="[30, 50, 80, 120]"
                  :page-size="page.pageSize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="page.total"
                >
                </el-pagination>
              </div>
            </el-row>
          </div>

          <!-- 新增弹窗  -->
          <!-- 完结弹窗  -->


          <!-- 批量打回弹窗 -->
          <el-dialog v-model="dialogReturn" title="批量打回" width="40%" draggable class="plAllret">
            <el-form
              v-loading="repulse"
              element-loading-text="正在打回中..."
              label-position="top"
              label-width="100px"
              :model="BatchFrom"
            >
              <el-form-item label="打回原因">
                <el-input v-model="BatchFrom.txt" type="textarea" :rows="4" />
              </el-form-item>

              <el-form-item label="流转营业部">
                <el-select
                  v-model="BatchFrom.businessDepartment"
                  multiple
                  filterable
                  default-first-option
                  :reserve-keyword="false"
                  placeholder="请选择活动区域"
                >
                  <el-option
                    v-for="item in warehouseData"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-form>
            <template #footer>
              <span class="dialog-footer">
                <el-button @click="dialogReturn = false">取消</el-button>
                <el-button type="primary" @click="ConfirmReturn" :disabled="repulse">
                  确定
                </el-button>
              </span>
            </template>
          </el-dialog>

          <!-- 工单指派弹窗 -->
          <el-dialog v-model="dialogassign" title="工单指派" width="40%" draggable class="plAllret">
            <el-form
              v-loading="AssignLoad"
              element-loading-text="正在打回中..."
              label-position="top"
              label-width="100px"
              :model="assignFrom"
            >
              <el-form-item label="客服列表">
                <el-select
                  v-model="assignFrom.businessDepartment"
                  filterable
                  default-first-option
                  :reserve-keyword="false"
                  placeholder="请选择指派客服"
                >
                  <el-option
                    v-for="item in customerService"
                    :key="item.value"
                    :label="item.realName"
                    :value="item.id"
                  />
                </el-select>
              </el-form-item>
            </el-form>
            <template #footer>
              <span class="dialog-footer">
                <el-button @click="dialogassign = false">取消</el-button>
                <el-button type="primary" @click="Assignbutton" :disabled="AssignLoad">
                  确定
                </el-button>
              </span>
            </template>
          </el-dialog>

          <!-- 批量完结弹窗 -->

          <el-dialog
            v-model="dialogBatchcompletion"
            title="批量完结"
            width="60%"
            :before-close="handleClose"
            :style="{ height: BatchcompletionHeight + 'px', overflowY: 'scroll' }"
            class="el_Batchcompletion"
          >
            <div v-loading="PLloading" element-loading-text="正在批量处理中...">
              <div class="Improveinformation">
                <el-tabs type="border-card" class="demo-tabs">
                  <el-tab-pane>
                    <template #label>
                      <span class="custom-tabs-label">
                        <el-icon><calendar /></el-icon>
                        <span>完结信息</span>
                      </span>
                    </template>

                    <div class="el-ckbtn">
                      <el-button type="primary" @click="AddCompensation">添加赔款方</el-button>
                      <el-button type="primary" @click="AddPayee">添加收款方</el-button>
                    </div>

                    <div
                      class="payanindemnity"
                      v-for="(item, index) in CompensationParty"
                      :key="index"
                    >
                      <span class="title" :style="{ color: item.state != 0 ? '#000' : '#F56C6C' }"
                        >{{ item.state == 0 ? '赔款方' : '收款方' }}{{ item.cld }}</span
                      >
                      <div class="sk_input">
                        <el-input
                          v-model="item.name"
                          :placeholder="item.state == 0 ? '请填写赔款方' : '请填写收款方'"
                        />
                      </div>
                      <div class="sk_input">
                        <el-input v-model="item.reason" placeholder="请填写原因" />
                      </div>
                      <div class="sk_input">
                        <el-input
                          @input="amountMoney"
                          :min="0"
                          v-model="item.num"
                          placeholder="金额"
                        />
                      </div>
                      <el-button type="danger" round @click="payremove(item.state, index)"
                        >移除</el-button
                      >
                    </div>
                    <div class="paySum">
                      <div class="sum">
                        <span>
                          <el-icon><Coin /></el-icon>赔款金额总和:<b>{{
                            TotalamountCompensation
                          }}</b></span
                        >
                        <span>
                          <el-icon><Coin /></el-icon>收款金额总和:<b>{{
                            TotalamountReceived
                          }}</b></span
                        >
                      </div>
                      <div></div>
                    </div>
                  </el-tab-pane>
                </el-tabs>
              </div>
              <!-- 仲裁原因 -->
              <div class="arbitrate">
                <el-tabs type="border-card" class="demo-tabs">
                  <el-tab-pane>
                    <template #label>
                      <span class="custom-tabs-label">
                        <el-icon><calendar /></el-icon>
                        <span>仲裁原因</span>
                      </span>
                    </template>

                    <el-input
                      v-model="Reasonarbitration"
                      type="textarea"
                      :autosize="{ minRows: 5, maxRows: 4 }"
                      placeholder="请输入仲裁原因"
                    />
                  </el-tab-pane>
                </el-tabs>
                <div class="el_btn">
                  <el-button type="primary" @click="CompletedSubmission">确认提交</el-button>
                </div>
              </div>
            </div>
          </el-dialog>
          <!-- 申诉弹窗 -->
          <el-dialog v-model="dialogappeal" title="工单申诉" width="30%">
            <div class="el_appeal" v-loading="loadingappeal" element-loading-text="Loading...">
              <el-select
                v-model="Appealselection"
                clearable
                filterable
                multiple
                placeholder="请选择责任方"
              >
                <el-option
                  v-for="item in warehouseData"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
              <el-input
                v-model="Reasonforappeal"
                :rows="4"
                type="textarea"
                placeholder="请输入申诉原因"
              />

              <span class="el_sdialog-footer">
                <el-button @click="dialogappeal = false">取消</el-button>
                <el-button type="primary" @click="Appealbutton"> 确定 </el-button>
              </span>
            </div>
          </el-dialog>

          <el-dialog
            v-model="dialogModifyAmount"
            :title="fromamount.title + '超时金额修改'"
            width="30%"
          >
            <el-form label-position="left" label-width="70px" :model="fromamount">
              <div class="el_amount">
                <el-form-item label="原金额">
                  <el-input v-model="fromamount.ytimeout" disabled />
                </el-form-item>
                <el-form-item label="修改金额">
                  <el-input v-model="fromamount.Amount" placeholder="请输入要修改的金额" />
                </el-form-item>
              </div>
            </el-form>
            <template #footer>
              <span class="dialog-footer">
                <el-button @click="dialogModifyAmount = false">取消</el-button>
                <el-button type="primary" @click="ModifyAmountFn">确定修改</el-button>
              </span>
            </template>
          </el-dialog>
        </basic-container>
      </div>
    </el-tabs>
  </div>
  <!-- 列表配置显示 -->
  <edittablehead
    @setcolum="setnewcolum"
    @closce="showdrawer"
    :drawerShow="drawerShow"
    :columnList="details.columnList"
  ></edittablehead>
</template>
<script setup>
import { ElMessage } from 'element-plus';
import { ElMessageBox } from 'element-plus';
import { Plus } from '@element-plus/icons-vue';
import { useStore } from 'vuex';
import {
  $_getList,
  $_submit,
  $_getDetail,
  $_remove,
  $_getProcessor,
  $_AddReply,
  $_getExchangeList,
  $_getInfo,
  $_batchReturn,
  $_assignCustomerService,
  $_getCustomerServicePersonnel,
  $_arbitrate,
  $_addCompletionEnd,
  $_appealSubmit,
  $_listSettlement,
  $_listAppeal,
  $_listOwn,
  $_moneyUpdate,
} from '@/api/aftersales/aftersalesWorkOrder';
import { getToken } from '@/utils/auth';
import { getDictionaryBiz } from '@/api/system/dict'; //字典
import functions from '@/utils/functions.js';
import { getDetailWarehouse, getDeptWarehouse } from '@/api/basicdata/basicdataWarehouse'; //处理方
import {
  ref,
  reactive,
  toRefs,
  computed,
  onMounted,
  nextTick,
  watch,
  getCurrentInstance,
} from 'vue';
import {
  columnList,
  recordList,
  Claimsfield,
  AppealList,
  timeoutList,
} from '@/option/aftersales/vueTvemp.js';
import { processRowProperty, isNumer, computeNumber} from '@/utils/util';
import { useRouter } from 'vue-router';
import dayjs from 'dayjs';
const $router = useRouter();
const $useStore = useStore();

const $route = useRoute();
/** vuex */
const accessControl = $useStore.getters.permission;
console.log(accessControl, '权限按钮');

// workAdd;//新增
// batch_return;//批量打回
// assign;//工单指派
// apply_arbitration;//申请仲裁
// batch_completion;//批量完结
// representations;//申诉
// reply;//回复
// processing_completed;//处理完结
// work_order_completion;//完结
// repulse;//打回
// arbitration_completed;//仲裁完结
// information_editing;//信息编辑
console.log(accessControl.add, '新增按钮权限');
const PermissionButton = computed(() => {
  return {
    workAdd: accessControl.add, //新增
    batch_return: accessControl.batch_return, //批量打回
    assign: accessControl.assign, //工单指派
    apply_arbitration: accessControl.apply_arbitration, //申请仲裁
    batch_completion: accessControl.batch_completion, //批量完结
    representations: accessControl.representations, //申诉
    reply: accessControl.reply, //回复
    processing_completed: accessControl.processing_completed, //处理完结
    work_order_completion: accessControl.work_order_completion, //完结
    repulse: accessControl.repulse, //打回
    arbitration_completed: accessControl.arbitration_completed, //仲裁完结
    information_editing: accessControl.information_editing, //信息编辑
  };
});
const tabValue = ref(0); //侧边栏激活状态
const publicColumnList = ref([]); //公共列表参数
const scrollContainer = ref(null); //客服实例
const workOrderStatus = ref(null); //侧边栏参数
const BatchFrom = ref({}); //批量打回
const currentPage = ref(1); // 默认页码
const TransportlossList = ref([
  //运损发现节点
]);
const pageSize = ref(30); // 默认每一页几条
const total = ref(0); //页码总页数
const KFinput = ref(''); //客服发送消息
const Appealselection = ref([]); //申诉选择的责任人
const KFfeel = ref(''); //文件附件地址
const pageList = ref([5, 10, 50, 100, 200]); // 选择每页显示多少条
const background = ref(true); // 是否开启背景颜色
const disabled = ref(false); // 是否禁止使用页码功能
const fromamount = ref({}); //修改金额表单
const TimeoutStatus = ref(false); //超时列表状态
const loading = ref(false); //首页表格加载效果
const dialogReturn = ref(false); //批量打回弹窗状态
const dialogappeal = ref(false); //申诉弹窗状态
const Indexdialog = ref(false); //新增弹窗
const Reasonforappeal = ref(''); //申诉原因
const Indexform = ref({}); //首页新增表单
const dialogcustomerService = ref(false); //客服信息
const IndexException = ref([]); //异常类型下拉选择
const DiscoveringNodes = ref([]); //发现节点下拉选择
const warehouseData = ref([]); //处理方
const customerService = ref([]);
const IndexForm = ref(null); //首页表实例
const FromDisabled = ref(false); //详情禁止输入框
const loadingappeal = ref(false); //工单申诉状态
const SelectType = ref(null); //类型
const ListRow = ref(); //当前行数据
const appealList = ref(); //申诉选择的参数
const StateType = ref(true); //类型
const dialogassign = ref(false); //工单指派
const AssignLoad = ref(false); //工单指派加载
const assignFrom = ref({}); //工单指派表单
const dialogImageUrl = ref('');
const dialogVisible = ref(false);
const groundlineType = ref(null); //干线状态
const groundlineSet = ref(true); //干线条件都满足
const enddialog = ref(false); //完结弹窗
const endFrom = ref({}); //完结弹窗表单
const screenHeight = ref(0); // 屏幕高度
const eightyPercentHeight = ref(0); // 80% 高度
const list = ref([]);
const options = ref([]);
const repulse = ref(false);
const dialogBatchcompletion = ref(false); //批量完结弹窗
const PLloading = ref(false);
const Mydata = ref(null); //仓库关键信息
const ProcessingList = ref([]); //赔付方式列表
const iconState = ref(false); //消息状态
const ProcessingPartyState = ref(false); //处理方数据(为真才显示)
const currentUser = ref(null); //存放当前的对话框必要Id
const ArbitrationStatus = ref(null); //申请仲裁状态
const TotalamountCompensation = ref(0); //赔款金额合计
const TotalamountReceived = ref(0); //收款金额合计
const Reasonarbitration = ref(null); //仲裁原因
const BatchcompletionHeight = ref(0); //批量完结弹窗
const userInfo = ref(); //当前登录人信息
const ClaimStatus = ref(false); //理赔状态
const AppealStatus = ref(false); //申诉列表状态
const dialogModifyAmount = ref(false); //超时金额修改弹出状态
const UserPermissions = ref('仓库客服'); //客服权限
const TabPermissions = ref(0); //菜单权限

const AppealStatusT = ref(false); //是否为申诉列表
const TabList = ref([
  { name: 0, label: '全部' },
  { name: 1, label: '处理中' },
  { name: 2, label: '处理完毕' },
  { name: 3, label: '待处理' },
  { name: 4, label: '理赔金额未出' },
  { name: 5, label: '仲裁中' },
  { name: 6, label: '完结' },
  { name: 7, label: '超时未处理' },
]); //标签栏
const DeliveryDriver = ref([]);

const CompensationParty = ref([
  { name: '', state: 0, num: null, reason: '', cld: 1 }, //赔款方
  { name: '', state: 1, num: null, reason: '', cld: 1 }, //收款方
]); //收/赔

const details = reactive({
  /** 是否开启搜索 */
  search: false,
  /** 表格搜索条件 */
  query: {
    workOrderStatus: null,
  },
  /** 时间快捷选择设置 */
  shortcuts: [
    {
      text: '最近一周',
      value: () => {
        const end = new Date();
        const start = new Date();
        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
        return [start, end];
      },
    },
    {
      text: '最近一个月',
      value: () => {
        const end = new Date();
        const start = new Date();
        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
        return [start, end];
      },
    },
    {
      text: '最近三个月',
      value: () => {
        const end = new Date();
        const start = new Date();
        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
        return [start, end];
      },
    },
  ],
  /** 时间选择器数据 */
  stockupDate: [],
  /** 列表 */
  columnList,

  /** 列表数据 */
  data: [],
  // 处理记录
  recordList,
  // 处理记录数据
  recorddata: [],
  /** 页面loading */
  loadingObj: {
    /** 列表加载loading */
    list: false,
    packageListLoading: false,
  },
  /** 列表复选框选中的数据 */
  selectionList: [],
  /** 是否显示设置表格 */
  drawerShow: false,
  /** 分页参数 */
  page: {
    currentPage: 1,
    pageSize: 50,
    total: 0,
  },

  /** 弹出层显示 */
  popUpShow: {
    /** 包件明细 */
    packageOrderListlVisited: false,
    /** 二维码 */
    QRCodeVisible: false,
    /** 修改客户信息 */
    editClientInfoVisible: false,
  },
  /** 列表Dom节点 */
  listNode: '',
  form: {},
  /** 全屏 */
  fullscreenObj: {
    /** 包明细 */
    packageOrderListlVisited: false,
  },
});

const {
  search,
  query,
  shortcuts,
  stockupDate,
  data,
  loadingObj,
  selectionList,
  drawerShow,
  page,
  trickleLoadingPage,
  zeroAdditionalRecordingInfo,
  popUpShow,
  recorddata,
} = toRefs(details);

// let tab = [
//   { label: '全部', value: 0 },
//   { label: '处理中', value: 1 },
//   { label: '待处理完毕', value: 2 },
//   { label: '待处理', value: 3 },
//   { label: '理赔金额未出', value: 4 },
//   { label: '仲裁中', value: 5 },
//   { label: '完结', value: 6 },
//   { label: '超时未处理', value: 7 },
// ];

// // 按钮配置
// // 1.新增  2.批量打回 3.工单指派 4.申请仲裁 5.批量完结  6.申诉

// // 角色配置
// // 1.仓库客服
// // 2.职能客服
// // 3.客服经理

// // 在value == 0状态下的权限配置
// 1.新增  只能仓库客服查看
// 2.批量打回  只能职能客服查看
// 3.工单指派  只能客服经理查看
// 4.申请仲裁   只能仓库客服查看
// 5.批量完结    只能职能客服查看
// 6.申诉        隐藏

// // 在value==1状态下的权限配置
// 1.新增        隐藏
// 2.批量打回    只能仓库客服查看
// 3.工单指派     隐藏
// 4.申请仲裁     只能仓库客服查看
// 5.批量完结     只能职能客服和客服经理查看
// 6.申诉         隐藏
// // 在value==2状态下的权限配置
// 隐藏所有按钮

// // 在value==3状态下的权限配置
// 1.新增          隐藏
// 2.批量打回       只能仓库客服查看
// 3.工单指派      只能客服经理查看
// 4.申请仲裁    隐藏
// 5.批量完结    隐藏
// 6.申诉        隐藏

// // 在value==4状态下的权限配置
// 1.新增       隐藏
// 2.批量打回   隐藏
// 3.工单指派   隐藏
// 4.申请仲裁  隐藏
// 5.批量完结   隐藏
// 6.申诉    仓库客服查看

// // 在value==5状态下的权限配置
// 1.新增       隐藏
// 2.批量打回   隐藏
// 3.工单指派   隐藏
// 4.申请仲裁  隐藏
// 5.批量完结  隐藏
// 6.申诉      隐藏

// // 在value==6状态下的权限配置
// 1.新增   隐藏
// 2.批量打回   隐藏
// 3.工单指派   隐藏
// 4.申请仲裁  隐藏
// 5.批量完结  隐藏
// 6.申诉     隐藏

// // 在value== 7 状态下的权限配置
// 1.新增    隐藏
// 2.批量打回  隐藏
// 3.工单指派  隐藏
// 4. 申请仲裁  隐藏
// 5.批量完结  隐藏
// 6.申诉  隐藏

// 角色通过  UserPermissions 变量控制
// 菜单通过 TabPermissions变量 来控制
// 例如：
// const UserPermissions = ref('仓库客服'); //客服权限
// const TabPermissions = ref(0); //菜单权限
// 按钮权限

const ButtonPermissions = computed(() => {
  // 根据 TabPermissions 的状态，决定每个按钮的显示隐藏逻辑
  switch (TabPermissions.value) {
    case 0: //全部
      return {
        add: UserPermissions.value == '仓库客服', //新增按钮
        batchReject: UserPermissions.value == '职能客服', //批量打回
        assignment: UserPermissions.value == '客服经理', //工单指派
        applyArbitration: UserPermissions.value == '仓库客服', //申请仲裁
        batchFinish: UserPermissions.value != '仓库客服', //批量完结
        appeal: false, //申诉
      };
    case 1: //处理中
      return {
        add: false, //新增按钮
        batchReject: UserPermissions.value != '仓库客服', //批量打回
        assignment: false, //工单指派
        applyArbitration: UserPermissions.value == '仓库客服', //申请仲裁
        batchFinish: UserPermissions.value != '仓库客服', //批量完结
        appeal: false, //申诉
      };
    case 2: //处理完毕
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //申请仲裁
        batchFinish: false, //批量完结
        appeal: UserPermissions.value == '仓库客服' && AppealStatusT.value, //申诉
      };
    case 3: //待处理
      return {
        add: false, //新增按钮
        batchReject: UserPermissions.value == '职能客服', //批量打回
        assignment: UserPermissions.value == '客服经理', //工单指派
        applyArbitration: false, //申请仲裁
        batchFinish: false, //批量完结
        appeal: false, //申诉
      };
    case 4: //理赔金额未出
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //申请仲裁
        batchFinish: false, //批量完结
        appeal: UserPermissions.value == '仓库客服', //申诉
      };
    case 5: //仲裁中
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //申请仲裁
        batchFinish: false, //批量完结
        appeal: false, //申诉
      };
    case 6: //完结
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //申请仲裁
        batchFinish: false, //批量完结
        appeal: false, //申诉
      };
    case 7: //超时未处理
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //申请仲裁
        batchFinish: false, //批量完结
        appeal: false, //申诉
      };
    // 其他任何情况下的默认情况
    default:
      return {
        add: false,
        batchReject: false,
        assignment: false,
        applyArbitration: false,
        batchFinish: false,
        appeal: false,
      };
  }
});

const ProcessingResults = [
  {
    value: '0',
    label: '维修',
  },
  {
    value: '1',
    label: '补漆',
  },
  {
    value: '2',
    label: '下补单',
  },
  {
    value: '3',
    label: '赔付运费',
  },
  {
    value: '4',
    label: '用库存',
  },
  {
    value: '5',
    label: '赔商家',
  },
  {
    value: '6',
    label: '赔客户',
  },
];
const fileList = ref([]);

const TransportLossNode = ref([
  { label: '在库操作环节', value: 1 },
  { label: '干线卸车环节', value: 2 },
  { label: '入库环节', value: 3 },
  { label: '配送环节', value: 4 },
  { label: '中转卸车环节', value: 5 },
  { label: '安装环节', value: 6 },
]);

// 页面初始化数据
const IndexTable = val => {
  ClaimStatus.value = false;
  AppealStatus.value = false; //关闭申诉状态
  TimeoutStatus.value = false; //关闭超时
  // ProcessingPartyState.value = false; //关闭处理方
  details.loadingObj.list = true; //开启动画加载
  let data = {
    ...val,
  };

  columnList[2].checkarr = []; //重置下拉搜索框
  columnList[3].checkarr = [];
  data.current = page.value.currentPage; //页码
  data.size = page.value.pageSize; //条数
  updateDictionary(columnList[2].checkarr, 'pc_work_order'); //异常类型
  updateDictionary(columnList[3].checkarr, 'pc_discovery_node'); //发现环节
  updateDictionary(columnList[17].checkarr, 'work_order_status'); //发现环节
  // 获取角色权限
  getDictionaryBiz('after_sales_visits').then(res => {
    console.log(res, '角色字典');
    const matchingItem = res.data.data.find(
      item => item.dictValue == JSON.parse(localStorage.getItem('TWMS-userInfo')).content.role_name
    );
    if (matchingItem) {
      UserPermissions.value = matchingItem.dictValue;
    } else {
      UserPermissions.value = '仓库客服';
    }
    console.log(UserPermissions.value, '当前角色权限');
  });

  $_getList(data).then(res => {
    Tableheaderswitching(columnList);
    console.log(res, '初始化返回值');
    details.loadingObj.list = false; //关闭动画加载

    if (res.data.data) {
      page.value.total = res.data.data.total; //总页数

      if (res.data.data.records.length) {
        res.data.data.records.forEach(item => {
          console.log(item, 'item');
          // 对为null的数据进行处理
          // for (const property in item) {
          //   if (item[property] == null) {
          //     item[property] = '/';
          //   }
          // }
          // 对状态进行处理
          if (item.workOrderType == 1) {
            item.workOrderTypeNameS = columnList[2].checkarr[0].label; //货损
          } else if (item.workOrderType == 2) {
            item.workOrderTypeNameS = columnList[2].checkarr[1].label; //少货
          } else if (item.workOrderType == 3) {
            item.workOrderTypeNameS = columnList[2].checkarr[2].label; //窜货
          } else if (item.workOrderType == 4) {
            item.workOrderTypeNameS = columnList[2].checkarr[3].label; //加急
          } else if (item.workOrderType == 5) {
            item.workOrderTypeNameS = columnList[2].checkarr[4].label; //其他
          }
          // 提货环节下拉赋值
          if (item.discoveryNode == 1) {
            item.discoveryNodeNameS = columnList[3].checkarr[0].label; //提货环节
          } else if (item.discoveryNode == 2) {
            item.discoveryNodeNameS = columnList[3].checkarr[1].label; //发货环节
          } else if (item.discoveryNode == 3) {
            item.discoveryNodeNameS = columnList[3].checkarr[2].label; //干线卸车环节
          } else if (item.discoveryNode == 4) {
            item.discoveryNodeNameS = columnList[3].checkarr[3].label; //库内作业环节
          } else if (item.discoveryNode == 5) {
            item.discoveryNodeNameS = columnList[3].checkarr[4].label; //配送装车环节
          } else if (item.discoveryNode == 6) {
            item.discoveryNodeNameS = columnList[3].checkarr[5].label; //其他
          } else if (item.discoveryNode == 7) {
            item.discoveryNodeNameS = columnList[3].checkarr[6].label; //配送签收环节
          } else if (item.discoveryNode == 8) {
            item.discoveryNodeNameS = columnList[3].checkarr[7].label; //安装环节
          }
          if (item.workOrderStatus == 10) {
            item.workOrderStatusNameS = columnList[17].checkarr[0].label; //待处理
          } else if (item.workOrderStatus == 20) {
            item.workOrderStatusNameS = columnList[17].checkarr[1].label; //处理中
          } else if (item.workOrderStatus == 30) {
            item.workOrderStatusNameS = columnList[17].checkarr[2].label; //已处理
          } else if (item.workOrderStatus == 40) {
            item.workOrderStatusNameS = columnList[17].checkarr[4].label; //待审核
          } else if (item.workOrderStatus == 50) {
            item.workOrderStatusNameS = columnList[17].checkarr[5].label; //已审核
          } else if (item.workOrderStatus == 60) {
            item.workOrderStatusNameS = columnList[17].checkarr[3].label; //超时未处理
          } else if (item.workOrderStatus == 70) {
            item.workOrderStatusNameS = columnList[17].checkarr[6].label; //仲裁中
          } else if (item.workOrderStatus == 80) {
            item.workOrderStatusNameS = columnList[17].checkarr[7].label; //完结
          } else if (item.workOrderStatus == 90) {
            item.workOrderStatusNameS = columnList[17].checkarr[8].label; //理赔金未出
          }
        });
        details.data = res.data.data.records;
      }else{
        details.data = res.data.data.records
      }
    }
    loading.value = false; //关闭加载效果
  });
};

// 表格切换
const Tableheaderswitching = (val) => {
  publicColumnList.value = val; //默认加载表格
  details.columnList = val;
};

// 页面初始化
const OnLoad = () => {
  // 表格切换

  userInfo.value = JSON.parse(localStorage.getItem('TWMS-userInfo')); //获取本地登录人参数
  Mydata.value = JSON.parse(localStorage.getItem('my_data')); //获取本地仓库信息
  currentUser.value = Mydata.value.id;
  // 在组件挂载后获取屏幕高度
  screenHeight.value = window.innerHeight;
  // 计算80%的高度
  eightyPercentHeight.value = screenHeight.value * 0.8;
  BatchcompletionHeight.value = screenHeight.value * 0.6;
  loading.value = true; //开启加载效果
  let data = {};
  console.log(page, 'page');
  data.current = page.value.currentPage; //页码
  data.size = page.value.pageSize; //条数
  console.log(data, '要提交的数据');
  updateDictionary(columnList[2].checkarr, 'pc_work_order'); //异常类型
  updateDictionary(columnList[3].checkarr, 'pc_discovery_node'); //发现环节
  IndexTable(details.query);
  getDeptWarehouse({}).then(res => {
    res.data.data.forEach(item => {
      warehouseData.value.push({
        value: item.id,
        label: item.name,
      });
    });
  });
};

OnLoad();
// 字典公共函数
function updateDictionary(targetArray, dictionaryType) {
  getDictionaryBiz(dictionaryType).then(res => {
    console.log(res, '字典');
    res.data.data.forEach(item => {
      targetArray.push({
        value: item.dictKey,
        label: item.dictValue,
      });
    });
  });
}
// 字典请求函数
const AddInfo = () => {
  $router.push('/aftersales/aftersalesWorkOrderAdd');
  // Indexform.value = {}; //清空表单
  // IndexException.value = [];
  // DiscoveringNodes.value = [];
  // // Indexdialog.value = true; //开启新增弹窗
  // FromDisabled.value = false; //禁用输入框
  // updateDictionary(IndexException.value, 'pc_work_order'); //异常类型
  // updateDictionary(DiscoveringNodes.value, 'pc_discovery_node'); //发现环节
  // getDeptWarehouse({}).then(res => {
  //   console.log(res, '处理方');
  //   res.data.data.forEach(item => {
  //     warehouseData.value.push({
  //       value: item.id,
  //       label: item.name,
  //     });
  //   });
  // });
};

// 首页新增表单确定
const ConfirmForm = () => {
  console.log(warehouseData.value, '准备好的数据');
  console.log(Indexform.value.duty, '要筛选的数据');
  let filteredB = warehouseData.value.filter(item => Indexform.value.duty.includes(item.id));
  console.log(filteredB);
  // 匹配司机名字

  Indexform.value.deliveryDriver = DeliveryDriver.value.find(
    item => item.value == Indexform.value.deliveryDriver
  ).label;
  console.log(Indexform.value.deliveryDriver); // 输出李华
  FromDisabled.value = false; //启用输入框
  let processorEntityList = [];

  //处理方
  Indexform.value.processor.forEach(item => {
    let found = warehouseData.value.find(element => element.value == item.toString());
    processorEntityList.push({
      businessName: found ? found.label : '',
      businessId: item,
      conditions: 1,
      typesOf: 2,
    });
  });

  //责任方
  Indexform.value.duty.forEach(item => {
    let found = warehouseData.value.find(element => element.value == item.toString());
    processorEntityList.push({
      businessName: found ? found.label : '',
      businessId: item,
      conditions: 1,
      typesOf: 1,
    });
  });

  // processorEntityList.push(ResponsibleParty);
  console.log(processorEntityList, 'processorEntityList');
  let DataSubmit = { ...Indexform.value }; //定义初始化
  DataSubmit.processorEntityList = processorEntityList;
  delete DataSubmit.duty, //移除多余字段
    delete DataSubmit.processor; //移除多余字段
  console.log(DataSubmit, '处理好的表单信息');
  console.log(warehouseData.value, 'warehouseData.value');

  Indexdialog.value = false; //关闭表单弹窗
  $_submit(DataSubmit).then(res => {
    if (res.data.code == 200) {
      ElMessage({
        message: res.data.msg,
        type: 'success',
      });
      Indexform.value = {}; //重置表单
      IndexTable(details.query);
    }
  });
};
// 顶部搜索
const searchHide = () => {
  console.log(details);
  details.search = !details.search;
};
// 首页查看详情按钮
const view = val => {
  console.log(val.row.id);
  $router.push({
    path: '/aftersales/aftersalesWorkOrderInfo',
    query: {
      id: val.row.id,
      name: val.row.workOrderNumber + '-信息查看',
      warehouseId: val.row.warehouseId,
      workOrderNumber: val.row.workOrderNumber, //添加异常记录包条码
      businessId: val.row.businessId,
      ProcessType: TabPermissions.value == 2 ? '2' : TabPermissions.value == 3 ? '1' : '', //类型 1 待处理 2 已处理
      RouteIndexs: TabPermissions.value, //当前记录参数
    },
  });
  return;
  console.log(val, '当前行数据');
  FromDisabled.value = true; //禁用输入框
  updateDictionary(IndexException.value, 'pc_work_order'); //异常类型
  updateDictionary(DiscoveringNodes.value, 'pc_discovery_node'); //发现环节
  getDeptWarehouse({}).then(res => {
    res.data.data.forEach(item => {
      warehouseData.value.push({
        value: item.id,
        label: item.name,
      });
    });
  });
  $_getDetail({
    id: val.row.id,
  }).then(res => {
    console.log(res, '查看详情返回值');
    if (res.data.data) {
      Indexform.value = res.data.data;
      Indexdialog.value = true; //展开弹窗
    }
  });
};
// 首页删除
const ViewDelete = val => {
  ElMessageBox.confirm(`是否删除该条数据?`)

    .then(() => {
      $_remove({
        ids: val.row.id,
      }).then(res => {
        console.log(res, '删除成功后的返回值');
        if (res.data.code == 200) {
          ElMessage({
            message: res.data.msg,
            type: 'success',
          });

          OnLoad(); //添加成功初始化程序
        }
      });
    })
    .catch(() => {
      // catch error
    });
};
// 首页批量删除
const BatchDelete = () => {
  console.log(details.selectionList, '选中的参数');
  let ids = [];
  details.selectionList.forEach(item => {
    ids.push(item.id);
  });
  ids = ids.join(',');

  ElMessageBox.confirm(`是否批量删除选中数据?`)
    .then(() => {
      $_remove({
        ids,
      }).then(res => {
        console.log(res, '删除成功后的返回值');
        if (res.data.code == 200) {
          ElMessage({
            message: res.data.msg,
            type: 'success',
          });

          OnLoad(); //添加成功初始化程序
        }
      });
    })
    .catch(() => {
      // catch error
    });
};
// 完结按钮
const CompletionButton = val => {
  $router.push({
    path: '/aftersales/aftersalesWorkOrderend',
    query: {
      id: val.row.id,
      name: val.row.id + '-完结填写',
      RouterState: 'end',
    },
  });
};
// 新增记录
const addingRecord = val => {
  console.log(val);
  $router.push({
    path: '/aftersales/aftersalesWorkOrderend',
    query: {
      id: val.row.id,
      name: val.row.workOrderNumber + '-添加异常记录',
      RouterState: 'record',
      businessId: val.row.businessId,
    },
  });
};

//  工单申诉按钮
const appeal = val => {
  console.log(details.selectionList, 'details.selectionList');
  if (!details.selectionList.length) {
    ElMessage({
      message: '请选择要申诉的数据',
      type: 'warning',
    });
    return;
  }
  if (details.selectionList.length > 1) {
    ElMessage({
      message: '只能单条申诉',
      type: 'warning',
    });
    return;
  }
  dialogappeal.value = true; //展开申诉弹窗
};
// 工单申诉确认按钮
const Appealbutton = () => {
  console.log(details.selectionList, '当前申诉的东西');
  loadingappeal.value = true; //开启加载效果
  console.log(Appealselection.value, '当前选择的责任人');
  console.log(warehouseData.value, '要循环处理的参数');
  let data = {
    peopleEntityList: [], //参数一
  };
  data.workOrderId = details.selectionList[0].lawoId;
  data.reason = Reasonforappeal.value;

  (data.appealPeopleName = warehouseData.value
    .filter(item => Appealselection.value.includes(item.value))
    .map(item => item.label)
    .join(',')), //实际责任人名称
    details.selectionList.forEach(item => {
      console.log(item.id);
      console.log(item, '已经选择的列表');
      data['peopleEntityList'].push({
        workOrderId: item.id, //异常工单ID
        warehouseId: item.warehouseId == '/' ? '' : item.warehouseId,
        reason: Reasonforappeal.value, //申诉理由
        claimant: userInfo.value.content.user_name, //申诉人
        claimantUserId: userInfo.value.content.user_id, //申诉人ID
        actualPersonName: warehouseData.value
          .filter(item => Appealselection.value.includes(item.value))
          .map(item => item.label)
          .join(','), //实际责任人名称
      });
    });
  console.log(data, '处理好的值');
  $_appealSubmit(data).then(res => {
    dialogappeal.value = false; //关闭申诉弹窗
    loadingappeal.value = false; //关闭加载效果
    console.log(res, '申诉成功返回值');
    ProcessingPartyState.value = false; //关闭处理方
    data.workOrderStatus = 30;
    details.query.workOrderStatus = 30;
    ArbitrationStatus.value = false; //不可以申请仲裁
    tabValue.value = 2;
    empty(); //清空搜索数据
    IndexTable({ workOrderStatus: 30 });
    if (res.data.code == 200) {
      ElMessage({
        message: res.data.msg,
        type: 'success',
      });
    }
  });
};

// 异常类型事件
const abnormalChange = val => {
  console.log(val);
  StateType.value = false;
  if (val == 1 || val == 2 || val == 3) {
    SelectType.value = val;
  } else {
    StateType.value = true;
  }
};
// 添加赔款方
// const AddCompensation = () => {
//   console.log('添加赔款方');
//   let som = 1;
//   CompensationParty.value.forEach(item => {
//     if (item.state == 0) {
//       som++;
//     }
//   });
//   CompensationParty.value.push({ name: '', state: 0, num: 0, reason: '', cld: som });
// };
// // 添加收款方
// const AddPayee = () => {
//   let som = 1;
//   CompensationParty.value.forEach(item => {
//     if (item.state == 1) {
//       som++;
//     }
//   });
//   CompensationParty.value.push({ name: '', state: 1, num: 0, reason: '', cld: som });
// };
// // 移除按钮
// const payremove = (state, val) => {
//   // 判断赔付方，至少保留一条数据
//   let som = 0;
//   if (state == 0) {
//     CompensationParty.value.forEach(item => {
//       if (item.state == 0) {
//         som++;
//       }
//     });
//     if (som == 1) {
//       ElMessage({
//         message: '赔款必填最少一条',
//         type: 'warning',
//       });
//       return;
//     }
//   }
//   CompensationParty.value.splice(val, 1);
// };
// 发现节点事件
const DiscoveringNodesChange = val => {
  groundlineSet.value = false; //干线条件都满足
  if (val == 1 || val == 2 || val == 3 || val == 4 || val == 5) {
    groundlineType.value = val; //干线状态
  } else {
    groundlineSet.value = true; //展示所有搜索框
  }
};
// 照片
const handleRemove = (uploadFile, uploadFiles) => {
  console.log(uploadFile, uploadFiles);
};

const handlePictureCardPreview = uploadFile => {
  dialogImageUrl.value = uploadFile.url;
  dialogVisible.value = true;
};

/** 表格表头输入框搜索 */
const inputsc = (index, row) => {
  processRowProperty(index, row, details);
  details.query[row.prop] = index;

  if (TimeoutStatus.value) {
    // 超时列表
    TimeoutHandling(details.query);
    return;
  }

  if (AppealStatus.value) {
    // 申诉列表
    appealFn(details.query);
    return;
  }

  if (ClaimStatus.value) {
    // 这是理赔搜索
    settlementclaim(details.query);
    return;
  }

  if (!ProcessingPartyState.value) {
    IndexTable(details.query); //首页初始化信息
    console.log('首页');
  } else {
    ProcessingPartyFun(details.query); //处理方信息
    console.log('处理方');
  }
};
// 网页顶部搜索按钮
const searchChange = () => {
  if (ClaimStatus.value) {
    // 表示这是理赔查询
    settlementclaim();
    details.search = false; //关闭搜索
    return;
  }

  details.search = false; //关闭搜索
  if (!ProcessingPartyState.value) {
    IndexTable(details.query); //首页初始化信息
  } else {
    ProcessingPartyFun(details.query); //处理方信息
  }
};
// 清空头部搜索
const empty = () => {
  details.columnList.forEach(item => {
    item.values = '';
  });
};
const searchChangeS = () => {
  console.log(details.columnList);
  details.columnList.forEach(item => {
    item.values = '';
  });
  details.search = false; //关闭搜索
  tabValue.value = 0;
  IndexTable(); //首页初始化信息
};
// 网页顶部清空按钮
const searchReset = () => {
  details.query = {};
  IndexTable(details.query);
  details.search = false; //关闭搜索
};
/** 表格表头时间选择 */
const timesc = (index, row) => {
  console.log(index, row);
  if (!!index) {
    index = dayjs(index).format('YYYY-MM-DD');
  }
  details.query[row.prop] = index;
  if (!index) {
    delete details.query[row.prop];
  }
};

/** 表格表头输入框搜索 */
const btnsc = val => {
  console.log(val);
};

/** 表格表头下拉框选择 */
const selectsc = (index, row) => {
  processRowProperty(index, row, details);
  if (TimeoutStatus.value) {
    // 超时列表
    TimeoutHandling(details.query);
    return;
  }
  if (AppealStatus.value) {
    // 申诉列表
    appealFn(details.query);
    return;
  }

  if (ClaimStatus.value) {
    // 这是理赔搜索
    settlementclaim(details.query);
    return;
  }

  if (!ProcessingPartyState.value) {
    IndexTable(details.query); //首页初始化信息
  } else {
    ProcessingPartyFun(details.query); //处理方信息
  }
};

// 反字典公共请求
const Antidictionary = (val, data) => {
  getDictionaryBiz(val).then(res => {
    res.data.data.forEach(item => {
      data.checkarr.push({
        value: item.dictValue,
        label: item.dictValue,
      });
    });
  });
};

function onLoad() {}

/** 表格表头复选框选择 */
const selectionChange = list => {
  console.log(list, '当前选择的数据');
  details.selectionList = list;
};

/** 页码改变执行的回调 */
const currentChange = val => {
  page.value.currentPage = val;

  // 超时
  if (TimeoutStatus.value) {
    TimeoutHandling(details.query);
    return;
  }

  if (AppealStatus.value) {
    // 申诉列表
    appealFn(details.query);
    return;
  }

  if (ClaimStatus.value) {
    // 这是理赔
    settlementclaim(details.query);
    return;
  }

  if (!ProcessingPartyState.value) {
    //表示当前不是处理方
    IndexTable(details.query);
  } else {
    ProcessingPartyFun(details.query);
  }
};
// 每页多少条
const sizeChange = val => {
  page.value.pageSize = val;
  // 超时
  if (TimeoutStatus.value) {
    TimeoutHandling(details.query);
    return;
  }
  if (AppealStatus.value) {
    // 申诉列表
    appealFn(details.query);
    return;
  }

  if (ClaimStatus.value) {
    // 这是理赔
    settlementclaim(details.query);
    return;
  }

  if (!ProcessingPartyState.value) {
    //表示当前不是处理方
    IndexTable(details.query);
  } else {
    ProcessingPartyFun(details.query);
  }
};
const changeProcessingResults = val => {
  // 首先删除取消的项目
  ProcessingList.value = ProcessingList.value.filter(item => val.includes(item.state - 1));

  // 然后添加或保持新的项目
  val.forEach(num => {
    let newItem = { input: '', min: 0, max: 1000, state: num + 1 };
    // 根据num为newItem的name字段赋值
    switch (num) {
      case '0':
        newItem.name = '维修';
        break;
      case '1':
        newItem.name = '补漆';
        break;
      case '2':
        newItem.name = '下补单';
        break;
      case '3':
        newItem.name = '赔付运费';
        break;
      case '4':
        newItem.name = '用库存';
        break;
      case '5':
        newItem.name = '赔商家';
        break;
      case '6':
        newItem.name = '赔客户';
        break;
      default:
        console.log('未知的编号：', num);
        return; // 如果不是我们想处理的num，跳过之后的逻辑
    }

    // 如果列表中不存在则加入新项目
    if (!ProcessingList.value.some(item => item.state === newItem.state)) {
      ProcessingList.value.push(newItem);
      console.log(`添加：${newItem.name}`);
    }
  });
};
// 查询理赔数据
const settlementclaim = val => {
  details.loadingObj.list = true; //开启动画加载
  console.log(Claimsfield, '理赔数据');
  ClaimStatus.value = true; //开启理赔查询状态
  AppealStatus.value = false; //关闭申诉状态
  TimeoutStatus.value = false; //关闭 超时状态
  details.columnList = Claimsfield;
  Claimsfield[3].checkarr = []; //营业部
  Claimsfield[7].checkarr = []; //异常类型名称
  Claimsfield[9].checkarr = []; //发现环节
  getDeptWarehouse({}).then(res => {
    res.data.data.forEach(item => {
      Claimsfield[3].checkarr.push({
        value: item.name,
        label: item.name,
      });
    });
  });

  getDictionaryBiz('pc_work_order').then(res => {
    res.data.data.forEach(item => {
      Claimsfield[7].checkarr.push({
        value: item.dictValue,
        label: item.dictValue,
      });
    });
  });
  getDictionaryBiz('pc_discovery_node').then(res => {
    res.data.data.forEach(item => {
      Claimsfield[9].checkarr.push({
        value: item.dictValue,
        label: item.dictValue,
      });
    });
  });

  // details.columnList    warehouseData.value

  console.log(details, 'details');
  let data = {
    current: details.page.currentPage,
    size: details.page.pageSize,
    ...val,
  };
  console.log(data, '要传递的参数');
  $_listSettlement(data).then(res => {
    details.loadingObj.list = false; //关闭动画加载
    console.log(res, '查询理赔数据');
    details.data = res.data.data.records; //数据
    page.value.total = res.data.data.total;
  });
};
// 获取申诉列表
const appealFn = val => {
  details.loadingObj.list = true; //开启动画加载
  AppealStatus.value = true; //开启申诉列表状态
  TimeoutStatus.value = false; //关闭 超时状态
  ClaimStatus.value = false; //关闭理赔查询状态
  AppealList[5].checkarr = []; //异常类型名称
  AppealList[6].checkarr = []; //发现环节

  Antidictionary('pc_work_order', AppealList[5]);

  Antidictionary('pc_discovery_node', AppealList[6]);
  console.log('当前是申诉列表');
  let data = {
    current: details.page.currentPage,
    size: details.page.pageSize,
    ...val,
  };
  $_listAppeal(data).then(res => {
    details.loadingObj.list = false; //开启动画加载
    console.log(res, '申诉列表返回值');
    details.data = res.data.data.records;
    page.value.total = res.data.data.total;
  });
};

// 申诉列表
const AppealTab = val => {
  if (val == 0) {
    AppealStatusT.value = false; //申诉列表开启
    Tableheaderswitching(columnList); //切换表头
    console.log('处理完毕');
    ProcessingPartyState.value = false; //关闭处理方
    details.query.workOrderStatus = 30;
    ArbitrationStatus.value = false; //不可以申请仲裁
    empty(); //清空搜索数据
    let data = {
      workOrderStatus: 30,
      ...details.query,
    };
    IndexTable(data);
  } else {
    AppealStatusT.value = true; //申诉列表开启
    console.log(val, '切换申诉列表');
    Tableheaderswitching(AppealList); //切换表头
    AppealList.forEach(item => {
      //清空搜索记录
      item.values = '';
    });
    appealFn(); // 获取申诉列表
  }
};
// 超时金额修改
const BtnModifyAmount = val => {
  console.log(val, '超时金额修改');
  dialogModifyAmount.value = true; //开启超时金额弹窗修改
  fromamount.value.title = val.row.workOrderNumber; //工单号
  fromamount.value.ytimeout = val.row.money; //原本金额
  fromamount.value.id = val.row.lawoId; //id
};
// 修改金额确定
const ModifyAmountFn = () => {
  let data = {
    id: fromamount.value.id,
    money: fromamount.value.Amount,
  };
  console.log(data, '准备提交的金额参数');
  $_moneyUpdate(data).then(res => {
    TimeoutHandling();
    console.log(res, '修改成功返回值');
    if (res.data.code == 200) {
      ElMessage({
        message: res.data.msg,
        type: 'success',
      });
    }
    dialogModifyAmount.value = false; //关闭超时金额弹窗修改
  });
};
// 查询超时记录
const TimeoutHandling = val => {
  timeoutList[3].checkarr = []; //异常类型名称
  timeoutList[4].checkarr = []; //发现环节
  ClaimStatus.value = false; //关闭理赔查询状态
  AppealStatus.value = false; //关闭申诉状态
  TimeoutStatus.value = true; //开启超时记录查询
  details.loadingObj.list = true; //开启动画加载
  Antidictionary('pc_work_order', timeoutList[3]);
  Antidictionary('pc_discovery_node', timeoutList[4]);
  let data = {
    current: details.page.currentPage,
    size: details.page.pageSize,
    ...val,
  };
  $_listOwn(data).then(res => {
    details.loadingObj.list = false; //开启动画加载
    console.log(res, '超时记录');
    details.data = res.data.data.records;
    page.value.total = res.data.data.total;
  });
};

// 标签栏触发
const tabChenge = val => {
  TabPermissions.value = val; //记录当前点击的菜单
  AppealStatusT.value = false; //申诉列表开启
  console.log(val, '触发了标签栏');
  let data = {};
  if (val == 0) {
    ProcessingPartyState.value = false; //关闭处理方
    details.query.workOrderStatus = null;
    ArbitrationStatus.value = false; //不可以申请仲裁
    Tableheaderswitching(columnList);
    IndexTable();
    empty();
    console.log('全部');
  } else if (val == 1) {
    // 处理中
    if (UserPermissions.value == '仓库客服') {
      data.workOrderStatus = 20;
      details.query.workOrderStatus = 20;
      Tableheaderswitching(columnList);
      empty();
      ProcessingPartyFun(data);
    } else {
      data.workOrderStatus = 40;
      details.query.workOrderStatus = 40;
      Tableheaderswitching(columnList);
      empty();
      IndexTable(data);
    }
    ProcessingPartyState.value = false; //关闭处理方
    ArbitrationStatus.value = true; //可以申请仲裁
  } else if (val == 2) {
    if (UserPermissions.value == '仓库客服') {
      data.workOrderStatus = 30;
      details.query.workOrderStatus = 30;
      Tableheaderswitching(columnList);
      empty();
      ProcessingPartyFun(data);
    } else {
      data.workOrderStatus = 50;
      details.query.workOrderStatus = 50;
      Tableheaderswitching(columnList);
      empty();
      IndexTable(data);
    }
    // 处理完毕
    ProcessingPartyState.value = false; //关闭处理方
    ArbitrationStatus.value = false; //不可以申请仲裁
  } else if (val == 3) {
    console.log(UserPermissions.value, '当前身份');
    if (UserPermissions.value == '仓库客服') {
      data.workOrderStatus = 10;
      details.query.workOrderStatus = 10;
      ArbitrationStatus.value = true; //可以申请仲裁
      Tableheaderswitching(columnList);
      empty();
      ProcessingPartyFun(data); //单独接口
    } else {
      console.log('待处理');
      ProcessingPartyState.value = true; //开启处理方
      data.workOrderStatus = 30;
      details.query.workOrderStatus = 30;
      ArbitrationStatus.value = true; //可以申请仲裁
      Tableheaderswitching(columnList);
      empty();
      IndexTable(data);
    }
  } else if (val == 4) {
    ProcessingPartyState.value = false; //关闭处理方
    // 理赔金额未出
    details.query.workOrderStatus = null;
    ArbitrationStatus.value = false; //不可以申请仲裁
    Tableheaderswitching(Claimsfield); //切换表格
    empty();
    settlementclaim();
  } else if (val == 5) {
    // 仲裁中
    ProcessingPartyState.value = false; //关闭处理方
    data.workOrderStatus = 70;
    details.query.workOrderStatus = 70;
    ArbitrationStatus.value = false; //不可以申请仲裁
    Tableheaderswitching(columnList); //表头切换
    empty();
    IndexTable(data);
  } else if (val == 6) {
    // 完结
    ProcessingPartyState.value = false; //关闭处理方
    data.workOrderStatus = 80;
    details.query.workOrderStatus = 80;
    ArbitrationStatus.value = false; //不可以申请仲裁
    Tableheaderswitching(columnList); //表头切换
    empty();
    IndexTable(data);
  } else if (val == 7) {
    // 超时未处理
    ProcessingPartyState.value = false; //关闭处理方
    data.workOrderStatus = null;
    details.query.workOrderStatus = '';
    ArbitrationStatus.value = false; //不可以申请仲裁
    Tableheaderswitching(timeoutList); //表头切换
    empty();
    TimeoutHandling(); //调用超时未出理
  }
};
/**
 * 设置列表 -- 固定函数
 * 弹窗的勾选回调，用于更改头部数组
 * 固定搭配，只需要更换   columnList
 *  */
const setnewcolum = (newarr, headarr, type) => {
  if (type == 1) {
    details.columnList = newarr;
    functions.setStorage(window.location.pathname + 'checkList', headarr);
  } else if (type == 2) {
    details.columnList = newarr;
    functions.setStorage(window.location.pathname + 'flexList', headarr);
  } else if (type == 3) {
    details.columnList = newarr;
    functions.setStorage(window.location.pathname + 'sortlist', headarr);
  }
};
/** 展开列表控件 */
const showdrawer = _flag => {
  details.drawerShow = _flag;
};

// 处理方数据公共函数
const ProcessingPartyFun = val => {
  ClaimStatus.value = false; //关闭理赔状态
  TimeoutStatus.value = false; //关闭超时
  AppealStatus.value = false; //关闭申诉状态
  details.query.workOrderStatus = null;
  details.loadingObj.list = true; //开启动画加载
  let data = {
    ...val,
  };
  console.log(val, 'val接收的参数');
  columnList[2].checkarr = []; //重置下拉搜索框
  columnList[3].checkarr = [];

  data.current = page.value.currentPage; //页码
  data.size = page.value.pageSize; //条数
  updateDictionary(columnList[2].checkarr, 'pc_work_order'); //异常类型
  updateDictionary(columnList[3].checkarr, 'pc_discovery_node'); //发现环节
  $_getProcessor(data).then(res => {
    details.loadingObj.list = false; //关闭动画加载
    page.value.total = res.data.data.total; //总页数
    if (res.data.data.records.length) {
      res.data.data.records.forEach(item => {
        // 对为null的数据进行处理
        for (const property in item) {
          if (item[property] == null) {
            item[property] = '/';
          }
        }
        // 对状态进行处理
        if (item.workOrderType == 1) {
          item.workOrderTypeNameS = columnList[2].checkarr[0].label; //货损
        } else if (item.workOrderType == 2) {
          item.workOrderTypeNameS = columnList[2].checkarr[1].label; //少货
        } else if (item.workOrderType == 3) {
          item.workOrderTypeNameS = columnList[2].checkarr[2].label; //窜货
        } else if (item.workOrderType == 4) {
          item.workOrderTypeNameS = columnList[2].checkarr[3].label; //加急
        } else if (item.workOrderType == 5) {
          item.workOrderTypeNameS = columnList[2].checkarr[4].label; //其他
        }
        // 提货环节下拉赋值
        if (item.discoveryNode == 1) {
          item.discoveryNodeNameS = columnList[3].checkarr[0].label; //提货环节
        } else if (item.discoveryNode == 2) {
          item.discoveryNodeNameS = columnList[3].checkarr[1].label; //发货环节
        } else if (item.discoveryNode == 3) {
          item.discoveryNodeNameS = columnList[3].checkarr[2].label; //干线卸车环节
        } else if (item.discoveryNode == 4) {
          item.discoveryNodeNameS = columnList[3].checkarr[3].label; //库内作业环节
        } else if (item.discoveryNode == 5) {
          item.discoveryNodeNameS = columnList[3].checkarr[4].label; //配送装车环节
        } else if (item.discoveryNode == 6) {
          item.discoveryNodeNameS = columnList[3].checkarr[5].label; //其他
        } else if (item.discoveryNode == 7) {
          item.discoveryNodeNameS = columnList[3].checkarr[6].label; //配送签收环节
        } else if (item.discoveryNode == 8) {
          item.discoveryNodeNameS = columnList[3].checkarr[7].label; //安装环节
        }
      });
      details.data = res.data.data.records;
      console.log(details.data, '存储的数据');
    } else {
      details.data = res.data.data.records; //这里是空的
    }
    loading.value = false; //关闭加载效果
  });
};

// 获取聊天记录
const FKList = () => {
  iconState.value = true;
  let data = { workOrderId: ListRow.value.id };
  $_getExchangeList(data).then(res => {
    iconState.value = false;
    console.log(res, '查询的值');
    ChatHistory.value = res.data.data;
    setTimeout(() => {
      const container = scrollContainer.value;
      if (container) {
        container.scrollTop = container.scrollHeight;
      }
    }, 0);
  });
};
// 点击回复按钮
const reply = val => {
  $router.push({
    path: '/aftersales/customerService',
    query: {
      row: JSON.stringify(val.row),
    },
  });
  return;
  console.log(val, 'ID++++++++');
  console.log(val.row);
  dialogcustomerService.value = true; //开启回复弹窗
  ListRow.value = val.row; //存储当前行点击数据
  FKList();
};
// 处理方数据
const ProcessingParty = () => {
  ProcessingPartyState.value = true; //开启处理方
  ProcessingPartyFun();
};
// 消息发送函数
const messagesendFn = () => {
  iconState.value = true;
  let data = {
    workOrderId: ListRow.value.id,
    businessName: Mydata.value.departmentName,
    businessId: Mydata.value.id,
    content: KFinput.value,
    warehouseId: ListRow.value.warehouseId,
    annex: KFfeel.value,
  };
  console.log(data, '处理好的数据');

  $_AddReply(data).then(res => {
    // 获取当前时间
    const currentTime = new Date();
    // 获取年、月、日、小时、分钟、秒
    const year = String(currentTime.getFullYear());
    const month = String(currentTime.getMonth() + 1).padStart(2, '0');
    const day = String(currentTime.getDate()).padStart(2, '0');
    const hours = String(currentTime.getHours()).padStart(2, '0');
    const minutes = String(currentTime.getMinutes()).padStart(2, '0');
    const seconds = String(currentTime.getSeconds()).padStart(2, '0');
    // 拼接时间字符串
    const formattedTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    console.log(res, '添加成功');
    if (res.data.code == 200) {
      // 添加成功
      iconState.value = false;
      ChatHistory.value.push({
        businessId: Mydata.value.id,
        businessName: Mydata.value.departmentName,
        content: KFinput.value,
        createTime: formattedTime,
      });
      // 滚动到最后
      setTimeout(() => {
        const container = scrollContainer.value;
        if (container) {
          container.scrollTop = container.scrollHeight;
        }
      }, 0);
      KFinput.value = ''; //清空内容
      KFfeel.value = null; //清空文件
    }
  });
  console.log(Mydata.value, '参数');
};
// 发送按钮
const messagesend = () => {
  messagesendFn();
};
// 客服刷新按钮
const KFRefresh = () => {
  FKList();
};
// 输入框回车
const inputEnter = () => {
  messagesendFn();
};
// 图片上传必须携带TOKEN
const headers = computed(() => {
  return { 'Blade-Auth': 'Bearer ' + getToken() };
});

// 图片上传接口
const doubledCount = computed(() => {
  return '/api/blade-resource/oss/endpoint/put-file';
});
// 附件上传成功
const fellSuccess = (response, uploadFile) => {
  console.log('上船成功');
  console.log(response, uploadFile);
  if (response.data.link) {
    KFfeel.value = response.data.link;
  }
};
// 批量打回
const BatchReturn = () => {
  BatchFrom.value.businessDepartment = [];
  BatchFrom.value.txt = null;
  if (!details.selectionList.length) {
    ElMessage({
      message: '请勾选要打回的数据',
      type: 'warning',
    });
    return;
  }
  dialogReturn.value = true;
  console.log(details.selectionList, '选中的参数');
};
// 批量打回确定按钮
const ConfirmReturn = () => {
  repulse.value = true; //开启加载并关闭按钮
  let data = {
    processorList: [],
  };
  // 过滤满足条件的对象
  let foundObjs = warehouseData.value.filter(obj =>
    BatchFrom.value.businessDepartment.includes(obj.value)
  );
  data['businessId'] = foundObjs.map(item => item.value).join(',');
  data['businessName'] = foundObjs.map(item => item.label).join(',');
  // 营业部处理
  foundObjs.forEach(item => {
    data['processorList'].push({ id: item.value, name: item.label });
  });
  data.reasonReturn = BatchFrom.value.txt; //打回原因
  // data.warehouseId = details.selectionList.map(item=>item.warehouseId); //仓库ID
  data.workOrderIds = details.selectionList.map(item => item.id); //异常工单ID
  console.log(data, '处理好的值');
  $_batchReturn(data)
    .then(res => {
      repulse.value = false; //关闭加载并关闭按钮
      dialogReturn.value = false; //关闭打回弹窗
      IndexTable(); //首页初始化信息
      console.log(res, '批量打回返回值');
      if (res.data.code == 200) {
        ElMessage({
          message: res.data.msg,
          type: 'success',
        });
      }
    })
    .catch(error => {
      repulse.value = false; //关闭加载并关闭按钮
      dialogReturn.value = false; //关闭打回弹窗
    });
};
// 工单指派
const assign = () => {
  if (!details.selectionList.length) {
    ElMessage({
      message: '请勾选工单数据',
      type: 'warning',
    });
    return;
  }
  $_getCustomerServicePersonnel({})
    .then(res => {
      console.log(res, '客服列表');
      customerService.value = res.data.data;
    })
    .catch(error => {
      console.log(error, '客服列表错误');
    });
  assignFrom.value = {}; //清空内容
  dialogassign.value = true; //开启指派工单弹窗
};
// 工单指派确定按钮
const Assignbutton = () => {
  AssignLoad.value = true; //开启加载和按钮禁止重复点击
  let foundObjs = customerService.value.find(obj => obj.id == assignFrom.value.businessDepartment); //筛选选择的工单
  let data = {
    assignList: [],
  };
  data.customerServiceId = foundObjs.id; //归属客服ID
  data.customerServiceName = foundObjs.realName; //归属客服名称
  data['assignList'] = details.selectionList.map(item => item.id); //异常工单ID//工单ID
  console.log(data, '处理好的值');
  $_assignCustomerService(data)
    .then(res => {
      AssignLoad.value = false; //关闭加载和按钮禁止重复点击
      dialogassign.value = false; //关闭指派工单弹窗
      console.log(res, '工单指派返回');
      IndexTable(); //首页初始化信息
      if (res.data.code == 200) {
        ElMessage({
          message: res.data.msg,
          type: 'success',
        });
      }
    })
    .catch(error => {
      AssignLoad.value = false; //关闭加载和按钮禁止重复点击
      dialogassign.value = false; //关闭指派工单弹窗
    });
};
// 申请仲裁
const arbitrate = () => {
  // 处理中，待处理可申请
  if (!details.selectionList.length) {
    console.log('当前没有数据');
    ElMessage({
      message: '请勾要仲裁的数据',
      type: 'warning',
    });
    return;
  }
  let data = {
    assignList: [],
  };

  console.log(details.selectionList, '仲裁选中的参数');
  details.selectionList.forEach(item => {
    data['assignList'].push(item.id);
  });
  if (!ArbitrationStatus.value) {
    ElMessage({
      message: '当前状态不可申请仲裁',
      type: 'warning',
    });
  } else {
    console.log(data, '仲裁处理好的参数');
    // 发送请求
    $_arbitrate(data).then(res => {
      console.log(res, '仲裁成功返回值');
      empty();
      PagerefreshPublic();
      if (res.data.code == 200) {
        ElMessage({
          message: res.data.msg,
          type: 'success',
        });
      }
    });
  }
};
// 页面刷新公共函数
const PagerefreshPublic = () => {
  console.log('执行了页面刷新公共函数');
  if (ProcessingPartyState.value && ArbitrationStatus.value) {
    ProcessingPartyFun();
  } else {
    IndexTable(); //刷新页面
  }
};
// 添加赔款方
const AddCompensation = () => {
  console.log('添加赔款方');
  let som = 1;
  CompensationParty.value.forEach(item => {
    if (item.state == 0) {
      som++;
    }
  });
  CompensationParty.value.push({ name: '', state: 0, num: 0, reason: '', cld: som });
};
// 添加收款方
const AddPayee = () => {
  let som = 1;
  CompensationParty.value.forEach(item => {
    if (item.state == 1) {
      som++;
    }
  });
  CompensationParty.value.push({ name: '', state: 1, num: 0, reason: '', cld: som });
};
// 移除按钮
const payremove = (state, val) => {
  // 判断赔付方，至少保留一条数据
  let som = 0;
  if (state == 0) {
    CompensationParty.value.forEach(item => {
      if (item.state == 0) {
        som++;
      }
    });
    if (som == 1) {
      ElMessage({
        message: '赔款必填最少一条',
        type: 'warning',
      });
      return;
    }
  }
  CompensationParty.value.splice(val, 1);
  console.log('CompensationParty :>> ', CompensationParty);
  amountMoney();
};
// 金额输入汇总
const amountMoney = () => {
  // 计算赔款金额总数
  TotalamountCompensation.value = 0;
  TotalamountReceived.value = 0;
  CompensationParty.value.forEach(item => {
    const _num = isNumer(item.num) ? item.num : 0;
    // 统计赔款方【0】
    if (item.state == 0) {
      TotalamountCompensation.value = computeNumber(
        TotalamountCompensation.value,
        '+',
        _num
      ).result;
    }
    // 统计收款方金额【1】
    if (item.state == 1) {
      TotalamountReceived.value = computeNumber(TotalamountReceived.value, '+', _num).result;
    }
  });
  console.log('赔款总计金额', TotalamountCompensation.value);
  console.log('收款总计金额', TotalamountReceived.value);
};

// 批量完结
const Batchcompletion = () => {
  console.log(details.selectionList);
  // 完结的逻辑
  if (!details.selectionList.length) {
    ElMessage({
      message: '请先勾选要处理的数据',
      type: 'warning',
    });
    return;
  }
  dialogBatchcompletion.value = true; //开启批量完结弹窗
};

// 批量提交
const CompletedSubmission = () => {
  PLloading.value = true; //开启处理加载效果
  console.log(CompensationParty.value);
  let pay = CompensationParty.value.find(item => item.cld == 1);
  console.log(pay);
  if (!pay.name || pay.num == null || !pay.reason) {
    ElMessage({
      message: '请填写赔款方完整信息',
      type: 'warning',
    });
    return;
  }
  if (!Reasonarbitration.value) {
    ElMessage({
      message: '请填写仲裁原因',
      type: 'warning',
    });
    return;
  }
  console.log(CompensationParty.value, 'CompensationParty赔款列表');
  console.log(details.selectionList, '选中的参数');

  // 初始化data数组，其结构对应于details.selectionList的长度
  let data = details.selectionList.map(() => ({
    completionRecipientEntities: [],
    completionRecordEntities: [],
  }));
  console.log(data, '初始值');
  // 填充data数组
  details.selectionList.forEach((selection, index) => {
    CompensationParty.value.forEach(party => {
      // 根据state值创建不同类型的对象填充到相应的数组中
      if (party.state === 0) {
        // 赔款方信息对象
        const record = {
          indemnitor: party.name,
          reason: party.reason,
          money: Number(party.num),
          reasonArbitration: Reasonarbitration.value,
          workOrderId: selection.id,
          warehouseId: selection.warehouseId,
        };
        // 将赔款方信息添加到对应的completionRecordEntities数组中
        data[index].completionRecordEntities.push(record);
      } else {
        // 收款方信息对象
        const recipient = {
          recipient: party.name,
          reasonReceivingPayment: party.reason,
          money: Number(party.num),
          responsibleParty: '', //
          workOrderNumber: selection.workOrderNumber,
          workOrderId: selection.id,
          warehouseId: selection.warehouseId,
        };
        // 将收款方信息添加到对应的completionRecipientEntities数组中
        data[index].completionRecipientEntities.push(recipient);
      }
    });
  });
  // 赔款方
  console.log(data, '处理好的值');
  $_addCompletionEnd(data).then(res => {
    PagerefreshPublic();
    PLloading.value = false; //关闭处理加载效果
    dialogBatchcompletion.value = false; //关闭弹窗
    console.log(res, '完结成功返回值');
    if (res.data.code) {
      ElMessage({
        message: res.data.msg,
        type: 'success',
      });
    }
  });
};
</script>

<style scoped lang="scss">
.el-card {
  height: 100%;
  :deep(.el-card__body) {
    height: 100%;
    display: flex;
    flex-direction: column;
  }
}
.page {
  height: 30px;
  flex: 1;
  display: flex;
  align-items: flex-end;
  padding-bottom: 14px;
  justify-content: flex-end;
}
:deep(.el-Cart-button) {
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
}
.el-Cart-button-right {
  display: flex;
  margin: 0 0px;
  justify-content: space-between;
}
.el-Cart-button-right {
  display: flex;
  margin: 0 0px;
  justify-content: space-between;
  align-items: center;
  button {
    background-color: transparent;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ccc;
    margin-right: 8px;

    &:hover {
      background-color: #172e601f;
      i {
        color: #0e2549;
      }
    }
    // 去掉最后一个按钮右侧边距
    &:last-child {
      margin-right: 0;
    }
  }
}
.IndexFrom {
  display: flex;
  flex-wrap: wrap;
  .el-form-item {
    margin: 10px;
    width: 31%;
    height: 46px;
    display: flex;
    align-items: center;
  }
  .el-form-item__content {
    .el-input {
      height: 36px;
      width: 206px;
    }
  }
  .el-input__wrapper {
    height: 32px !important;
  }
  :deep(.el-input) {
    width: 100% !important;
  }
  :deep(.el-input__wrapper) {
    height: 30px !important;
  }
  :deep(.el-select) {
    width: 100%;
  }
}
.Transport_damage_photos {
  padding: 6px;
  .title {
    font-size: 14px;
    margin-bottom: 9px;
    display: block;
  }
}
.endClass {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  .el-form-item {
    margin: 6px;
    width: 32%;
  }
  .el-select {
    width: 100%;
  }
  :deep(.el-input) {
    width: 100%;
  }
  :deep(.el-input__wrapper) {
    height: 26px;
  }
  .Transport_damage_photos {
    .title {
      font-size: 14px;
    }
  }
}
.ProcessingResults {
  width: 100%;
  height: 260px;
  border: 1px solid #ccc;
  position: relative;
  padding: 26px;
  box-sizing: border-box;
  margin-top: 20px;
  .title {
    position: absolute;
    top: -20px;
    left: 20px;
    font-size: 26px;
    background-color: #fff;
  }
}
.selector {
  display: flex;
  width: 100%;
  padding: 16px;
  padding-left: 6px;
  .title {
    width: 108px;
  }
}
.Listadmiration {
  display: flex;
  flex-wrap: wrap;
  .name {
    display: flex;
    margin: 10px 5%;
    span {
      display: block;
      width: 90px;
    }
  }
}
.ElBtnClass {
  button {
    border: none;
    padding: 0;
    background-color: transparent;
  }
  button:hover {
    background-color: transparent;
  }
}
:deep(.el-card) {
  height: 100%;
}
.avue-crud {
  height: 100%;
  display: flex;
  flex-direction: column;
}
:deep(.el-card__body) {
  height: 100%;
}
.lptime {
  margin-top: 30px;
  padding-left: 60px;
  display: flex;
  flex-direction: column;
  font-size: 14px;
  :deep(.el-input__wrapper) {
    height: 30px;
  }
  .name {
    margin-bottom: 10px;
  }
}
.recordCl {
  height: 200px;
  overflow-y: scroll;
}
.el_Completion {
  padding: 10px 0;
  .title {
    font-size: 14px;
  }
}
.el-ckbtn {
  margin-top: 10px;
}
.payanindemnity {
  display: flex;
  align-items: center;
  margin-top: 20px;
  .title {
    width: 76px;
    height: 100%;
    display: flex;
    display: block;
    align-items: center;
  }
  .sk_input {
    margin: 0 5px;
    width: 300px;
  }
  .el-button {
    background-color: #ff0000;
    border: none;
  }
}
.el_clzr {
  padding: 0 18px;
  padding-left: 8px;

  :deep(.el-select) {
    width: 100%;
  }
  :deep(.el-input) {
    height: 38px;
  }
}
.el-fy {
  flex: 1;
  display: flex;
  align-items: flex-end;
  margin-bottom: 10px;
}
.el-times {
  :deep(.el-input__wrapper) {
    height: 30px !important;
  }
}
.el_tims_box {
  display: flex;
}
.el-fr-d {
  margin: 6px 0px;
}
.el-btn {
  width: 100%;
}
:deep(.el-card) {
  box-shadow: none;
}
.content_max {
  display: flex;
  height: 100%;
}
.content_right {
  flex: 1;
  height: 100%;
  width: 100%;
}
.el_times {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-between;
  :deep(.el-form-item) {
    margin: 0;
    align-items: center;
    .el-form-item__label {
      margin-left: 20px;
    }
  }
}
.topText {
  width: 70%;
}
.content {
  width: 100%;
  height: 300px;
  overflow-y: scroll;
  scroll-behavior: smooth;
  /* 添加平滑滚动效果 */
  border-radius: 5px;
  .YH {
    width: 100%;
    min-height: 50px;
    margin: 4px 0;
    display: flex;
    flex-direction: row;
    .box {
      width: 386px;
      height: 100%;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      .name {
        display: flex;
        flex-direction: column;
        span {
          display: flex;
          justify-content: flex-start;
          padding-left: 10px;
          margin-bottom: 10px;
        }
        .time {
          display: flex;
          justify-content: flex-end;
          padding: 0 10px;
          margin-top: 4px;
        }
      }
    }
    .input {
      border: 1px solid;
      width: 300px;
      min-height: 30px;
      box-sizing: border-box;
      border-radius: 8px;
      padding: 8px;
      margin: 0 6px;
      text-indent: 2em;
      position: relative;
      .ico {
        position: absolute;
        right: -6%;
        bottom: 0;
      }
    }
  }
  .KF {
    width: 100%;
    min-height: 50px;
    margin: 4px 0;
    display: flex;
    justify-content: flex-end;
    .box {
      width: 386px;
      height: 100%;
      display: flex;
      flex-direction: row-reverse;
      justify-content: space-between;
      .name {
        display: flex;
        flex-direction: column;
        span {
          display: flex;
          justify-content: flex-end;
          padding-right: 10px;
          margin-bottom: 10px;
        }
        .time {
          display: flex;
          justify-content: flex-start;
          padding: 0 10px;
          margin-top: 4px;
        }
      }
    }
    .input {
      border: 1px solid;
      width: 300px;
      min-height: 30px;
      box-sizing: border-box;
      border-radius: 8px;
      padding: 8px;
      margin: 0 6px;
      text-indent: 2em;
      position: relative;
      .ico {
        position: absolute;
        left: -16%;
        bottom: 0;
      }
    }
  }
  .TX {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    border: 1px solid #ccc;
    background: url('../../../public/img/tx.png') no-repeat;
    background-size: cover;
  }
}
.inputTextarea {
  margin-top: 50px;
  display: flex;
  align-items: flex-end;
  .fell {
    width: 100%;
    .el-upload-list {
      display: none;
    }
  }
}
.btn_fs {
  margin-left: 50px;
}
.felltis {
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
  border: 1px dashed;
  padding: 0 4px;
  border-radius: 3px;
}
.el_fk {
  .my-header {
    display: flex;
    justify-content: space-between;
    margin-right: 25px;
  }
  .el-dialog__title {
    margin: 0;
  }
}
.plAllret {
  :deep(.el-select) {
    width: 100%;
  }
  .el-select {
    width: 100%;
  }
}

:deep(.is-active) {
  font-weight: bold !important;
}
.Improveinformation {
  width: 100%;
  :deep(.custom-tabs-label) {
    display: flex;
    align-items: center;
  }
  :deep(.el-tab-pane) {
    padding: 10px;
  }
}
.paySum {
  margin-top: 36px;
  font-size: 14px;
  display: flex;
  justify-content: space-between;
  .sum {
    display: flex;
  }
  span {
    margin-right: 30px;
    display: flex;
    align-items: center;
  }
}
:deep(.el_Batchcompletion) {
  height: 745.6px;
  overflow-y: scroll;
  margin: 0;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.el_btn {
  display: flex;
  justify-content: flex-end;
}
:deep(.el_tabs) {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  .el-tabs__content {
    padding: 0;
    flex: 1;
  }
  .el-tabs__header {
    height: 37px;
    width: 100%;
  }
}
:deep(.avue-crud__pagination) {
  padding-top: 2px !important;
}
.arbitrate {
  margin-top: 36px;
  .el_btn {
    margin-top: 10px;
  }
  :deep(.el-tabs__content) {
    padding: 0 !important;
    flex: 1;
  }
}
.el_appeal {
  :deep(.el-select) {
    width: 100% !important;
    margin-bottom: 10px;
  }
}
.el_sdialog-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
}
:deep(.avue-crud__header) {
  align-items: center;
}
.el_amount {
  display: flex;
  justify-content: space-between;
}
</style>