This commit is contained in:
zyh
2026-02-03 14:43:20 +08:00
7 changed files with 962 additions and 1625 deletions

View File

View File

@@ -9,6 +9,16 @@ export function listSheepfold_management(query) {
})
}
// 主表格:羊舍级别汇总查询
export function listSheepfoldSummary(query) {
return request({
url: '/sheepfold_management/sheepfold_management/summaryList',
method: 'get',
params: query
})
}
// 查询羊舍管理详细
export function getSheepfold_management(id) {
return request({

File diff suppressed because it is too large Load Diff

View File

@@ -207,29 +207,31 @@
<!-- 胚胎等级 -->
<el-divider content-position="left">胚胎等级</el-divider>
<el-row :gutter="20">
<el-col :span="4">
<el-form-item label="A+">
<el-input-number v-model="form.gradeAPlus" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
<el-col :span="6">
<el-form-item label="A+级" prop="gradeAPlus" label-width="60px">
<el-input-number v-model="form.gradeAPlus" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="A">
<el-input-number v-model="form.gradeA" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
<el-col :span="6">
<el-form-item label="A级" prop="gradeA" label-width="60px">
<el-input-number v-model="form.gradeA" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="B">
<el-input-number v-model="form.gradeB" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
<el-col :span="6">
<el-form-item label="B级" prop="gradeB" label-width="60px">
<el-input-number v-model="form.gradeB" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="C">
<el-input-number v-model="form.gradeC" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
<el-col :span="6">
<el-form-item label="C级" prop="gradeC" label-width="60px">
<el-input-number v-model="form.gradeC" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="D">
<el-input-number v-model="form.gradeD" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<el-form-item label="D级" prop="gradeD" label-width="60px">
<el-input-number v-model="form.gradeD" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
</el-row>
@@ -237,29 +239,31 @@
<!-- 发育阶段 -->
<el-divider content-position="left">发育阶段</el-divider>
<el-row :gutter="20">
<el-col :span="4">
<el-form-item label="2/4细胞">
<el-input-number v-model="form.cell24" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
<el-col :span="6">
<el-form-item label="2/4细胞" prop="cell24" label-width="60px">
<el-input-number v-model="form.cell24" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="8细胞">
<el-input-number v-model="form.cell8" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
<el-col :span="6">
<el-form-item label="8细胞" prop="cell8" label-width="60px">
<el-input-number v-model="form.cell8" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="16细胞">
<el-input-number v-model="form.cell16" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
<el-col :span="6">
<el-form-item label="16细胞" prop="cell16" label-width="60px">
<el-input-number v-model="form.cell16" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="未受精">
<el-input-number v-model="form.unfertilized" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
<el-col :span="6">
<el-form-item label="未受精" prop="unfertilized" label-width="60px">
<el-input-number v-model="form.unfertilized" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="退化">
<el-input-number v-model="form.degenerated" :min="0" controls-position="right" @change="calculateTotal" style="width: 100%" />
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<el-form-item label="退化" prop="degenerated" label-width="60px">
<el-input-number v-model="form.degenerated" :min="0" @change="calculateTotal" style="width: 100%" />
</el-form-item>
</el-col>
</el-row>
@@ -310,7 +314,11 @@
</el-col>
<el-col :span="6">
<el-form-item label="去向" prop="destination">
<el-input v-model="form.destination" placeholder="默认遗弃可自行修改" />
<el-select v-model="form.destination" placeholder="请选择去向" style="width: 100%">
<el-option label="冷冻保存" value="冷冻保存" />
<el-option label="移植" value="移植" />
<el-option label="遗弃" value="遗弃" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
@@ -511,15 +519,22 @@ function handleFlushTimeChange(val) {
/** 供体母羊选择变化 */
function handleDonorFemaleChange(val) {
if (!val) {
form.value.donorFemaleVariety = null
form.value.donorMaleNo = null
form.value.donorMaleVariety = null
form.value.embryoVariety = null
form.value.ranchId = null
form.value.ranchName = null
form.value.embryoAge = null
matingDateCache.value = null
return
if (!val) { /* 清空逻辑... */ return; }
getDonorInfo(val).then(response => {
console.log("后端返回的数据:", response.data); // 检查这里是否有 embryoVariety 字段
const info = response.data || {};
// 确保这些字段名与后端 result.put(...) 的 Key 一致
form.value.donorFemaleVariety = info.donorFemaleVariety || null;
form.value.donorMaleNo = info.donorMaleNo || null; // 匹配成功后会自动填入
form.value.donorMaleVariety = info.donorMaleVariety || null;
form.value.embryoVariety = info.embryoVariety || null; // 自动计算后的品种
form.value.ranchId = info.ranchId || null;
form.value.ranchName = info.ranchName || null;
matingDateCache.value = info.matingDate || null;
calculateEmbryoAge(); // 计算胎龄
});
}
// 调用接口获取关联信息

View File

@@ -0,0 +1,110 @@
<!-- src/views/fileManagement/sheep_pedigree/index.vue -->
<template>
<div class="app-container">
<!-- 诊断信息 -->
<div style="background:#f0f9ff; padding:20px; margin-bottom:20px; border:1px solid #bae0ff;">
<h3>页面加载诊断</h3>
<p><strong>路由路径</strong> {{ $route.path }}</p>
<p><strong>路由参数</strong> {{ $route.params }}</p>
<p><strong>查询参数</strong> {{ $route.query }}</p>
<p><strong>组件路径</strong> {{ $route.meta?.component }}</p>
<p><strong>菜单配置</strong> {{ menuConfig }}</p>
<el-button @click="reloadPage" type="primary">重新加载</el-button>
<el-button @click="goBack" type="info">返回</el-button>
</div>
<!-- 测试内容 -->
<div style="text-align:center; padding:50px;">
<h1 style="color:#1890ff;">羊只系谱管理页面</h1>
<p v-if="isFrameIssue" style="color:red; font-weight:bold;">
检测到 isFrame=1 问题请修改菜单配置为"是否外链="
</p>
<p>这是一个测试页面如果看到此内容说明组件加载成功</p>
<el-button type="success" @click="testClick">测试按钮</el-button>
</div>
</div>
</template>
<script>
export default {
name: "SheepPedigree",
data() {
return {
menuConfig: {},
isFrameIssue: false
};
},
created() {
console.log("=== 羊只系谱页面创建 ===");
console.log("1. 路由信息:", this.$route);
console.log("2. 路由匹配:", this.$router.currentRoute);
console.log("3. 权限信息:", this.$store.state.user.permissions);
// 检测是否是isFrame问题
const route = this.$route;
if (route.meta && route.meta.isFrame === '1') {
this.isFrameIssue = true;
console.error("检测到isFrame=1会导致页面显示问题");
}
// 获取当前路由对应的菜单配置
this.getMenuConfig();
// 测试API
this.testApiConnection();
},
mounted() {
console.log("页面已挂载到DOM");
console.log("当前URL", window.location.href);
},
methods: {
getMenuConfig() {
// 从Vuex中查找当前路由对应的菜单
const routes = this.$store.state.permission.routes || [];
this.findMenuConfig(routes, this.$route.path);
},
findMenuConfig(menus, path) {
for (const menu of menus) {
if (menu.path === path) {
this.menuConfig = menu;
console.log("找到菜单配置:", menu);
return;
}
if (menu.children) {
this.findMenuConfig(menu.children, path);
}
}
},
async testApiConnection() {
try {
// 测试调用API使用已有的API
const response = await this.$axios.get('/system/dict/data/type/sheep_type');
console.log("API测试成功", response.data);
} catch (error) {
console.warn("API测试失败", error.response || error.message);
}
},
testClick() {
this.$message.success("按钮点击成功!页面功能正常");
},
reloadPage() {
window.location.reload();
},
goBack() {
this.$router.back();
}
}
};
</script>
<style scoped>
.app-container {
min-height: 500px;
padding: 20px;
}
</style>

View File

@@ -37,16 +37,6 @@
v-hasPermi="['sheepfold_management:sheepfold_management:add']"
>新增</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-button
type="success"
plain
icon="Edit"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['sheepfold_management:sheepfold_management:edit']"
>修改</el-button>
</el-col> -->
<el-col :span="1.5">
<el-button
type="danger"
@@ -69,27 +59,32 @@
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="sheepfold_managementList" @selection-change="handleSelectionChange" border>
<!-- 主表格羊舍级别汇总数据每个羊舍一行 -->
<el-table v-loading="loading" :data="sheepfoldSummaryList" @selection-change="handleSelectionChange" border>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="羊舍id" align="center" prop="id" sortable/>
<el-table-column label="牧场" align="center" prop="ranchId" sortable>
<template #default="scope">
<dict-tag :options="da_ranch" :value="scope.row.ranchId"/>
</template>
</el-table-column>
<el-table-column label="羊舍名称" align="center" prop="sheepfoldName" sortable/>
<!-- 羊舍名称唯一添加点击事件 -->
<el-table-column label="羊舍名称" align="center" prop="sheepfoldName" sortable>
<template #default="scope">
<span style="color: #409eff; cursor: pointer;" @click="openSheepfoldDetail(scope.row)">
{{ scope.row.sheepfoldName }}
</span>
</template>
</el-table-column>
<el-table-column label="羊舍类型" align="center" prop="sheepfoldTypeId" sortable>
<template #default="scope">
<dict-tag :options="bas_sheepfold_type" :value="scope.row.sheepfoldTypeId"/>
</template>
</el-table-column>
<el-table-column label="羊舍编号" align="center" prop="sheepfoldNo" sortable/>
<el-table-column label="排号" align="center" prop="rowNo" sortable/>
<el-table-column label="栏号" align="center" prop="columns" sortable/>
<el-table-column label="羊数" align="center" prop="totalSheepCount" sortable/>
<el-table-column label="备注" align="center" prop="comment" sortable/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<!-- <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['sheepfold_management:sheepfold_management:edit']">修改</el-button> -->
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['sheepfold_management:sheepfold_management:remove']">删除</el-button>
</template>
</el-table-column>
@@ -97,35 +92,74 @@
<pagination
v-show="total>0"
:total="total"
:total="sheepfoldSummaryList.length"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<!-- 羊舍详情弹窗栏位级别明细 -->
<el-dialog
title="羊舍栏位详情"
v-model="subDialogVisible"
width="800px"
append-to-body
>
<el-table v-loading="subLoading" :data="subSheepfoldList" border>
<el-table-column label="牧场" align="center" prop="ranchId">
<template #default="scope">
<dict-tag :options="da_ranch" :value="scope.row.ranchId"/>
</template>
</el-table-column>
<!-- 羊舍名称列固定显示点击的主表格名称 -->
<el-table-column label="羊舍名称" align="center">
<template #default="scope">
{{ selectedSheepfoldName }} <!-- 不再用后端返回的直接用选中的名称 -->
</template>
</el-table-column>
<el-table-column label="栏舍名称" align="center">
<template #default="scope">
{{ scope.row.sheepfoldName }}{{ scope.row.rowNo }}{{ scope.row.columns }}
</template>
</el-table-column>
<!-- 羊数列显示单栏位羊数处理空值为0 -->
<el-table-column label="羊数" align="center">
<template #default="scope">
{{ scope.row.sheepCount || 0 }} <!-- 空值显示0 -->
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="comment"/>
</el-table>
<!-- 2. 新增总羊数展示区域放在表格下方 -->
<div style="text-align: left; margin-top: 15px; font-size: 16px; font-weight: bold;">
该羊舍总羊数{{ selectedTotalSheepCount }}
</div>
<!-- ===== 图形化展示区域 ===== -->
<el-divider>牧场羊舍示意图</el-divider>
<template #footer>
<el-button @click="subDialogVisible = false">关闭</el-button>
</template>
</el-dialog>
<!-- 牧场羊舍示意图保留原有 -->
<!-- <el-divider>牧场羊舍示意图</el-divider>
<el-collapse
v-model="activeNames"
accordion
style="margin-top: 16px; max-width: 100%; overflow-x: auto"
>
<!-- 一级牧场 -->
<el-collapse-item
v-for="ranch in seatMapTree"
:key="ranch.ranchId"
:title="ranch.ranchName"
:name="ranch.ranchId"
>
<!-- 二级羊舍类型 -->
<el-collapse accordion>
<el-collapse-item
v-for="type in ranch.types"
:key="type.typeId"
:title="`${type.typeName} (${type.folds.length}个)`"
>
<!-- 三级羊舍卡片 -->
<el-row :gutter="16">
<el-col
v-for="fold in type.folds"
@@ -141,7 +175,6 @@
<template #header>
<span>{{ fold.foldNo }}{{type.typeName}}</span>
</template>
<!-- 四级 -->
<div
v-for="row in fold.rows"
:key="row.rowNo"
@@ -149,7 +182,6 @@
>
<div class="row-label">{{ row.rowNo }}</div>
<div class="seat-row">
<!-- 五级栏位 -->
<div
v-for="col in row.columns"
:key="col"
@@ -167,23 +199,9 @@
</el-collapse-item>
</el-collapse>
</el-collapse-item>
</el-collapse>
</el-collapse> -->
<!-- 添加或修改羊舍管理对话框 -->
<!-- 添加或修改羊舍管理对话框保留原有 -->
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
<el-form ref="sheepfold_managementRef" :model="form" :rules="rules" label-width="80px">
<el-form-item label="牧场" prop="ranchId">
@@ -196,9 +214,6 @@
></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="羊舍名称" prop="sheepfoldName">
<el-input v-model="form.sheepfoldName" placeholder="请输入羊舍名称" />
</el-form-item> -->
<el-form-item label="羊舍类型" prop="sheepfoldTypeId">
<el-select v-model="form.sheepfoldTypeId" placeholder="请选择羊舍类型">
<el-option
@@ -215,10 +230,6 @@
该羊舍编号已存在
</div>
</el-form-item>
<!-- <el-form-item label="排号" prop="rowNo">
<el-input v-model="form.rowNo" placeholder="请输入排号" />
</el-form-item> -->
<el-form-item label="排数" prop="rowCount">
<el-input-number
v-model="form.rowCount"
@@ -228,13 +239,6 @@
placeholder="请输入排数"
/>
</el-form-item>
<!-- <el-form-item label="栏号" prop="columns">
<el-input v-model="form.columns" placeholder="请输入栏数" />
</el-form-item> -->
<!-- 动态栏位数配置 -->
<div v-for="(row, index) in form.rowsConfig" :key="index" class="row-config">
<el-form-item
:label="`${String.fromCharCode(65 + index)}排栏位数`"
@@ -253,8 +257,6 @@
/>
</el-form-item>
</div>
<el-form-item label="备注" prop="comment">
<el-input v-model="form.comment" placeholder="请输入备注" />
</el-form-item>
@@ -270,12 +272,14 @@
</template>
<script setup name="Sheepfold_management">
import { getSeatMap,listSheepfold_management, getSheepfold_management, delSheepfold_management, addSheepfold_management, updateSheepfold_management,checkSheepfoldNoExist } from "@/api/fileManagement/sheepfold_management"
import { listSheepfoldSummary, getSeatMap,listSheepfold_management, getSheepfold_management, delSheepfold_management, addSheepfold_management, updateSheepfold_management,checkSheepfoldNoExist } from "@/api/fileManagement/sheepfold_management"
const { proxy } = getCurrentInstance()
const { bas_sheepfold_type, da_ranch } = proxy.useDict('bas_sheepfold_type', 'da_ranch')
const sheepfold_managementList = ref([])
// 原有变量
const sheepfold_managementList = ref([]) // 原始栏位明细数据
const sheepfoldSummaryList = ref([]) // 羊舍级别汇总数据(主表格展示)
const open = ref(false)
const loading = ref(true)
const showSearch = ref(true)
@@ -284,7 +288,20 @@ const single = ref(true)
const multiple = ref(true)
const total = ref(0)
const title = ref("")
const sheepfoldNoExists = ref(false) // 用于显示羊舍编号是否存在
const sheepfoldNoExists = ref(false)
const activeNames = ref([])
const seatMapTree = ref([])
const occupied = ref(new Set())
// 新增子弹窗相关变量
const subDialogVisible = ref(false) // 子弹窗显示状态
const subLoading = ref(false) // 子表格加载状态
const subSheepfoldList = ref([]) // 子表格数据
const selectedSheepfold = ref(null) // 选中的羊舍信息
const selectedSheepfoldName = ref(''); // 新增存储点击的羊舍名称如“1号产羔舍”
// 2. 新增变量存储选中行的总羊数兜底为0
const selectedTotalSheepCount = ref(0);
const data = reactive({
@@ -294,8 +311,8 @@ const data = reactive({
sheepfoldName: null,
sheepfoldTypeId: null,
sheepfoldNo: null,
rowCount: 1, // 默认1排
rowsConfig: [{ columnCount: 1 }], // 默认1栏
rowCount: 1,
rowsConfig: [{ columnCount: 1 }],
comment: null
},
queryParams: {
@@ -324,40 +341,33 @@ const data = reactive({
const { queryParams, form, rules } = toRefs(data)
// 排数变化处理
// 原有方法
const handleRowCountChange = (count) => {
// 确保count是数字
count = Number(count)
// 重置rowsConfig
form.value.rowsConfig = []
// 根据排数生成配置项
for (let i = 0; i < count; i++) {
form.value.rowsConfig.push({
rowLetter: String.fromCharCode(65 + i), // A, B, C...
columnCount: 1 // 默认1栏
rowLetter: String.fromCharCode(65 + i),
columnCount: 1
})
}
}
/** 查询羊舍管理列表 */
// 修改getList方法主表格加载汇总数据
function getList() {
loading.value = true
listSheepfold_management(queryParams.value).then(response => {
sheepfold_managementList.value = response.rows
total.value = response.total
// 调用汇总接口,而非原有明细接口
listSheepfoldSummary(queryParams.value).then(response => {
sheepfoldSummaryList.value = response.rows // 汇总数据(每个羊舍一行)
total.value = sheepfoldSummaryList.value.length
loading.value = false
})
}
// 取消按钮
function cancel() {
open.value = false
reset()
}
// 表单重置
function reset() {
form.value = {
id: null,
@@ -372,27 +382,23 @@ function reset() {
proxy.resetForm("sheepfold_managementRef")
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1
getList()
loadSeatMap()
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef")
handleQuery()
}
// 多选框选中数据
function handleSelectionChange(selection) {
ids.value = selection.map(item => item.id)
single.value = selection.length != 1
multiple.value = !selection.length
}
/** 新增按钮操作 */
function handleAdd() {
reset()
open.value = true
@@ -400,33 +406,15 @@ function handleAdd() {
title.value = "添加羊舍管理"
}
/** 修改按钮操作 */
// function handleUpdate(row) {
// reset()
// const _id = row.id || ids.value
// getSheepfold_management(_id).then(response => {
// form.value = response.data
// // 修改时不需要rowsConfig
// if (form.value.rowsConfig) {
// delete form.value.rowsConfig
// delete form.value.rowCount
// }
// open.value = true
// title.value = "修改羊舍管理"
// })
// }
/**查找字典 */
function findDictLabelByValue(dictOptions, value) {
const formattedValue = String(value);
const foundOption = dictOptions.value.find(option => option.value === formattedValue);
return foundOption ? foundOption.label : '';
}
// 验证羊舍编号,确保只能输入数字
function validateSheepfoldNo() {
const sheepfoldNo = form.value.sheepfoldNo
if (sheepfoldNo) {
// 移除非数字字符
const cleanedInput = sheepfoldNo.replace(/\D/g, '')
if (cleanedInput !== sheepfoldNo) {
form.value.sheepfoldNo = cleanedInput
@@ -435,16 +423,13 @@ function validateSheepfoldNo() {
}
}
// 检查羊舍编号是否已存在
async function checkSheepfoldNoExistence() {
if (!form.value.sheepfoldNo || !form.value.ranchId || !form.value.sheepfoldTypeId) {
sheepfoldNoExists.value = false
return
}
try {
const exist = await checkSheepfoldNoExist(form.value.ranchId, form.value.sheepfoldTypeId, form.value.sheepfoldNo)
sheepfoldNoExists.value = exist.data
} catch (error) {
proxy.$modal.msgError("检查羊舍编号时出错:" + error.message)
@@ -452,20 +437,15 @@ async function checkSheepfoldNoExistence() {
}
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["sheepfold_managementRef"].validate(async valid => {
if (valid) {
// 检查羊舍编号是否已存在
await checkSheepfoldNoExistence()
if (sheepfoldNoExists.value) {
proxy.$modal.msgError("该羊舍编号已存在,无法重复添加")
return
}
if (form.value.id != null) {
// 修改操作 - 单条记录
updateSheepfold_management(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功")
open.value = false
@@ -473,34 +453,25 @@ function submitForm() {
loadSeatMap()
})
} else {
// 新增操作 - 多条记录
const requests = []
const ranchName = findDictLabelByValue(da_ranch, form.value.ranchId)
const typeName = findDictLabelByValue(bas_sheepfold_type, form.value.sheepfoldTypeId)
// 生成每条记录的数据
form.value.rowsConfig.forEach((rowConfig, rowIndex) => {
// 使用行索引 + 1 作为排号
const rowNo = String.fromCharCode(65 + rowIndex) // A, B, C...
const rowNo = String.fromCharCode(65 + rowIndex)
for (let i = 1; i <= rowConfig.columnCount; i++) {
const columnNo = i.toString().padStart(2, '0') // 01, 02, 03...
const columnNo = i.toString().padStart(2, '0')
const record = {
ranchId: form.value.ranchId,
sheepfoldTypeId: form.value.sheepfoldTypeId,
sheepfoldNo: form.value.sheepfoldNo,
rowNo: rowNo, // 使用正确的排号
rowNo: rowNo,
columns: columnNo,
comment: form.value.comment,
// 自动生成羊舍名称:羊舍编号 + 类型 + 排号栏号
sheepfoldName: `${form.value.sheepfoldNo}号-${typeName}-${rowNo}${columnNo}`
}
requests.push(addSheepfold_management(record))
}
})
// 执行所有新增请求
Promise.all(requests)
.then(() => {
proxy.$modal.msgSuccess(`新增成功,共添加${requests.length}条记录`)
@@ -516,7 +487,6 @@ function submitForm() {
})
}
/** 删除按钮操作 */
function handleDelete(row) {
const _ids = row.id || ids.value
proxy.$modal.confirm('是否确认删除羊舍管理编号为"' + _ids + '"的数据项?').then(function() {
@@ -528,28 +498,18 @@ function handleDelete(row) {
}).catch(() => {})
}
/** 导出按钮操作 */
function handleExport() {
proxy.download('sheepfold_management/sheepfold_management/export', {
...queryParams.value
}, `sheepfold_management_${new Date().getTime()}.xlsx`)
}
/* ===== 图形化展示所需变量和方法 ===== */
const activeNames = ref([]) // 当前展开的牧场
const seatMapTree = ref([]) // 树形结构数据
const loadSeatMap = () => {
getSeatMap()
.then(res => (seatMapTree.value = res.data))
.catch(err => proxy.$modal.msgError('加载座位图失败:' + err.message))
}
/* 演示:点击栏位切换颜色 */
const occupied = ref(new Set())
const isOccupied = (foldNo, rowNo, col) =>
occupied.value.has(`${foldNo}-${rowNo}-${col}`)
const toggleSeat = (foldNo, rowNo, col) => {
@@ -559,25 +519,63 @@ const toggleSeat = (foldNo, rowNo, col) => {
: occupied.value.add(key)
}
/* 页面加载时拉取数据 */
// 辅助方法:获取字典标签
const getDictLabel = (dictOptions, value) => {
const formattedValue = String(value);
const foundOption = dictOptions.find(option => option.value === formattedValue);
return foundOption ? foundOption.label : '';
}
// 打开羊舍详情弹窗
const openSheepfoldDetail = (row) => {
selectedSheepfold.value = row
// 新增:给选中的羊舍名称赋值
selectedSheepfoldName.value = row.sheepfoldName
// 2. 核心存储选中行的总羊数兜底为0避免无数据时显示空
selectedTotalSheepCount.value = row.totalSheepCount || 0;
subDialogVisible.value = true
getSubSheepfoldList()
}
// 点击主表格羊舍名称的方法(修改:传入选中的羊舍名称)
const openSubTable = (row) => {
selectedSheepfoldName.value = row.sheepfoldName; // 存储点击的羊舍名称(主表格的名称)
subDialogVisible.value = true;
getSubSheepfoldList(row); // 调用子表格数据查询
};
// 获取羊舍详情列表(按羊舍编号+牧场+类型筛选)
const getSubSheepfoldList = () => {
subLoading.value = true
// 构造查询参数:筛选当前羊舍的所有栏位
const params = {
ranchId: selectedSheepfold.value.ranchId,
sheepfoldTypeId: selectedSheepfold.value.sheepfoldTypeId,
sheepfoldNo: selectedSheepfold.value.sheepfoldNo,
pageNum: 1,
pageSize: 999 // 一次性加载所有栏位
}
listSheepfold_management(params).then(response => {
subSheepfoldList.value = response.rows
subLoading.value = false
}).catch(err => {
proxy.$modal.msgError('加载羊舍详情失败:' + err.message)
subLoading.value = false
})
}
onMounted(() => {
getList()
loadSeatMap()
})
getList()
loadSeatMap()
</script>
<style scoped>
.row-config {
margin-bottom: 15px;
@@ -587,7 +585,6 @@ loadSeatMap()
background-color: #f5f7fa;
}
/* ===== 图形化展示样式 ===== */
.seat-block {
margin-bottom: 8px;
}

File diff suppressed because it is too large Load Diff