fix: 去掉表头排序及筛选

2025-03-25 09:15:17 +08:00
parent 4c5d4c7113
commit 66764e4d73
7 changed files with 239 additions and 239 deletions
--- a/src/views/Jyh/Search/Components/BatchVerify.vue
+++ b/src/views/Jyh/Search/Components/BatchVerify.vue
@@ -1,48 +1,56 @@
 <template>
  <div class="BatchVerify">
    <div class="search-form" v-if="isLogin">
-      <FileUploadButton
-        buttonText="批量导入"
-        accept=".xlsx"
-        :onFileUpload="handleFileUpload"
-      />
-      <d-search class="mt-0 mb-2" style="width: 400px" :delay="1000" @search="onSearch($event)" placeholder="请输入软件名称"></d-search>
+      <FileUploadButton buttonText="批量导入" accept=".xlsx" :onFileUpload="handleFileUpload" />
+      <d-search
+        class="mt-0 mb-2"
+        style="width: 400px"
+        :delay="1000"
+        @search="onSearch($event)"
+        placeholder="请输入软件名称"
+      ></d-search>
      <div class="tjsj">
        <span style="height: 14px" class="split"></span>
        <span>可使用：</span>
-        <span class="green" @click="filterVerifyResult(1)">{{useNum}}</span>
+        <span class="green" @click="filterVerifyResult(1)">{{ useNum }}</span>
        <span style="height: 14px" class="split"></span>
        <span>有风险：</span>
-        <span class="red" @click="filterVerifyResult(2)">{{riskNum}}</span>
+        <span class="red" @click="filterVerifyResult(2)">{{ riskNum }}</span>
        <span style="height: 14px" class="split"></span>
        <span>未治理：</span>
-        <span class="yellow" @click="filterVerifyResult(0)">{{noNum}}</span>
+        <span class="yellow" @click="filterVerifyResult(0)">{{ noNum }}</span>
      </div>
      <div class="left-btn">
-        <a v-if="isLogin" class="cursor-pointer" href="/static/软件存在及可信校验模版.xlsx" download><i class="icon icon-download-2"></i>下载excel模板</a>
+        <a v-if="isLogin" class="cursor-pointer" href="/static/软件存在及可信校验模版.xlsx" download
+          ><i class="icon icon-download-2"></i>下载excel模板</a
+        >
        <span v-if="isLogin" style="height: 14px" class="split"></span>
-        <d-button v-if="isLogin" class="output-btn" icon="icon-share" variant="text" @click="exportResult">导出</d-button>
+        <d-button v-if="isLogin" class="output-btn" icon="icon-share" variant="text" @click="exportResult"
+          >导出</d-button
+        >
        <span v-if="isLogin" style="height: 14px" class="split"></span>
-        <TableSetting :columns="columns" :show-column-list="showColumnList" @update:show-column-list="updateShowColumnList"/>
+        <TableSetting
+          :columns="columns"
+          :show-column-list="showColumnList"
+          @update:show-column-list="updateShowColumnList"
+        />
      </div>
    </div>
    <div class="mt-3 px-20">
-      <d-table class="jyh-table" v-if="tableData.length" :striped="false" :data="tableData" table-layout="auto" :show-loading="loading">
-
+      <d-table
+        class="jyh-table"
+        v-if="tableData.length"
+        :striped="false"
+        :data="tableData"
+        table-layout="auto"
+        :show-loading="loading"
+      >
        <!-- 索引列 -->
        <d-column type="index" width="40"></d-column>

        <!-- 动态渲染列 -->
        <template v-for="column in columns" :key="column.key">
-          <d-column
-            v-if="column.visible"
-            :field="column.key"
-            :header="column.label"
-            :filterable="column.filterable"
-            :filter-list="column.filterList"
-            :sortable="column.sortable"
-            @filter-change="handleFilterChange"
-          >
+          <d-column v-if="column.visible" :field="column.key" :header="column.label">
            <!-- 自定义列内容 -->
            <template #default="scope">
              <template v-if="column.key === 'validStatus'">
@@ -91,30 +99,33 @@
          </d-column>
        </template>
        <d-column header="操作" width="200" fixed-right="0px">
-        <!--TODO:申请入口只有校验不通过的才显示-->
+          <!--TODO:申请入口只有校验不通过的才显示-->
          <template #default="scope">
-            <d-button
-              variant="text"
-              v-if="scope.row.validStatus == 0"
-              :disabled="scope.row.validStatus !== 0"
-            >
+            <d-button variant="text" v-if="scope.row.validStatus == 0" :disabled="scope.row.validStatus !== 0">
              申请入库
            </d-button>
          </template>
        </d-column>
      </d-table>

