logpm_page/src/views/aftersales/aftersalesWorkOrderTemp.vue

<template>
  <basic-container v-loading="PageLoading" element-loading-text="数据正在加载中...">
    <!-- 首页表格 -->
    <div class="avue-crud">
      <!-- 搜索模块 -->
      <div v-h5uShow="search">
        <!-- 查询模块 -->
        <el-form :inline="true" :model="TopQuery" class="el-fr-d">
          <el-form-item label="工单号" class="el-times">
            <div class="el_div_input">
              <el-input
                type="text"
                clearable
                v-model="TopQuery.workOrderNumber"
                placeholder="请输入工单号"
              /><el-icon @click="MultilineSearch('工单号搜索', TopQuery.workOrderNumber)"
                ><CirclePlusFilled
              /></el-icon>
            </div>
          </el-form-item>
          <el-form-item label="订单自编号" class="el-times">
            <div class="el_div_input">
              <el-input
                clearable
                type="text"
                v-model="TopQuery.orderCode"
                placeholder="请输入订单自编号"
              /><el-icon @click="MultilineSearch('订单自编号搜索')"><CirclePlusFilled /></el-icon>
            </div>
          </el-form-item>
          <!-- <el-form-item label="配送日期">
            <el-date-picker
              v-model="TopQuery.time"
              type="datetimerange"
              unlink-panels
              range-separator="至"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              :shortcuts="shortcuts"
              :default-time="defaultTime2"
            />
          </el-form-item> -->
          <!-- 查询按钮 -->
          <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>
      </div>
      <el-tabs type="border-card" v-model="tabValue" @tab-change="tabChenge" class="el_tabs">
        <div></div>
        <template v-for="item in TabList">
          <el-tab-pane v-if="item.state" :name="item.name" :label="item.label" :key="item.name">
          </el-tab-pane>
        </template>
      </el-tabs>
      <!-- 控件模块 -->
      <el-row>
        <div class="avue-crud__header">
          <!-- 头部左侧按钮模块 -->
          <div class="avue-crud__left">
            <el-button
              type="primary"
              icon="Edit"
              v-if="ButtonPermissions.add"
              @click="CreateworkOrder"
              >创建工单</el-button
            >
            <el-button type="primary" icon="Download" v-if="ButtonPermissions.export_Report"
              >Excel导出</el-button
            >
            <el-button type="primary" icon="Download" v-if="ButtonPermissions.Timed_outexport"
              >Excel超时导出</el-button
            >
            <el-button type="primary" icon="Avatar" v-if="ButtonPermissions.defaultassignments"
              >默认指派</el-button
            >
            <el-button
              type="primary"
              icon="CloseBold"
              v-if="ButtonPermissions.batchReject"
              @click="BatchReturnResults"
              >结果批量打回</el-button
            >
            <el-button type="primary" icon="FolderChecked" v-if="ButtonPermissions.ManagerConfirmed"
              >完结批量审核</el-button
            >
            <el-button
              @click="ResultConfirmed"
              type="primary"
              icon="Select"
              v-if="ButtonPermissions.Batchdetermination"
              >批量处理结果提交</el-button
            >
            <el-button type="primary" icon="Stamp" v-if="ButtonPermissions.Result_review"
              >结果批量审核</el-button
            >
            <el-button
              type="primary"
              icon="Pointer"
              v-if="ButtonPermissions.assignment"
              @click="WorkOrderAssignment"
              >工单指派</el-button
            >
            <el-button type="primary" icon="User" v-if="ButtonPermissions.applyArbitration"
              >客服介入</el-button
            >
            <el-button type="primary" icon="EditPen" v-if="ButtonPermissions.DingTalkNumber"
              >钉钉号填写</el-button
            >
            <el-button type="primary" icon="Stamp" v-if="ButtonPermissions.batchFinish"
              >批量完结</el-button
            >
            <el-button type="primary" icon="Stamp" v-if="ButtonPermissions.ArbitrationDetermination"
              >批量完结审核</el-button
            >
            <el-button type="primary" icon="Coin" v-if="ButtonPermissions.Financial_accounting"
              >财务入账</el-button
            >
          </div>
          <!-- 头部右侧按钮模块 -->
          <div class="avue-crud__right">
            <el-tooltip content="刷新数据" placement="top">
              <el-button icon="el-icon-refresh" @click="searchChangeS" circle></el-button>
            </el-tooltip>

            <el-tooltip content="重置表格搜索" placement="top">
              <el-button icon="CircleClose" @click="ResetTableSearch" circle></el-button>
            </el-tooltip>

            <el-tooltip content="表格设置" placement="bottom">
              <el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
            </el-tooltip>

            <el-tooltip content="高级搜索" placement="bottom">
              <el-button icon="Search" @click="searchHide" circle></el-button>
            </el-tooltip>
          </div>
        </div>
      </el-row>

      <!-- 首页表格 -->
      <el-row>
        <!-- 列表模块 -->
        <tablecmt
          class="tableNode"
          :columnList="details.columnListPublic"
          :tableData="data"
          :loading="loadingObj.list"
          @inputTxt="inputsc"
          @timeCheck="timesc"
          @selectCheck="selectsc"
          @selection="selectionChange"
        >
          <template #default="slotProps">
            <template v-if="slotProps.scope.column.label === '异常工单号'">
              <el-text class="el_textBtn" @click="ViewDetailsRow(slotProps.scope.row)">
                {{
                  slotProps.scope.column.label === '异常工单号'
                    ? slotProps.scope.row.workOrderNumber
                    : ''
                }}
              </el-text>
            </template>

            <template v-if="slotProps.scope.column.label === '操作'">
              <el-text @click="ViewDetails(slotProps.scope.row)">查看</el-text>

              <el-text
                @click="WorkOrderAppeal(slotProps.scope.row)"
                v-if="PermissionButton.Work_order_appeal(slotProps.scope.row)"
                >申诉</el-text
              >
              <el-text
                v-if="PermissionButton.Process_submission_button"
                @click="ResultConfirmed(slotProps.scope.row)"
                >处理提交</el-text
              >
              <el-text
                @click="CancelWorkOrderAppeal(slotProps.scope.row)"
                v-if="PermissionButton.Cancel_appeal_button(slotProps.scope.row)"
                >取消申诉</el-text
              >
              <el-text
                v-if="PermissionButton.Appeal_editor_button(slotProps.scope.row)"
                @click="WorkOrderAppeal(slotProps.scope.row, 'edit')"
                >编辑</el-text
              >
              <el-text
                v-if="PermissionButton.Delete_appeal_button(slotProps.scope.row)"
                @click="Deleteappealrecords(slotProps.scope.row, 'edit')"
                >删除记录</el-text
              >
            </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="[1, 2, 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="appeal.dialogappeal"
      :title="appeal.AppealeditorState ? '工单申述编辑' : '工单申诉'"
      width="60%"
    >
      <el-form ref="appealruleFormRef" :model="appeal" :rules="appealrules">
        <div class="el_appeal" v-loading="appeal.loadingappeal" element-loading-text="Loading...">
          <el-form-item label="选择实际责任方" prop="Appealselection">
            <el-select
              v-model="appeal.Appealselection"
              clearable
              filterable
              multiple
              placeholder="请选择实际责任方"
            >
              <el-option
                v-for="item in warehouseData"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="申诉原因" prop="Reasonforappeal">
            <el-input
              v-model="appeal.Reasonforappeal"
              :rows="4"
              type="textarea"
              placeholder="请输入申诉原因"
            />
          </el-form-item>
          <el-form-item label="照片(上传一张)">
            <el-upload
              v-model:file-list="appeal.AppealAttachment"
              list-type="picture-card"
              :action="doubledCount"
              :before-upload="beforeAvatarUpload"
              :headers="headers"
              multiple
              drag
            >
              <el-icon><Plus /></el-icon>
            </el-upload>
          </el-form-item>

          <span class="el_sdialog-footer">
            <el-button @click="appeal.dialogappeal = false">取消</el-button>
            <el-button type="primary" @click="Appealbutton"> 确定 </el-button>
          </span>
        </div>
      </el-form>
    </el-dialog>
    <!-- 处理结果批量打回弹窗 -->
    <el-dialog v-model="BatchReturn.dialogReturn" title="批量打回" width="40%" class="plAllret">
      <el-form
        v-loading="BatchReturn.repulseloading"
        element-loading-text="正在打回中..."
        label-position="top"
        label-width="100px"
        :model="BatchReturn.BatchFrom"
        :rules="BatchReturn.rules"
        ref="batchReturnForm"
      >
        <el-form-item label="打回原因" prop="txt">
          <el-input
            v-model="BatchReturn.BatchFrom.txt"
            type="textarea"
            :rows="4"
            placeholder="请输入打回原因"
          />
        </el-form-item>

        <el-form-item label="流转营业部" prop="businessDepartment">
          <el-select
            v-model="BatchReturn.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="BatchReturn.BatchReturn.dialogReturn = false">取消</el-button>
          <el-button type="primary" @click="ConfirmReturn()" :disabled="BatchReturn.repulseloading">
            提交
          </el-button>
        </span>
      </template>
    </el-dialog>
    <!-- 工单指派弹窗 -->
    <el-dialog v-model="assignFrom.dialogassign" title="工单指派" width="40%" class="plAllret">
      <el-form
        v-loading="assignFrom.AssignLoad"
        element-loading-text="正在处理中..."
        label-position="top"
        label-width="100px"
        :model="assignFrom"
        :rules="assignFrom.rules"
        ref="assignFromForm"
      >
        <el-form-item label="客服列表" prop="businessDepartment">
          <el-select
            v-model="assignFrom.businessDepartment"
            filterable
            default-first-option
            :reserve-keyword="false"
            placeholder="请选择指派客服"
          >
            <el-option
              v-for="item in assignFrom.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="assignFrom.dialogassign = false">取消</el-button>
          <el-button type="primary" @click="Assignbutton" :disabled="assignFrom.AssignLoad">
            确定
          </el-button>
        </span>
      </template>
    </el-dialog>

    <!-- 搜索弹窗 -->
    <div class="Searchboxpop-upwindow">
      <el-dialog
        v-model="Searchboxpop.dialogSearch"
        :title="Searchboxpop.SearchboxpopUpwindowtitle"
        :show-close="false"
        :fullscreen="Searchboxpop.fullscreen"
        :close-on-click-modal="false"
        :draggable="true"
        :overflow="false"
        width="50%"
      >
        <template #header>
          <div class="title">
            <span>{{ Searchboxpop.SearchboxpopUpwindowtitle }}</span>
          </div>
          <div class="div_icon">
            <el-icon @click="minimize"><Minus /></el-icon>
            <el-icon @click="maximize"><FullScreen /></el-icon>
            <el-icon @click="close"><CloseBold /></el-icon>
          </div>
        </template>
        <el-input
          v-model="TopQuery.inputAll"
          style="width: 100%; height: 100%"
          :autosize="{ minRows: 24 }"
          type="textarea"
          placeholder="每一行算一个搜索单位“多个请【换行】输入"
        />
        <template #footer>
          <div class="dialog-footer">
            <el-button type="primary" @click="dialogSearchSubmit"> 确认 </el-button>
          </div>
        </template>
      </el-dialog>
    </div>
    <!-- 最小化窗口 -->
    <div class="minimize_windows" v-if="Searchboxpop.MinimizeState">
      <div class="title">
        <span>{{ Searchboxpop.SearchboxpopUpwindowtitle }}</span>
      </div>
      <div class="div_icon">
        <el-icon @click="ExpandWindow"><FullScreen /></el-icon>
        <el-icon @click="DestroyWindow"><Close /></el-icon>
      </div>
    </div>
  </basic-container>
  <!-- 列表配置显示 -->

  <!-- <edittablehead
    v-for="columnList in columnLists"
    :key="columnList"
    v-show="columnListName == columnList"
    @closce="showdrawer"
    :drawerShow="drawerShow"
    :columnList="details.columnListPublic"
    v-model="details.columnListPublic"
    :columnListName="columnListName"
  ></edittablehead> -->
