<template>
|
<div class="app-container">
|
<div class="search_form">
|
<div>
|
<span class="search_title">库存时间设置：配置库存预警检测时间、盘点周期、周转率预警天数等</span>
|
</div>
|
<div>
|
<el-button type="primary" @click="openForm('add')">新增设置</el-button>
|
</div>
|
</div>
|
<div class="table_list">
|
<el-table :data="tableData" border v-loading="tableLoading" height="calc(100vh - 18.5em)">
|
<el-table-column align="center" label="序号" type="index" width="60" />
|
<el-table-column label="预警检测时间" prop="warningCheckTime" width="140" />
|
<el-table-column label="盘点周期" prop="stockTakingCycle" width="120" />
|
<el-table-column label="周转率预警天数" prop="turnoverWarnDays" width="150" />
|
<el-table-column label="每月自动盘点日" prop="autoTakingDay" width="150" />
|
<el-table-column label="是否启用" prop="enabled" width="100">
|
<template #default="scope">
|
<el-tag :type="scope.row.enabled === 1 ? 'success' : 'info'">{{ scope.row.enabled === 1 ? '启用' : '停用' }}</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="备注" prop="remark" show-overflow-tooltip />
|
<el-table-column fixed="right" label="操作" width="130" align="center">
|
<template #default="scope">
|
<el-button link type="primary" size="small" @click="openForm('edit', scope.row)">编辑</el-button>
|
<el-button link type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
|
<el-dialog v-model="dialogVisible" :title="dialogTitle" width="560px" @close="closeDialog">
|
<el-form :model="form" label-width="140px" label-position="top">
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="预警检测时间(HH:mm)">
|
<el-time-picker v-model="form.warningCheckTime" format="HH:mm" value-format="HH:mm" style="width: 100%" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="盘点周期">
|
<el-select v-model="form.stockTakingCycle" style="width: 100%" placeholder="请选择">
|
<el-option label="每日" value="日" />
|
<el-option label="每周" value="周" />
|
<el-option label="每月" value="月" />
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="周转率预警天数">
|
<el-input-number v-model="form.turnoverWarnDays" :min="1" style="width: 100%" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="每月自动盘点日">
|
<el-input-number v-model="form.autoTakingDay" :min="1" :max="31" style="width: 100%" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="是否启用">
|
<el-switch v-model="form.enabled" :active-value="1" :inactive-value="0" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="24">
|
<el-form-item label="备注">
|
<el-input v-model="form.remark" type="textarea" :rows="2" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<template #footer>
|
<el-button type="primary" @click="submitForm">确认</el-button>
|
<el-button @click="closeDialog">取消</el-button>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script setup>
|
import { ref, reactive, onMounted } from "vue";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
import { getStockTimeSettingList, addStockTimeSetting, updateStockTimeSetting, delStockTimeSetting } from "@/api/inventoryManagement/stockTaking.js";
|
|
const tableData = ref([]);
|
const tableLoading = ref(false);
|
const dialogVisible = ref(false);
|
const dialogTitle = ref("新增设置");
|
const dialogMode = ref("add");
|
const emptyForm = () => ({
|
id: null, warningCheckTime: "09:00", stockTakingCycle: "月", turnoverWarnDays: 30, autoTakingDay: 1, enabled: 1, remark: "",
|
});
|
const form = reactive(emptyForm());
|
|
const getList = () => {
|
tableLoading.value = true;
|
getStockTimeSettingList().then((res) => {
|
tableLoading.value = false;
|
tableData.value = res.data || [];
|
}).catch(() => { tableLoading.value = false; });
|
};
|
const openForm = (mode, row) => {
|
dialogMode.value = mode;
|
dialogTitle.value = mode === "add" ? "新增设置" : "编辑设置";
|
Object.assign(form, emptyForm());
|
if (mode === "edit" && row) {
|
Object.keys(form).forEach((k) => { if (row[k] !== undefined) form[k] = row[k]; });
|
}
|
dialogVisible.value = true;
|
};
|
const closeDialog = () => { dialogVisible.value = false; };
|
const submitForm = () => {
|
const payload = { ...form };
|
const req = dialogMode.value === "add" ? addStockTimeSetting(payload) : updateStockTimeSetting(payload);
|
req.then(() => {
|
ElMessage.success(dialogMode.value === "add" ? "新增成功" : "修改成功");
|
closeDialog();
|
getList();
|
}).catch(() => ElMessage.error("操作失败"));
|
};
|
const handleDelete = (row) => {
|
ElMessageBox.confirm("确认删除该设置？", "提示", { type: "warning" }).then(() => {
|
delStockTimeSetting([row.id]).then(() => { ElMessage.success("删除成功"); getList(); });
|
}).catch(() => {});
|
};
|
|
onMounted(() => { getList(); });
|
</script>
|
|
<style scoped lang="scss">
|
.table_list { margin-top: unset; }
|
</style>
|