-<!--      <DataPanel v-else skeleton :card="false" :empty="true">-->
-<!--      </DataPanel>-->
+      <!--      <DataPanel v-else skeleton :card="false" :empty="true">-->
+      <!--      </DataPanel>-->

      <NoData v-else :small="false"></NoData>
    </div>

    <!-- 删除组件 -->
-    <GModal v-model="deletevModels" ref="deleteModal" title="删除?" @confirm="confirmDelete" showWarnIcon
-            confirmColor="danger">
-      <span class="inline-block text-G900 text-sm font-normal leading-[20px] break-all">你确认删除此项：{{ item.cla_name }}
-        ？</span>
+    <GModal
+      v-model="deletevModels"
+      ref="deleteModal"
+      title="删除?"
+      @confirm="confirmDelete"
+      showWarnIcon
+      confirmColor="danger"
+    >
+      <span class="inline-block text-G900 text-sm font-normal leading-[20px] break-all"
+        >你确认删除此项：{{ item.cla_name }} ？</span
+      >
    </GModal>
  </div>
 </template>
@@ -134,28 +145,28 @@ import { storeToRefs } from 'pinia';
 import TableSetting from '@/components/TableSetting/index.vue';
 import FileUploadButton from '@/components/FileUploadButton/index.vue';
 import { releasePage, repoImport } from '@/api/jyh';