</template>
<script>
export default {
  name: '/aftersales/aftersalesWorkOrderTemp',
};
</script>
<script setup>
import { ref, reactive, toRefs, computed, onMounted, nextTick, watch } from 'vue';
import { useStore } from 'vuex';
import {
  processRowPropertyName,
  setNodeHeight,
  downloadXls,
  handleClearTableQuery,
  deepClone,
} from '@/utils/util';
import { ElMessageBox, ElMessage } from 'element-plus';
import { getDictionaryBiz } from '@/api/system/dict';
import { getToken } from '@/utils/auth';
import dayjs from 'dayjs';
import { getDetailWarehouse, getDeptWarehouse } from '@/api/basicdata/basicdataWarehouse'; //处理方
import {
  $_getList,
  $_submit,
  $_getDetail,
  $_remove,
  $_getProcessor,
  $_AddReply,
  $_getExchangeList,
  $_getInfo,
  $_batchReturn,
  $_assignCustomerService,
  $_getCustomerServicePersonnel,
  $_arbitrate,
  $_addCompletionEnd,
  $_appealSubmit,
  $_listSettlement,
  $_listAppeal,
  $_listOwn,
  $_moneyUpdate,
  $_updateWorkList,
  $_updateManagerConfirmed,
  $_updateWorkOrderStatus,
  $_AppealDetails,
  $_Cancelappeal,
  $_getDetails,
  $_settlementUpdate,
  $_updateArbitrateStatu,
  $_exportAftersalesWorkOrder,
  $_aftersalesCustomerMall,
  $_aftersalesCustomerMallremove,
  $_aftersalesCustomerMallsave,
  $_aftersalesCustomerMallsetDefault,
  $_updateFinanceTime,
  $_basicdataTripartiteMall,
  $_aftersalesCustomerMallgetByClientId,
  $_exportaftersalesOvertimeFine,
} from '@/api/aftersales/aftersalesWorkOrder';
import {
  columnList,
  columnList1,
  columnList2,
  columnList3,
  columnList4,
  columnList5,
  columnList6,
  columnList7,
  columnList8,
  columnList9,
  columnList10,
  recordList,
  Claimsfield,
  AppealList,
  timeoutList,
  CustomerColumnList,
  MallassignmentColumnList,
  customerserviceColumnList,
} from '@/option/aftersales/vueTvemp.js';
// (0, '全部'),
// (8, '待回复'),
// (3, '待处理(新建)'),
// (1, '处理中'),
// (4, '理赔金额未出'),
// (2, '处理完毕'),
// (5, '客服介入'),
// (9, '待审核'),
// (6, '完结'),
// (10, '申诉列表'),
// (7, '超时未处理'),

const $router = useRouter(); //跳转
const $useStore = useStore(); //权限
const $route = useRoute(); //获取地址栏参数
const tabValue = ref(0); //菜单激活
const UserPermissions = ref(''); //当前人身份
const workOrderStatus = ref(30); //工单状态
const PageLoading = ref(false); //页面loading
const warehouseData = ref([]); //仓库信息
const UserInfo = ref({}); //登陆人信息
const assignFromForm = ref(null); //指派客服表单实例
const dialogSearch = ref(false); //弹窗搜索
// 多行搜索
const Searchboxpop = ref({
  SearchboxpopUpwindowtitle: '', //标题
  dialogSearch: false, ///弹窗是否展开
  fullscreen: false, //是否全屏
  MinimizeState: false, //是否最小化
});
const assignFrom = ref({
  dialogassign: false,
  AssignLoad: false,
  customerService: [], //客服列表
  rules: {
    businessDepartment: [{ required: true, message: '请选择要指派的客服', trigger: 'blur' }],
  },
}); //工单指派总部客服
const batchReturnForm = ref(null);
const BatchReturn = ref({
  //批量打回弹窗
  dialogReturn: false,
  // 批量打回loading,
  repulseloading: false,
  BatchFrom: {},
  rules: {
    txt: [{ required: true, message: '请输入打回原因', trigger: 'blur' }],
    businessDepartment: [{ required: true, message: '请选择至少一个营业部', trigger: 'change' }],
  },
});
const appeal = ref({
  dialogappeal: false, //工单申诉弹窗
  AppealeditorState: false, //申诉是否为编辑状态(默认否)
  loadingappeal: false, //申诉弹窗loading
  Appealselection: [], //申诉弹窗选中数据
  AppealAttachment: [], //申诉照片
  Reasonforappeal: '', //申诉原因
  selectList: [], //申诉列表
  selectionList: [], //要申诉的数据
});
const appealruleFormRef = ref();
const columnListName = ref('columnList');
/**
 * 人身份
 * Warehouse_customer_service  仓库客服
 * Headquarters_customer_service  总部客服
 * Headquarters_Manager 总部客服经理
 */
