Merge branch 'dev' of http://114.132.189.42:9002/r/center-lims-before-ruoyi...

zouyu

2025-03-18 bc44c8e3c9d85691ce3fa73ef1300a6fae46e365

 src/views/business/inspectionTask/index.vue

@@ -1,9 +1,2078 @@
<template>
  <div>检验任务</div>
  <div class="bg-1" style="padding: 15px 5px">
    <basic-container>
      <div class="search" :style="`height: ${more ? 100 : 50}px;`">
        <el-row :gutter="10" style="width: 100%">
          <el-col :span="16" style="display: flex; flex-wrap: wrap">
            <div
              class="search_thing"
              style="margin-left: 20px"
              v-if="maxNum > 1"
            >
              <div class="search_label">委托编号：</div>
              <div class="search_input">
                <el-input
                  size="small"
                  placeholder="请输入"
                  clearable
                  v-model="queryParams.entrustCode"
                  @keyup.enter.native="refreshTable()"
                ></el-input>
              </div>
            </div>
            <div
              class="search_thing"
              style="margin-left: 20px"
              v-if="maxNum > 2"
            >
              <div class="search_label">样品编号：</div>
              <div class="search_input">
                <el-input
                  size="small"
                  placeholder="请输入"
                  clearable
                  v-model="queryParams.sampleCode"
                  @keyup.enter.native="refreshTable()"
                ></el-input>
              </div>
            </div>
            <div
              class="search_thing"
              style="margin-left: 20px"
              v-if="maxNum > 3"
            >
              <div class="search_label">样品名称：</div>
              <div class="search_input">
                <el-input
                  size="small"
                  placeholder="样品大类/样品名称"
                  clearable
                  v-model="queryParams.sample"
                  @keyup.enter.native="refreshTable()"
                ></el-input>
              </div>
            </div>
            <div
              class="search_thing"
              style="margin-left: 20px"
              v-if="maxNum >= 4 || more"
            >
              <div class="search_label">检验状态：</div>
              <div class="search_input">
                <el-select
                  size="small"
                  v-model="queryParams.insState"
                  style="width: 100%"
                  clearable
                  @change="refreshTable()"
                >
                  <el-option
                    v-for="(a, i) in insStateList"
                    :key="i"
                    :label="a.dictLabel"
                    :value="a.dictValue"
                  ></el-option>
                </el-select>
              </div>
            </div>
            <div
              class="search_thing"
              style="margin-left: 20px"
              v-if="maxNum >= 5 || more"
            >
              <div class="search_label">下发时间：</div>
              <div class="search_input">
                <div class="search_input">
                  <el-date-picker
                    size="small"
                    clearable
                    @change="refreshTable()"
                    v-model="queryParams.sendTimeRange"
                    type="daterange"
                    value-format="yyyy-MM-dd[T]HH:mm:ss"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    :default-time="['00:00:00', '23:59:59']"
                  >
                  </el-date-picker>
                </div>
              </div>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="search_thing">
              <el-button
                v-if="maxNum < 5"
                type="text"
                :icon="!more ? 'el-icon-arrow-down' : 'el-icon-arrow-up'"
                style="color: #3a7bfa"
                @click="more = !more"
                >{{ !more ? "更多" : "收起" }}</el-button
              >
              <div class="search_thing" style="padding-left: 10px">
                <el-button size="small" @click="refresh()">重 置</el-button>
                <el-button size="small" type="primary" @click="refreshTable()"
                  >查 询</el-button
                >
                <template>
                  <el-button size="small" type="primary" @click="excelExport"
                    >查看结果</el-button
                  >
                  <el-button
                    size="small"
                    type="primary"
                    @click="unInsDialogVisible = true"
                    >导出待检信息</el-button
                  >
                </template>
              </div>
            </div>
          </el-col>
        </el-row>
      </div>
    </basic-container>
    <basic-container>
      <div class="center">
        <div class="center-options">
          <el-row>
            <el-col :span="24">
              <div
                style="
                  display: flex;
                  align-items: center;
                  justify-content: space-between;
                "
              >
                <div style="display: flex; align-items: center">
                  <ul class="tab">
                    <li
                      v-for="(m, i) in tabList"
                      :key="i"
                      :class="{ active: i == tabIndex }"
                      @click="handleTab(m, i)"
                    >
                      {{ m.label.replace("试验室", "") }}
                    </li>
                  </ul>
                  <div>
                    <el-checkbox
                      @change="changeCheckBox"
                      class="view-self-checkbox"
                      v-model="alone"
                      ><span>我的任务</span></el-checkbox
                    >
                  </div>
                </div>
                <div class="center-title">
                  <p>
                    <span>本月任务数量:</span>
                    <span v-if="currentMonthPlanTotal != undefined">{{
                      currentMonthPlanTotal
                    }}</span>
                  </p>
                  <p>
                    <span>总计任务数量:</span>
                    <span v-if="$refs.insOrderPlan != undefined">{{
                      $refs.insOrderPlan.page.total
                    }}</span>
                  </p>
                </div>
              </div>
            </el-col>
          </el-row>
        </div>
        <lims-table
          ref="insOrderPlan"
          highlightCurrentRow
          :rowClassName="changeRowClass"
          :tableData="tableData"
          :height="tableMainHeight + ''"
          :column="column"
          @pagination="pagination"
          :page="page"
          :tableLoading="tableLoading"
        >
        </lims-table>
      </div>
    </basic-container>
    <div v-show="activeFace == 0 && state == 0" style="height: 100%"></div>

    <el-dialog title="提示" :visible.sync="claimVisible" width="400px">
      是否认领委托编号<span style="color: #33c130">{{
        sampleUserForm.entrustCode
      }}</span
      >的任务
      <span slot="footer" class="dialog-footer">
        <el-button @click="claimVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirmClaim" :loading="loading"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <el-dialog title="检验交接" :visible.sync="connectVisible" width="400px">
      <div class="search_thing" style="width: 100%">
        <div class="search_label" style="width: 90px">
          <span class="required-span">* </span>交接人员：
        </div>
        <div class="search_input">
          <el-select
            v-model="connect.connectPerson"
            placeholder="请选择"
            style="width: 100%"
            filterable
          >
            <el-option-group
              v-for="(item, index) in Object.keys(personList)"
              :key="index"
              :label="item"
            >
              <el-option
                :disabled="
                  userNameList.filter((name) => name == op.name).length > 0
                "
                v-for="op in personList[item]"
                :key="op.id"
                :label="op.name"
                :value="op.id"
              >
              </el-option>
            </el-option-group>
          </el-select>
        </div>
      </div>
      <div class="search_thing" style="width: 100%">
        <div class="search_label" style="width: 90px">
          <span class="required-span">* </span>试验室：
        </div>
        <div class="search_input">
          <el-select
            v-model="connect.sonLaboratory"
            placeholder="请选择"
            style="width: 100%"
            filterable
          >
            <el-option
              v-for="item in sonLaboratoryList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="connectVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirmConnect" :loading="loading"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <Inspection
      v-if="state > 0"
      @goback="goback"
      :handover="personList"
      :sonLaboratoryList="sonLaboratoryList"
      :orderId="orderId"
      :inspectorList="inspectorList"
      :sonLaboratory="componentData.entity.sonLaboratory"
      :state="state"
    />
    <el-dialog
      title="数据查看"
      :visible.sync="dataDialogVisible"
      width="100%"
      fullscreen
    >
      <div
        style="width: 100%; text-align: right; margin-bottom: 10px"
        v-if="premissionReviewFun()"
      >
        <el-button type="primary" size="small" @click="goReview(currentRow)"
          >前往复核</el-button
        >
      </div>
      <lims-table
        ref="dataLookTable"
        highlightCurrentRow
        :tableData="dataLooktableData"
        height="80vh"
        :column="dataLookColumn"
        :tableLoading="dataLookTableLoading"
      >
      </lims-table>
    </el-dialog>
    <!-- 导出弹框 -->
    <el-dialog
      :title="title"
      :visible.sync="dialogVisibleExcel"
      fullscreen
      :before-close="handleClose"
    >
      <div class="search">
        <div style="display: flex">
          <div style="margin-right: 20px">
            <span>委托单号：</span>
            <el-input
              size="mini"
              placeholder="请输入"
              clearable
              style="width: 180px"
              v-model="excelForm.entrustCode"
              @keyup.enter.native="refreshTable()"
            ></el-input>
          </div>
          <div style="margin-right: 20px">
            <span>样品编号：</span>
            <el-input
              size="mini"
              placeholder="请输入"
              clearable
              v-model="excelForm.sampleCode"
              style="width: 180px"
              @keyup.enter.native="refreshTable()"
            ></el-input>
          </div>
          <div style="margin-right: 20px">
            <span>检验人：</span>
            <el-select
              size="mini"
              v-model="excelForm.sampleName"
              placeholder="请选择"
              @keyup.enter.native="refreshTable()"
              style="width: 120px"
            >
              <el-option-group
                v-for="(item, index) in Object.keys(personList)"
                :key="index"
                :label="item"
              >
                <el-option
                  v-for="op in personList[item]"
                  :key="op.id"
                  :label="op.name"
                  :value="op.id"
                >
                </el-option>
              </el-option-group>
            </el-select>
          </div>
          <div style="margin-right: 20px">
            <span>日期：</span>
            <el-date-picker
              size="mini"
              v-model="excelForm.dateTime"
              type="daterange"
              range-separator="至"
              value-format="yyyy-MM-dd HH:mm:ss"
              format="yyyy-MM-dd"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            >
            </el-date-picker>
          </div>
        </div>
        <div class="search_thing">
          <el-button
            size="mini"
            type="primary"
            icon="el-icon-search"
            @click="excelSearch"
            >查 询</el-button
          >
          <el-button
            size="mini"
            icon="el-icon-download"
            type="primary"
            @click="excelExportTrends"
            :loading="outLoading"
            >导 出</el-button
          >
        </div>
      </div>
      <!-- 表格内容 -->
      <el-divider content-position="left">检验结果</el-divider>
      <br />
      <div>
        <el-tabs
          type="border-card"
          v-model="activeName"
          @tab-click="handleClick"
        >
          <el-tab-pane
            v-for="(v, i) in tabs"
            :key="i"
            :label="v"
            :name="i.toString()"
          >
            <el-table
              :data="tabsData"
              border
              ref="showResultTable"
              v-loading="loadingTable"
              :height="tableHeight+''"
              element-loading-text="加载中"
              element-loading-spinner="el-icon-loading"
              element-loading-background="rgba(255, 255, 255, 1)"
            >
              <el-table-column
                label="序号"
                type="index"
                width="60"
              ></el-table-column>
              <el-table-column
                label="委托单号"
                show-overflow-tooltip
                prop="entrustCode"
                width="180"
              ></el-table-column>
              <el-table-column
                show-overflow-tooltip
                label="样品编号"
                prop="sampleCode"
                width="180"
              ></el-table-column>
              <el-table-column
                label="管色标"
                prop="bushing"
                width="80"
              ></el-table-column>
              <el-table-column
                label="光纤带色标"
                prop="fibers"
                width="110"
              ></el-table-column>
              <el-table-column
                label="光纤色标"
                prop="fiber"
                width="100"
              ></el-table-column>
              <el-table-column
                label="检测项目分类"
                show-overflow-tooltip
                prop="inspectionItem"
                v-if="tabName != '温度循环'"
                width="180"
              ></el-table-column>
              <el-table-column
                label="检测人"
                prop="userName"
                width="80"
              ></el-table-column>
              <el-table-column
                label="检测时间"
                prop="insTime"
                width="180"
              ></el-table-column>
              <el-table-column
                label="下发时间"
                prop="sendTime"
                width="180"
              ></el-table-column>
              <el-table-column
                v-for="(v, i) in tableHeader"
                :label="v.label"
                :prop="v.prop"
                :key="i"
                min-width="120"
                show-overflow-tooltip
                :width="calcTableColumnWidth(v.label)"
              >
              </el-table-column>
            </el-table>
            <el-pagination
              background
              style="text-align: right; margin-top: 20px"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[10, 20, 50, 100, 200]"
              :page-size="pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="total"
            >
            </el-pagination>
          </el-tab-pane>
        </el-tabs>
      </div>
    </el-dialog>
    <!-- 导出委托费用弹框 -->
    <el-dialog
      title="委托费用统计导出"
      :visible.sync="commissionFeesDialogVisible"
      width="30%"
      :before-close="handleCloseCommissionFees"
    >
      <el-form :model="exportFees" ref="exportFees" :rules="feesRule">
        <el-form-item label="下单日期" prop="commissionFeesDate">
          <el-date-picker
            v-model="exportFees.commissionFeesDate"
            type="daterange"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          >
          </el-date-picker>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleCloseCommissionFees">取 消</el-button>
        <el-button type="primary" @click="exportcommissionFees"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 导出待检信息弹框 -->
    <el-dialog
      title="待检任务导出"
      :visible.sync="unInsDialogVisible"
      width="30%"
      :before-close="handleCloseUnInsDialog"
    >
      <el-form
        :model="unInsProductsData"
        ref="exportUnInsProducts"
        :rules="unInsRule"
      >
        <el-form-item label="下发日期" prop="sendTime">
          <el-date-picker
            v-model="unInsProductsData.sendTime"
            type="daterange"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          >
          </el-date-picker>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleCloseUnInsDialog">取 消</el-button>
        <el-button type="primary" @click="exportUnInsProductsFun"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 数据查看详情 -->
    <el-dialog
      title="查看详情"
      :visible.sync="dialogVisible"
      width="70%"
      :before-close="handleClose3"
    >
      <el-table
        v-if="type == '单根垂直燃烧' || type == '松套管'"
        :data="viewDetailsList"
        border
        height="400px"
        style="width: 100%"
      >
        <el-table-column
          type="index"
          label="序号"
          width="80px"
        ></el-table-column>
        <el-table-column prop="entrustCode" label="委托单号"></el-table-column>
        <el-table-column prop="sampleCode" label="样品编号"></el-table-column>
        <el-table-column
          prop="color"
          label="套管"
          v-if="viewDetailsList.filter((ele) => ele.color !== '').length > 0"
        ></el-table-column>
        <!-- <el-table-column prop="inspectionItem" label="检验项"></el-table-column> -->
        <el-table-column prop="insValue" label="检验结果"></el-table-column>
      </el-table>

      <el-table
        v-if="type == '抗拉强度'"
        :data="viewDetailsList"
        height="400px"
        border
        style="width: 100%"
      >
        <el-table-column
          type="index"
          label="序号"
          width="80px"
        ></el-table-column>
        <el-table-column prop="inspectionItem" label="检验项"></el-table-column>
        <el-table-column
          prop="inspectionItemSubclass"
          label="检验子项"
        ></el-table-column>
        <el-table-column prop="width" label="宽度"></el-table-column>
        <el-table-column prop="thickness" label="厚度"></el-table-column>
        <el-table-column prop="testValue" label="检验值"></el-table-column>
      </el-table>

      <el-table
        v-if="type == '断裂伸长率'"
        :data="viewDetailsList"
        height="400px"
        border
        style="width: 100%"
      >
        <el-table-column
          type="index"
          label="序号"
          width="80px"
        ></el-table-column>
        <el-table-column prop="inspectionItem" label="检验项"></el-table-column>
        <el-table-column
          prop="inspectionItemSubclass"
          label="检验子项"
        ></el-table-column>
        <el-table-column
          v-for="(v, i) in tableHeader"
          :key="i"
          :prop="`testValue${i}`"
          :label="`检验值${i + 1}`"
        ></el-table-column>
      </el-table>
    </el-dialog>
    <!-- 订单基本信息弹框 -->
    <el-dialog
      title="委托单信息"
      :visible.sync="orderInfoDialog"
      top="5vh"
      width="70%"
    >
      <el-divider content-position="left">检验样品编号列表</el-divider>
      <el-table
        :data="insSampleListData"
        border
        height="200"
        :cell-style="{ textAlign: 'center' }"
        :header-cell-style="{ textAlign: 'center' }"
      >
        <el-table-column label="样品编号" prop="sampleCode"></el-table-column>
        <el-table-column label="状态" prop="state">
          <template slot-scope="scope">
            <el-tag type="danger" v-if="scope.row.state == 0">待检</el-tag>
            <el-tag type="warning" v-if="scope.row.state == 1">在检</el-tag>
            <el-tag type="success" v-if="scope.row.state == 2">已检</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="检测人" prop="inspectName"></el-table-column>
      </el-table>
      <br />
      <el-divider content-position="left">委托单内容</el-divider>
      <el-table
        :data="insProductVOSData"
        border
        height="300"
        :cell-style="{ textAlign: 'center' }"
        :header-cell-style="{ textAlign: 'center' }"
      >
        <el-table-column
          label="样品编号"
          prop="sampleCode"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          label="样品型号"
          prop="model"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          label="检测项目"
          prop="testItem"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          label="检测子项"
          prop="testItemChildren"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          label="试验方法"
          prop="testMethod"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          label="标准要求"
          prop="requirement"
          show-overflow-tooltip
        ></el-table-column>
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
export default {};
import { mapGetters } from "vuex";
import Inspection from "./Inspection.vue";
import { getYearAndMonthAndDays } from "@/utils/date";
import { transformExcel } from "@/utils/file";
import limsTable from "@/components/Table/lims-table.vue";
import {
  getCurrentMonthPlanTotal,
  exportCommissionFees,
  exportUnInsProducts,
  exportInsOrderPlanResult,
  getTabHeader,
  getInsOrderTemList,
  getInsOrderPlanList,
  claimInsOrderPlan,
  getSampleInfoByOrderId,
  selectInsOrderPlanList,
  upPlanUser2,
  upPlanUser,
} from "@/api/business/inspectionTask";
import {
  selectSampleAndProductByOrderId,
  viewDetails,
} from "@/api/business/inspectionOrder";
import { getDicts } from "@/api/system/dict/data";
import { getLaboratoryPersonList } from "@/api/system/user";
import LimsTable from "../../../components/Table/lims-table.vue";
export default {
  components: {
    Inspection,
    limsTable,
    LimsTable,
  },
  computed: {
    ...mapGetters(["permissions", "nickName"]),
    title() {
      return this.selectTab + "检验结果显示";
    },
    isLeader() {
      const power = JSON.parse(sessionStorage.getItem("power"));
      if (power) {
        const filterList = power.filter((ele) => ele.menuMethod == "leader");
        return filterList.length > 0;
      }
      return false;
    },
  },
  data() {
    return {
      insStateList: [],
      urgencyDictList: [],
      tableData: [],
      column: [
        {
          label: "委托编号",
          prop: "entrustCode",
          minWidth: "160px",
          width: "160px",
          dataType: "link",
          linkEvent: {
            method: "selectAllByOne",
            vueComponent: this,
          },
        },
        {
          label: "委托单位",
          prop: "company",
          minWidth: "160px",
          width: "160px",
        },
        {
          label: "样品名称",
          prop: "sample",
          minWidth: "140px",
          width: "140px",
          dataType: "link",
          linkEvent: {
            method: "selectOrderInfo",
            vueComponent: this,
          },
        },
        {
          label: "样品型号",
          prop: "model",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "紧急程度",
          prop: "type",
          dataType: "tag",
          minWidth: "90px",
          width: "90px",
          formatData: (params) => {
            let index = this.urgencyDictList.findIndex(
              (item) => item.dictValue == params
            );
            if (index > -1) {
              return this.urgencyDictList[index].dictLabel;
            } else {
              return null;
            }
          },
          formatType: (params) => {
            let index = this.urgencyDictList.findIndex(
              (item) => item.dictValue == params
            );
            if (index > -1) {
              return this.urgencyDictList[index].listClass;
            } else {
              return null;
            }
          },
        },
        {
          label: "状态",
          prop: "insState",
          dataType: "tag",
          minWidth: "100px",
          width: "100px",
          formatData: (params) => {
            let index = this.insStateList.findIndex(
              (item) => item.dictValue == params
            );
            if (index > -1) {
              return this.insStateList[index].dictLabel;
            } else {
              return null;
            }
          },
          formatType: (params) => {
            let index = this.insStateList.findIndex(
              (item) => item.dictValue == params
            );
            if (index > -1) {
              return this.insStateList[index].listClass;
            } else {
              return null;
            }
          },
        },
        {
          label: "检验人",
          prop: "userName",
          minWidth: "140px",
          width: "140px",
        },
        {
          label: "复核人",
          prop: "checkName",
          minWidth: "100px",
          width: "100px",
        },
        {
          label: "约定时间",
          prop: "appointed",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "下发时间",
          prop: "sendTime",
          minWidth: "140px",
          width: "140px",
        },
        {
          label: "检验开始时间",
          prop: "insTime",
          minWidth: "140px",
          width: "140px",
        },
        {
          label: "理由",
          prop: "verifyTell",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "操作",
          dataType: "action",
          fixed: "right",
          operation: [
            {
              name: "数据查看",
              type: "text",
              clickFun: (row) => {
                this.handleDataLook(row);
              },
            },
            {
              name: "检验",
              type: "text",
              clickFun: (row) => {
                this.handleInspection(row);
              },
              disabled: (row, index) => {
                return (
                  row.userName == null ||
                  row.insState == 3 ||
                  row.insState == 5 ||
                  (row.userName && !this.hasExistUserName(row.userName))
                );
              },
            },
            {
              name: "交接",
              type: "text",
              clickFun: (row) => {
                this.handleConnect(row);
              },
              disabled: (row, index) => {
                return (
                  row.userName == null ||
                  row.insState == 5 ||
                  row.insState == 3 ||
                  (row.userName &&
                    !this.hasExistUserName(row.userName) &&
                    !this.isLeader)
                );
              },
            },
            {
              name: "复核",
              type: "text",
              clickFun: (row) => {
                this.handleReview(row);
              },
              disabled: (row, userName) => {
                return (
                  row.userName == null ||
                  row.insState != 3 ||
                  (row.checkName && !this.hasExistUserName(row.userName))
                );
              },
            },
            {
              name: "认领",
              type: "text",
              clickFun: (row) => {
                this.claimFun(row);
              },
              disabled: (row, index) => {
                return row.userName != null || row.checkName != null;
              },
            },
          ],
        },
      ],
      dataLooktableData: [],
      insResultList: [
        {
          value: 1,
          label: "合格",
          type: "success",
        },
        {
          value: 0,
          label: "不合格",
          type: "danger",
        },
        {
          value: 3,
          label: "不判定",
          type: "",
        },
      ],
      dataLookColumn: [
        {
          label: "委托编号",
          prop: "entrustCode",
          minWidth: "160px",
          width: "160px",
        },
        {
          label: "样品编号",
          prop: "sampleCode",
          minWidth: "160px",
          width: "160px",
        },
        {
          label: "管套色标",
          prop: "bushColor",
          minWidth: "100px",
          width: "100px",
        },
        {
          label: "光纤带编号",
          prop: "code",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "光纤色标",
          prop: "color",
          minWidth: "100px",
          width: "100px",
        },
        {
          label: "检验项",
          prop: "inspectionItem",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "检验子项",
          prop: "inspectionItemSubclass",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "检验结果",
          prop: "lastValue",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "结果判定",
          prop: "insResult",
          minWidth: "100px",
          width: "100px",
          dataType: "tag",
          formatData: (params) => {
            let index = this.insResultList.findIndex(
              (item) => item.value == params
            );
            if (index > -1) {
              return this.insResultList[index].label;
            } else {
              return null;
            }
          },
          formatType: (params) => {
            let index = this.insResultList.findIndex(
              (item) => item.value == params
            );
            if (index > -1) {
              return this.insResultList[index].type;
            } else {
              return null;
            }
          },
        },
        {
          label: "单位",
          prop: "unit",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "试验要求",
          prop: "tell",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "检验人",
          prop: "checkName",
          minWidth: "120px",
          width: "120px",
        },
        {
          label: "检验日期",
          prop: "checkTime",
          minWidth: "140px",
          width: "140px",
        },
        {
          label: "样品名称",
          prop: "sample",
          minWidth: "160px",
          width: "160px",
        },
        {
          label: "样品型号",
          prop: "model",
          minWidth: "160px",
          width: "160px",
        },
        {
          label: "试验室",
          prop: "sonLaboratory",
          minWidth: "120px",
          width: "120px",
        },
        {
          dataType: "action",
          label: "操作",
          fixed: "right",
          operation: [
            {
              name: "查看",
              type: "text",
              clickFun: (row) => {
                this.viewDetails(row);
              },
              // showHide: (row) => {
              //   return (
              //     row.inspectionItem == "单根垂直燃烧" ||
              //     row.inspectionItem.includes("松套管") ||
              //     row.inspectionItemSubclass.includes("松套管") ||
              //     (row.inspectionItem == "抗拉强度" &&
              //       (row.inspectionItemSubclass == "热老化处理前" ||
              //         row.inspectionItemSubclass == "热老化处理后")) ||
              //     (row.inspectionItem == "断裂伸长率" &&
              //       (row.inspectionItemSubclass == "热老化处理前" ||
              //         row.inspectionItemSubclass == "热老化处理后"))
              //   );
              // },
            },
          ],
        },
      ],
      dataLookTableLoading: false,
      queryParams: {
        entrustCode: null,
        sampleCode: null,
        sample: null,
        insState: null,
        sendTimeRange: [],
      },
      page: {
        total: 0,
        size: 20,
        current: 1,
      },
      tableLoading: false,

      //old
      tableHeader: [],
      type: "",
      maxNum: 1,
      isShowMore: false,
      more: false,
      dialogVisible: false,
      viewDetailsList: [],
      unInsDialogVisible: false,
      unInsProductsData: {
        sendTime: [],
      },
      exportFees: {
        commissionFeesDate: [],
      },
      feesRule: {
        commissionFeesDate: {
          required: true,
          message: "请选择下单日期",
          trigger: "change",
        },
      },
      unInsRule: {
        sendTime: {
          required: true,
          message: "请选择下发日期",
          trigger: "change",
        },
      },
      commissionFeesDialogVisible: false,
      commissionFeesDate: null,
      orderInfoDialog: false, //订单基本信息弹框
      tableHeight: 0,
      tableMainHeight: 0,
      outLoading: false,
      trendsTable: [],
      pageSize: 20,
      total: 0,
      currentPage: 1,
      loadingTable: true,
      activeName: "0",
      tabName: null,
      tabsData: [],
      tabs: [],
      selectTab: "",
      excelForm: {
        entrustCode: null,
        sampleCode: null,
        sampleName: null,
        dateTime: null,
      },
      dialogVisibleExcel: false,
      examine: null,
      inspectorList: [], //检验人员列表
      alone: false,
      sampleUserForm: {
        entrustCode: null,
        insSampleId: null,
        userId: null,
      },
      claimVisible: false,
      tabList: [],
      active: 1,
      tabIndex: 0,
      componentDataDataLook: {
        isPage: false,
        entity: {
          id: 0,
          orderBy: {
            field: "sampleCode",
            order: "asc",
          },
        },
        isIndex: false,
        showSelect: false,
        select: false,
        do: [
          {
            id: "",
            font: "查看",
            type: "text",
            method: "viewDetails",
            showFun: (row, index) => {
              return (
                row.inspectionItem == "单根垂直燃烧" ||
                row.inspectionItem.includes("松套管") ||
                row.inspectionItemSubclass.includes("松套管") ||
                (row.inspectionItem == "抗拉强度" &&
                  (row.inspectionItemSubclass == "热老化处理前" ||
                    row.inspectionItemSubclass == "热老化处理后")) ||
                (row.inspectionItem == "断裂伸长率" &&
                  (row.inspectionItemSubclass == "热老化处理前" ||
                    row.inspectionItemSubclass == "热老化处理后"))
              );
            },
          },
        ],
        tagField: {
          insState: {
            select: [],
          },
          insResult: {
            select: [
              {
                value: 1,
                label: "合格",
                type: "success",
              },
              {
                value: 0,
                label: "不合格",
                type: "danger",
              },
              {
                value: 3,
                label: "不判定",
                type: "",
              },
            ],
          },
        },
        selectField: {},
        spanConfig: {
          rows: [
            // {
            //   name: "entrustCode",
            //   index: 0,
            // },
            // {
            //   name: "sampleCode",
            //   index: 1,
            // },
          ],
        },
        requiredAdd: [],
        requiredUp: [],
      },
      dataDialogVisible: false,

      upIndex: 0,
      planTotal: 0,
      state: 0, //0:台账页，1：检验页面,2检验页面(复核)，默认为0
      activeFace: 0, //1：下单，2：查看，3：审核，默认为0
      currentId: null,
      entityCopy: {},
      orderId: 0,
      personList: [],
      connectVisible: false,
      connect: {
        connectPerson: "",
        sonLaboratory: "",
      },
      loading: false,
      currentTime: null,
      sonLaboratoryList: [],
      userNameList: [],
      currentRow: null,
      insProductVOSData: [],
      insSampleListData: [],
      currentMonthPlanTotal: 0,
    };
  },
  created() {
    this.getLaboratoryDicts();
    this.getTypeDicts();
    this.getInsStateDicts();
    this.getAuthorizedPerson();
    this.currentTime = getYearAndMonthAndDays();
    this.getTableHeight();
    this.handleResize();
  },
  mounted() {
    window.addEventListener("resize", this.getTableHeight);
    // 监听窗口大小改变事件
    window.addEventListener("resize", this.handleResize);
  },
  beforeDestroy() {
    window.removeEventListener("resize", this.getTableHeight);
    window.removeEventListener("resize", this.handleResize);
  },
  watch: {
    more() {
      this.getTableHeight();
    },
    tabsData() {
      this.$nextTick(() => {
        this.$refs.showResultTable &&
          this.$refs.showResultTable.forEach((e) => e.doLayout());
      });
    },
  },
  methods: {
    //判断检验人中是否包含当前用户
    hasExistUserName(userName) {
      return userName.includes(this.nickName);
    },
    pagination({ page, limit }) {
      this.page.current = page;
      this.page.size = limit;
      this.getList();
    },
    getList() {
      this.tableLoading = true;
      selectInsOrderPlanList({ ...this.queryParams, ...this.page })
        .then((res) => {
          if (res.code === 200) {
            this.tableData = res.data.records;
            this.page.total = res.data.total;
          }
          this.tableLoading = false;
        })
        .catch((error) => {
          this.tableLoading = false;
          console.error(error);
        });
    },
    getCurrentMonthPlanTotal() {
      let startTime = null;
      let endTime = null;
      if (this.queryParams.sendTimeRange.length > 1) {
        startTime = this.queryParams.sendTimeRange[0].replace("T", " ");
        endTime = this.queryParams.sendTimeRange[1].replace("T", " ");
      }
      getCurrentMonthPlanTotal({
        sonLaboratory: this.queryParams.sonLaboratory,
        startTime: startTime,
        endTime: endTime,
      })
        .then((res) => {
          if (res.code === 200) {
            this.currentMonthPlanTotal = res.data;
          }
        })
        .catch((error) => {
          console.error(error);
        });
    },
    // 定义一个函数来处理视口宽度变化
    handleResize() {
      //视口宽度
      let windowWidth = window.innerWidth;
      //减去左边菜单栏宽度200，页边距40,右边的操作按钮宽度viewportWidth*33.33333%
      let viewportWidth = windowWidth - 200 - 40;
      //搜索表单最大宽度
      let formMaxWidth = viewportWidth - viewportWidth * 0.3333333;
      //单个搜索框宽度为230
      this.maxNum = formMaxWidth / 250;
    },
    // 查看详情
    viewDetails(row) {
      this.dialogVisible = true;
      if (
        row.inspectionItem.includes("松套管") ||
        row.inspectionItemSubclass.includes("松套管")
      ) {
        this.type = "松套管";
      } else {
        this.type = row.inspectionItem;
      }
      let data = {
        inspectionItem: row.inspectionItem,
        inspectionItemSubclass: row.inspectionItemSubclass,
        insProductId: row.insProductId,
        insSampleId: row.insSampleId,
        entrustCode: row.entrustCode,
        sampleCode: row.sampleCode,
      };
      viewDetails(data)
        .then((res) => {
          if (res.code === 200) {
            this.viewDetailsList = res.data;
            if (res.data[0].tableHeader) {
              this.tableHeader = res.data[0].tableHeader;
            } else {
              this.tableHeader = [
                {
                  testValue0: "",
                },
              ];
            }
          }
        })
        .catch((error) => {
          console.error(error);
        });
    },
    handleCommand(command) {
      switch (command) {
        case "showInsResults":
          //查询检验结果
          this.excelExport();
          break;
        case "exportFees":
          //导出委托费用
          this.commissionFeesDialogVisible = true;
          break;
        case "exportUnInsProducts":
          //导出待检信息
          this.unInsDialogVisible = true;
          break;
      }
    },
    // 导出委托费用
    exportcommissionFees() {
      this.$refs.exportFees.validate((valid) => {
        if (valid) {
          let data = {
            startTime: this.exportFees.commissionFeesDate[0],
            endTime: this.exportFees.commissionFeesDate[1],
          };
          exportCommissionFees(data)
            .then((res) => {
              transformExcel(res, "委托费用统计.xlsx");
              this.$nextTick(() => {
                this.$message.success("导出成功");
                this.commissionFeesDate = null;
                this.commissionFeesDialogVisible = false;
              });
            })
            .catch((error) => {
              console.error(error);
            });
        }
      });
    },
    handleCloseCommissionFees() {
      this.exportFees.commissionFeesDate = null;
      this.commissionFeesDialogVisible = false;
      this.$refs.exportFees.resetFields();
    },
    // 导出待检任务
    exportUnInsProductsFun() {
      this.$refs.exportUnInsProducts.validate((valid) => {
        if (valid) {
          let data = {
            startDate: this.unInsProductsData.sendTime[0],
            endDate: this.unInsProductsData.sendTime[1],
            entrustCode: this.queryParams.entrustCode,
            insState: this.queryParams.insState,
            sampleCode: this.queryParams.sampleCode,
            sample: this.queryParams.sample,
            sonLaboratory: this.queryParams.sonLaboratory,
          };
          console.log(data);
          exportUnInsProducts(data)
            .then((res) => {
              transformExcel(res, "待检任务统计.xlsx");
              this.$nextTick(() => {
                this.$message.success("导出成功");
                this.handleCloseUnInsDialog();
              });
            })
            .catch((error) => {
              console.error(error);
            });
        }
      });
    },
    handleCloseUnInsDialog() {
      this.unInsProductsData.sendTime = [];
      this.unInsDialogVisible = false;
      this.$refs.exportUnInsProducts.resetFields();
    },
    //前往复核按钮权限校验
    premissionReviewFun() {
      if (this.currentRow) {
        let row = this.currentRow;
        return !(
          row.userName == null ||
          row.insState != 3 ||
          (row.checkName && !row.checkName.includes(this.nickName))
        );
      }
    },
    //前往复核方法
    goReview(currentRow) {
      this.dataDialogVisible = false;
      this.$nextTick(() => {
        this.handleReview(currentRow);
      });
    },
    //查看检验结果-计算表格列宽度
    calcTableColumnWidth(columnName) {
      let width = 120;
      if (columnName) {
        let clacWidth = 20 * columnName.length;
        width = clacWidth > width ? clacWidth : width;
      }
      return width;
    },
    getTableHeight() {
      const outherMainHeight = this.more ? 386 : 336; //主表格其余高度
      const otherHeight = 320; // 其余高度
      const tableH = 50; // 距离页面下方的高度
      const tableHeightDetil = window.innerHeight - tableH;
      if (tableHeightDetil <= 300) {
        this.tableHeight = 200;
        this.tableMainHeight = 200;
      } else {
        this.tableHeight = window.innerHeight - tableH - otherHeight;
        this.tableMainHeight = window.innerHeight - tableH - outherMainHeight;
      }
    },
    // 导出查看结果数据
    excelExportTrends() {
      this.$message.warning("正在导出 请稍后...");
      this.outLoading = true;
      exportInsOrderPlanResult({
        sampleType: this.tabName,
        sonLaboratory: this.selectTab,
        entrustCode: this.excelForm.entrustCode,
        sampleCode: this.excelForm.sampleCode,
        createUser: this.excelForm.sampleName,
        insTime: this.excelForm.dateTime,
        headerS: JSON.stringify(this.tableHeader),
      })
        .then((res) => {
          this.outLoading = false;
          this.$message.success("导出成功");
          const blob = new Blob([res], { type: "application/octet-stream" });
          const url = URL.createObjectURL(blob);
          const link = document.createElement("a");
          link.href = url;
          link.download = "检验结果.xlsx";
          link.click();
        })
        .catch((error) => {
          console.error(error);
        });
    },
    handleClose3() {
      this.dialogVisible = false;
    },
    handleSizeChange(val) {
      this.pageSize = val;
      let table = JSON.parse(JSON.stringify(this.trendsTable));
      this.tabsData = table.slice(0, val);
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      let table = JSON.parse(JSON.stringify(this.trendsTable));
      this.tabsData = table.slice(
        (val - 1) * this.pageSize,
        val * this.pageSize
      );
      console.log(`当前页: ${val}`);
    },
    handleClick(tab, event) {
      this.tabName = this.tabs[tab.name];
      this.getTabHeader(this.tabs[tab.name]);
    },
    excelSearch() {
      this.getTabHeader(this.tabName);
    },
    // 导出弹框获取tabs页标签
    excelExport() {
      this.resetForm();
      this.outLoading = false;
      this.activeName = "0";
      if (this.selectTab == null || this.selectTab == "") {
        this.selectTab = this.tabList[0].value;
      }
      this.loadingTable = true;
      getTabHeader({
        sonLaboratory: this.selectTab,
        samples: "",
      })
        .then((res) => {
          if (res.code === 200) {
            this.tabs = res.data.tabHeader;
            this.tabName = this.tabs[0];
            this.getTabHeader(this.tabs[0]); // 获取动态表头
          }
        })
        .catch((error) => {
          console.error(error);
        });
      this.dialogVisibleExcel = true;
    },
    // samples获取动态表头
    getTabHeader(samples) {
      getTabHeader({
        sonLaboratory: this.selectTab,
        samples: samples,
      })
        .then((res) => {
          if (res.code === 200) {
            this.loadingTable = true;
            this.tableHeader = [];
            this.tableHeader = res.data.tableHeader;
            let data = {
              sampleType: samples,
              sonLaboratory: this.selectTab,
              entrustCode: this.excelForm.entrustCode,
              sampleCode: this.excelForm.sampleCode,
              createUser: this.excelForm.sampleName,
              insTime: this.excelForm.dateTime,
              headerS: JSON.stringify(this.tableHeader),
            };
            if (samples == "温度循环") {
              // 获取表格数据
              getInsOrderTemList(data)
                .then((res) => {
                  if (res.code === 200) {
                    this.tabsData = [];
                    this.trendsTable = res.data;
                    // 分页
                    this.total = this.trendsTable.length;
                    this.tabsData = res.data.slice(0, this.pageSize);
                    this.loadingTable = false;
                  }
                })
                .catch((error) => {
                  console.error(error);
                });
            } else {
              // 获取表格数据
              getInsOrderPlanList(data)
                .then((res) => {
                  if (res.code === 200) {
                    this.tabsData = [];
                    this.trendsTable = res.data;
                    // 分页
                    this.total = this.trendsTable.length;
                    this.tabsData = res.data.slice(0, this.pageSize);
                    this.loadingTable = false;
                  }
                })
                .catch((error) => {
                  console.error(error);
                });
            }
          }
        })
        .catch((error) => {
          console.error(error);
        });
    },
    // 清空表单
    resetForm() {
      this.excelForm = {
        entrustCode: null,
        sampleCode: null,
        sampleName: null,
        dateTime: null,
      };
    },

    // 数据查看
    handleDataLook(row) {
      this.dataLookTableLoading = true;
      selectSampleAndProductByOrderId({ id: row.id })
        .then((res) => {
          if (res.code === 200) {
            this.dataLooktableData = res.data;
          }
          this.dataLookTableLoading = false;
        })
        .catch((error) => {
          console.error(error);
          this.dataLookTableLoading = false;
        });
      this.dataDialogVisible = true;
    },
    changeCheckBox(val) {
      this.queryParams.userId = val ? 0 : null;
      this.refreshTable();
    },
    refresh() {
      if (this.tabList.length > 0) {
        this.tabIndex = 0;
        this.queryParams.sonLaboratory = this.tabList[0].value;
      }
      this.refreshTable();
    },
    claimFun(row) {
      if (row) {
        this.sampleUserForm = {
          entrustCode: row.entrustCode,
          insSampleId: row.id,
          sonLaboratory: row.sonLaboratory,
        };
        this.claimVisible = true;
      }
    },
    confirmClaim() {
      this.loading = true;
      claimInsOrderPlan(this.sampleUserForm)
        .then((res) => {
          if (res.code === 200 && res.data) {
            this.loading = false;
            this.$message.success("认领成功");
            this.claimVisible = false;
            this.refreshTable("page");
          }
        })
        .catch((error) => {
          console.error(error);
          this.loading = false;
        });
    },
    refreshTable() {
      this.getList();
      this.$nextTick(() => {
        this.getCurrentMonthPlanTotal();
      });
    },
    changeRowClass({ row, rowIndex }) {
      if (this.currentTime == row.appointed) {
        return "highlight-warning-row-border";
      } else if (this.currentTime > row.appointed) {
        return "highlight-danger-row-border";
      }
      return "";
    },
    onReset() {
      this.searchForm = {
        sampleName: null,
        state: null,
      };
      this.componentData.entity.insState = null;
      this.componentData.entity.sampleName = null;
      this.refreshTable();
    },
    onSubmit() {
      this.componentData.entity.insState = this.searchForm.state;
      this.componentData.entity.sampleName = this.searchForm.sampleName;
      this.$nextTick(() => {
        this.refreshTable();
      });
    },
    handleTab(m, i) {
      console.log("aaa", m, i);
      this.selectTab = m.value;
      this.tabIndex = i;
      this.queryParams.sonLaboratory = m.value;
      this.refreshTable();
    },
    getTypeDicts() {
      getDicts("urgency_level")
        .then((res) => {
          if (res.code === 200) {
            this.urgencyDictList = res.data;
          }
        })
        .catch((error) => {
          console.error(error);
        });
    },
    getInsStateDicts() {
      getDicts("inspection_task_state")
        .then((res) => {
          if (res.code === 200) {
            this.insStateList = res.data;
          }
        })
        .catch((error) => {
          console.error(error);
        });
      // this.$axios
      //   .post(this.$api.enums.selectEnumByCategory, {
      //     category: "",
      //   })
      //   .then((res) => {
      //     let data = res.data;

      //     data.forEach((ele) => {
      //       //0:待检验 1:检验中 2:已检验 3:待复核 4:复核未通过 5:复核通过
      //       if (["2", "5"].includes(ele.value)) {
      //         ele.type = "success";
      //       } else if (["1", "3"].includes(ele.value)) {
      //         ele.type = "warning";
      //       } else if (["0", "4"].includes(ele.value)) {
      //         ele.type = "danger";
      //       }
      //     });
      //     this.componentData.tagField.insState.select = data;
      //   });
    },
    getLaboratoryDicts() {
      getDicts("sys_sub_lab")
        .then((res) => {
          if (res.code === 200) {
            this.tabList = res.data.map((ele) => {
              return {
                label: ele.dictLabel,
                value: ele.dictValue,
              };
            });
            if (this.tabList.length > 0) {
              this.queryParams.sonLaboratory = this.tabList[0].value;
            }
            this.refreshTable();
          }
        })
        .catch((error) => {
          console.error(error);
        });
    },
    selectAllByOne(row) {
      this.$router.push({
        name: "showDetails",
        query: {
          active: 2,
          currentId: row.id,
          examine: 1,
          isPlan: true,
        },
      });
    },
    //查看委托单基本信息
    selectOrderInfo(row) {
      if (row) {
        getSampleInfoByOrderId({
          id: row.id,
          sonLaboratory: row.sonLaboratory,
        })
          .then((res) => {
            if (res.code == 200) {
              this.insSampleListData = res.data.insSamples;
              this.insProductVOSData = res.data.insProductVOS;
            }
          })
          .catch((error) => {
            console.error(error);
          });
      }
      this.$nextTick(() => {
        this.orderInfoDialog = true;
      });
    },
    playOrder(num) {
      this.activeFace = num;
    },
    goback() {
      this.state = 0;
      this.refreshTable("page");
    },
    handleInspection(row) {
      //当前检验任务的检验人列表
      let inspectorList = [];
      if (row.userName) {
        inspectorList = row.userName.split(",");
      }
      inspectorList.push(this.nickName);
      this.$router.push({
        name: "Inspection",
        params: {
          inspectorList: inspectorList,
          state: 1,
          orderId: row.id,
          sonLaboratory: this.queryParams.sonLaboratory,
          handover: this.personList,
        },
      });

      // this.inspectorList = inspectorList;
      // this.state = 1;
      // this.orderId = row.id;
    },
    handleConnect(row) {
      this.orderId = row.id;
      this.connect = {
        connectPerson: "",
        sonLaboratory: "",
      };
      this.userNameList = row.userName.split(",");
      this.connectVisible = true;
      upPlanUser2({
        orderId: this.orderId,
      })
        .then((res) => {
          if (res.code === 200 && res.data.length > 0) {
            this.sonLaboratoryList = [];
            res.data.forEach((m) => {
              this.sonLaboratoryList.push({
                value: m,
                label: m,
              });
            });
            this.connect.sonLaboratory = row.sonLaboratory;
          }
        })
        .catch((error) => {
          console.error(error);
        });
    },
    confirmConnect() {
      if (
        this.connect.connectPerson == null ||
        this.connect.connectPerson == "" ||
        this.connect.connectPerson == undefined
      ) {
        this.$message.error("未选择交接人员");
        return;
      }
      if (
        this.connect.sonLaboratory == null ||
        this.connect.sonLaboratory == "" ||
        this.connect.sonLaboratory == undefined
      ) {
        this.$message.error("未选择试验室");
        return;
      }
      this.loading = true;
      upPlanUser({
        orderId: this.orderId,
        userId: this.connect.connectPerson,
        sonLaboratory: this.connect.sonLaboratory,
      })
        .then((res) => {
          if (res.code === 200) {
            this.loading = false;
            this.$message.success("操作成功");
            this.refreshTable("page");
          }
          this.connectVisible = false;
        })
        .catch((error) => {
          console.error(error);
          this.loading = false;
        });
    },
    handleReview(row) {
      this.state = 2;
      this.orderId = row.id;
    },
    getAuthorizedPerson() {
      getLaboratoryPersonList()
        .then((res) => {
          if (res.code === 200) {
            this.personList = res.data;
          }
        })
        .catch((error) => {
          console.error(error);
        });
    },
    handleClose(done) {
      done();
    },
    getStyle() {
      return "height: calc(100% - " + (this.more ? "94" : "44") + "px)";
    },
  },
};
</script>

