zhangwencui
2026-05-23 feddaa9bbeef8b41c34eab67ab2a9f69a32db348
src/views/equipmentManagement/measurementEquipment/index.vue
@@ -3,37 +3,48 @@
      <div class="search_form mb20">
         <div>
            <span class="search_title">录入日期:</span>
            <el-date-picker
               v-model="searchForm.recordDate"
        <el-date-picker v-model="searchForm.recordDate"
               value-format="YYYY-MM-DD"
               format="YYYY-MM-DD"
               type="date"
               placeholder="请选择"
               clearable
               style="width: 160px"
               @change="handleQuery"
            />
                        @change="handleQuery" />
            <span class="search_title ml10">计量器具编号:</span>
            <el-input v-model="searchForm.code" placeholder="请输入编号" clearable style="width: 240px" @change="handleQuery"/>
        <el-input v-model="searchForm.code"
                  placeholder="请输入编号"
                  clearable
                  style="width: 240px"
                  @change="handleQuery" />
            <span class="search_title ml10">状态:</span>
            <el-select v-model="searchForm.status" placeholder="请选择状态" @change="handleQuery" style="width: 160px" clearable>
               <el-option label="有效" :value="1"></el-option>
               <el-option label="逾期" :value="2"></el-option>
        <el-select v-model="searchForm.status"
                   placeholder="请选择状态"
                   @change="handleQuery"
                   style="width: 160px"
                   clearable>
          <el-option label="有效"
                     :value="1"></el-option>
          <el-option label="逾期"
                     :value="2"></el-option>
            </el-select>
            <el-button type="primary" @click="handleQuery" style="margin-left: 10px"
            >搜索</el-button
            >
            <el-button @click="handleReset" style="margin-left: 10px">重置</el-button>
        <el-button type="primary"
                   @click="handleQuery"
                   style="margin-left: 10px">搜索</el-button>
        <el-button @click="handleReset"
                   style="margin-left: 10px">重置</el-button>
         </div>
         <div>
            <el-button type="primary" @click="openForm('add')">新增计量器具</el-button>
            <el-button type="danger" plain @click="handleDelete">删除</el-button>
        <el-button type="primary"
                   @click="openForm('add')">新增计量器具</el-button>
        <el-button type="danger"
                   plain
                   @click="handleDelete">删除</el-button>
            <el-button @click="handleOut">导出</el-button>
         </div>
      </div>
      <div class="table_list">
         <PIMTable
            rowKey="id"
      <PIMTable rowKey="id"
            :column="tableColumn"
            :tableData="tableData"
            :page="page"
@@ -42,18 +53,26 @@
            :tableLoading="tableLoading"
            @pagination="pagination"
        :dbRowClick="dbRowClick"
        :rowClassName="rowClassName"
         ></PIMTable>
                :rowClassName="rowClassName"></PIMTable>
      </div>
      <form-dia ref="formDia" @close="handleQuery"></form-dia>
      <calibration-dia ref="calibrationDia" @close="handleQuery"></calibration-dia>
    <form-dia ref="formDia"
              @close="handleQuery"></form-dia>
    <calibration-dia ref="calibrationDia"
                     @close="handleQuery"></calibration-dia>
    <files-dia ref="filesDia"></files-dia>
    <rowClickDataForm ref="rowClickData"></rowClickDataForm>
   </div>
</template>
<script setup>
import {onMounted, ref, reactive, toRefs, getCurrentInstance, nextTick} from "vue";
  import {
    onMounted,
    ref,
    reactive,
    toRefs,
    getCurrentInstance,
    nextTick,
  } from "vue";
import FormDia from "@/views/equipmentManagement/measurementEquipment/components/formDia.vue";
import {ElMessageBox} from "element-plus";
import useUserStore from "@/store/modules/user.js";
@@ -63,9 +82,9 @@
  measuringInstrumentListPage,
} from "@/api/equipmentManagement/measurementEquipment.js";
import FilesDia from "./filesDia.vue";
import rowClickDataForm from "./components/rowClickData.vue"
  import rowClickDataForm from "./components/rowClickData.vue";
const { proxy } = getCurrentInstance();
const userStore = useUserStore()
  const userStore = useUserStore();