const Useridentity = {
  Warehouse_customer_service: '仓库客服',
  Headquarters_customer_service: '总部客服',
  Headquarters_Manager: '总部客服经理',
};
const TabPermissions = ref(0); //记录的菜单编号
const TopQuery = ref({
  time: [],
});
// 必要初始化字典
const dictionaries = {
  pc_work_order: ref([]), ////异常类型
  pc_discovery_node: ref([]), //发现环节
  work_order_status: ref([]), //工单状态
  after_sales_visits: ref([]), //角色部门
};
// 菜单标签
const createTabItem = (name, label) => ({
  name,
  label,
  state: true,
  DataList: [],
  total: 0,
  request: true, //是否请求
  currentPage: 1,
  pageSize: 2,
  query: {},
});

const TabList = ref([
  createTabItem(0, '全部'),
  createTabItem(8, '待回复'),
  createTabItem(3, '待处理(新建)'),
  createTabItem(1, '处理中'),
  createTabItem(4, '理赔金额未出'),
  createTabItem(2, '处理完毕'),
  createTabItem(5, '客服介入'),
  createTabItem(9, '待审核'),
  createTabItem(6, '完结'),
  createTabItem(10, '申诉列表'),
  createTabItem(7, '超时未处理'),
]);
/**
 * @description 申诉按钮的逻辑
 * @returns {boolean} 是否显示申诉按钮
 */
const WorkOrderAppealButton = () => row => {
  // 如果是仓库客服角色
  if (UserPermissions.value == Useridentity.Warehouse_customer_service) {
    // 并且当前标签是申诉列表
    if (TabPermissions.value == 6) {
      // 则显示申诉按钮
      if (row.canRepresentations && row.workOrderStatus != 100) {
        return true;
      }
    }
  }
  // 否则不显示申诉按钮
  return false;
};
/**
 * @description 取消申诉按钮的逻辑
 * @returns {boolean} 是否显示申诉按钮
 */
const CancelAppealButton = () => row => {
  // 如果是仓库客服角色
  if (UserPermissions.value == Useridentity.Warehouse_customer_service) {
    // 并且当前标签是申诉列表
    if (TabPermissions.value == 10) {
      if (row.typesOf == '0') {
        // 则显示申诉按钮
        return true;
      }
    }
  }
  return false;
};
/**
 * @description 编辑申诉按钮的逻辑
 * @returns {boolean} 是否显示申诉编辑按钮
 */
const AppealEditorButton = () => row => {
  // 如果是仓库客服角色
  if (UserPermissions.value == Useridentity.Warehouse_customer_service) {
    // 并且当前标签是申诉列表
    if (TabPermissions.value == 10) {
      if (row.typesOf == '0') {
        return true;
      }
    }
  }
  return false;
};
/**
 * @description 编辑申诉按钮的逻辑
 * @returns {boolean} 是否显示申诉删除按钮
 */
const Deleteappealbutton = () => row => {
  // 如果是仓库客服角色
  if (UserPermissions.value == Useridentity.Warehouse_customer_service) {
    // 并且当前标签是申诉列表
    if (TabPermissions.value == 10) {
      // 则显示申诉按钮
      if (row.typesOf == '3') {
        return true;
      }
    }
  }
  // 否则不显示申诉按钮
  return false;
};
/**
 * @description 处理金额提交按钮的逻辑
 * @returns {boolean} 是否显示理赔金额未出处理提交按钮
 */
const ProcessSubmission = () => {
  // 如果是仓库客服角色
  if (TabPermissions.value == 4) {
    // 则显示申诉按钮
    return true;
  }
  // 否则不显示申诉按钮
  return false;
};

/**
 * @description 操作栏按钮权限
 * @returns {boolean} 是否显示相关按钮
 */
