first commit
This commit is contained in:
yanpeng200212
@@ -0,0 +1,283 @@
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, computed } from 'vue';
|
||||
import request from '../../../utils/request';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
||||
|
||||
const list = ref([]);
|
||||
const total = ref(0);
|
||||
const loading = ref(false);
|
||||
const deptOptions = ref([]); // 前缫车间
|
||||
const zhuangkouOptions = ref([]); // 工艺庄口
|
||||
const guigeOptions = ref([]); // 规格
|
||||
|
||||
const query = reactive({ pageIndex: 1, pageSize: 20, date: '', deptId: null, keyword: '' });
|
||||
|
||||
// 颜色字典（写死）
|
||||
const yanseOptions = ['蓝色', '绿色', '乌红', '深红', '桔红', '蓝方', '黄方', '绿方', '紫方', '红方', '金方', '红圆', '桔圆', '绿圆', '黄圆', '粉圆', '蓝圆', '嫩绿'];
|
||||
const jizuOptions = [1, 2, 3, 4, 5, 6];
|
||||
|
||||
const dialogVisible = ref(false);
|
||||
const dialogTitle = ref('新增落丝记录');
|
||||
const isEdit = ref(false);
|
||||
const editId = ref(null);
|
||||
const form = reactive({
|
||||
workDate: new Date(), deptId: null, gyzkId: null, jizu: 1,
|
||||
luosiTime: '', yanse: '', huishu: 0, chetaiStart: 0, chetaiEnd: 0,
|
||||
chetaishu: 0, isbanche: false, hours: 0, guige: '', chesu: 0
|
||||
});
|
||||
|
||||
async function load() {
|
||||
loading.value = true;
|
||||
try {
|
||||
const params = { pageIndex: query.pageIndex, pageSize: query.pageSize, keyword: query.keyword };
|
||||
if (query.date) params.date = query.date;
|
||||
if (query.deptId) params.deptId = query.deptId;
|
||||
const res = await request.get('/lsjl', { params });
|
||||
list.value = res.data.items;
|
||||
total.value = res.data.total;
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
// 加载前缫车间（名称含"前缫"的部门）
|
||||
async function loadDepts() {
|
||||
const res = await request.get('/sys/department');
|
||||
deptOptions.value = (res.data || []).filter((d) => d.name.includes('前缫'));
|
||||
}
|
||||
|
||||
async function loadZhuangkou() {
|
||||
const res = await request.get('/craftzhuangkou', { params: { pageIndex: 1, pageSize: 1000 } });
|
||||
zhuangkouOptions.value = res.data.items;
|
||||
}
|
||||
|
||||
async function loadGuige() {
|
||||
const res = await request.get('/shengsiguige/all');
|
||||
guigeOptions.value = res.data;
|
||||
}
|
||||
|
||||
// 车间+机组 → 自动带出车台号
|
||||
async function loadChetai() {
|
||||
if (!form.deptId || !form.jizu) return;
|
||||
try {
|
||||
const res = await request.get('/lsjl/chetai', { params: { deptId: form.deptId, jizu: form.jizu } });
|
||||
if (res.data) {
|
||||
form.chetaiStart = res.data.chetaiStart;
|
||||
form.chetaiEnd = res.data.chetaiEnd;
|
||||
calcChetaishu();
|
||||
}
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
function calcChetaishu() {
|
||||
if (form.chetaiStart > 0 && form.chetaiEnd > form.chetaiStart) {
|
||||
form.chetaishu = form.chetaiEnd - form.chetaiStart + 1;
|
||||
}
|
||||
}
|
||||
|
||||
function openCreate() {
|
||||
isEdit.value = false;
|
||||
dialogTitle.value = '新增落丝记录';
|
||||
Object.assign(form, {
|
||||
workDate: new Date(), deptId: deptOptions.value[0]?.id || null, gyzkId: null, jizu: 1,
|
||||
luosiTime: '', yanse: yanseOptions[0] || '', huishu: 0, chetaiStart: 0, chetaiEnd: 0,
|
||||
chetaishu: 0, isbanche: false, hours: 0, guige: guigeOptions.value[0] || '', chesu: 0
|
||||
});
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
|
||||
function openEdit(row) {
|
||||
isEdit.value = true;
|
||||
editId.value = row.id;
|
||||
dialogTitle.value = '修改落丝记录';
|
||||
Object.assign(form, {
|
||||
workDate: row.workDate, deptId: row.deptId, gyzkId: row.gyzkId, jizu: row.jizu,
|
||||
luosiTime: row.luosiTime, yanse: row.yanse, huishu: row.huishu,
|
||||
chetaiStart: row.chetaiStart, chetaiEnd: row.chetaiEnd, chetaishu: row.chetaishu,
|
||||
isbanche: row.isbanche, hours: row.hours, guige: row.guige, chesu: row.chesu
|
||||
});
|
||||
dialogVisible.value = true;
|
||||
}
|
||||
|
||||
async function save() {
|
||||
if (!form.deptId) { ElMessage.warning('请选择车间'); return; }
|
||||
if (!form.gyzkId) { ElMessage.warning('请选择庄口'); return; }
|
||||
try {
|
||||
if (isEdit.value) {
|
||||
await request.put(`/lsjl/${editId.value}`, form);
|
||||
ElMessage.success('更新成功');
|
||||
} else {
|
||||
await request.post('/lsjl', form);
|
||||
ElMessage.success('创建成功');
|
||||
}
|
||||
dialogVisible.value = false;
|
||||
load();
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
async function del(row) {
|
||||
await ElMessageBox.confirm('确定删除这条落丝记录吗？', '提示', { type: 'warning' });
|
||||
try {
|
||||
await request.delete(`/lsjl/${row.id}`);
|
||||
ElMessage.success('删除成功');
|
||||
load();
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
function handlePageChange(p) { query.pageIndex = p; load(); }
|
||||
|
||||
onMounted(() => { load(); loadDepts(); loadZhuangkou(); loadGuige(); });
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span>落丝记录</span>
|
||||
<el-button type="primary" @click="openCreate">新增落丝记录</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="search-bar">
|
||||
<el-date-picker v-model="query.date" type="date" placeholder="日期" value-format="YYYY-MM-DD" style="width: 160px" />
|
||||
<el-select v-model="query.deptId" clearable placeholder="车间" style="width: 160px">
|
||||
<el-option v-for="d in deptOptions" :key="d.id" :label="d.name" :value="d.id" />
|
||||
</el-select>
|
||||
<el-input v-model="query.keyword" placeholder="庄口/规格" clearable style="width: 180px" @keyup.enter="query.pageIndex=1;load()" />
|
||||
<el-button type="primary" @click="query.pageIndex=1;load()">搜索</el-button>
|
||||
<el-button @click="Object.assign(query,{date:'',deptId:null,keyword:'',pageIndex:1});load()">重置</el-button>
|
||||
</div>
|
||||
|
||||
<el-table v-loading="loading" :data="list" border stripe>
|
||||
<el-table-column label="日期" width="100">
|
||||
<template #default="{ row }">{{ row.workDate?.slice(0, 10) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="deptName" label="车间" width="120" />
|
||||
<el-table-column prop="jizu" label="机组" width="70" />
|
||||
<el-table-column prop="guige" label="规格" width="80" />
|
||||
<el-table-column prop="zhuangKouName" label="庄口" min-width="180" />
|
||||
<el-table-column prop="huishu" label="回数" width="70" />
|
||||
<el-table-column prop="yanse" label="颜色" width="80" />
|
||||
<el-table-column prop="isbancheName" label="半车" width="70" />
|
||||
<el-table-column prop="luosiTime" label="落丝时间" width="90" />
|
||||
<el-table-column prop="hours" label="时长" width="70" />
|
||||
<el-table-column prop="chetaishu" label="车台数" width="80" />
|
||||
<el-table-column prop="chetaiStart" label="开始车台" width="90" />
|
||||
<el-table-column prop="chetaiEnd" label="结束车台" width="90" />
|
||||
<el-table-column prop="chesu" label="车速" width="80" />
|
||||
<el-table-column label="操作" width="140" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button size="small" type="primary" @click="openEdit(row)">编辑</el-button>
|
||||
<el-button size="small" type="danger" @click="del(row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination class="pagination" :current-page="query.pageIndex" :page-size="query.pageSize" :total="total" layout="total, prev, pager, next" @current-change="handlePageChange" />
|
||||
|
||||
<el-dialog v-model="dialogVisible" :title="dialogTitle" width="640px">
|
||||
<el-form :model="form" label-width="100px">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="日期">
|
||||
<el-date-picker v-model="form.workDate" type="date" value-format="YYYY-MM-DD" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="车间">
|
||||
<el-select v-model="form.deptId" style="width: 100%" @change="loadChetai">
|
||||
<el-option v-for="d in deptOptions" :key="d.id" :label="d.name" :value="d.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="机组">
|
||||
<el-select v-model="form.jizu" style="width: 100%" @change="loadChetai">
|
||||
<el-option v-for="j in jizuOptions" :key="j" :label="j" :value="j" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="庄口">
|
||||
<el-select v-model="form.gyzkId" filterable style="width: 100%">
|
||||
<el-option v-for="z in zhuangkouOptions" :key="z.id" :label="z.zhuangKouName" :value="z.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="颜色">
|
||||
<el-select v-model="form.yanse" style="width: 100%">
|
||||
<el-option v-for="y in yanseOptions" :key="y" :label="y" :value="y" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="回数">
|
||||
<el-input-number v-model="form.huishu" :min="0" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="落丝时间">
|
||||
<el-time-picker v-model="form.luosiTime" value-format="HH:mm:ss" placeholder="落丝时间" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="缫丝时长">
|
||||
<el-input-number v-model="form.hours" :min="0" :precision="1" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="开始车台">
|
||||
<el-input-number v-model="form.chetaiStart" :min="0" style="width: 100%" @change="calcChetaishu" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="结束车台">
|
||||
<el-input-number v-model="form.chetaiEnd" :min="0" style="width: 100%" @change="calcChetaishu" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="车台数">
|
||||
<el-input-number v-model="form.chetaishu" :min="0" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="规格">
|
||||
<el-select v-model="form.guige" style="width: 100%">
|
||||
<el-option v-for="g in guigeOptions" :key="g" :label="g" :value="g" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="车速">
|
||||
<el-input-number v-model="form.chesu" :min="0" :precision="1" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="半车">
|
||||
<el-switch v-model="form.isbanche" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="save">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.card-header { display: flex; justify-content: space-between; align-items: center; }
|
||||
.search-bar { display: flex; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
|
||||
.pagination { margin-top: 16px; justify-content: flex-end; }
|
||||
</style>
|
||||
Reference in New Issue
Block a user