Merge branch 'main' of http://118.182.97.76:3000/admin/zhyc-sheep-ui
This commit is contained in:
0
src/api/fileManagement/sheep_pedigree
Normal file
0
src/api/fileManagement/sheep_pedigree
Normal 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
@@ -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(); // 计算胎龄
|
||||
});
|
||||
}
|
||||
|
||||
// 调用接口获取关联信息
|
||||
|
||||
110
src/views/fileManagement/sheep_ pedigree/index.vue
Normal file
110
src/views/fileManagement/sheep_ pedigree/index.vue
Normal 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>
|
||||
@@ -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
Reference in New Issue
Block a user