const PermissionButton = computed(() => ({
  Work_order_appeal: WorkOrderAppealButton(),
  Cancel_appeal_button: CancelAppealButton(),
  Appeal_editor_button: AppealEditorButton(),
  Delete_appeal_button: Deleteappealbutton(),
  Process_submission_button: ProcessSubmission(),
}));
const ButtonPermissions = computed(() => {
  // 根据 TabPermissions 的状态，决定每个按钮的显示隐藏逻辑
  switch (TabPermissions.value) {
    case 0: //全部
      return {
        add: true, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //客服介入
        DingTalkNumber: false, //钉钉号填写
        batchFinish: false, //批量完结
        Batchdetermination: false, //批量确定
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Result_review: false, //结果审核（总部审核处理结果）
        Financial_accounting: false, //财务入账
        defaultassignments: UserPermissions.value != Useridentity.Warehouse_customer_service, //默认指派
        export_Report: true, //导出报表
        Timed_outexport: false, //超时导出
      };
    case 1: //处理中
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: UserPermissions.value != Useridentity.Warehouse_customer_service, //工单指派
        applyArbitration: UserPermissions.value == Useridentity.Warehouse_customer_service, //客服介入
        DingTalkNumber: false, //钉钉号填写
        batchFinish: false, //批量完结
        Batchdetermination: false, //处理结果批量确定
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Financial_accounting: false, //财务入账
        Result_review: UserPermissions.value == Useridentity.Headquarters_customer_service, //结果审核（总部审核处理结果）
        defaultassignments: false, //默认指派
        export_Report: true, //导出报表
        Timed_outexport: false, //超时导出
      };
    case 2: //处理完毕
      return {
        add: false, //新增按钮
        batchReject: UserPermissions.value == Useridentity.Headquarters_customer_service, //批量打回
        assignment: UserPermissions.value != Useridentity.Warehouse_customer_service, //工单指派
        applyArbitration: false, //客服介入
        DingTalkNumber: false, //钉钉号填
        batchFinish: false, //批量完结
        Batchdetermination: false, //批量确定
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Result_review: false, //结果审核（总部审核处理结果）
        Financial_accounting: false, //财务入账
        defaultassignments: false, //默认指派
        export_Report: true, //导出报表
        Timed_outexport: false, //超时导出
      };
    case 3: //待处理
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //客服介入
        batchFinish: false, //批量完结
        Batchdetermination: false, //批量确定
        DingTalkNumber: false, //钉钉号填写
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Result_review: false, //结果审核（总部审核处理结果）
        Financial_accounting: false, //财务入账
        defaultassignments: false, //默认指派
        export_Report: true, //导出报表
        Timed_outexport: false, //超时导出
      };
    case 4: //理赔金额未出
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //客服介入
        batchFinish: false, //批量完结
        DingTalkNumber: false, //钉钉号填写
        Batchdetermination: true, //批量确定
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Financial_accounting: false, //财务入账
        Result_review: false, //结果审核（总部审核处理结果）
        defaultassignments: false, //默认指派
        export_Report: true, //导出报表
        Timed_outexport: false, //超时导出
      };
    case 5: //客服介入
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //客服介入
        batchFinish: false, //批量完结
        DingTalkNumber: false, //钉钉号填写
        Batchdetermination: false, //批量确定
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: UserPermissions.value != Useridentity.Warehouse_customer_service, //批量总裁完结确定
        Financial_accounting: false, //财务入账
        Result_review: false, //结果审核（总部审核处理结果）
        defaultassignments: false, //默认指派
        export_Report: true, //导出报表
        Timed_outexport: false, //超时导出
      };
    case 6: //完结
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //客服介入
        batchFinish: false, //批量完结
        DingTalkNumber: UserPermissions.value != Useridentity.Warehouse_customer_service, //钉钉号填写, //钉钉号填写
        Batchdetermination: false, //批量确定
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Financial_accounting: UserPermissions.value != Useridentity.Warehouse_customer_service, //财务入账
        defaultassignments: false, //默认指派
        Result_review: false, //结果审核（总部审核处理结果）
        export_Report: true, //导出报表
        Timed_outexport: false, //超时导出
      };
    case 7: //超时未处理
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //客服介入
        batchFinish: false, //批量完结
        Batchdetermination: false, //批量确定
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Financial_accounting: false, //财务入账
        defaultassignments: false, //默认指派
        export_Report: false, //导出报表
        Result_review: false, //结果审核（总部审核处理结果）
        Timed_outexport: true, //超时导出
      };
    case 8: //待回复
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: true, //客服介入
        batchFinish: false, //批量完结
        Batchdetermination: false, //批量确定
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Financial_accounting: false, //财务入账
        defaultassignments: false, //默认指派
        export_Report: true, //导出报表
        Result_review: false, //结果审核（总部审核处理结果）
        Timed_outexport: false, //超时导出
      };
    case 9: //待审核
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //客服介入
        batchFinish: false, //批量完结
        Batchdetermination: false, //批量确定
        ManagerConfirmed: UserPermissions.value == Useridentity.Headquarters_Manager, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Financial_accounting: false, //财务入账
        defaultassignments: false, //默认指派
        export_Report: true, //导出报表
        Result_review: false, //结果审核（总部审核处理结果）
        Timed_outexport: false, //超时导出
      };
      case 10: //申诉列表
      return {
        add: false, //新增按钮
        batchReject: false, //批量打回
        assignment: false, //工单指派
        applyArbitration: false, //客服介入
        batchFinish: false, //批量完结
        Batchdetermination: false, //批量确定
        ManagerConfirmed:false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Financial_accounting: false, //财务入账
        defaultassignments: false, //默认指派
        export_Report: false, //导出报表
        Result_review: false, //结果审核（总部审核处理结果）
        Timed_outexport: false, //超时导出
      };
    // 其他任何情况下的默认情况
    default:
      return {
        add: false,
        batchReject: false,
        assignment: false,
        applyArbitration: false,
        batchFinish: false,
        Batchdetermination: false, //批量确定
        ManagerConfirmed: false, //处理完毕下面的客服经理批量确定
        ArbitrationDetermination: false, //批量完结确定
        Financial_accounting: false, //财务入账
        defaultassignments: false, //默认指派
        export_Report: false, //导出报表
        Result_review: false, //结果审核（总部审核处理结果）
        Timed_outexport: false, //超时导出
      };
  }
});
const details = reactive({
  /** 是否开启搜索 */
  search: false,
  /** 表格搜索条件 */
  query: {},
  defaultTime2: [new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 2, 1, 23, 59, 59)], // '12:00:00', '08:00:00'
  /** 时间快捷选择设置 */
  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: [],
  /** 列表 */
  columnListPublic: deepClone(columnList), //公共列表
  /** 列表数据 */
  data: [],
  /** 页面loading */
  loadingObj: {
    /** 列表加载loading */
    list: false,
    packageListLoading: false,
  },
  /** 列表复选框选中的数据 */
  selectionList: [],
  /** 是否显示设置表格 */
  drawerShow: false,
  /** 分页参数 */
  page: {
    currentPage: 1,
    pageSize: 2,
    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,
  defaultTime2,
} = toRefs(details);
watch(
  () => $route.path,
  (newPath, oldPath) => {
    if ($useStore.state.isRefresh.refreshObj.aftersalesWorkOrderTemp) {
      TabPermissions.value = $useStore.state.Customer.Customerobj;
      tabValue.value = $useStore.state.Customer.Customerobj; //菜单编号
      if ([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10].includes(TabPermissions.value)) {
        updateMenuAndData(); //获取最新数据
        $useStore.commit('Customer_Menu', 0); //设置回初始值
      }
      $useStore.commit('EDIT_REFRESHITEM', { title: 'aftersalesWorkOrderTemp', status: false }); //重新缓存页面
    }
  }
);

const appealrules = reactive({
  Reasonforappeal: [{ required: true, message: '请选择责任方', trigger: 'blur' }],
  Appealselection: [{ required: true, message: '请填写申诉原因', trigger: 'blur' }],
});
// 图片上传接口
const doubledCount = computed(() => {
  return '/api/blade-resource/oss/endpoint/put-file';
});
// 图片上传必须携带TOKEN
const headers = computed(() => {
  return { 'Blade-Auth': 'Bearer ' + getToken() };
});
/** 展开列表控件 */
const showdrawer = _flag => {
  details.drawerShow = _flag;
};
/** 表格表头输入框搜索 */
const inputsc = (index, row) => {
  console.log(details.query, 'details.query');
  let _Obj = MatchCurrentMenu(); //匹配出当前菜单
  _Obj.request = true; //更新请求状态
  _Obj.query = details.query;
  processRowPropertyName(index, row, _Obj.query);
  PublicDataRequest(TabPermissions.value); //获取页面数据
};

/** 表格表头时间选择 */
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 selectsc = async (index, row) => {
  console.log(index, row);
  let _Obj = MatchCurrentMenu(); //匹配出当前菜单
  _Obj.request = true; //更新请求状态
  _Obj.query = details.query;
  processRowPropertyName(index, row, _Obj.query);
  PublicDataRequest(TabPermissions.value); //获取页面数据
};
/** 表格表头复选框选择 */
const selectionChange = list => {
  console.log(list);
  details.selectionList = list;
};
// 网页顶部搜索按钮
const searchChange = () => {
  updateMenuAndData(); //获取最新数据
};

// 刷新按钮
const searchChangeS = () => {
  updateMenuAndData(); //获取最新数据
};
// 重置表格搜索
const ResetTableSearch = async () => {
  let _Obj = MatchCurrentMenu();
  console.log(TabPermissions.value, '123123123');
  _Obj.request = true;
  console.log(_Obj, 'Obj');
  await handleClearTableQuery(details.columnListPublic);
  _Obj.query = {};
  PublicDataRequest(TabPermissions.value, true);
};
//清空
const searchReset = () => {
  TopQuery.value={}
  TabList.value.forEach(item => {
    item.query = {};
  });
  const TabcolumnList = [
    columnList,
    columnList1,
    columnList2,
    columnList3,
    columnList4,
    columnList5,
    columnList6,
    columnList7,
    columnList8,
    columnList9,
    columnList10,
  ];

  TabcolumnList.forEach(item => {
    handleClearTableQuery(item);
  });
  details.search = false; // 关闭搜索
  updateMenuAndData(); //获取最新数据
  autoscaling();
};
// 顶部搜索
const searchHide = () => {
  console.log(details);
  details.search = !details.search;
  autoscaling();
};
// 字典公共函数
async function updateDictionary(targetArray, dictionaryType) {
  await getDictionaryBiz(dictionaryType).then(res => {
    console.log(res, '字典');
    res.data.data.forEach(item => {
      targetArray.push({
        value: item.dictKey,
        label: item.dictValue,
      });
    });
  });
}
//表格自适应高度
const autoscaling = () => {
  const _node = document.querySelector('.tableNode');
  setNodeHeight(_node, '', true);
};
/**
 * 该函数将 columnList - columnList10  等十一个表头对象的
 * checkarr 属性赋值为对应的字典数组
 * @param {Array} columnLists - 一个包含 columnList - columnList10 等十一个对象的数组
 * @param {Object} propToDictionaryMap - 一个对象，键为 columnList 对象的 prop 属性，值为对应的字典数组
 */
const SelectionInitialization = () => {
  const columnLists = [
    columnList,
    columnList1,
    columnList2,
    columnList3,
    columnList4,
    columnList5,
    columnList6,
    columnList7,
    columnList8,
    columnList9,
    columnList10,
  ];

  // 定义一个映射对象，用于替代 if-else 判断
  const propToDictionaryMap = {
    workOrderTypeNameS: dictionaries.pc_work_order.value,
    discoveryNodeNameS: dictionaries.pc_discovery_node.value,
    workOrderStatusNameS: dictionaries.work_order_status.value,
  };

  const functionIF = item => {
    // 缓存过滤结果
    const filteredData = item.filter(item => item.type === 3);

    filteredData.forEach(item => {
      const checkarr = propToDictionaryMap[item.prop];
      if (checkarr) {
        item.checkarr = checkarr;
      }
    });
  };

  columnLists.forEach(functionIF);
};

/**
 * 描述: 初始化字典，包含角色信息、异常类型、发现环节、工单状态，。
 */
const Dictionaryrequest = async () => {
  // Map 生成一个包含所有 Promise 的数组
  const dictionaryPromises = Object.entries(dictionaries).map(([key, refValue]) => {
    return updateDictionary(refValue.value, key);
  });
  //等待字典请求完成执行页面其余参数防止出现判断错误
  await Promise.all(dictionaryPromises);
};

/**
 * 描述: 获取用户角色信息并更新界面元素状态。
 * 该函数用于检查用户的角色，并根据角色执行相应的验证和UI更新逻辑。
 */
const Roleverification = () => {
  const userInfo = localStorage.getItem('TWMS-userInfo');
  if (!userInfo) {
    console.error('用户信息未找到');
    return;
  }
  let roleNames = [];
  try {
    roleNames = JSON.parse(userInfo).content.role_name.split(',');
  } catch (error) {
    console.error('解析用户角色信息出错:', error);
    return;
  }
  UserInfo.value = JSON.parse(userInfo); //存储一份登陆人信息
  // 匹配用户角色
  const matchingItem = dictionaries.after_sales_visits.value.find(item =>
    roleNames.includes(item.label)
  );
  // 更新用户权限
  if (matchingItem) {
    console.log(matchingItem, '匹配出来的角色');

    UserPermissions.value = matchingItem.label;
  }
  // 更新TabList的状态
  const updateTabState = (tabName, condition) => {
    const tab = TabList.value.find(res => res.name == tabName);
    if (tab) {
      tab.state = condition;
    }
  };
  if (UserPermissions.value) {
    updateTabState('8', UserPermissions.value == Useridentity.Warehouse_customer_service);
    updateTabState('9', UserPermissions.value !== Useridentity.Warehouse_customer_service);
  } else {
    // 匹配不到角色时，默认为关闭状态(总部经理的审核菜单)
    updateTabState('9', false);
  }
  console.log('内部执行完毕');
  console.log(matchingItem, '匹配出来的角色');
};
onMounted(() => {
  autoscaling();
});
/**
 * 获取所有仓库信息
 */
const GetWarehouse = () => {
  getDeptWarehouse({}).then(res => {
    res.data.data.forEach(item => {
      warehouseData.value.push({
        value: item.id,
        label: item.name,
        disabled: item.name == localStorage.getItem('WarehouseName'),
      });
    });
  });
};
/**
 * 获取客服人员
 *
 * @returns {Promise<void>}
 */
const GetCustomerService = async () => {
  try {
    let _res = await $_getCustomerServicePersonnel();
    const { code, data } = _res.data;
    if (code != 200) {
      return;
    }
    assignFrom.value.customerService = data;
  } catch (e) {
    console.log(e);
  } finally {
  }
};

/**
 *页面初始化函数，包含字典，等必要请求
 */
const PageOnlaod = async () => {
  PageLoading.value = true;
  try {
    await Dictionaryrequest(), // 初始化字典
      // 并行执行异步请求
      await Promise.all([
        Roleverification(), // 获取角色信息
        SelectionInitialization(), // 下拉框初始化赋值
        GetWarehouse(), //获取仓库
        GetCustomerService(), //获取总部客服列表
      ]);

    // 获取页面数据
    await PublicDataRequest(TabPermissions.value);
  } catch (error) {
    console.log(error);
  } finally {
    PageLoading.value = false;
  }
};
// 页面初始化
PageOnlaod();

// 切换菜单处理分页数据
const PagingDataProcessing = () => {
  let _Obj = MatchCurrentMenu();
  console.log(_Obj, '匹配出来的公共菜单');
  // 对当前菜单进行缓存还原
  details.data = _Obj.DataList; //数据
  details.page.total = _Obj.total; //总页数
  details.page.currentPage = _Obj.currentPage; //当前页码
  details.page.pageSize = _Obj.pageSize; //每页条数
  // 判断是否需要请求数据
  if (_Obj.request) {
    console.log('当前需要加载页面');
    return true;
  }
  console.log('当前已经加载过了');
  return false;
};

/**
 *  @description: 点击tabBar时，记录当前点击的tab
 *  @param {number} value  当前点击的tab的value
 *  @return {void} 无返回值
 */
const tabChenge = async (value, Reset) => {
  PageLoading.value = true; // 开启loading
  let _Obj = await MatchCurrentMenu(); //匹配出上一个菜单
  _Obj.query = await deepClone(details.query); //把上一个菜单的搜索条件缓存起来
  TabPermissions.value = value; //记录最新的菜单
  PublicDataRequest(value, Reset); //请求数据
};

const PublicDataRequest = async (value, Reset) => {
  try {
    await MenuHeaderProcessing(value); // 处理头部菜单
    await Processingworkorderstatus(value); // 处理工单请求状态
    // 判断是否需要请求数据{_state}返回true表示需要false表示不需要
    let _state = PagingDataProcessing();
    if (!_state) {
      PageLoading.value = false; // 关闭oading
      return;
    }
    PageLoading.value = true; // 开启loading

    // 定义一个异步函数映射表（数据处理函数）
    const dataProcessingMap = {
      0: Publicaccessdata,
      1: Publicaccessdata,
      2: Publicaccessdata,
      3: Publicaccessdata,
      4: ClaimAmountData,
      5: Publicaccessdata,
      6: Publicaccessdata,
      7: OverdueUnprocessedData,
      8: DataAwaitingReplyData,
      9: Publicaccessdata,
      10: AppealData,
    };

    // 执行对应的函数
    const processDataFn = dataProcessingMap[value] || Publicaccessdata;
    await processDataFn(Reset); // 使用await确保完成
  } catch (error) {
    console.error('An error occurred:', error);
  } finally {
    PageLoading.value = false; // 确保关闭loading
  }
};

/**
 *  @description: 菜单状态处理
 *  @param {number} value  当前点击的tab的value
 *  @return {void} 无返回值
 */
const Processingworkorderstatus = value => {
  console.log(UserPermissions.value, 'UserPermissions.value');
  console.log(Useridentity.Warehouse_customer_service, 'Useridentity.Warehouse_customer_service');

  switch (value) {
    case 0: // 全部
      workOrderStatus.value =
        UserPermissions.value === Useridentity.Warehouse_customer_service ? 1000 : null;
      break;
    case 1: // 处理中
      workOrderStatus.value = 20;
      // UserPermissions.value === Useridentity.Warehouse_customer_service ? 20 : 40;
      break;
    case 2: // 处理完毕
      workOrderStatus.value = 30;
      break;
    case 3: // 待处理
      workOrderStatus.value = 10;
      break;
    case 5: // 客服介入
      workOrderStatus.value = 70;
      break;
    case 6: // 完结
      workOrderStatus.value = 80;
      break;
    case 9: // 待审核
      workOrderStatus.value =
        UserPermissions.value === Useridentity.Headquarters_Manager ? 500 : 40;
      break;
    default:
      workOrderStatus.value = null;
      break;
  }
};
// 更新分页信息
const updatePageDetails = (pageSize, currentPage) => {
  details.page.pageSize = pageSize;
  details.page.currentPage = currentPage;
};
const MatchCurrentMenu = (ID = TabPermissions.value) => {
  return TabList.value.find(res => res.name == ID);
};
// 每页多少条
const sizeChange = value => {
  let _Obj = MatchCurrentMenu(); //匹配出当前菜单
  _Obj.request = true; //更新请求状态
  _Obj.pageSize = value; //更新菜单每页条数
  _Obj.currentPage = 1; //切换每页条数的时候重置页码
  updatePageDetails(value, 1); //更新页码
  PublicDataRequest(TabPermissions.value);
};

/** 页码改变执行的回调 */
const currentChange = value => {
  const _Obj = MatchCurrentMenu(); // 匹配出当前菜单
  _Obj.request = true; //更新请求状态
  _Obj.currentPage = value; //更新当前菜单页码
  updatePageDetails(_Obj.pageSize, value); //更新分页信息
  PublicDataRequest(TabPermissions.value); //请求数据
};

/**
 * @description: 公共菜单数据处理
 * @param {object} data 接收公共菜单数据
 */
const PublicDataProcessing = data => {
  const { records, total, size, current } = data;
  const matchedTab = TabList.value.find(tab => tab.name === TabPermissions.value);
  // 更新 details 数据
  details.data = records;
  details.page = {
    total,
    pageSize: size,
    currentPage: current,
  };

  // 更新匹配的 TabList 项
  if (matchedTab) {
    details.query = matchedTab.query; //重新把缓存的条件赋值给搜索
    console.log(matchedTab.query, '重新把缓存的条件赋值给搜索');

    Object.assign(matchedTab, {
      DataList: records,
      total,
      pageSize: size,
      currentPage: current,
      request: !(records?.length > 0), //如果有值状态改为false下次默认不请求，否则true下次继续请求
    });
    console.log(matchedTab, '匹配出来的公共菜单');
  }

  console.log(TabList.value, 'TabList');
};
/**
 *  @description: 菜单表头处理
 *  @param {number} value  当前点击的tab的value
 *  @return {void} 无返回值
 */
const MenuHeaderProcessing = value => {
  const columnLists = {
    columnList, // 0: 全部
    columnList1, // 1: 处理中
    columnList2, // 2: 处理完毕
    columnList3, // 3: 待处理
    columnList4, // 4: 理赔金额未出
    columnList5, // 5: 客服介入
    columnList6, // 6: 完结
    columnList7, // 7: 超时未处理
    columnList8, // 8: 待回复
    columnList9, // 9: 待审核
    columnList10, // 10: 申诉列表
  };

  const keys = Object.keys(columnLists);
  const selectedKey = value >= 0 && value < keys.length ? keys[value] : 'columnList';

  // 使用深拷贝赋值
  details.columnListPublic = columnLists[selectedKey];

  // 将变量名字符串赋值给 columnListName.value
  columnListName.value = selectedKey;

  console.log(details.columnListPublic, 'details.columnListPublic');
  console.log(columnListName.value, 'columnListName.value');
};
// 状态处理
const DataStateProcessing = data => {
  console.log(data, '状态处理');
  console.log(dictionaries, 'dictionaries.pc_work_order.value');

  // 函数用于查找标签
  const findLabelByValue = (collection, value) => {
    const entry = collection.find(res => res.value === value);
    return entry ? entry.label : '/';
  };

  // 对状态进行处理
  if (data.records?.length) {
    data.records.forEach(item => {
      // 处理工单类型
      item.workOrderTypeNameS = findLabelByValue(
        dictionaries.pc_work_order.value,
        item.workOrderType
      );

      // 处理发现节点
      item.discoveryNodeNameS = findLabelByValue(
        dictionaries.pc_discovery_node.value,
        item.discoveryNode
      );

      // 处理工单状态
      item.workOrderStatusNameS = findLabelByValue(
        dictionaries.work_order_status.value,
        item.workOrderStatus
      );
    });
  }
};

/**
 *  @description: 对数据进行处理
 *  @return {void} 无返回值
 */
const DataAndStateProcessing = data => {
  PublicDataProcessing(data); //处理数据
  DataStateProcessing(data); //状态处理
};

/**
 * @description: 获取当前菜单的查询条件
 * @return {Object} 返回当前菜单的查询条件对象
 */
const getQuery = () => {
  // 匹配当前菜单并获取其搜索条件
  let _Obj = MatchCurrentMenu();
  return _Obj.query;
};
/**
 * @description: 更新当前菜单的请求状态并请求数据
 * @return {void} 无返回值
 */
const updateMenuAndData = () => {
  const currentMenu = MatchCurrentMenu(); // 匹配当前菜单
  if (currentMenu) {
    currentMenu.request = true; // 更新请求状态
  }
  PublicDataRequest(TabPermissions.value); // 请求数据
};
/**
 * @description 通用函数用于处理数据请求（包含待回复、理赔金额未出、申诉、超时未处理）
 * @param {Function} fetchFunction - 用于执行具体数据请求的函数
 * @param {boolean} [reset=false] - 控制是否重置查询条件的标志，默认值为 false
 * @returns {Promise<void>} 不返回任何内容，仅执行数据请求和处理
 */
const fetchData = async (fetchFunction, reset) => {
  try {
    let _submitData = {
      current: details.page.currentPage, // 页码
      size: details.page.pageSize, // 条数
      ...(reset ? {} : getQuery()), // 查询条件，条件重置根据 reset 标志
    };

    let _res = await fetchFunction(_submitData);
    console.log(_res);

    const { code, data } = _res.data;
    if (code !== 200) {
      return;
    }

    DataAndStateProcessing(data); // 对数据和状态处理
  } catch (error) {
    console.log(error);
  }
};

/**
 *  @description: 待回复菜单数据请求
 */
const DataAwaitingReplyData = async Reset => {
  await fetchData($_getProcessor, Reset);
};
/**
 *  @description: 理赔金额未出菜单数据请求
 */
const ClaimAmountData = async Reset => {
  await fetchData($_listSettlement, Reset);
};
/**
 *  @description: 申诉菜单数据请求
 */
const AppealData = async Reset => {
  await fetchData($_listAppeal, Reset);
};
/**
 *  @description: 超时未处理菜单数据请求
 */
const OverdueUnprocessedData = async Reset => {
  await fetchData($_listOwn, Reset);
};

/**
 *  @description: 公共数据请求，包含全部、待处理、处理中、处理完毕、客服介入、待审核、完结
 */
const Publicaccessdata = async Reset => {
  try {
    let _submitData = {
      workOrderStatus: workOrderStatus.value, //工单状态
      current: details.page.currentPage, //页码
      size: details.page.pageSize, //条数
      ...(Reset ? {} : getQuery()), // 查询条件，条件重置根据 reset 标志
    };
    let _res = await $_getList(_submitData);
    const { code, data } = _res.data;
    if (code !== 200) {
      return;
    }
    DataAndStateProcessing(data); //对数据和状态处理
    console.log(_res, '公共数据菜单=:' + TabPermissions.value);
    console.log(TabList.value, '公共菜单');
  } catch (error) {
    console.log(error);
  } finally {
  }
};

/**
 *
 * @description 创建工单
 */
const CreateworkOrder = () => {
  $router.push('/aftersales/aftersalesWorkOrderAdd');
};
/**
 *
 * @description 工单申诉
 */
const WorkOrderAppeal = async (row, state) => {
  appeal.value.selectList = [];
  appeal.value.AppealAttachment = []; //清空图片
  appeal.value.Appealselection = []; //清空责任人
  appeal.value.Reasonforappeal = ''; //清空申诉内容
  appeal.value.selectList.push(row); //存储当前申诉的对象
  console.log(appeal.value.selectList, 'appeal.value.selectList');

  appeal.value.dialogappeal = true; //展开申诉编辑
  if (state == 'edit') {
    // 当前是编辑申诉
    appeal.value.AppealeditorState = true; //开启申诉编辑状态
    console.log(row, 'row');

    let data = {
      id: row.id,
    };
    await $_AppealDetails(data).then(res => {
      console.log(res, '申诉编辑回显');
      appeal.value.Reasonforappeal = res.data.data.reason; //申诉原因
      setTimeout(() => {
        if (res.data.data.peopleEntityList) {
          appeal.value.Appealselection = res.data.data.peopleEntityList.map(
            item => item.actualPersonId
          );
        }
        if (res.data.data.imagePath) {
          appeal.value.AppealAttachment.push({
            url: res.data.data.imagePath,
          });
        }
      }, 0);
    });
    return;
  }
  if (!state) {
    appeal.value.AppealeditorState = false; //开启申诉编辑状态
  }
};
// 工单申诉确认按钮
const Appealbutton = async state => {
  try {
    await appealruleFormRef.value.validate();
  } catch (fields) {
    return;
  }

  const confirmResult = await ElMessageBox.confirm('是否确认发起工单申诉?', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning',
  }).catch(() => false);

  if (!confirmResult) {
    return;
  }

  if (appeal.value.AppealAttachment.length > 1) {
    ElMessage({
      message: '只能上传一张图片',
      type: 'warning',
    });
    return;
  }

  appeal.value.loadingappeal = true;

  let data = {
    peopleEntityList: [],
    imagePath: '',
    workOrderId: '',
    appealPeopleName: '',
  };

  data.reason = appeal.value.Reasonforappeal;
  data.appealPeopleName = warehouseData.value
    .filter(item => appeal.value.Appealselection.includes(item.value))
    .map(item => item.label)
    .join(',');

  appeal.value.Appealselection.forEach(item => {
    const selectedWarehouse = warehouseData.value.find(res => res.value === item);
    data.peopleEntityList.push({
      workOrderId: appeal.value.selectList[0].id,
      reason: appeal.value.Reasonforappeal,
      claimant: UserInfo.value.content.user_name,
      actualPersonId: selectedWarehouse.value,
      actualPersonName: selectedWarehouse.label,
    });
  });

  data.workOrderId = appeal.value.AppealeditorState
    ? appeal.value.selectList[0].workOrderId
    : appeal.value.selectList[0].id;

  if (appeal.value.AppealeditorState) {
    data.id = appeal.value.selectList[0].id;
  }

  if (appeal.value.AppealAttachment.length > 0) {
    const attachment = appeal.value.AppealAttachment[0];
    data.imagePath = attachment.response ? attachment.response.data.link : attachment.url;
  }

  console.log(data, '处理好的值');

  try {
    const { data: response } = await $_appealSubmit(data);
    const { code, msg } = response;

    if (code === 200) {
      ElMessage({
        message: msg,
        type: 'success',
      });
    }

    appeal.value.dialogappeal = false;
    updateMenuAndData(); //更新菜单数据
  } finally {
    appeal.value.loadingappeal = false;
  }
};