const data = reactive({
   searchForm: {
@@ -81,56 +100,56 @@
      label: "出厂编号",
      prop: "code",
    minWidth:150,
    align:"center"
      align: "center",
   },
  {
    label: "计量器具名称",
    prop: "name",
    width: '160px',
      width: "160px",
    align: "center",
  },
   {
      label: "检定单位",
      prop: "unit",
      width: 200,
    align:"center"
      align: "center",
   },
   {
      label: "证书编号",
      prop: "model",
      width:200,
    align:"center"
      align: "center",
   },
   {
      label: "最新鉴定日期",
      prop: "mostDate",
      width: 130,
    align:"center"
      align: "center",
   },
   {
      label: "录入人",
      prop: "userName",
      width: 130,
    align:"center"
      align: "center",
   },
   {
      label: "录入日期",
      prop: "recordDate",
    align:"center",
    minWidth: 130
      minWidth: 130,
   },
   {
      label: "有效日期",
      prop: "valid",
      width: 130,
    align:"center"
      align: "center",
   },
  {
    label: "状态",
    prop: "status",
    width: 130,
    align: "center",
    formatData: (params) => {
      formatData: params => {
      if (params === 1) {
        return "有效";
      } else if (params === 2) {
@@ -138,26 +157,26 @@
      } else {
        return null;
      }
    }
      },
  },
   {
      dataType: "action",
      label: "操作",
      align: "center",
      width: '130',
      fixed: 'right',
      width: "130",
      fixed: "right",
      operation: [
      {
         name: "附件",
         type: "text",
         clickFun: (row) => {
          clickFun: row => {
          openFilesFormDia(row);
         },
      },
         {
            name: "查看",
          name: "编辑",
            type: "text",
            clickFun: (row) => {
          clickFun: row => {
               openCalibrationDia("verifying", row);
            },
         },
@@ -166,8 +185,8 @@
]);
const tableData = ref([]);
const tableLoading = ref(false);
const rowClickData = ref([])
const filesDia = ref()
  const rowClickData = ref([]);
  const filesDia = ref();
const page = reactive({
   current: 1,
   size: 100,
@@ -176,17 +195,17 @@
const selectedRows = ref([]);
// 打开附件弹框
const openFilesFormDia = (row) => {
    filesDia.value?.openDialog(row,'measuring_instrument_ledger')
  const openFilesFormDia = row => {
    filesDia.value?.openDialog(row, "measuring_instrument_ledger");
};
const dbRowClick = (row)=>{
  rowClickData.value?.openDialog(row)
}
  const dbRowClick = row => {
    rowClickData.value?.openDialog(row);
  };
// 行样式:快到期(7天内)或逾期标红
const rowClassName = ({ row }) => {
  console.log('rowClassName called:', row);
    console.log("rowClassName called:", row);
  // valid 是有效天数,mostDate 是最新检定日期
  if (row.valid && row.mostDate) {
    const mostDate = new Date(row.mostDate);
@@ -197,24 +216,33 @@
    
    const now = new Date();
    const diffDays = Math.ceil((expireDate - now) / (1000 * 60 * 60 * 24));
    console.log('row:', row.code, 'validDays:', validDays, 'expireDate:', expireDate, 'diffDays:', diffDays);
      console.log(
        "row:",
        row.code,
        "validDays:",
        validDays,
        "expireDate:",
        expireDate,
        "diffDays:",
        diffDays
      );
    // 7天内到期或已逾期都标红
    if (diffDays <= 7) {
      console.log('return warning-row');
      return 'warning-row';
        console.log("return warning-row");
        return "warning-row";
    }
  } else {
    console.log('row missing valid or mostDate:', row.valid, row.mostDate);
      console.log("row missing valid or mostDate:", row.valid, row.mostDate);
  }
  return '';
}
    return "";
  };
// 表格选择数据
const handleSelectionChange = (selection) => {
  const handleSelectionChange = selection => {
   selectedRows.value = selection;
};
const formDia = ref()
const calibrationDia = ref()
  const formDia = ref();
  const calibrationDia = ref();
// 查询列表
/** 搜索按钮操作 */
@@ -231,39 +259,41 @@
   page.current = 1;
   getList();
};
const pagination = (obj) => {
  const pagination = obj => {
   page.current = obj.page;
   page.size = obj.limit;
   getList();
};
const getList = () => {
   tableLoading.value = true;
   measuringInstrumentListPage({ ...searchForm.value, ...page }).then((res) => {
    measuringInstrumentListPage({ ...searchForm.value, ...page })
      .then(res => {
      tableLoading.value = false;
      tableData.value = res.data.records;
      page.total = res.data.total;
   }).catch((err) => {
      tableLoading.value = false;
   })
      .catch(err => {
        tableLoading.value = false;
      });
};
// 打开弹框
const openForm = (type, row) => {
   nextTick(() => {
      formDia.value?.openDialog(type, row)
   })
      formDia.value?.openDialog(type, row);
    });
};
// 打开检定校准弹框
const openCalibrationDia = (type, row) => {
   nextTick(() => {
      calibrationDia.value?.openDialog(type, row)
   })
}
      calibrationDia.value?.openDialog(type, row);
    });
  };
const handleDelete = () => {
   let ids = [];
   if (selectedRows.value.length > 0) {
      ids = selectedRows.value.map((item) => item.id);
      ids = selectedRows.value.map(item => item.id);
   } else {
      proxy.$modal.msgWarning("请选择数据");
      return;
@@ -276,7 +306,7 @@
      .then(() => {
         tableLoading.value = true;
         measuringInstrumentDelete(ids)
            .then((res) => {
          .then(res => {
               proxy.$modal.msgSuccess("删除成功");
               getList();
            })
@@ -296,7 +326,11 @@
      type: "warning",
   })
      .then(() => {
         proxy.download("/measuringInstrumentLedger/export", {}, "计量器具台账.xlsx");
        proxy.download(
          "/measuringInstrumentLedger/export",
          {},
          "计量器具台账.xlsx"
        );
      })
      .catch(() => {
         proxy.$modal.msg("已取消");