zhangwencui
2 天以前 cc13825bb6b3f4185e3db8aa29e58990ee4e01c0
src/views/equipmentManagement/spareParts/index.vue
@@ -36,9 +36,8 @@
            <el-tag type="success" size="small">{{ row.status }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="price" label="价格" width="140"></el-table-column>
        <el-table-column prop="quantity" label="数量" width="140"></el-table-column>
        <el-table-column prop="description" label="描述" width="150"></el-table-column>
        <el-table-column prop="description" label="描述"></el-table-column>
        <el-table-column label="操作" width="150" fixed="right" align="center">
          <template #default="{ row }">
            <el-button
@@ -60,6 +59,18 @@
          </template>
        </el-table-column>
      </el-table>
      <!-- 分页组件 -->
      <div class="pagination-container">
        <el-pagination
          v-model:current-page="pagination.current"
          v-model:page-size="pagination.size"
          :page-sizes="[10, 20, 50, 100]"
          :total="pagination.total"
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
      </div>
    </div>
    <el-dialog title="分类管理" v-model="dialogVisible" width="60%">
      <el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
@@ -99,16 +110,6 @@
        <el-form-item label="描述" prop="description">
          <el-input v-model="form.description"></el-input>
        </el-form-item>
        <el-form-item label="价格" prop="price">
          <el-input-number
            v-model="form.price"
            placeholder="请输入价格"
            :min="0"
            :step="0.01"
            :precision="2"
            style="width: 100%"
          ></el-input-number>
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
@@ -147,6 +148,12 @@
const queryParams = reactive({
  name: ''
});
// 分页参数
const pagination = reactive({
  current: 1,
  size: 10,
  total: 0
});
// 表单数据
const form = reactive({
  id:'',
@@ -155,7 +162,6 @@
  status: '',
  description: '',
  deviceLedgerIds: [],
  price: null
});
// 表单验证规则
@@ -215,7 +221,10 @@
const fetchListData = async () => {
  loading.value = true;
  try {
    const params = {};
    const params = {
      current: pagination.current,
      size: pagination.size
    };
    if (queryParams.name) {
      params.name = queryParams.name;
    }
@@ -223,6 +232,7 @@
    if (res.code === 200) {
      renderTableData.value = res.data.records || [];
      categories.value = res.data.records || [];
      pagination.total = res.data.total || 0;
    }
  } catch (error) {
      loading.value = false;
@@ -233,12 +243,27 @@
// 查询
const handleQuery = () => {
  pagination.current = 1;
  fetchListData();
}
// 重置查询
const resetQuery = () => {
  queryParams.name = '';
  pagination.current = 1;
  fetchListData();
}
// 分页大小改变
const handleSizeChange = (size) => {
  pagination.size = size;
  pagination.current = 1;
  fetchListData();
}
// 当前页改变
const handleCurrentChange = (current) => {
  pagination.current = current;
  fetchListData();
}
@@ -261,7 +286,6 @@
  form.status = '';
  form.description = '';
  form.deviceLedgerIds = [];
  form.price = null;
  operationType.value = 'add'
  dialogVisible.value = true;
};
@@ -373,6 +397,13 @@
  margin-top: unset;
}
.pagination-container {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
  padding: 16px 0;
}
.el-table__header-wrapper th {
  background-color: #f5f7fa;
  font-weight: 600;