// 删除申诉记录
const Deleteappealrecords = async row => {
  ElMessageBox.confirm('是否删除当前记录?', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning',
  })
    .then(async () => {
      try {
        appeal.value.loadingappeal = true;
        let data = {
          ids: row.id,
        };
        let _res = await $_getDetails(data);
        if (_res.data.code == 200) {
          ElMessage({
            message: '删除成功',
            type: 'success',
          });
          updateMenuAndData(); //获取新数据
        }
      } catch {
      } finally {
        appeal.value.loadingappeal = false;
      }
    })
    .catch(() => {});
};

/**
 *
 * @description 工单取消申诉
 */
const CancelWorkOrderAppeal = row => {
  ElMessageBox.confirm('是否取消申诉?', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning',
  })
    .then(() => {
      let data = {
        id: row.id, //取消申诉ID
        typesOf: '3', //申诉状态
        workOrderId: row.workOrderId, //异常工单ID
      };
      PageLoading.value = true;
      $_Cancelappeal(data)
        .then(res => {
          console.log(res, '取消申诉返回值');
          if (res.data.code == 200) {
            updateMenuAndData(); //获取新数据
            ElMessage({
              message: '取消申诉成功',
              type: 'success',
            });
          }
        })
        .catch(error => {
          console.log(error);
        })
        .finally(() => {
          PageLoading.value = false;
        });
    })
    .catch(() => {});
};
/**
 * @description: [全部]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails0 = row => {
  console.log(row, '当前行数据');
  const workOrderInfoPath_Info = '/aftersales/aftersalesWorkOrderInfo'; //跳转路径
  const queryParams = {
    id: row.id, //异常工单ID
    name: `${row.workOrderNumber}-详情信息`,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
  };
  $router.push({ path: workOrderInfoPath_Info, query: { ...queryParams } });
};

/**
 * @description: [待回复]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails8 = row => {
  console.log(row, '当前行数据');
  const workOrderInfoPath_end = '/aftersales/aftersalesWorkOrderend'; //跳转路径
  const queryParams = {
    id: row.id, //异常工单ID
    name: `${row.workOrderNumber}-回复信息`,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
  };
  $router.push({ path: workOrderInfoPath_end, query: { ...queryParams } });
};
/**
 * @description: [待回复]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails3 = row => {
  console.log(row, '【待回复】当前行数据');
  const workOrderInfoPath_end = '/aftersales/aftersalesWorkOrderend'; //跳转路径
  const queryParams = {
    id: row.id, //异常工单ID
    name: `${row.workOrderNumber}-处理结果`,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
  };
  $router.push({ path: workOrderInfoPath_end, query: { ...queryParams } });
};
/**
 * @description: [处理中]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails1 = row => {
  console.log(row, '【处理中】当前行数据');
  const workOrderInfoPath_end = '/aftersales/aftersalesWorkOrderend'; //跳转路径
  const queryParams = {
    id: row.id, //异常工单ID
    name: `${row.workOrderNumber}-处理结果`,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
  };
  $router.push({ path: workOrderInfoPath_end, query: { ...queryParams } });
};
/**
 * @description: [理赔金额未出]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails4 = row => {
  console.log(row, '【理赔金额未出】当前行数据');
  const workOrderInfoPath_end = '/aftersales/aftersalesWorkOrderend'; //跳转路径
  const queryParams = {
    id: row.lawoId, //理赔金额未出的异常ID
    subId: row.laprId, //修改处理结果提交需要的ID
    name: `${row.workOrderNumber}-处理结果`,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
    businessId: row.businessId, //客服仲裁完结需要的ID（后期看情况可以删除）
  };
  $router.push({ path: workOrderInfoPath_end, query: { ...queryParams } });
};

/**
 * @description: [处理完毕]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails2 = row => {
  console.log(row, '【处理完毕】当前行数据');
  const workOrderInfoPath_end = '/aftersales/aftersalesWorkOrderend'; //跳转路径
  const queryParams = {
    id: row.id, //异常工单ID
    name: `${row.workOrderNumber}-处理完毕`,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
  };
  $router.push({ path: workOrderInfoPath_end, query: { ...queryParams } });
};
/**
 * @description: [客服介入]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails5 = row => {
  console.log(row, '【客服介入】当前行数据');
  const workOrderInfoPath_end = '/aftersales/aftersalesWorkOrderend'; //跳转路径
  const queryParams = {
    id: row.id, //异常工单ID
    name: `${row.workOrderNumber}-客服介入`,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
  };
  $router.push({ path: workOrderInfoPath_end, query: { ...queryParams } });
};
/**
 * @description: [待审核]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails9 = row => {
  console.log(row, '【待审核】当前行数据');
  const workOrderInfoPath_end = '/aftersales/aftersalesWorkOrderend'; //跳转路径
  const queryParams = {
    id: row.id, //异常工单ID
    name: `${row.workOrderNumber}-待审核`,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
  };
  $router.push({ path: workOrderInfoPath_end, query: { ...queryParams } });
};
/**
 * @description: [完结]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails6 = row => {
  console.log(row, '【完结】当前行数据');
  const workOrderInfoPath_end = '/aftersales/aftersalesWorkOrderend'; //跳转路径
  const queryParams = {
    id: row.id, //异常工单ID
    name: `${row.workOrderNumber}-完结`,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
  };
  $router.push({ path: workOrderInfoPath_end, query: { ...queryParams } });
};
/**
 * @description: [申诉列表]常工单号，跳转到详情信息页面
 * @param {Object} row - 当前行数据
 * @return {void}
 */
