syntec3-0-ui-components-test 1.0.0

package/src/views/productionWorkOrder/index.vue

@@ -0,0 +1,2174 @@
+<template>
+  <div data-test-id="DIV-CHFzZk">
+    <pageContent v-loading="loadingShow" :is-tab="false" :is-view="true" data-test-id="PAGECONTENT-izX8Nl">
+      <template #viewContent>
+        <viewTabs
+          ref="viewTabsRef"
+          :key="tabKey"
+          :page-data="permissionData"
+          :view-type="isCanOperation"
+          :tabs="allViewTabs"
+          :view-id-from-list="viewIdFromList"
+          data-test-id="VIEWTABS-Q9kTH3"
+          @tabClick="handleTabClick"
+          @openLogDrawer="openViewRecordDrawer"
+          @openViewDrawer="openViewListDrawer"
+          @tabUpdate="handleTabUpdate"
+        />
+      </template>
+      <template #searchContent>
+        <customFilter
+          ref="querySearchRef"
+          :can-edit-headers="canEditHeaders"
+          data-test-id="CUSTOMFILTER-7SqxcZ"
+          :permission-code="'PMC_101000'"
+          @filterSearch="query"
+          @parentSaveData="saveData"
+        />
+      </template>
+      <template #headerContent>
+        <div
+          v-for="item in topButtons.filter((it) => !it.isFold && !it.isBatch && !it.isAdvanced)"
+          :key="item.key"
+          data-test-id="DIV-PSkh9W"
+        >
+          <el-button link type="primary" data-test-id="EL-BUTTON-W21EYJ" @click="item.func()">
+            <v-icon :class="item.icon" style="margin-right: 0.5rem" data-test-id="V-ICON-u6sfaW" />
+            {{ t(item.describe) }}
+          </el-button>
+        </div>
+        <!-- 批量操作 -->
+        <el-dropdown
+          v-if="topButtons.filter((it) => it.isBatch).length"
+          ref="dropdownRef"
+          :hide-on-click="false"
+          trigger="click"
+          data-test-id="EL-DROPDOWN-KOLxvB"
+        >
+          <el-button link type="primary" data-test-id="EL-BUTTON-uL3lAP">
+            <v-icon class="mdi mdi-format-list-bulleted" style="margin-right: 0.5rem" data-test-id="V-ICON-6WYKtV" />
+            {{ t('batchOperation') }}
+          </el-button>
+          <template #dropdown>
+            <el-dropdown-menu data-test-id="EL-DROPDOWN-MENU-fP2RDK">
+              <el-dropdown-item
+                v-for="item in topButtons.filter((it) => it.isBatch).sort((a, b) => a.order - b.order)"
+                :key="item.key"
+                data-test-id="EL-DROPDOWN-ITEM-BHWWZO"
+              >
+                <el-button link type="primary" data-test-id="EL-BUTTON-tirddF" @click="item.func(item.type)">
+                  <div
+                    v-if="!conditionalRequirements(item)"
+                    style="display: flex; align-items: center"
+                    data-test-id="DIV-pPQOZG"
+                  >
+                    <v-icon :class="item.icon" style="margin-right: 0.5rem" data-test-id="V-ICON-5ULA2e" />
+                    {{ t(item.describe) }}
+                  </div>
+                  <el-tooltip
+                    v-else
+                    :content="conditionalRequirements(item)"
+                    placement="top"
+                    :enterable="false"
+                    data-test-id="EL-TOOLTIP-06r65V"
+                  >
+                    <div style="display: flex; align-items: center" data-test-id="DIV-MrnYf0">
+                      <v-icon :class="item.icon" style="margin-right: 0.5rem" data-test-id="V-ICON-gBKlq2" />
+                      {{ t(item.describe) }}
+                    </div>
+                  </el-tooltip>
+                </el-button>
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+        <!-- 更多操作 -->
+        <el-dropdown
+          v-if="topButtons.filter((it) => it.isFold).length"
+          ref="dropdownRef"
+          :hide-on-click="false"
+          trigger="click"
+          data-test-id="EL-DROPDOWN-EJWfJj"
+        >
+          <el-button link type="primary" data-test-id="EL-BUTTON-2AAYEN">
+            <v-icon
+              class="mdi mdi-dots-horizontal-circle-outline"
+              style="margin-right: 0.5rem"
+              data-test-id="V-ICON-5TLIK9"
+            />
+            {{ t('moreActions') }}
+          </el-button>
+          <template #dropdown>
+            <el-dropdown-menu data-test-id="EL-DROPDOWN-MENU-yjg6mt">
+              <el-dropdown-item
+                v-for="item in topButtons.filter((it) => it.isFold === true).sort((a, b) => a.order - b.order)"
+                :key="item.key"
+                data-test-id="EL-DROPDOWN-ITEM-m1enDJ"
+              >
+                <el-button link type="primary" data-test-id="EL-BUTTON-WJ2TmP" @click="item.func(item.type)">
+                  <div
+                    v-if="!conditionalRequirements(item)"
+                    style="display: flex; align-items: center"
+                    data-test-id="DIV-OZ8ZH4"
+                  >
+                    <v-icon :class="item.icon" style="margin-right: 0.5rem" data-test-id="V-ICON-FFdWil" />
+                    {{ t(item.describe) }}
+                  </div>
+                  <el-tooltip
+                    v-else
+                    :content="conditionalRequirements(item)"
+                    placement="top"
+                    :enterable="false"
+                    data-test-id="EL-TOOLTIP-3i726d"
+                  >
+                    <div style="display: flex; align-items: center" data-test-id="DIV-gke81Q">
+                      <v-icon :class="item.icon" style="margin-right: 0.5rem" data-test-id="V-ICON-s8xdOz" />
+                      {{ t(item.describe) }}
+                    </div>
+                  </el-tooltip>
+                </el-button>
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+        <!-- 进阶操作 -->
+        <el-dropdown
+          v-if="topButtons.filter((it) => it.isAdvanced).length"
+          ref="dropdownRef"
+          :hide-on-click="false"
+          trigger="click"
+          data-test-id="EL-DROPDOWN-RK0HII"
+        >
+          <el-button link type="primary" data-test-id="EL-BUTTON-BPBjDD">
+            <v-icon class="mdi mdi-format-list-bulleted" style="margin-right: 0.5rem" data-test-id="V-ICON-hGQVCU" />
+            {{ t('advancedOperation') }}
+          </el-button>
+          <template #dropdown>
+            <el-dropdown-menu data-test-id="EL-DROPDOWN-MENU-EmB3sR">
+              <el-dropdown-item
+                v-for="item in topButtons.filter((it) => it.isAdvanced).sort((a, b) => a.order - b.order)"
+                :key="item.key"
+                data-test-id="EL-DROPDOWN-ITEM-n7j8U8"
+              >
+                <el-button link type="primary" data-test-id="EL-BUTTON-tirddF" @click="item.func()">
+                  <div
+                    v-if="!conditionalRequirements(item)"
+                    style="display: flex; align-items: center"
+                    data-test-id="DIV-UfDjKO"
+                  >
+                    <v-icon :class="item.icon" style="margin-right: 0.5rem" data-test-id="V-ICON-mn4JnI" />
+                    {{ t(item.describe) }}
+                  </div>
+                  <el-tooltip
+                    v-else
+                    :content="conditionalRequirements(item)"
+                    placement="top"
+                    :enterable="false"
+                    data-test-id="EL-TOOLTIP-Qvpo5M"
+                  >
+                    <div style="display: flex; align-items: center" data-test-id="DIV-BkjGeh">
+                      <v-icon :class="item.icon" style="margin-right: 0.5rem" data-test-id="V-ICON-a7Ae5f" />
+                      {{ t(item.describe) }}
+                    </div>
+                  </el-tooltip>
+                </el-button>
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+      </template>
+      <template #tableContent>
+        <el-table
+          ref="multipleTableRef"
+          v-loading="tableLoading"
+          v-shift-select:multipleTableRef
+          border
+          style="margin-bottom: 1rem"
+          :data="dessertsList"
+          height="100%"
+          header-row-class-name="tableHeader"
+          header-cell-class-name="tableHeaderCell"
+          scrollbar-always-on
+          data-test-id="EL-TABLE-iLns7K"
+          :summary-method="
+            function (param) {
+              return summation.getSummaries(param, customFieldsList, [
+                'productionOrderRequiredThroughput',
+                'inboundQuantity',
+                'returnQuantity',
+                'inboundRemain',
+              ]);
+            }
+          "
+          show-summary
+          :default-sort="{ prop: 'consDate', order: 'descending' }"
+          @selection-change="handleSelectionChange"
+          @cell-mouse-enter="handleCellMouseEnter"
+          @cell-mouse-Leave="handleCellMouseLeave"
+          @sort-change="handleSortChange"
+          @row-click="handleRowClick"
+        >
+          <el-table-column
+            align="center"
+            fixed="left"
+            type="selection"
+            width="60"
+            data-test-id="EL-TABLE-COLUMN-EV5MI4"
+          />
+          <el-table-column
+            align="center"
+            label="#"
+            fixed
+            type="index"
+            width="70"
+            show-overflow-tooltip
+            data-test-id="EL-TABLE-COLUMN-OPEP89"
+          >
+            <template #default="scope">
+              <span data-test-id="SPAN-XdHSqC">{{ calcIndex(scope.$index) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            v-for="item in tableHeaders"
+            :key="String(item.value)"
+            :prop="String(item.value)"
+            :fixed="item.isFixed ? 'left' : false"
+            :label="item.text"
+            :sortable="
+              [
+                'consDate',
+                'modiDate',
+                'orderExpectedDue',
+                'productionOrderExpectedStartDate',
+                'productionOrderExpectedDueDate',
+              ].includes(item.value)
+                ? 'custom'
+                : false
+            "
+            align="center"
+            show-overflow-tooltip
+            :min-width="
+              ['orderExpectedDue', 'productionOrderExpectedStartDate', 'productionOrderExpectedDueDate'].includes(
+                item.value,
+              )
+                ? 140
+                : 120
+            "
+            :width="item.isCustom ? getColumnWidth(item.text, String(item.value), dessertsList, 200) : 'auto'"
+            data-test-id="EL-TABLE-COLUMN-SRbkra"
+          >
+            <template #header>
+              <span v-if="item.value === 'productionOrderPriority'" data-test-id="SPAN-xb7qiL">
+                {{ item.text }}
+                <el-tooltip placement="top" effect="light" data-test-id="EL-TOOLTIP-FB51l8">
+                  <i class="mdi mdi-information" data-test-id="I-LHAacq" />
+                  <template #content>
+                    <div v-for="(value, key, index) in priorityStatus" :key="index" data-test-id="DIV-RFpwHc">
+                      <v-icon
+                        :class="getPriorityIcon(value)"
+                        :style="`color: ${getPriorityColor(value)};`"
+                        data-test-id="V-ICON-ZdtNsf"
+                      />
+                      <span style="color: black; padding: 5px" data-test-id="SPAN-oEOumL">{{ t(`${key}`) }}</span>
+                    </div>
+                  </template>
+                </el-tooltip>
+              </span>
+              <span v-else-if="item.text.length > 16" data-test-id="SPAN-3cIjB7">
+                <el-tooltip :content="item.text" placement="top" :enterable="false" data-test-id="EL-TOOLTIP-r1wgMI">
+                  {{ item.text.slice(0, 16) }}...
+                </el-tooltip>
+              </span>
+              <span v-else data-test-id="SPAN-snsDYW">
+                {{ item.text }}
+                <el-tooltip
+                  v-if="item.fieldTypeId === 9"
+                  data-test-id="EL-TOOLTIP-SADWo"
+                  class="box-item"
+                  effect="dark"
+                  :content="fieldToText(item)"
+                  placement="top"
+                >
+                  <v-icon class="mdi mdi-information" data-test-id="V-ICON-ASDWD-DWDAq" />
+                </el-tooltip>
+              </span>
+            </template>
+            <template #default="scope">
+              <span v-if="item.isCustom" data-test-id="SPAN-RWld6r">
+                <span
+                  v-if="item.fieldTypeId === 5"
+                  data-test-id="SPAN-SELaOu"
+                  @click="handleClickPreview(item.customFieldId, scope.row.docCustomFieldAndValues)"
+                >
+                  <div
+                    v-for="(fileItem, fileItemIndex) in getValue(item.customFieldId, scope.row.docCustomFieldAndValues)"
+                    :key="fileItemIndex"
+                    :style="
+                      getValue(item.customFieldId, scope.row.docCustomFieldAndValues) === '-'
+                        ? {}
+                        : { color: '#125088', cursor: 'pointer' }
+                    "
+                    class="ellipsis-single-line"
+                    data-test-id="DIV-EU7OcV"
+                  >
+                    {{ fileItem
+                    }}<span
+                      v-if="fileItemIndex < getValue(item.customFieldId, scope.row.docCustomFieldAndValues).length - 1"
+                      data-test-id="SPAN-3XEGH8"
+                      >,
+                    </span>
+                  </div>
+                </span>
+                <span
+                  v-else-if="
+                    item.fieldTypeId === 6 && getValue(item.customFieldId, scope.row.docCustomFieldAndValues) !== '-'
+                  "
+                  class="a-text-class"
+                  data-test-id="SPAN-MhG75h"
+                  @click="hyperLinkClick(item, scope.row.docCustomFieldAndValues)"
+                >
+                  {{ getValue(item.customFieldId, scope.row.docCustomFieldAndValues) }}
+                </span>
+                <span
+                  v-else-if="
+                    item.fieldTypeId === 7 && getValue(item.customFieldId, scope.row.docCustomFieldAndValues) !== '-'
+                  "
+                  data-test-id="SPAN-qOqzQw"
+                >
+                  <el-tag type="info" style="margin-right: 0.5rem" round data-test-id="EL-TAG-UOwz6R">
+                    {{ getValue(item.customFieldId, scope.row.docCustomFieldAndValues) }}
+                  </el-tag>
+                </span>
+                <span
+                  v-else-if="
+                    item.fieldTypeId === 8 && getValue(item.customFieldId, scope.row.docCustomFieldAndValues) !== '-'
+                  "
+                  data-test-id="SPAN-xCDH3f"
+                >
+                  <el-tag
+                    v-for="(multipleItem, multipleItemIndex) in getValue(
+                      item.customFieldId,
+                      scope.row.docCustomFieldAndValues,
+                    )"
+                    :key="multipleItemIndex"
+                    type="info"
+                    style="margin-right: 0.5rem"
+                    round
+                    data-test-id="EL-TAG-6Tq8m3"
+                  >
+                    {{ multipleItem }}
+                  </el-tag>
+                </span>
+                <span v-else-if="item.fieldTypeId === 9" data-test-id="SPAN-uyqrrqwftkV">
+                  {{ getValue(item.customFieldId, scope.row.docCustomFieldAndValues) }}
+                </span>
+                <span v-else data-test-id="SPAN-uyqrkV">
+                  {{ getValue(item.customFieldId, scope.row.docCustomFieldAndValues) }}
+                </span>
+              </span>
+              <span v-if="item.value === 'originalOrderType'" data-test-id="SPAN-yJo5oK">
+                {{
+                  scope.row[item.value] === 1
+                    ? t('productionPlanList')
+                    : scope.row[item.value] === 2
+                      ? t('saleOrder')
+                      : '-'
+                }}
+              </span>
+              <span v-if="item.value === 'originalOrderNumber'" data-test-id="SPAN-i9U4Uc">
+                {{ scope.row.productionPlanNumber ? scope.row.productionPlanNumber : '-' }}
+              </span>
+              <span v-if="item.value === 'orderExpectedDue'" data-test-id="SPAN-uN7zIj">
+                {{ scope.row.orderExpectedDue ? dayjs(scope.row.orderExpectedDue).format('YYYY-MM-DD') : '--' }}
+              </span>
+              <span v-if="item.value === 'productionOrderExpectedStartDate'" data-test-id="SPAN-gSzuJR">
+                {{
+                  scope.row.productionOrderExpectedStartDate
+                    ? dayjs(scope.row.productionOrderExpectedStartDate).format('YYYY-MM-DD')
+                    : '--'
+                }}
+              </span>
+              <span v-if="item.value === 'productionOrderStatus'" data-test-id="SPAN-STqv4M">
+                <el-tag
+                  :style="`color:${tagStatusColor(scope.row.productionOrderStatus)}`"
+                  style="margin-left: 4px"
+                  :color="getChipStatusColor(scope.row.productionOrderStatus)"
+                  data-test-id="EL-TAG-mfRiQa"
+                >
+                  {{ t(getStatusKeys(scope.row.productionOrderStatus)) }}
+                </el-tag>
+              </span>
+              <span v-if="item.value === 'productionOrderExpectedDueDate'" data-test-id="SPAN-c7MzLy">
+                {{
+                  scope.row.productionOrderExpectedDueDate
+                    ? dayjs(scope.row.productionOrderExpectedDueDate).format('YYYY-MM-DD')
+                    : '--'
+                }}
+              </span>
+              <span v-if="item.value === 'consDate'" data-test-id="SPAN-jYeTU7">
+                {{ scope.row.consDate ? dayjs(scope.row.consDate).format('YYYY-MM-DD HH:mm:ss') : '--' }}
+              </span>
+              <span v-if="item.value === 'modiDate'" data-test-id="SPAN-oGaJQq">
+                {{ scope.row.modiDate ? dayjs(scope.row.modiDate).format('YYYY-MM-DD HH:mm:ss') : '--' }}
+              </span>
+              <!-- 物料档案栏位 -->
+              <span
+                v-if="item.value === 'productionOrderMaterialFileList'"
+                :data-test-id="`SPAN-3fw4dN-productionWorkOrder-${scope.$index}`"
+              >
+                <span
+                  v-if="getMaterialFileValue(scope.row.productionOrderMaterialFileList) !== '-'"
+                  :data-test-id="`SPAN-AtTCmZ-productionWorkOrder-${scope.$index}`"
+                  @click="handleClickPreviewOfMaterialPart(scope.row.productionOrderMaterialFileList)"
+                >
+                  <div
+                    v-for="(fileItem, fileItemIndex) in getMaterialFileValue(scope.row.productionOrderMaterialFileList)"
+                    :key="fileItemIndex"
+                    :style="
+                      getMaterialFileValue(scope.row.productionOrderMaterialFileList) === '-'
+                        ? {}
+                        : { color: '#125088', cursor: 'pointer' }
+                    "
+                    class="ellipsis-single-line"
+                    :data-test-id="`DIV-YHhYGn-productionWorkOrder-${scope.$index}-${fileItemIndex}`"
+                  >
+                    {{ fileItem
+                    }}<span
+                      v-if="fileItemIndex < getMaterialFileValue(scope.row.productionOrderMaterialFileList).length - 1"
+                      :data-test-id="`SPAN-rY5kit-productionWorkOrder-${scope.$index}-${fileItemIndex}`"
+                      >,
+                    </span>
+                  </div>
+                </span>
+                <span v-else :data-test-id="`SPAN-nTsmtc-productionWorkOrder-${scope.$index}`">--</span>
+              </span>
+              <span v-if="item.value === 'materialSpec'" data-test-id="SPAN-3fw4dN">
+                {{ !scope.row.materialSpec && scope.row.materialSpec !== 0 ? '--' : scope.row.materialSpec }}
+              </span>
+              <span v-if="item.value === 'productionOrderPriority'" data-test-id="SPAN-qfLcCp">
+                <div class="mr-2" data-test-id="DIV-bVkCru">
+                  <v-icon
+                    :class="getPriorityIcon(scope.row.productionOrderPriority)"
+                    :style="`color: ${getPriorityColor(scope.row.productionOrderPriority)};`"
+                    data-test-id="V-ICON-qSsT49"
+                  />
+                </div>
+              </span>
+              <span v-if="item.value === 'inboundRemain'" data-test-id="SPAN-dfgdfs-inboundRemain">
+                {{ scope.row.inboundRemain < 0 ? 0 : scope.row.inboundRemain }}
+              </span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            align="center"
+            fixed="right"
+            width="120"
+            :label="t('action')"
+            data-test-id="EL-TABLE-COLUMN-y1IHkd"
+          >
+            <template #default="scope">
+              <div style="display: flex; justify-content: space-evenly" data-test-id="DIV-4r7bpj">
+                <el-tooltip
+                  v-if="checkButtonisExist('PMC_101000_012')"
+                  :content="t('edit')"
+                  placement="top"
+                  :enterable="false"
+                  data-test-id="EL-TOOLTIP-wcany6"
+                >
+                  <el-button link type="primary" data-test-id="EL-BUTTON-fhOy3W" @click="editem(scope.row)">
+                    <i class="mdi mdi-pencil" style="font-size: 1.5rem" data-test-id="I-wtPm5k" />
+                  </el-button>
+                </el-tooltip>
+                <el-dropdown
+                  v-if="
+                    checkButtonArrisExist([
+                      'PMC_101000_013',
+                      'PMC_101000_014',
+                      'PMC_101000_015',
+                      'PMC_101000_020',
+                      'PMC_101000_021',
+                    ])
+                  "
+                  data-test-id="EL-DROPDOWN-zlO8h4"
+                >
+                  <el-button link type="primary" data-test-id="EL-BUTTON-uA7w8w">
+                    <i class="mdi mdi-cog" style="font-size: 1.5rem" data-test-id="I-8yTjsa" />
+                  </el-button>
+                  <template #dropdown>
+                    <el-dropdown-menu data-test-id="EL-DROPDOWN-MENU-leueH8">
+                      <el-dropdown-item
+                        v-if="checkButtonisExist('PMC_101000_013')"
+                        data-test-id="EL-DROPDOWN-ITEM-IqLtY5"
+                        @click="printBtnClick(scope.row)"
+                      >
+                        <el-button link type="primary" data-test-id="EL-BUTTON-XEHczv">
+                          <v-icon
+                            class="mdi mdi-cloud-print"
+                            style="margin-right: 0.5rem"
+                            data-test-id="V-ICON-hu3Q4h"
+                          />
+                          {{ t('print') }}
+                        </el-button>
+                      </el-dropdown-item>
+                      <el-dropdown-item data-test-id="EL-DROPDOWN-ITEM-Hlkvk9">
+                        <el-button
+                          v-if="checkButtonisExist('PMC_101000_014')"
+                          link
+                          type="primary"
+                          data-test-id="EL-BUTTON-LU2sQs"
+                          @click="workOrderClosed(scope.row)"
+                        >
+                          <v-icon
+                            class="mdi mdi-close-circle"
+                            style="margin-right: 0.5rem"
+                            data-test-id="V-ICON-u2o1UR"
+                          />
+                          {{ t('close') }}
+                        </el-button>
+                      </el-dropdown-item>
+                      <el-dropdown-item
+                        v-if="checkButtonisExist('PMC_101000_015')"
+                        data-test-id="EL-DROPDOWN-ITEM-wWCuKw"
+                        @click="showWorkOrderDetail(scope.row)"
+                      >
+                        <el-button link type="primary" data-test-id="EL-BUTTON-9t8rJa">
+                          <v-icon
+                            class="mdi mdi-eye-settings-outline"
+                            style="margin-right: 0.5rem"
+                            data-test-id="V-ICON-snEXEY"
+                          />
+                          {{ t('progressCheck') }}
+                        </el-button>
+                      </el-dropdown-item>
+                      <el-dropdown-item
+                        v-if="checkButtonisExist('PMC_101000_020')"
+                        data-test-id="EL-DROPDOWN-ITEM-ZEnxLP"
+                        @click="copyFun(scope.row)"
+                      >
+                        <el-button link type="primary" data-test-id="EL-BUTTON-8BDib9">
+                          <v-icon
+                            class="mdi mdi-content-copy"
+                            style="margin-right: 0.5rem"
+                            data-test-id="V-ICON-QJVUIS"
+                          />
+                          {{ t('copy') }}
+                        </el-button>
+                      </el-dropdown-item>
+                      <!--                   功能预留-->
+                      <el-dropdown-item
+                        v-if="checkButtonisExist('PMC_101000_021')"
+                        data-test-id="EL-DROPDOWN-ITEM-JtNJob"
+                        @click="deleteFun(scope.row)"
+                      >
+                        <el-button link type="primary" data-test-id="EL-BUTTON-kevoIa">
+                          <v-icon
+                            class="mdi mdi-delete-outline"
+                            style="margin-right: 0.5rem"
+                            data-test-id="V-ICON-z8u679"
+                          />
+                          {{ t('delete') }}
+                        </el-button>
+                      </el-dropdown-item>
+                    </el-dropdown-menu>
+                  </template>
+                </el-dropdown>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination
+          style="background-color: transparent; padding-bottom: 0.625rem; padding-top: 1.25rem"
+          :total="page.total"
+          :current-page="page.currentPage"
+          :page-size="page.pageSize"
+          :selected-num="workOredrList.length"
+          :current-count="dessertsList.length"
+          :has-selected="true"
+          permission-code="PMC_101000"
+          :data-test-id="`PAGINATION-msjXvX`"
+          @changePage="changePage"
+        />
+      </template>
+    </pageContent>
+    <GloablePopover
+      v-if="hidePopover"
+      :key="dayjs()"
+      v-model="hidePopover"
+      :pop-information="popoverInfo"
+      :pop-strategies="popoverStrategies"
+      :virtual-ref="materialPartNumberRef"
+      virtual-triggering
+      data-test-id="GLOABLEPOPOVER-87O67J"
+    />
+    <FilePreview ref="PreviewDialogRef" data-test-id="FILEPREVIEW-kI9dkJ" />
+
+    <!-- 物料档案预览弹窗组件 -->
+    <materialPartFilePreview
+      ref="materialPartFilePreviewRef"
+      virtual-triggering
+      data-test-id="FILEPREVIEW-kI9dkJ-materialPartFilePreview--productionWorkOrder"
+    />
+    <!-- 视图列表抽屉组件 -->
+    <viewListDrawer
+      ref="viewListDrawerRef"
+      :permission-data="permissionData"
+      data-test-id="VIEWLISTDRAWER-9zQnTJ"
+      @updateViewTabs="updateViewTabs"
+    />
+    <!-- 视图操作记录 -->
+    <viewRecord ref="viewRecordDrawerRef" :page-data="permissionData" data-test-id="VIEWRECORD-AVwDVS" />
+    <createView
+      ref="createViewRef"
+      :permission-data="permissionData"
+      data-test-id="CREATEVIEW-B5WTn0"
+      @updataView="getViewTabList"
+    />
+  </div>
+</template>
+<script setup>
+import { ref, computed, onMounted, nextTick, watch } from 'vue';
+import pageContent from '@/components/pageContent.vue';
+import { useI18n } from 'vue-i18n';
+import apiFunction from '@/scriptFiles/checkApiErrorMechanism';
+import { ElMessage, ElMessageBox } from 'element-plus';
+import pagination from '@/components/Pagination.vue';
+import dayjs from 'dayjs';
+import untils from '@/plugins/excel';
+import prodRelatedScript from './configFiles/productionRelatedScript';
+import orderStatus from './configFiles/status';
+import GloablePopover from '@/components/popover.vue';
+import viewTabs from '@/components/Layout/modules/viewFile/viewTabs.vue';
+import { isArray } from 'lodash';
+import FilePreview from './components/filePreview.vue';
+import materialPartFilePreview from './productionFlowLabel/component/materialPartFilePreview.vue';
+import viewListDrawer from '@/components/Layout/modules/viewFile/viewList.vue';
+import createView from '@/components/Layout/modules/viewFile/createView.vue';
+import viewRecord from '@/components/Layout/modules/viewFile/viewRecord.vue';
+import customFilter from '@/components/customFilter/customFilter.vue';
+import summation from '@/utils/summation';
+import { getColumnWidth } from '@/utils/tableWidth';
+const viewTabsRef = ref(null); // 视图tabref
+const createViewRef = ref(null); // 创建视图ref
+const permissionData = ref({
+  permissionCode: 'PMC_101000',
+  docCode: 'doc_5',
+});
+const viewId = ref(''); //视图id
+const loadingShow = ref(false); // 全局loading
+const tableLoading = ref(false); // 表格loading
+const multipleTableRef = ref(null);
+const { t } = useI18n();
+const querySearchRef = ref(null); // 搜索
+const priorityStatus = ref({
+  topPriority: 4, // 最优先
+  priority: 3, // 优先
+  normal: 2, // 正常
+  secondary: 1, // 次要
+  leastImportant: 0, // 最次要
+});
+const dropdownRef = ref(null);
+const selectedProdOrders = ref([]);
+// 分页
+const page = ref({
+  total: null,
+  currentPage: 1,
+  pageSize: 20,
+});
+// 视图管理
+const isCanOperation = ref(false);
+// 物料信息
+const querySearchMaterialList = ref([]);
+// 表头固定字段
+const allHeaders = computed(() => [
+  {
+    text: t('workOrderStatus'),
+    value: 'productionOrderStatus',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('productionOrderNumber'),
+    value: 'productionOrderNumber',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('partNumber'),
+    value: 'partNumber',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('productName'),
+    value: 'productName',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('materialCategory'),
+    value: 'materialCategoryName',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('materialFile'),
+    value: 'productionOrderMaterialFileList',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('materialSpec'),
+    value: 'materialSpec',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('workOrderRequirementsNumber'),
+    value: 'productionOrderRequiredThroughput',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('craftPath'),
+    value: 'craftPathName',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('salesOrderNumber'),
+    value: 'orderNumber',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('sourceOrderType'),
+    value: 'originalOrderType',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('sourceOrderNo'),
+    value: 'originalOrderNumber',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('customerNameDigiwin'),
+    value: 'orderDemander',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('orderExpectedDue'),
+    value: 'orderExpectedDue',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('startDate'),
+    value: 'productionOrderExpectedStartDate',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('finishDate'),
+    value: 'productionOrderExpectedDueDate',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('importantSort'),
+    value: 'productionOrderPriority',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('creator'),
+    value: 'consUserName',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('createTime'),
+    value: 'consDate',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('updatePerson'),
+    value: 'modiUserName',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('updateTime'),
+    value: 'modiDate',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('inventoryStorageQuantity'),
+    value: 'inboundQuantity',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('returnQuantity'),
+    value: 'returnQuantity',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('inboundRemain'),
+    value: 'inboundRemain',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('description'),
+    value: 'remark',
+    isFixed: false,
+    isShown: true,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+  {
+    text: t('shutdownReason'),
+    value: 'closeReason',
+    isFixed: false,
+    isShown: false,
+    disabled: false,
+    freeze: false,
+    customizeFields: false,
+  },
+]);
+// 表格内容
+const dessertsList = ref([]);
+// 存储生产工单自定义字段
+const fieldList = ref([]);
+// 获取自定义字段信息
+const customFieldsList = ref([]);
+// 表格行选择内容记录
+const workOredrList = ref([]);
+const columnConfig = ref([]);
+
+const canEditHeaders = computed(() => {
+  const allHeaderList = [
+    ...allHeaders.value.map((item) => ({
+      ...item,
+      isCustom: false,
+      columnKey: item.text,
+    })),
+    ...customFieldsList.value.map((item) => ({
+      ...item,
+      columnKey: item.fieldName,
+      isCustom: true,
+    })),
+  ];
+  const list = [];
+  if (!columnConfig.value?.length) {
+    return allHeaderList;
+  }
+  const notExistsList = [];
+  allHeaderList.forEach((ite) => {
+    const filterItem = columnConfig.value.find((el) => el.value === ite.value);
+    if (filterItem) {
+      list.push({
+        ...ite,
+        order: filterItem.order,
+        fixed: filterItem.freeze,
+        freeze: filterItem.freeze,
+        isFixed: filterItem.freeze,
+        disabled: false,
+        isShown: filterItem.isShown,
+      });
+    } else {
+      notExistsList.push({
+        ...ite,
+        fixed: false, // 是否固定列
+        freeze: false, // 是否冻结列
+        disabled: false, // 是否禁用
+        isShown: false, // 是否显示隐藏
+      });
+    }
+  });
+  console.log([...list.sort((a, b) => a.order - b.order), ...notExistsList]);
+  return [...list.sort((a, b) => a.order - b.order), ...notExistsList];
+});
+// 表头字段
+const tableHeaders = computed(() => {
+  const allHeaderList = [...allHeaders.value, ...customFieldsList.value];
+  const list = [];
+  if (columnConfig.value?.length) {
+    columnConfig.value.forEach((item) => {
+      if (item.isShown) {
+        if (!item.isCustom) {
+          const filterItem = allHeaderList.find((i) => i.value === item.columnKey);
+          if (filterItem) {
+            list.push({
+              ...filterItem,
+              ...item,
+              text: filterItem.text,
+            });
+          }
+        } else {
+          const filterItem = customFieldsList.value.find((i) => i.value === item.customFieldId);
+          if (filterItem) {
+            list.push({
+              text: filterItem.customFieldName,
+              value: String(filterItem.columnKey),
+              ...filterItem,
+              ...item,
+              sortable: false,
+              class: 'parentTabColor white--text',
+            });
+          }
+        }
+      }
+    });
+    return [...list];
+  }
+  return [...allHeaderList.filter((item) => !!item.isShown)];
+});
+// 失败弹窗
+function openErrorDialog(title = t('requestError')) {
+  ElMessage({
+    message: title,
+    type: 'error',
+  });
+}
+// 查询主页数据
+const userInfo = ref(false);
+const downloadParam = ref({});
+// 排序字段
+const orderSettingList = ref([
+  {
+    orderSettingID: 5,
+    orderSettingType: 1,
+  },
+  {
+    orderSettingID: 6,
+    orderSettingType: 1,
+  },
+]);
+const query = async (item) => {
+  let index = viewId.value;
+  downloadParam.value = JSON.parse(JSON.stringify(item));
+  try {
+    nextTick(async () => {
+      if (!userInfo.value) {
+        page.value.currentPage = 1;
+      }
+      tableLoading.value = true;
+      dessertsList.value = [];
+      const params = {
+        ...item,
+        isPc: true,
+        orderSettingList: orderSettingList.value,
+        count: page.value.pageSize,
+        startIndex: page.value.currentPage !== 1 ? (page.value.currentPage - 1) * page.value.pageSize : 0,
+        viewId: viewId.value ? Number(viewId.value) : 0,
+      };
+      const { data } = await apiFunction.planFormulationQuery(params);
+      if (data.code === 0 && data.content.totalCount && index === viewId.value) {
+        dessertsList.value = data.content.data.map((item) => {
+          const obj = {};
+          if (item.mesCustomFieldAndValueList?.length) {
+            item.mesCustomFieldAndValueList.forEach((i) => {
+              obj[i.mesCustomFieldID] = i.mesCustomFieldValue;
+            });
+          }
+          return {
+            ...item,
+            ...obj,
+          };
+        });
+        page.value.total = data.content.totalCount;
+        querySearchMaterialList.value = data.content?.materialList || [];
+        tableLoading.value = false;
+      } else {
+        tableLoading.value = false;
+        page.value.total = 0;
+      }
+      userInfo.value = false;
+    });
+  } catch (error) {
+    console.error('Error in query:', error);
+    tableLoading.value = false;
+    openErrorDialog(t('apiError'));
+  }
+};
+// 字段转文字
+const fieldToText = (string) => {
+  const str = string.dmlDocCustomFormulaSettingsDTO.formulaExpression;
+  const data = str.replace(/\$\{([^}]+)\}/g, (match, fullPath) => {
+    const propertyName = fullPath.split('.').pop();
+    const propertyField = propertyName.split('_');
+    if (propertyField.length === 2 && !isNaN(propertyField[1])) {
+      const fIndexData = fieldList.value.find((res) => res.docCustomId === Number(propertyField[1]));
+      return '${' + t('productionPlan') + '.' + fIndexData.fieldName + '}';
+    } else {
+      if (propertyName === 'PORequiredThroughput') {
+        return '${' + t('productionPlan') + '.' + t('productionOrderRequiredThroughput') + '}';
+      } else if (propertyName === 'InboundQuantity') {
+        return '${' + t('productionPlan') + '.' + t('inboundQuantity') + '}';
+      } else if (propertyName === 'ReturnQuantity') {
+        return '${' + t('productionPlan') + '.' + t('returnQuantity') + '}';
+      } else if (propertyName === 'InboundRemain') {
+        return '${' + t('productionPlan') + '.' + t('inboundRemain') + '}';
+      } else {
+        return '${' + t('productionPlan') + '.' + t(propertyName) + '}';
+      }
+    }
+  });
+  return data;
+};
+// 查询回调方法
+const filterSearch = () => {
+  querySearchRef.value.handleSearch();
+};
+// 表头排序
+const handleSortChange = (val) => {
+  const mapping = {
+    productionOrderExpectedStartDate: 3,
+    productionOrderExpectedDueDate: 4,
+    consDate: 6,
+    orderExpectedDue: 7,
+    modiDate: 8,
+  };
+  const orderSettingID = mapping[val.prop];
+  const orderSettingType = val.order === 'descending' ? 1 : 0;
+  if (orderSettingList.value.length === 2) {
+    orderSettingList.value.splice(1, 1);
+  }
+  if (val.order) {
+    orderSettingList.value.push({
+      orderSettingID,
+      orderSettingType,
+    });
+  }
+  querySearchRef.value.handleSearch();
+};
+// 序号列
+const calcIndex = (index) => {
+  return Number(index) + 1 + Number(page.value.pageSize * (page.value.currentPage - 1));
+};
+// 表格行选择事件
+const handleSelectionChange = (item) => {
+  workOredrList.value = item;
+};
+/**
+ * 行点击
+ * @param row 行数据
+ */
+const handleRowClick = (row) => {
+  if (row) {
+    multipleTableRef.value.toggleRowSelection(row, undefined, false);
+  } else {
+    multipleTableRef.value.clearSelection();
+  }
+};
+// 获取选中的数据是否符合每个按钮的需求
+const conditionalRequirements = (item) => {
+  let flag = false;
+  flag = workOredrList.value.some((item) => item.productionOrderStatus === 5);
+  if (item.key === 'multiTaskEdit' && (workOredrList.value.length > 20 || flag)) {
+    return !flag ? t('maxSupportedSimultaneousEdits') : t('unableToEditClosedTickets');
+  }
+  flag = workOredrList.value.some((item) => item.productionOrderStatus !== 5);
+  if (item.key === 'antiClose' && flag) {
+    return t('supportReopenClosedTickets');
+  }
+  flag = workOredrList.value.some((item) => item.productionOrderStatus !== 0);
+  if (item.key === 'distribution' && flag) {
+    return t('undistributedOrder');
+  }
+  flag = workOredrList.value.some((item) => item.productionOrderStatus !== 1);
+  if (item.key === 'returnWorkOrder' && flag) {
+    return t('unstartedOrderSupportsReturn');
+  }
+  flag = workOredrList.value.some((item) => item.productionOrderStatus === 5);
+  if (item.key === 'workOrderClosed' && flag) {
+    return t('closeNonClosedTickets');
+  }
+  return false;
+};
+// // 工单状态颜色
+const tagStatusColor = (item) => {
+  return prodRelatedScript.orderTagStatusColor(item);
+};
+const getChipStatusColor = (item) => {
+  return prodRelatedScript.orderGetChipStatusColor(item);
+};
+const getStatusKeys = (item) => {
+  return Object.keys(orderStatus.orderPlanStatus).find((key) => orderStatus.orderPlanStatus[key] === item);
+};
+// 取得重要程度顏色
+const getPriorityColor = (item) => {
+  return prodRelatedScript.priorityColor(item);
+};
+// 取得重要程度Icon
+const getPriorityIcon = (item) => {
+  return prodRelatedScript.priorityIcon(item);
+};
+const formatThousands = (num) => {
+  // 先处理数字，分离整数和小数部分
+  const parts = num.toString().split('.');
+  const integerPart = parts[0];
+  const decimalPart = parts[1] ? '.' + parts[1] : '';
+
+  // 为整数部分添加千分位
+  const formattedInteger = integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+
+  return formattedInteger + decimalPart;
+};
+
+// 表格自定义字段展示
+const getValue = (fieldId, list) => {
+  const field = fieldList.value.find((item) => item.customFieldId === fieldId);
+  const i = list?.find((item) => item.docCustomId === fieldId);
+  if (list && field && i) {
+    // 日期
+    if (field.fieldTypeId === 3) {
+      if (i.writeValue && i.writeValue !== 'null') {
+        return dayjs(Number(i.writeValue)).format('YYYY-MM-DD HH:mm:ss');
+      }
+      return '-';
+    }
+    // 日期区间
+    if (field.fieldTypeId === 4) {
+      try {
+        if (i.writeValue) {
+          const val = JSON.parse(i.writeValue);
+          return `${dayjs(Number(val[0])).format('YYYY-MM-DD HH:mm:ss')} ~ ${dayjs(Number(val[1])).format('YYYY-MM-DD HH:mm:ss')}`;
+        }
+        return '-';
+      } catch (error) {
+        return '-';
+      }
+    }
+    // 附件
+    if (field.fieldTypeId === 5) {
+      return i.fileData.map((ite) => ite.fileName).length ? i.fileData.map((ite) => ite.fileName) : '-';
+    }
+    // 复选框
+    if (field.fieldTypeId === 8) {
+      return i.writeValue ? JSON.parse(i.writeValue) : '-';
+    }
+    if (field.fieldTypeId === 9) {
+      if (field.dmlDocCustomFormulaSettingsDTO.isThousandSeparator && i.writeValue) {
+        return formatThousands(i.writeValue);
+      } else {
+        return i.writeValue || '-';
+      }
+    }
+    return i.writeValue || '-';
+  }
+  return '-';
+};
+// 档案预览
+const PreviewDialogRef = ref(null);
+const handleClickPreview = (fieldId, list) => {
+  if (list && list.length && fieldList.value.find((item) => item.customFieldId === fieldId)) {
+    const findItem = list?.find((item) => item.docCustomId === fieldId);
+    if (findItem && findItem.fileData && findItem.fileData.length)
+      PreviewDialogRef.value.handleOpenDialog(findItem.fileData, findItem.docCustomId);
+  }
+};
+// 新增
+const addPlan = () => {
+  ElMessage.info(t('add'));
+};
+// 编辑
+const editem = (val) => {
+  if (val && val.productionOrderStatus === 5) {
+    openErrorDialog(t('currentTicketClosed'));
+    return;
+  }
+  nextTick(() => {
+    ElMessage.info(t('edit'));
+  });
+};
+// 多工单编辑
+const multiTaskEdit = () => {
+  if (!workOredrList.value.length) {
+    openErrorDialog(t('pleaseSelectWorkOrder'));
+    return;
+  }
+  if (workOredrList.value.length > 20) {
+    openErrorDialog(t('maxSupportedSimultaneousEdits'));
+    return;
+  }
+  if (workOredrList.value.some((ite) => ite.productionOrderStatus === 5)) {
+    openErrorDialog(t('unableToEditClosedTickets'));
+    return;
+  }
+  ElMessage.info(t('multiTaskEdit'));
+};
+const notOkProductionOrderIDList = ref([]);
+// 派送工单
+const distribution = () => {
+  notOkProductionOrderIDList.value = [];
+  if (!workOredrList.value.length) {
+    openErrorDialog(t('pleaseSelectWorkOrder'));
+    return;
+  }
+  if (workOredrList.value.some((item) => item.productionOrderStatus !== 0)) {
+    openErrorDialog(t('undistributedOrder'));
+    return;
+  }
+  ElMessage.info(t('distribution'));
+};
+// 退回工单
+const returnWorkOrder = () => {
+  if (!workOredrList.value.length) {
+    openErrorDialog(t('pleaseSelectWorkOrder'));
+    return;
+  }
+  if (workOredrList.value.some((item) => item.productionOrderStatus !== 1)) {
+    openErrorDialog(t('unstartedOrderSupportsReturn'));
+    return;
+  }
+  ElMessage.info(t('returnWorkOrder'));
+};
+
+// 下推
+const pushDown = () => {
+  if (workOredrList.value.length === 0) {
+    ElMessage.error(t('pleaseSelectDownFirst'));
+    return;
+  }
+  if (workOredrList.value.length > 1) {
+    ElMessage.error(t('crossDocumentNotSupported'));
+    return;
+  }
+  // 工单状态：0-未派工，1-未开工，2-已开工，3-已完工，4-已逾期，5-已关闭
+  if (workOredrList.value[0].productionOrderStatus === 5) {
+    ElMessage.error(t('downFailedDocumentsClosedState'));
+    return;
+  }
+  dropdownRef.value.handleClose();
+  ElMessage.info(t('pushDown'));
+};
+// 关联查询
+const associativeQueries = () => {
+  if (workOredrList.value.length === 0) {
+    ElMessage.error(t('pleaseFirstSelectQuery'));
+    return;
+  }
+  if (workOredrList.value.length > 1) {
+    ElMessage.error(t('crossDocumentQueryNotSupported'));
+    return;
+  }
+  dropdownRef.value.handleClose();
+  ElMessage.info(t('associativeQueries'));
+};
+// 关闭工单
+const workOrderClosed = (val) => {
+  if (!workOredrList.value.length && !val) {
+    openErrorDialog(t('pleaseSelectWorkOrder'));
+    return;
+  }
+  if (val && val.productionOrderStatus === 5) {
+    openErrorDialog(t('currentTicketClosed'));
+    return;
+  }
+  if (!val && workOredrList.value.some((item) => item.productionOrderStatus === 5)) {
+    openErrorDialog(t('closeNonClosedTickets'));
+    return;
+  }
+  dropdownRef.value.handleClose();
+  ElMessage.info(t('workOrderClosed'));
+};
+// 反关闭
+const antiClose = () => {
+  if (!workOredrList.value.length) {
+    openErrorDialog(t('pleaseSelectWorkOrder'));
+    return;
+  }
+  if (workOredrList.value.some((item) => item.productionOrderStatus !== 5)) {
+    openErrorDialog(t('supportReopenClosedTickets'));
+    return;
+  }
+  ElMessage.info(t('antiClose'));
+};
+// 批量更新
+const batchUpdate = () => {
+  if (!workOredrList.value.length) {
+    openErrorDialog(t('pleaseSelectWorkOrder'));
+    return;
+  }
+  if (workOredrList.value.some((ite) => ite.productionOrderStatus === 5)) {
+    openErrorDialog(t('closedTicketsUpdate'));
+    return;
+  }
+  ElMessage.info(t('batchUpdate'));
+};
+//标签发行
+function labelingIssuance() {
+  if (!workOredrList.value.length) {
+    openErrorDialog(t('pleaseSelectWorkOrder'));
+    return;
+  } else if (workOredrList.value.length > 1) {
+    openErrorDialog(t('onlyUseOneTag'));
+    return;
+  }
+  if (workOredrList.value[0].productionOrderStatus === 5) {
+    openErrorDialog(t('closedTicketsNotIssueTags'));
+    return;
+  }
+  dropdownRef.value.handleClose();
+  ElMessage.info(t('labelingIssuance'));
+}
+// 订单分享
+const orderSharing = () => {
+  if (workOredrList.value.length > 0) {
+    dropdownRef.value.handleClose();
+    selectedProdOrders.value = workOredrList.value;
+    const isEquation = selectedProdOrders.value.every(
+      (element) => element.orderNumber === selectedProdOrders.value[0].orderNumber,
+    );
+    if (isEquation) {
+      ElMessage.info(t('orderSharing'));
+    } else {
+      openErrorDialog(t('errorDifferentOrders'));
+    }
+  } else {
+    openErrorDialog(t('sharedSelectOrder'));
+  }
+};
+// 工时推算
+const workingHoursCaculate = async () => {
+  if (!workOredrList.value.length) {
+    openErrorDialog(t('pleaseSelectWorkOrder'));
+    return;
+  } else {
+    ElMessage.info(t('workingHoursCaculate'));
+  }
+};
+
+// 获取导出的数据
+const downloadData = ref([]);
+const downloadIndex = ref(0);
+const initDownloadData = async () => {
+  const param = {
+    ...downloadParam.value,
+    isPc: true,
+    count: 200,
+    startIndex: downloadIndex.value,
+    orderSettingList: orderSettingList.value,
+    viewId: viewId.value ? Number(viewId.value) : 0,
+  };
+  const res = await apiFunction.planFormulationQuery(param).catch(() => ElMessage.error(t('apiError')));
+  const {
+    data: { code, content, message },
+  } = res;
+  if (code === 0) {
+    const contentData =
+      content && content.data && content.data.length
+        ? content.data.map((item) => {
+            const customData = {};
+            if (item.docCustomFieldAndValues && item.docCustomFieldAndValues.length)
+              item.docCustomFieldAndValues.forEach((customItem) => {
+                customData[customItem.docCustomId] = customItem;
+              });
+            return { ...item, ...customData };
+          })
+        : [];
+    downloadData.value = [...downloadData.value, ...contentData];
+    if (downloadData.value.length < content.totalCount) {
+      downloadIndex.value += 200;
+      await initDownloadData();
+    }
+  } else ElMessage.error(t(message));
+};
+
+const initPriorityStatusText = (value) =>
+  Object.keys(priorityStatus.value).find((item) => (priorityStatus.value[item] === value ? item : ''));
+
+// Excel汇出
+const handleExport = async () => {
+  tableLoading.value = true;
+  downloadData.value = [];
+  downloadIndex.value = 0;
+  // 表头
+  const title = [tableHeaders.value.map(({ text }) => text)];
+  downloadData.value = [];
+  await initDownloadData();
+  const body = downloadData.value.map((bodyItem) => {
+    return tableHeaders.value.map((headerItem) => {
+      const value = bodyItem[headerItem.value];
+      if (headerItem.value === 'originalOrderType') return value === 1 ? t('productionPlanList') : '';
+      else if (headerItem.value === 'productionOrderMaterialFileList')
+        return bodyItem.productionOrderMaterialFileList?.length
+          ? bodyItem.productionOrderMaterialFileList?.map((ite) => ite.plmFileName).join()
+          : '';
+      // 物料档案
+      else if (headerItem.value === 'productionOrderPriority') return t(initPriorityStatusText(value));
+      else if (headerItem.value === 'originalOrderNumber') return bodyItem.productionPlanNumber;
+      else if (headerItem.value === 'productionOrderStatus') return t(getStatusKeys(value)) || '';
+      else if (
+        headerItem.value === 'orderExpectedDue' ||
+        headerItem.value === 'productionOrderExpectedStartDate' ||
+        headerItem.value === 'productionOrderExpectedDueDate'
+      )
+        return value ? dayjs(value).format('YYYY-MM-DD') : '';
+      else if (headerItem.value === 'consDate' || headerItem.value === 'modiDate')
+        return value ? dayjs(value).format('YYYY-MM-DD HH:mm:ss') : '';
+      else if (headerItem.value === 'inboundRemain') return bodyItem.inboundRemain < 0 ? 0 : value;
+      else if (headerItem.isCustom) {
+        if (value?.fieldTypeId === 3 && (value?.writeValue ?? '') !== '') {
+          return value?.writeValue ? dayjs(Number(value?.writeValue)).format('YYYY-MM-DD HH:mm:ss') : '';
+        } else if (value?.fieldTypeId === 4 && (value?.writeValue ?? '') !== '') {
+          return value?.writeValue && isArray(JSON.parse(value?.writeValue)) && JSON.parse(value?.writeValue).length
+            ? `${dayjs(JSON.parse(value?.writeValue)[0]).format('YYYY-MM-DD HH:mm:ss')} ~ ${dayjs(JSON.parse(value?.writeValue)[1]).format('YYYY-MM-DD HH:mm:ss')}`
+            : '';
+        } else if (value?.fieldTypeId === 5) {
+          return value.fileData && value.fileData.length ? value.fileData.map((item) => item.fileName).join(',') : '';
+        } else if (value?.fieldTypeId === 8 && (value?.writeValue ?? '') !== '') {
+          return JSON.parse(value?.writeValue).join(',');
+        } else {
+          return value?.writeValue;
+        }
+      } else return value;
+    });
+  });
+  tableLoading.value = false;
+  untils.exportFromArray({
+    title,
+    body,
+    name: t('productionWorkOrderRemittance'),
+    suffix: 'xlsx',
+    sheetName: t('productionWorkOrderRemittance'),
+    wscols: body[0].map(() => ({ wch: 20 })),
+  });
+};
+// 进度查看
+const showWorkOrderDetail = (item) => {
+  console.log('item:', item);
+  ElMessage.info(t('progressView'));
+};
+// 复制
+const copyFun = (val) => {
+  console.log('val:', val);
+  ElMessage.info(t('copy'));
+};
+// 删除
+const deleteFun = (val) => {
+  if (val.productionOrderStatus !== 0) {
+    ElMessage.error(t('unassignedWorkOrderCanDelete'));
+    return;
+  }
+  ElMessageBox.confirm(t('ticketDeleteConfirmation'), t('warning'), {
+    confirmButtonText: t('confirm'),
+    cancelButtonText: t('cancel'),
+    type: 'warning',
+  })
+    .then(() => {
+      ElMessage.info(t('delete'));
+    })
+    .catch(() => {
+      // 用户点击取消的操作
+      loadingShow.value = false;
+    });
+};
+// 打开汇入弹窗
+const handleImport = () => {
+  ElMessage.info(t('import'));
+};
+const getCustomFields = async () => {
+  const params = {
+    docCode: 'doc_5',
+    status: 1,
+    fieldName: '',
+    consDate: [],
+    startIndex: 0,
+    count: 100,
+  };
+  await apiFunction
+    .querySetting(params)
+    .then((res) => {
+      if (res.data.code === 0) {
+        const customFieldData = res.data.content.data.map((ite) => ({
+          ...ite,
+          customFieldName: ite.fieldName,
+          columnKey: ite.fieldName,
+          customFieldId: ite.docCustomId,
+          isCustom: true,
+          isFixed: false,
+          isShown: true,
+          disabled: false,
+          freeze: false,
+          customizeFields: true,
+        }));
+        fieldList.value = customFieldData;
+        customFieldsList.value = customFieldData.map((item) => ({
+          ...item,
+          text: item.customFieldName,
+          columnKey: item.customFieldName,
+          align: 'index',
+          sortable: false,
+          value: item.customFieldId,
+          class: 'parentTabColor white--text',
+          width: '170px',
+          customFieldId: item.docCustomId,
+          fieldTypeId: item.fieldTypeId,
+        }));
+      } else {
+        openErrorDialog(t(res.data.message));
+      }
+    })
+    .catch(() => {
+      openErrorDialog(t('apiError'));
+    });
+};
+// 列配置信息获取
+const getColumnConfig = async () => {
+  columnConfig.value = [];
+  await apiFunction
+    .queryColumnSettingNext({
+      displayIds: [101000201],
+    })
+    .then((res) => {
+      if (res.data.code === 0) {
+        const dataList = res.data.content.data;
+        if (dataList[0].displayId === 101000201 && dataList[0].configJson) {
+          columnConfig.value = dataList[0].configJson.columnSetting;
+        }
+        const fIndex = columnConfig.value.findIndex((item) => item.columnKey === 'productName');
+        const someFlag = columnConfig.value.some((item) => item.columnKey === 'materialCategoryName');
+        if (columnConfig.value && columnConfig.value.length && !someFlag)
+          columnConfig.value.splice(fIndex + 1, 0, {
+            columnKey: 'materialCategoryName',
+            customizeFields: false,
+            disabled: false,
+            fixed: false,
+            freeze: false,
+            isCustom: false,
+            isFixed: false,
+            isShown: true,
+            text: t('materialCategory'),
+            value: 'materialCategoryName',
+          });
+      } else {
+        columnConfig.value = [];
+      }
+    })
+    .catch(() => {
+      tableLoading.value = false;
+      columnConfig.value = [];
+    });
+};
+const saveData = async (val) => {
+  tableLoading.value = true;
+  const list = val.map((item, index) => ({
+    ...item,
+    order: index + 1,
+    columnKey: item.isCustom ? item.columnKey : item.value,
+    isShown: item.isShown,
+  }));
+  await apiFunction
+    .updateColumnSettingNext({
+      data: [
+        {
+          displayId: 101000201,
+          configJson: {
+            displayId: 101000201,
+            columnSetting: list,
+          },
+        },
+      ],
+    })
+    .then((res) => {
+      tableLoading.value = false;
+      if (res.data.code !== 0) {
+        ElMessage.error(t(res.data.message));
+      } else {
+        columnConfig.value = list;
+      }
+    })
+    .catch(() => {
+      tableLoading.value = false;
+    });
+};
+// 分页方法
+const changePage = async (val) => {
+  page.value.currentPage = val.page;
+  page.value.pageSize = val.size;
+  userInfo.value = true;
+  filterSearch();
+};
+
+/* popover显示物料详情 虚拟触发 */
+// 虚拟触发绑定的ref
+const materialPartNumberRef = ref();
+//popover传入信息
+const popoverInfo = ref();
+//控制popover显隐
+const hidePopover = ref(false);
+//不同路由下的字段映射策略
+const popoverStrategies = ref({
+  numberField: 'partNumber',
+  nameField: 'productName',
+  specField: 'materialSpec',
+});
+//移入事件，移入时传入相应信息
+const handleCellMouseEnter = (row, column, event) => {
+  if (column.property === 'partNumber') {
+    popoverInfo.value = row;
+    materialPartNumberRef.value = event.children[0];
+    hidePopover.value = true;
+  }
+};
+//移出事件，刷新组件
+const handleCellMouseLeave = () => {
+  return;
+};
+function moveDBeforeB(arr) {
+  const newArr = [...arr];
+  const indexA = newArr.findIndex((item) => item.permissionCode === 'PMC_101000_023');
+  const indexB = newArr.findIndex((item) => item.permissionCode === 'PMC_101000_009');
+
+  if (indexA === -1 || indexB === -1 || indexA < indexB) {
+    return newArr;
+  }
+
+  // 一步完成移除和插入
+  const dElement = newArr[indexA];
+  return [...newArr.slice(0, indexB), dElement, ...newArr.slice(indexB, indexA), ...newArr.slice(indexA + 1)];
+}
+// 按钮
+const buttonList = ref([]);
+const topButtons = ref([]);
+async function getButtons() {
+  await apiFunction
+    .QueryMyPermission({
+      permissionSource: 'web',
+      permissionCode: 'PMC_101000',
+    })
+    .then((res) => {
+      if (res.data?.code === 0) {
+        buttonList.value = moveDBeforeB(res.data.content);
+      } else {
+        ElMessage.error(t(res.data.message));
+      }
+    })
+    .catch()
+    .finally(() => {
+      loadingShow.value = false;
+    });
+}
+const hyperLinkClick = (item, docCustomFieldAndValues) => {
+  const hyperLinkUrlStr = docCustomFieldAndValues.filter((ite) => ite.docCustomId === item.customFieldId)[0].writeValue;
+  window.open(hyperLinkUrlStr, '_blank');
+};
+
+function checkButtonisExist(id) {
+  let findArr = buttonList.value.filter((it) => id === it.permissionCode);
+  if (findArr.length) {
+    return true;
+  } else {
+    return false;
+  }
+}
+function checkButtonArrisExist(arr) {
+  let findArr = buttonList.value.filter((it) => arr.some((item) => item === it.permissionCode));
+  if (findArr.length) {
+    return true;
+  } else {
+    return false;
+  }
+}
+// 打印的工单行数据
+const printSelectRowData = ref([]);
+// 打印按钮的点击方法
+function printBtnClick(row) {
+  printSelectRowData.value = [row.productionOrderNumber];
+}
+// 批量打印方法
+function batchPrint(type) {
+  console.log('type:', type);
+  if (workOredrList.value.length === 0) {
+    openErrorDialog(t('pleaseSelectOrder'));
+    return;
+  }
+  ElMessage.info(t('批量打印/预览'));
+}
+
+//操作日志
+function operationLog() {
+  ElMessage.info(t('操作日志'));
+}
+//完工
+function toBeFinished() {
+  if (workOredrList.value.length === 0) {
+    openErrorDialog(t('pleaseSelectWorkOrder'));
+    return;
+  }
+  let arr = [2, 4];
+  let flag = workOredrList.value.some((item) => !arr.includes(item.productionOrderStatus));
+  if (flag) {
+    openErrorDialog(t('toBeFinishedTips'));
+  } else {
+    ElMessageBox.confirm(t('toBeFinishedConfirmTips'), t('warning'), {
+      confirmButtonText: t('confirm'),
+      cancelButtonText: t('cancel'),
+      type: 'warning',
+    })
+      .then(() => {
+        ElMessage.info(t('toBeFinished'));
+      })
+      .catch(() => {
+        // 用户点击取消的操作
+        loadingShow.value = false;
+      });
+  }
+}
+watch(
+  () => buttonList.value,
+  () => {
+    if (buttonList.value && buttonList.value.length > 0) {
+      topButtons.value = [];
+      buttonList.value.map((it) => {
+        switch (it.permissionCode) {
+          // 新增
+          case 'PMC_101000_001':
+            topButtons.value.push({
+              describe: 'add',
+              key: 'add',
+              icon: 'mdi mdi-plus',
+              func: addPlan,
+              isFold: false,
+              isBatch: false,
+              isAdvanced: false,
+            });
+            break;
+          //   批量汇入
+          case 'PMC_101000_002':
+            topButtons.value.push({
+              describe: 'batchImport',
+              key: 'import',
+              icon: 'mdi mdi-import',
+              func: handleImport,
+              isFold: false,
+              isBatch: true,
+              isAdvanced: false,
+              order: 1,
+            });
+            break;
+          //   批量汇出
+          case 'PMC_101000_003':
+            topButtons.value.push({
+              describe: 'batchExport',
+              key: 'export',
+              icon: 'mdi mdi-export',
+              func: handleExport,
+              isFold: false,
+              isBatch: true,
+              isAdvanced: false,
+              order: 2,
+            });
+            break;
+          //   多工单编辑
+          case 'PMC_101000_004':
+            topButtons.value.push({
+              describe: 'multiTaskEdit',
+              key: 'multiTaskEdit',
+              icon: 'mdi mdi-table-edit',
+              func: multiTaskEdit,
+              isFold: true,
+              isBatch: false,
+              isAdvanced: false,
+              order: 1,
+            });
+            break;
+          //   批量打印
+          case 'PMC_101000_019':
+            topButtons.value.push({
+              describe: 'batchPrint',
+              key: 'batchPrint',
+              icon: 'mdi mdi-cloud-print',
+              func: batchPrint,
+              type: 2,
+              isFold: false,
+              isBatch: true,
+              isAdvanced: false,
+              order: 4,
+            });
+            break;
+          //   批量更新
+          case 'PMC_101000_005':
+            topButtons.value.push({
+              describe: 'batchUpdate',
+              key: 'batchUpdate',
+              icon: 'mdi mdi-file-document-refresh-outline',
+              func: batchUpdate,
+              isFold: false,
+              isBatch: true,
+              isAdvanced: false,
+              order: 3,
+            });
+            break;
+          //   派送工单
+          case 'PMC_101000_006':
+            topButtons.value.push({
+              describe: 'deliveryOrder',
+              key: 'distribution',
+              icon: 'mdi mdi-sync',
+              func: distribution,
+              isFold: false,
+              isBatch: false,
+              isAdvanced: false,
+              order: 2,
+            });
+            break;
+          //   退回工单
+          case 'PMC_101000_007':
+            topButtons.value.push({
+              describe: 'returnWorkOrder',
+              key: 'returnWorkOrder',
+              icon: 'mdi mdi-arrow-left-circle',
+              func: returnWorkOrder,
+              isFold: true,
+              isBatch: false,
+              isAdvanced: false,
+              order: 3,
+            });
+            break;
+          //   订单分享
+          case 'PMC_101000_008':
+            topButtons.value.push({
+              describe: 'orderSharing',
+              key: 'orderSharing',
+              icon: 'mdi mdi-share',
+              func: orderSharing,
+              isFold: true,
+              isBatch: false,
+              isAdvanced: false,
+              order: 4,
+            });
+            break;
+          //   批量关闭
+          case 'PMC_101000_009':
+            topButtons.value.push({
+              describe: 'batchClose',
+              key: 'workOrderClosed',
+              icon: 'mdi mdi-close-circle',
+              func: workOrderClosed,
+              isFold: false,
+              isBatch: true,
+              isAdvanced: false,
+              order: 5,
+            });
+            break;
+          //   反关闭
+          case 'PMC_101000_010':
+            topButtons.value.push({
+              describe: 'antiClose',
+              key: 'antiClose',
+              icon: 'mdi mdi-minus-circle-off',
+              func: antiClose,
+              isFold: true,
+              isBatch: false,
+              isAdvanced: false,
+              order: 6,
+            });
+            break;
+          //   标签发行
+          case 'PMC_101000_011':
+            topButtons.value.push({
+              describe: 'labelingIssuance',
+              key: 'labelingIssuance',
+              icon: 'mdi mdi-label-multiple',
+              func: labelingIssuance,
+              isFold: false,
+              isBatch: false,
+              isAdvanced: true,
+              order: 1,
+            });
+            break;
+          //   下推
+          case 'PMC_101000_016':
+            topButtons.value.push({
+              describe: 'pushDown',
+              key: 'pushDown',
+              icon: 'mdi mdi-download-box',
+              func: pushDown,
+              isFold: false,
+              isBatch: false,
+              isAdvanced: true,
+              order: 3,
+            });
+            break;
+          //   关联查询
+          case 'PMC_101000_017':
+            topButtons.value.push({
+              describe: 'associativeQueries',
+              key: 'associativeQueries',
+              icon: 'mdi mdi-tag-search',
+              func: associativeQueries,
+              isFold: false,
+              isBatch: false,
+              isAdvanced: true,
+              order: 2,
+            });
+            break;
+          //   工时推算
+          case 'PMC_101000_018':
+            topButtons.value.push({
+              describe: 'workingHoursCaculate',
+              key: 'workingHoursCaculate',
+              icon: 'mdi mdi-pencil-box-multiple-outline',
+              func: workingHoursCaculate,
+              isFold: false,
+              isBatch: false,
+              isAdvanced: true,
+              order: 4,
+            });
+            break;
+          //   打印预览
+          case 'PMC_101000_024':
+            topButtons.value.push({
+              describe: 'printPreview',
+              key: 'printPreview',
+              icon: 'mdi mdi-pencil-box-multiple-outline',
+              func: batchPrint,
+              type: 1,
+              isFold: true,
+              isBatch: false,
+              isAdvanced: false,
+              order: 7,
+            });
+            break;
+          // 操作日志
+          case 'PMC_101000_022':
+            topButtons.value.push({
+              describe: 'operationLog',
+              key: 'operationLog',
+              icon: 'mdi mdi-clock-outline',
+              func: operationLog,
+              isFold: false,
+              isBatch: false,
+              isAdvanced: true,
+              order: 5,
+            });
+            break;
+          // 完工
+          case 'PMC_101000_023':
+            topButtons.value.push({
+              describe: 'toBeFinished',
+              key: 'toBeFinished',
+              icon: 'mdi mdi-checkbox-marked-circle',
+              func: toBeFinished,
+              isFold: true,
+              isBatch: false,
+              isAdvanced: false,
+              order: 5,
+            });
+            break;
+          default:
+            break;
+        }
+      });
+      // obtainProcessedBtnList();
+    }
+  },
+  { deep: true, immediate: true },
+);
+// 得到物料档案显示值
+function getMaterialFileValue(list) {
+  // 附件
+  if (list?.length) {
+    return list.map((ite) => ite.plmFileName).length ? list.map((ite) => ite.plmFileName) : '-';
+  }
+  return '-';
+}
+// 物料档案预览
+const materialPartFilePreviewRef = ref(null);
+function handleClickPreviewOfMaterialPart(list) {
+  if (list && list.length) {
+    materialPartFilePreviewRef.value.handleOpenDialog(list);
+  }
+}
+
+/**
+ * 视图管理
+ */
+const allViewTabs = ref([]);
+const tabKey = ref(1);
+const viewIdFromList = ref(null);
+//获取页面的管理视图列表
+async function getViewTabList() {
+  loadingShow.value = true;
+  await apiFunction
+    .getViewOnlyReadList({
+      permissionCode: permissionData.value.permissionCode,
+    })
+    .then((res) => {
+      if (res.data?.code === 0) {
+        allViewTabs.value = [...res.data.content];
+      } else {
+        ElMessage.error(t(res.data.message));
+      }
+    })
+    .catch()
+    .finally(() => {
+      loadingShow.value = false;
+      viewIdFromList.value = null;
+    });
+}
+function handleTabUpdate() {
+  getViewTabList();
+}
+// 定义视图列表抽屉组件ref
+const viewListDrawerRef = ref(null);
+/**
+ * 打开视图列表抽屉
+ */
+function openViewListDrawer() {
+  viewListDrawerRef.value.open();
+}
+// 父组件：切换tab页 接收子组件传递的完整 Tab 数据
+function handleTabClick(id, type) {
+  if (id === viewId.value && !type) {
+    return;
+  }
+  if (type === 'edit') {
+    createViewRef.value.open(id, 0);
+    return;
+  }
+  if (type === 'copy') {
+    createViewRef.value.open(id, 2);
+    return;
+  }
+  viewId.value = id;
+  page.value.currentPage = 1;
+  filterSearch();
+}
+
+/**
+ * 视图操作记录
+ */
+const viewRecordDrawerRef = ref(null); // 视图记录ref
+// 打开视图操作记录抽屉
+function openViewRecordDrawer() {
+  viewRecordDrawerRef.value.open();
+}
+// 更新viewTabs
+function updateViewTabs(newTabOrderList, viewId) {
+  tabKey.value++;
+  allViewTabs.value = [...newTabOrderList];
+  viewIdFromList.value = viewId;
+  getViewTabList();
+}
+
+onMounted(async () => {
+  downloadParam.value = {};
+  loadingShow.value = true;
+  await getButtons();
+  await getCustomFields();
+  await getColumnConfig();
+  // querySearchRef.value.init();
+  //判断视图管理权限或者操作权限，如果存在视图 则有视图管理权限（调用视图管理权限接口），不存在则调用操作权限接口（隐藏 编辑复制删除 添加 操作记录功能）
+  isCanOperation.value = buttonList.value.some((it) => it.permissionCode === 'PMC_101000_025');
+  getViewTabList();
+});
+</script>
+<style scoped lang="scss">
+@use '@/scss/base/table.scss';
+
+.statusColor {
+  min-width: 100px;
+  height: 40px;
+  text-align: center;
+  line-height: 40px;
+}
+
+.a-text-class {
+  color: #409eff;
+  cursor: pointer;
+  text-decoration: underline;
+}
+
+.ellipsis-single-line {
+  white-space: nowrap;
+  /* 禁止换行 */
+  overflow: hidden;
+  /* 隐藏超出内容 */
+  text-overflow: ellipsis;
+  /* 显示省略号 */
+}
+</style>