<style></style>
<style scoped lang="scss">
.ins-order-plan-main .title {
  font-size: 20px;
  color: #3a7bfa;
}

.search {
  background-color: #fff;
  display: flex;
  align-items: center;
}

.search_thing {
  display: flex;
  align-items: center;
  height: 50px;
  width: 230px;
}

.search_label {
  /* width: 90px; */
  font-size: 14px;
  text-align: right;
}

.search_input {
  width: calc(100% - 70px);
}

.ins-order-plan-main .search {
  width: 100%;
  margin-bottom: 10px;
  height: 80px;
  background-color: #fff;
  border-radius: 3px;
}

.search .form-inline {
  height: 50px;
  padding-top: 20px;
  padding-left: 20px;
}

.tab {
  list-style-type: none;
  display: flex;
  padding-inline-start: 0px;
}

.tab li {
  line-height: 24px;
  padding: 6px 14px;
  font-size: 14px;
  color: #333333;
  border: 1px solid #eeeeee;
  cursor: pointer;
}

.tab li:nth-child(1) {
  border-radius: 8px 0 0 8px;
}

.tab li:nth-last-child(1) {
  border-radius: 0 8px 8px 0;
}

.tab li.active {
  border-color: #3a7bfa;
  color: #3a7bfa;
}

.center .center-options .center-title {
  display: flex;
  align-items: center;
  justify-content: right;
  text-align: right;
  span:last-child {
    color: #3a7bfa;
    font-size: 23px;
    font-weight: 400;
  }
  p:last-child {
    margin-left: 20px;
  }
}

.view-self-checkbox {
  margin-left: 50px;
}
.ins-order-plan-main .el-form-item__label {
  color: #000;
}

.ins-order-plan-main .el-table th.el-table__cell > .cell {
  height: 46px;
  line-height: 30px;
}
</style>