const ViewDetails10 = row => {
  console.log(row, '【申诉列表】当前行数据');
  const workOrderInfoPath_end = '/aftersales/aftersalesWorkOrderend'; //跳转路径
  const queryParams = {
    id: row.workOrderId, //申诉列表查询需要的ID
    workOrderId: row.id, //申诉驳回用的ID
    name: `${row.workOrderNumber}-申诉`,
    typesOf: row.typesOf,
    workOrderNumber: row.workOrderNumber, //异常工单号
    RouteIndexs: TabPermissions.value, //当前菜单编号
    workOrderStatus: row.workOrderStatus, //工单状态
  };
  $router.push({ path: workOrderInfoPath_end, query: { ...queryParams } });
};
// 全部异常工单号点击查看
const ViewDetailsRow = row => {
  console.log(row, '异常工单号点击查看详情当前行数据');
  switch (TabPermissions.value) {
    case 0:
      ViewDetails0(row);
      break;
    case 1:
      ViewDetails1(row);
      break;
    case 2:
      ViewDetails2(row);
      break;
    case 3:
      ViewDetails3(row);
      break;
    case 4:
      ViewDetails4(row);
      break;
    case 5:
      ViewDetails5(row);
      break;
    case 6:
      ViewDetails6(row);
      break;
    case 8:
      ViewDetails8(row);
      break;
    case 9:
      ViewDetails9(row);
      break;
    case 10:
      ViewDetails10(row);
      break;
    default:
      break;
  }
};