-import NoData from "@/components/NoData/NoData.vue";
-import * as XLSX from "xlsx"
+import NoData from '@/components/NoData/NoData.vue';
+import * as XLSX from 'xlsx';

 const useNum = computed(() => {
-  if (tableData.value.length>0) {
-    return tableData.value.filter(item => item.validStatus === 1).length;
+  if (tableData.value.length > 0) {
+    return tableData.value.filter((item) => item.validStatus === 1).length;
  } else {
    return 0;
  }
 });

 const riskNum = computed(() => {
-  if (tableData.value.length>0) {
-    return tableData.value.filter(item => item.validStatus === 2).length;
+  if (tableData.value.length > 0) {
+    return tableData.value.filter((item) => item.validStatus === 2).length;
  } else {
    return 0;
  }
 });

 const noNum = computed(() => {
-  if (tableData.value.length>0) {
-    return tableData.value.filter(item => item.validStatus === 0).length;
+  if (tableData.value.length > 0) {
+    return tableData.value.filter((item) => item.validStatus === 0).length;
  } else {
    return 0;
  }
@@ -165,10 +176,10 @@ const noNum = computed(() => {
 const handleFileUpload = async (file) => {
  console.log('选择的文件:', file.name);

-  const { data, error } = await repoImport({file});
+  const { data, error } = await repoImport({ file });
  if (!error && data) {
    currentReusltFilter.value = null;
-    allTableData.value = data.data.data
+    allTableData.value = data.data.data;
    tableData.value = [...allTableData.value];
  }

@@ -195,14 +206,24 @@ const columns = ref([
  { key: 'licenseCount', label: 'License数量', visible: true, filterable: false, sortable: false },
  { key: 'industryCategory', label: '行业类型', visible: true, filterable: true, sortable: false },
  { key: 'primaryLanguage', label: '编程语言', visible: true, filterable: true, sortable: false },
-  { key: 'codeLines', label: '代码量', visible: true, filterable: false, sortable: false },
+  { key: 'codeLines', label: '代码量', visible: true, filterable: false, sortable: false }
 ]);
 const validStatusMap = {
-  0 : '未治理',
-  1 : '可使用',
-  2 : '有风险'
-}
-const formData = ref({ title: '',type: '', useType: '',formData:'',select: '',time1:null,name:'',versionCode:'',pulishTime:'' });
+  0: '未治理',
+  1: '可使用',
+  2: '有风险'
+};
+const formData = ref({
+  title: '',
+  type: '',
+  useType: '',
+  formData: '',
+  select: '',
+  time1: null,
+  name: '',
+  versionCode: '',
+  pulishTime: ''
+});
 const typeOptions = reactive(['主软件', '依赖软件']);
 const riskOptions = reactive(['低', '中', '高']);
 const useTypeOptions = reactive(['软件', '文档', '文档+软件']);
@@ -230,35 +251,38 @@ const openDelete = (row: any) => {
  deletevModels.value = true;
 };

-const getReleaseList = async() => {
+const getReleaseList = async () => {
  if (!isLogin.value) {
    return;
  }
  loading.value = true;
-  const { data, error } = await releasePage({  current: pager.value.pageIndex,size: pager.value.pageSize  });
+  const { data, error } = await releasePage({ current: pager.value.pageIndex, size: pager.value.pageSize });
  if (!error && data) {
    loading.value = false;
    allTableData.value = data.data.records;
-    tableData.value = [...allTableData.value]
+    tableData.value = [...allTableData.value];
    pager.value.total = data.data.total;
  } else {
    loading.value = false;
  }
 };

-onMounted(async() => {
+onMounted(async () => {
  // getReleaseList();
 });

 const filterTable = () => {
-  tableData.value = allTableData.value.filter(item => {
+  tableData.value = allTableData.value.filter((item) => {
    if (currentReusltFilter.value !== null) {
-      return item.softwareName.trim().toLowerCase().includes(searchStr.value.trim().toLowerCase()) && item.validStatus === currentReusltFilter.value;
+      return (
+        item.softwareName.trim().toLowerCase().includes(searchStr.value.trim().toLowerCase()) &&
+        item.validStatus === currentReusltFilter.value
+      );
    } else {
      return item.softwareName.trim().toLowerCase().includes(searchStr.value.trim().toLowerCase());
    }
-  })
-}
+  });
+};

 const filterVerifyResult = (type) => {
  if (currentReusltFilter.value === type) {
@@ -267,12 +291,12 @@ const filterVerifyResult = (type) => {
    currentReusltFilter.value = type;
  }
  filterTable();
-}
+};

 const onSearch = (str: string) => {
  searchStr.value = str;
  filterTable();
-}
+};

 const router = useRouter();

@@ -285,8 +309,8 @@ const updateShowColumnList = (newValue) => {
  tableKey.value++; // 更新 tableKey，强制刷新表格
 };

-
-const handleBatchImport = async() => { // 多个项目导入
+const handleBatchImport = async () => {
+  // 多个项目导入
  // importRepo.value = queryTable.value.filter((val) => val.checked);
  loadingStatus.batchMigrating = true;
  // await batchMigrate();
@@ -294,29 +318,27 @@ const handleBatchImport = async() => { // 多个项目导入
 };

 const exportResult = () => {
-
  if (!allTableData.value.length) {
    Message.info('暂无结果');
    return;
  }

-  const exportData = allTableData.value.map(item => {
-    let res = {}
-    columns.value.forEach(col => {
-
+  const exportData = allTableData.value.map((item) => {
+    let res = {};
+    columns.value.forEach((col) => {
      if (col.key === 'validStatus') {
        res[col.label] = validStatusMap[item[col.key]] ? validStatusMap[item[col.key]] : '';
      } else {
        res[col.label] = item[col.key] ? item[col.key] : '';
      }
-    })
-    return res
-  })
+    });
+    return res;
+  });

  try {
    const workSheet = XLSX.utils.json_to_sheet(exportData);
-    const workBook: any = { Sheets: { '校验结果': workSheet}, SheetNames: ['校验结果']};
-    const excelBuffer = XLSX.write(workBook, { bookType: 'xlsx', type: 'array'});
+    const workBook: any = { Sheets: { 校验结果: workSheet }, SheetNames: ['校验结果'] };
+    const excelBuffer = XLSX.write(workBook, { bookType: 'xlsx', type: 'array' });

    const link = document.createElement('a');
    const blob = new Blob([excelBuffer]);
@@ -326,11 +348,11 @@ const exportResult = () => {
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
-    Message.success('导出成功')
+    Message.success('导出成功');
  } catch {
-    Message.error('导出失败')
+    Message.error('导出失败');
  }
-}
+};

 // 跳转
 const gotoDetail = (row) => {
@@ -421,7 +443,6 @@ const signCla = (row: any) => {
    right: 0;
    top: 0;
  }
-
 }

 .error {
@@ -440,7 +461,7 @@ const signCla = (row: any) => {
  font-size: 12px;
  line-height: 16px;
  margin-right: 8px;
-  border: 1px solid #E3E3EE;
+  border: 1px solid #e3e3ee;
 }

 .one-line {
@@ -485,7 +506,6 @@ const signCla = (row: any) => {
    line-height: 22px;
    letter-spacing: 0px;
    text-align: left;
-
  }
 }

--- a/src/views/Jyh/Search/Components/OssQuery.vue
+++ b/src/views/Jyh/Search/Components/OssQuery.vue
@@ -97,15 +97,7 @@

        <!-- 动态渲染列 -->
        <template v-for="column in columns" :key="column.key">
-          <d-column
-            v-if="column.visible"
-            :field="column.key"
-            :header="column.label"
-            :filterable="column.filterable"
-            :filter-list="column.filterList"
-            :sortable="column.sortable"
-            @filter-change="handleFilterChange"
-          >
+          <d-column v-if="column.visible" :field="column.key" :header="column.label">
            <!-- 自定义列内容 -->
            <template #default="scope">
              <template v-if="column.key === 'versionName'">