/**
 *  @description: 查看按钮
 *  @param {Object} row 当前行数据
 *  @return {void} 无返回值
 */
const ViewDetails = row => {
  console.log(row, '点击查看详情当前行数据');
  switch (TabPermissions.value) {
    case 0:
      ViewDetails0(row); //全部
      break;
    case 1:
      ViewDetails1(row);
      break;
    case 2:
      ViewDetails2(row);
      break;
    case 3:
      ViewDetails3(row);
      break;
    case 4:
      ViewDetails4(row);
      break;
    case 5:
      ViewDetails5(row);
      break;
    case 6:
      ViewDetails6(row);
      break;
    case 8:
      ViewDetails8(row);
      break;
    case 9:
      ViewDetails9(row);
      break;
    case 10:
      ViewDetails10(row);
      break;
    default:
      break;
  }
};
// 理赔金额未出处理结果确定
const ResultConfirmed = async row => {
  console.log(row);
  try {
    let _submit = {
      assignList: [],
    };
    if (row.lawoId) {
      // 单个
      _submit.assignList.push(row.lawoId);
    } else {
      // 批量
      if (!details.selectionList.length) {
        ElMessage.warning('请勾选要处理的数据');
        return;
      }
      _submit.assignList = details.selectionList.map(item => item.lawoId);
    }
    ElMessageBox.confirm(`是否确认${row.lawoId ? '提交' : '批量提交'}处理结果?`, '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    })
      .then(async () => {
        let _res = await $_updateWorkOrderStatus(_submit);
        const { code, msg } = _res.data;
        if (code == 200) {
          console.log(_res, '理赔金额未出处理结果确定');
          ElMessage.success(msg);
          updateMenuAndData(); //获取最新数据
        }
      })
      .catch(() => {});
  } catch (e) {
    console.log(e);
  } finally {
  }
};
/**
 * @description: 批量处理结果(打回)
 * @return {void} 无返回值
 */
const BatchReturnResults = () => {
  if (!details.selectionList.length) {
    ElMessage({
      message: '请勾选要处理的数据',
      type: 'warning',
    });
    return;
  }
  BatchReturn.value.dialogReturn = true; //展开弹窗
};
const ConfirmReturn = async () => {
  const validateAndProcessReturn = async () => {
    try {
      const selectedObjs = warehouseData.value.filter(obj =>
        BatchReturn.value.BatchFrom.businessDepartment.includes(obj.value)
      );

      const businessId = selectedObjs.map(item => item.value).join(',');
      const businessName = selectedObjs.map(item => item.label).join(',');
      const processorList = selectedObjs.map(item => ({ id: item.value, name: item.label }));
      const workOrderIds = details.selectionList.map(item => item.id);

      const data = {
        businessId,
        businessName,
        processorList,
        reasonReturn: BatchReturn.value.BatchFrom.txt,
        workOrderIds,
        typesOf: '1',
      };

      console.log(data, '处理好的值');

      const _res = await $_batchReturn(data);
      const { code, msg } = _res.data;

      if (code === 200) {
        ElMessage.success(msg);
        BatchReturn.value.dialogReturn = false; //关闭弹窗
        updateMenuAndData(); //获取最新数据
      }
    } catch (e) {
      console.error(e);
    }
  };

  batchReturnForm.value.validate(async valid => {
    if (valid) {
      ElMessageBox.confirm('是否确认批量打回营业部?', '提示', {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(async () => {
          await validateAndProcessReturn();
        })
        .catch(() => {});
    }
  });
};
/**
 * @description 工单指派
 * @return {void} 无返回值
 */
const WorkOrderAssignment = () => {
  // 检查是否选中任何工单
  if (!details.selectionList.length) {
    // 提示用户选择数据
    ElMessage({
      message: '请勾选要处理的数据',
      type: 'warning',
    });
    return;
  }
  // 初始化指派表单并打开指派弹窗
  assignFrom.value = { ...assignFrom.value, businessDepartment: '', dialogassign: true };
};

/**
 * 工单指派确定按钮
 * 1.根据选择的客服ID,名称,和选择的工单ID,将其组装成一个data对象
 * 2.然后调用$_assignCustomerService(data)接口,
 * 3.成功后关闭加载,关闭弹窗,重新拉取数据
 */
const Assignbutton = async () => {
  const WorkOrderAssignmentFunction = async () => {
    const assignForm = assignFrom.value;
    assignForm.AssignLoad = true; // 开启加载

    try {
      // 筛选选择的工单
      const foundObjs = assignForm.customerService.find(
        obj => obj.id == assignForm.businessDepartment
      );

      if (!foundObjs) {
        console.error('未找到对应的工单信息');
        return;
      }

      // 构建请求数据
      const data = {
        customerServiceId: foundObjs.id, // 归属客服ID
        customerServiceName: foundObjs.realName, // 归属客服名称
        assignList: details.selectionList.map(item => item.id), // 异常工单ID/工单ID
      };

      // 发起请求
      const _res = await $_assignCustomerService(data);
      const { code, msg } = _res.data;

      if (code !== 200) {
        console.error('分配客服失败:', msg);
        return;
      }

      // 关闭弹窗
      assignForm.dialogassign = false;

      // 更新当前菜单和请求数据
      updateMenuAndData();
    } catch (error) {
      console.error('分配客服时发生错误:', error);
    } finally {
      assignForm.AssignLoad = false; // 关闭加载
    }
  };

  assignFromForm.value.validate(async valid => {
    if (valid) {
      ElMessageBox.confirm('是否确认指派该客服?', '提示', {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(async () => {
        await WorkOrderAssignmentFunction();
      });
    } else {
      ElMessage.warning('请检查表单是否填写否完整');
    }
  });
};
/**
 * 弹窗多行搜索
 * 1.获取当前选中的客户信息
 * 2.然后根据客户信息,去后台查询对应的客服信息
 * 3.将查询到的客服信息显示在弹窗中
 * 4.然后用户可以选择对应的客服
 * 5.最终将选择的客服信息,分配给对应的工单
 */
const MultilineSearch = (title, input) => {
  if (input) {
    const formattedInput = input.split(',').join('\n');
    TopQuery.value.inputAll = formattedInput; // 赋值给 inputAll
  } else {
    TopQuery.value.inputAll = '';
  }

  Searchboxpop.value.SearchboxpopUpwindowtitle = title; // 设置标题

  Searchboxpop.value.dialogSearch = true; // 打开对话框
};
/**
 * @description  dialogSearchSubmit
 * 1.获取用户输入的所有数据
 * 2.将其拆分成每一行
 * 3.然后将每一行的前后空格去除
 * 4.然后将所有的行连接起来
 * 5.将连接起来的数据重新赋值给workOrderNumber
 * @param {void} 无参数
 * @return {void} 无返回值
 */
const dialogSearchSubmit = () => {
  // 1.获取用户输入的所有数据
  const inputAll = TopQuery.value.inputAll;

  // 2.将其拆分成每一行
  const lines = inputAll
    .split('\n') // 按换行分割
    .map(line => line.trim()) // 移除每一行前后的空格
    .filter(line => line !== ''); // 过滤掉空行

  // 3.然后将每一行的前后空格去除

  // 4.然后将所有的行连接起来
  const joinedLines = lines.join(','); // 使用逗号连接，无空格

  // 5.将连接起来的数据重新赋值给workOrderNumber
  TopQuery.value.workOrderNumber = joinedLines;
  Searchboxpop.value.dialogSearch = false; //关闭弹窗
};
// 关闭
const close = () => {
  Searchboxpop.value.dialogSearch = false; //关闭弹窗
  Searchboxpop.value.MinimizeState = false; //销毁最小化
};
// 最大化
const maximize = () => {
  Searchboxpop.value.fullscreen = !Searchboxpop.value.fullscreen; //最大化
};

// 最小化
const minimize = () => {
  Searchboxpop.value.dialogSearch = false; //关闭弹窗
  Searchboxpop.value.MinimizeState = true; //最小化
};
const ExpandWindow = () => {
  Searchboxpop.value.dialogSearch = true; //回复窗口弹窗
  Searchboxpop.value.MinimizeState = false; //销毁最小化
};
const DestroyWindow = () => {
  Searchboxpop.value.MinimizeState = false; //销毁最小化
};
</script>

<style scoped lang="scss">
:deep(.el-card) {
  height: 100%;
}
:deep(.el-card__body) {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 0 !important;
}
.el-fy {
  flex: 1;
  display: flex;
  align-items: flex-end;
}
.avue-crud {
  height: 100%;
  display: flex;
  flex-direction: column;
}
:deep(.el_tabs) {
  .el-tabs__item {
    font-family: '黑体';
    border-right: 1px dashed #00000014;
  }
  .is-active {
    font-family: '黑体';
    font-weight: bold;
  }
  .el-tabs__content {
    display: none;
  }
}
.avue-crud__header {
  min-height: initial;
  margin: 4px 0;
  padding: 0 4px;
}
.avue-crud__left {
  .el-button {
    border-radius: 2px;
  }
}
:deep(.el_appeal) {
  .el-form-item {
    flex-direction: column;
    align-items: flex-start;
    .el-form-item__label {
      position: relative;
    }
    .el-form-item__content {
      width: 100% !important;
    }
  }
}
:deep(.plAllret) {
  height: 30%;

  display: flex;
  flex-direction: column;
  .el-select {
    width: 100%;
  }
  .el-dialog__footer {
    display: flex;
    flex: 1;
    align-items: flex-end;
    justify-content: flex-end;
  }
}
:deep(.el-fr-d) {
  display: flex;
  .el-form-item {
    width: 20%;
  }
  .el_div_input {
    width: 100%;
    display: flex;
    align-items: center;
    .el-icon {
      font-size: 2em;
    }
  }
  .el-form-item {
    margin: 0;
    margin: 10px 6px;
  }
}
:deep(.Searchboxpop-upwindow) {
  .el-overlay {
    position: absolute;
    .el-dialog {
      min-height: 70%;
    }
    .el-overlay-dialog {
      position: absolute;
    }
    .el-dialog__header {
      display: flex;
      justify-content: space-between;
      .title {
        position: relative;
        padding: 0 10px;
      }
      .title::after {
        content: '*';
        color: #172e60;
        position: absolute;
        font-size: 20px;
        top: 0;
        left: 0;
      }
      .div_icon {
        width: 100px;
        display: flex;
        justify-content: space-between;
        font-size: 19px;
        cursor: pointer;
      }
    }
    .el-dialog__footer {
      display: flex;
      justify-content: center;
      padding: 6px;
      .el-button {
        width: 160px;
        height: 35px;
      }
    }
  }
}
.minimize_windows {
  width: 200px;
  height: 49px;
  border: 1px solid #cccccc82;
  position: absolute;
  bottom: 1px;
  left: 10px;
  box-shadow: 2px -1px 0.15625vw #c1c1c187;
  display: flex;
  align-items: center;
  justify-content: space-around;
  .title {
    height: 100%;
    display: flex;
    align-items: center;
    span {
      font-size: 16px;
    }
  }
  span {
    font-size: 14px;
  }
  .div_icon {
    display: flex;
    align-items: center;
    width: 54px;
    justify-content: space-between;
    font-size: 20px;
  }
}
</style>