Merge branch 'main' of http://e19510c831.iok.la/admin/zhyc-sheep-ui
This commit is contained in:
commit
acb021d78d
33
src/api/dairyProducts/milkInOutStore/milkInOutStore.js
Normal file
33
src/api/dairyProducts/milkInOutStore/milkInOutStore.js
Normal file
@ -0,0 +1,33 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function getList(params) {
|
||||
return request({
|
||||
url: '/milkInOutStore/list',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
export function importExcel(file) {
|
||||
const data = new FormData()
|
||||
data.append('file', file)
|
||||
return request({
|
||||
url: '/milkInOutStore/import',
|
||||
method: 'post',
|
||||
data,
|
||||
headers: { 'Content-Type': 'multipart/form-data' }
|
||||
})
|
||||
}
|
||||
|
||||
export function exportExcel(params) {
|
||||
return request({
|
||||
url: '/milkInOutStore/export',
|
||||
method: 'post',
|
||||
params,
|
||||
responseType: 'blob'
|
||||
})
|
||||
}
|
||||
|
||||
export function getColumns() {
|
||||
return request({ url: '/milkInOutStore/columns', method: 'get' })
|
||||
}
|
33
src/api/dairyProducts/milkProdclasses/milkProdclasses.js
Normal file
33
src/api/dairyProducts/milkProdclasses/milkProdclasses.js
Normal file
@ -0,0 +1,33 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function listMilkProdclasses(query) {
|
||||
return request({
|
||||
url: '/milkProdclasses/milkProdclasses/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
export function importMilkProdclasses(data) {
|
||||
return request({
|
||||
url: '/milkProdclasses/milkProdclasses/import',
|
||||
method: 'post',
|
||||
data: data,
|
||||
headers: { 'Content-Type': 'multipart/form-data' }
|
||||
})
|
||||
}
|
||||
|
||||
export function exportMilkProdclasses(query) {
|
||||
return request({
|
||||
url: '/milkProdclasses/milkProdclasses/export',
|
||||
method: 'post',
|
||||
responseType: 'blob',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
export function getRanchList() {
|
||||
return request({
|
||||
url: '/system/ranch/list',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
@ -44,3 +44,13 @@
|
||||
// }
|
||||
// 可以保留空文件或删除此文件
|
||||
// 因为前端不再需要调用后端API
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 查询胎次校正列表
|
||||
export function listParityCorrection(query) {
|
||||
return request({
|
||||
url: '/parityCorrection/parityCorrection/listAll',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
8
src/api/dairyProducts/ranch/ranch.js
Normal file
8
src/api/dairyProducts/ranch/ranch.js
Normal file
@ -0,0 +1,8 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function getRanchList() {
|
||||
return request({
|
||||
url: '/dairyProducts/ranch/list',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
44
src/api/dairyProducts/sheepMilkAnalysis/sheepMilkAnalysis.js
Normal file
44
src/api/dairyProducts/sheepMilkAnalysis/sheepMilkAnalysis.js
Normal file
@ -0,0 +1,44 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 查询羊奶出入库列表
|
||||
export function listMilkInOutStore(query) {
|
||||
return request({
|
||||
url: '/milkInOutStore/milkInOutStore/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询羊奶出入库详细
|
||||
export function getMilkInOutStore(id) {
|
||||
return request({
|
||||
url: '/milkInOutStore/milkInOutStore/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 新增羊奶出入库
|
||||
export function addMilkInOutStore(data) {
|
||||
return request({
|
||||
url: '/milkInOutStore/milkInOutStore',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 修改羊奶出入库
|
||||
export function updateMilkInOutStore(data) {
|
||||
return request({
|
||||
url: '/milkInOutStore/milkInOutStore',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 删除羊奶出入库
|
||||
export function delMilkInOutStore(id) {
|
||||
return request({
|
||||
url: '/milkInOutStore/milkInOutStore/' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
@ -25,3 +25,25 @@ export function delSheep_file(id) {
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 在群总数
|
||||
export const getInGroupCount = () =>
|
||||
request({ url: '/sheep_file/sheep_file/stat/inGroupCount', method: 'get' })
|
||||
|
||||
export function getSheepTypeStat() {
|
||||
return request({ url: '/sheep_file/sheep_file/stat/sheepType', method: 'get' })
|
||||
}
|
||||
|
||||
export function getBreedStatusStat() {
|
||||
return request({ url: '/sheep_file/sheep_file/stat/breedStatus', method: 'get' })
|
||||
}
|
||||
|
||||
export function getVarietyStat() {
|
||||
return request({ url: '/sheep_file/sheep_file/stat/variety', method: 'get' })
|
||||
}
|
||||
|
||||
export function getLactationParityStat() {
|
||||
return request({ url: '/sheep_file/sheep_file/stat/lactationParity', method: 'get' })
|
||||
}
|
||||
|
@ -50,3 +50,6 @@ export function delData(dictCode) {
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
// 兼容旧写法
|
||||
export { getDicts as listDictDataByType }
|
157
src/views/dairyProducts/milkInOutStore/milkInOutStore/index.vue
Normal file
157
src/views/dairyProducts/milkInOutStore/milkInOutStore/index.vue
Normal file
@ -0,0 +1,157 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form :inline="true" :model="queryParams" class="mb-4">
|
||||
<el-form-item label="开始日期">
|
||||
<el-date-picker v-model="queryParams.datetimeStart" type="date" value-format="YYYY-MM-DD"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="结束日期">
|
||||
<el-date-picker v-model="queryParams.datetimeEnd" type="date" value-format="YYYY-MM-DD"/>
|
||||
</el-form-item>
|
||||
<el-button type="primary" @click="getList">查询</el-button>
|
||||
<el-button @click="resetQuery">重置</el-button>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" style="margin-bottom: 16px;">
|
||||
<el-col :span="24">
|
||||
<el-upload :before-upload="beforeUpload" :show-file-list="false" style="display: inline-block; margin: 0 8px;">
|
||||
<el-button type="primary">导入</el-button>
|
||||
</el-upload>
|
||||
<el-button type="success" @click="handleExport">导出</el-button>
|
||||
<el-button @click="openColDialog">列设置</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-dialog v-model="colDialog" title="选择展示列">
|
||||
<div>
|
||||
<strong>饲喂来源:</strong>
|
||||
<el-checkbox-group v-model="selectedFeed">
|
||||
<el-checkbox v-for="f in allCols.feed" :key="f" :label="f">{{ f }}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
<div style="margin-top:1em">
|
||||
<strong>销售去向:</strong>
|
||||
<el-checkbox-group v-model="selectedSale">
|
||||
<el-checkbox v-for="s in allCols.sale" :key="s" :label="s">{{ s }}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="applyCols">确认</el-button>
|
||||
<el-button @click="colDialog = false">取消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<el-table :data="rows" border style="margin-top:16px">
|
||||
<!-- 前面的固定列 -->
|
||||
<el-table-column prop="datetime" label="日期"/>
|
||||
<el-table-column prop="num" label="羊数"/>
|
||||
<el-table-column prop="colostSheep" label="初乳羊"/>
|
||||
<el-table-column prop="commercialIntake" label="商乳入库"/>
|
||||
<el-table-column prop="antiIntake" label="抗乳入库"/>
|
||||
<el-table-column prop="colostIntake" label="初乳入库"/>
|
||||
<el-table-column prop="intakeTotal" label="入库小计"/>
|
||||
<el-table-column prop="commercialTest" label="商乳实验用奶"/>
|
||||
<el-table-column prop="colostTest" label="初乳实验用奶"/>
|
||||
<el-table-column prop="transferCommercial" label="商乳调拨出库"/>
|
||||
<el-table-column prop="transferAnti" label="抗乳调拨出库"/>
|
||||
<el-table-column prop="transferColost" label="初乳调拨出库"/>
|
||||
<el-table-column prop="transferTotal" label="调拨小计"/>
|
||||
<el-table-column prop="loss" label="损耗"/>
|
||||
|
||||
<!-- 动态饲喂来源列(插入到这里) -->
|
||||
<el-table-column v-for="f in selectedFeed" :key="'feed-'+f" :prop="f" :label="f"/>
|
||||
<!-- 动态销售去向列 -->
|
||||
<el-table-column v-for="s in selectedSale" :key="'sale-'+s" :prop="s" :label="s"/>
|
||||
|
||||
<!-- 后面的固定列 -->
|
||||
<el-table-column prop="stockCommercial" label="商乳库存"/>
|
||||
<el-table-column prop="stockAnti" label="抗乳库存"/>
|
||||
<el-table-column prop="colost" label="初乳库存"/>
|
||||
<el-table-column prop="returnFresh" label="爱特退回鲜奶"/>
|
||||
<el-table-column prop="returnYogurt" label="爱特退回酸奶"/>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
style="margin-top:16px; text-align:right"
|
||||
:total="total"
|
||||
v-model:page-size="queryParams.pageSize"
|
||||
v-model:current-page="queryParams.pageNum"
|
||||
@current-change="getList">
|
||||
</el-pagination>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import { getList as fetchList, importExcel, exportExcel, getColumns } from '@/api/dairyProducts/milkInOutStore/milkInOutStore.js'
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
const queryParams = reactive({
|
||||
datetimeStart: null,
|
||||
datetimeEnd: null,
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
})
|
||||
const rows = ref([])
|
||||
const total = ref(0)
|
||||
const allCols = reactive({ feed: [], sale: [] })
|
||||
const selectedFeed = ref([])
|
||||
const selectedSale = ref([])
|
||||
const colDialog = ref(false)
|
||||
|
||||
function getList() {
|
||||
fetchList(queryParams).then(res => {
|
||||
rows.value = res.rows
|
||||
total.value = res.total
|
||||
})
|
||||
}
|
||||
|
||||
function resetQuery() {
|
||||
queryParams.datetimeStart = null
|
||||
queryParams.datetimeEnd = null
|
||||
queryParams.pageNum = 1
|
||||
getList()
|
||||
}
|
||||
|
||||
function openColDialog() {
|
||||
getColumns().then(res => {
|
||||
const d = res.data[0]
|
||||
allCols.feed = d.feed || []
|
||||
allCols.sale = d.sale || []
|
||||
// 默认勾选所有源/销项列
|
||||
selectedFeed.value = [...allCols.feed]
|
||||
selectedSale.value = [...allCols.sale]
|
||||
colDialog.value = true
|
||||
})
|
||||
}
|
||||
|
||||
function applyCols() {
|
||||
colDialog.value = false
|
||||
getList()
|
||||
}
|
||||
|
||||
function beforeUpload(file) {
|
||||
importExcel(file).then(() => {
|
||||
ElMessage.success('导入成功')
|
||||
getList()
|
||||
}).catch(err => {
|
||||
ElMessage.error('导入失败:' + (err.message || err))
|
||||
})
|
||||
return false
|
||||
}
|
||||
|
||||
function handleExport() {
|
||||
exportExcel(queryParams).then(blob => {
|
||||
const link = document.createElement('a')
|
||||
link.href = URL.createObjectURL(blob)
|
||||
link.download = `milk_in_out_store_${Date.now()}.xlsx`
|
||||
link.click()
|
||||
}).catch(err => {
|
||||
ElMessage.error('导出失败:' + (err.message || err))
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => getList())
|
||||
</script>
|
@ -0,0 +1,161 @@
|
||||
<!-- index.vue (前端视图,修改 resetQuery 以匹配正确字段) -->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form ref="queryRef" :model="queryParams" inline label-width="80px">
|
||||
<el-form-item label="日期范围">
|
||||
<el-date-picker v-model="dateRange" type="daterange" range-separator="至"
|
||||
start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD" />
|
||||
</el-form-item>
|
||||
<!-- 管理耳号变成输入框 -->
|
||||
<el-form-item label="管理耳号">
|
||||
<el-input v-model="queryParams.manageEarNo" placeholder="请输入管理耳号" clearable />
|
||||
</el-form-item>
|
||||
<!-- 厂区下拉框,数据源来自字典 da_ranch -->
|
||||
<el-form-item label="厂区">
|
||||
<el-select v-model="queryParams.factory" clearable placeholder="请选择">
|
||||
<el-option
|
||||
v-for="d in ranchOptions"
|
||||
:key="d.value"
|
||||
:label="d.label"
|
||||
:value="d.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 班次只有 1、2 -->
|
||||
<el-form-item label="班次">
|
||||
<el-select v-model="queryParams.classes" clearable placeholder="请选择">
|
||||
<el-option :value="1" label="1" />
|
||||
<el-option :value="2" label="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getList">查询</el-button>
|
||||
<el-button @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row>
|
||||
<el-button type="info" plain @click="handleImport" v-hasPermi="['milkProdclasses:milkProdclasses:import']">
|
||||
<el-icon><Upload /></el-icon> 导入
|
||||
</el-button>
|
||||
<el-button type="warning" plain @click="handleExport" v-hasPermi="['milkProdclasses:milkProdclasses:export']">
|
||||
<el-icon><Download /></el-icon> 导出
|
||||
</el-button>
|
||||
</el-row>
|
||||
|
||||
<el-table :data="tableData" v-loading="loading">
|
||||
<el-table-column prop="datetime" label="日期" width="110" />
|
||||
<el-table-column prop="manageEarNo" label="管理耳号" />
|
||||
<el-table-column prop="electronicEarNo" label="电子耳号" />
|
||||
<el-table-column prop="parity" label="胎次" />
|
||||
<el-table-column prop="factory" label="厂区" />
|
||||
<el-table-column prop="classes" label="班次" />
|
||||
<el-table-column prop="milk" label="班次产奶量" />
|
||||
<el-table-column prop="correctedMilk" label="班次校正奶量" />
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList" />
|
||||
|
||||
<!-- 导入弹窗 -->
|
||||
<el-dialog title="Excel导入" v-model="openImport" width="400px">
|
||||
<el-upload drag :action="uploadUrl" :headers="headers"
|
||||
accept=".xls,.xlsx" :on-success="uploadSuccess" :on-error="uploadError">
|
||||
<el-icon class="el-icon--upload"><UploadFilled /></el-icon>
|
||||
<div>将文件拖到此处或<em>点击上传</em></div>
|
||||
</el-upload>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import { listMilkProdclasses, importMilkProdclasses, exportMilkProdclasses } from '@/api/dairyProducts/milkProdclasses/milkProdclasses'
|
||||
import { getToken } from '@/utils/auth'
|
||||
import { getRanchList } from '@/api/dairyProducts/ranch/ranch.js'
|
||||
import { Upload, Download, UploadFilled } from '@element-plus/icons-vue';
|
||||
|
||||
const ranchOptions = ref([])
|
||||
|
||||
onMounted(() => {
|
||||
getRanchList().then(res => {
|
||||
ranchOptions.value = res.data.map(item => ({
|
||||
label: item.ranchName,
|
||||
value: item.ranchCode
|
||||
}))
|
||||
}).catch(err => {
|
||||
console.error('获取厂区列表失败:', err)
|
||||
})
|
||||
})
|
||||
|
||||
const queryParams = reactive({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
manageEarNo: '', // 管理耳号
|
||||
factory: null,
|
||||
classes: null
|
||||
})
|
||||
const dateRange = ref([])
|
||||
const tableData = ref([])
|
||||
const total = ref(0)
|
||||
const loading = ref(false)
|
||||
const openImport = ref(false)
|
||||
|
||||
const uploadUrl = import.meta.env.VITE_APP_BASE_API + '/milkProdclasses/milkProdclasses/import';
|
||||
const headers = { Authorization: 'Bearer ' + getToken() };
|
||||
|
||||
function getList() {
|
||||
loading.value = true
|
||||
const [start, end] = dateRange.value || []
|
||||
listMilkProdclasses({
|
||||
datetimeStart: start,
|
||||
datetimeEnd: end,
|
||||
manageEarNo: queryParams.manageEarNo,
|
||||
factory: queryParams.factory,
|
||||
classes: queryParams.classes,
|
||||
pageNum: queryParams.pageNum,
|
||||
pageSize: queryParams.pageSize
|
||||
}).then(res => {
|
||||
tableData.value = res.rows
|
||||
total.value = res.total
|
||||
loading.value = false
|
||||
}).catch(err => {
|
||||
console.error('查询失败:', err);
|
||||
loading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
function resetQuery() {
|
||||
Object.assign(queryParams, { pageNum: 1, manageEarNo: '', factory: null, classes: null });
|
||||
dateRange.value = [];
|
||||
getList();
|
||||
}
|
||||
|
||||
function handleImport() {
|
||||
openImport.value = true;
|
||||
}
|
||||
|
||||
function uploadSuccess(response) {
|
||||
console.log('上传成功:', response);
|
||||
openImport.value = false;
|
||||
getList();
|
||||
}
|
||||
|
||||
function uploadError(err) {
|
||||
console.error('上传失败:', err);
|
||||
}
|
||||
|
||||
function handleExport() {
|
||||
const [start, end] = dateRange.value || [];
|
||||
exportMilkProdclasses({
|
||||
datetimeStart: start,
|
||||
datetimeEnd: end,
|
||||
manageEarNo: queryParams.manageEarNo, // 与后台参数统一
|
||||
factory: queryParams.factory,
|
||||
classes: queryParams.classes
|
||||
});
|
||||
}
|
||||
|
||||
getList();
|
||||
</script>
|
@ -7,48 +7,30 @@
|
||||
border
|
||||
stripe
|
||||
>
|
||||
<el-table-column
|
||||
label="胎次"
|
||||
align="center"
|
||||
prop="parity"
|
||||
width="120"
|
||||
/>
|
||||
<el-table-column
|
||||
label="系数"
|
||||
align="center"
|
||||
prop="coef"
|
||||
width="120"
|
||||
/>
|
||||
<el-table-column label="胎次" align="center" prop="parity" width="120" />
|
||||
<el-table-column label="系数" align="center" prop="coef" width="120" />
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="ParityCorrection">
|
||||
import { listParityCorrection } from '@/api/dairyProducts/parityCorrection/parityCorrection.js'
|
||||
import { ref, onMounted } from 'vue'
|
||||
|
||||
const loading = ref(false)
|
||||
const parityCorrectionList = ref([])
|
||||
|
||||
// 预定义胎次校正数据(1-8胎次)
|
||||
const fixedParityData = [
|
||||
{ id: 1, parity: 1, coef: 1.2 },
|
||||
{ id: 2, parity: 2, coef: 1.0 },
|
||||
{ id: 3, parity: 3, coef: 0.96 },
|
||||
{ id: 4, parity: 4, coef: 0.96 },
|
||||
{ id: 5, parity: 5, coef: 1.0 },
|
||||
{ id: 6, parity: 6, coef: 1.0 },
|
||||
{ id: 7, parity: 7, coef: 1.0 },
|
||||
{ id: 8, parity: 8, coef: 1.0 }
|
||||
]
|
||||
|
||||
// 组件挂载时加载数据
|
||||
onMounted(() => {
|
||||
function getList() {
|
||||
loading.value = true
|
||||
// 模拟异步加载
|
||||
setTimeout(() => {
|
||||
parityCorrectionList.value = fixedParityData
|
||||
listParityCorrection().then(res => {
|
||||
parityCorrectionList.value = res.rows || res.data || [] // 兼容两种返回风格
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
}, 500)
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getList()
|
||||
})
|
||||
</script>
|
||||
|
||||
|
194
src/views/dairyProducts/sheepMilkAnalysis/index.vue
Normal file
194
src/views/dairyProducts/sheepMilkAnalysis/index.vue
Normal file
@ -0,0 +1,194 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 查询条件 -->
|
||||
<el-form :inline="true" :model="queryParams" class="filter-form">
|
||||
<el-form-item label="耳号">
|
||||
<el-input v-model="queryParams.manageEarTag" placeholder="请输入耳号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="筛选天数">
|
||||
<el-input-number v-model="queryParams.screenDays" :min="0" placeholder="请输入天数" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleQuery">查询</el-button>
|
||||
<el-button @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作按钮行 -->
|
||||
<div class="button-group">
|
||||
<el-button type="success" @click="handleExport">导出</el-button>
|
||||
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
width="400"
|
||||
trigger="click"
|
||||
>
|
||||
<el-checkbox-group v-model="selectedFields" class="checkbox-columns">
|
||||
<el-checkbox
|
||||
v-for="col in allColumns"
|
||||
:key="col.prop"
|
||||
:label="col.prop"
|
||||
>{{ col.label }}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
|
||||
<template #reference>
|
||||
<el-button type="info">展示列</el-button>
|
||||
</template>
|
||||
</el-popover>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 数据表格 -->
|
||||
<el-table :data="list" border style="width: 100%" v-loading="loading" :row-key="row => row.id">
|
||||
<el-table-column
|
||||
v-for="col in visibleColumns"
|
||||
:key="col.prop"
|
||||
:label="col.label"
|
||||
:prop="col.prop"
|
||||
:min-width="col.minWidth || 120"
|
||||
/>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页 -->
|
||||
<el-pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:current-page="queryParams.pageNum"
|
||||
:page-size="queryParams.pageSize"
|
||||
@current-change="handlePageChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listSheepMilkAnalysis, exportSheepMilkAnalysis } from "@/api/dairyProducts/sheepMilkAnalysis/sheepMilkAnalysis.js";
|
||||
|
||||
export default {
|
||||
name: "SheepMilkAnalysis",
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
total: 0,
|
||||
list: [],
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
manageEarTag: null,
|
||||
screenDays: null
|
||||
},
|
||||
selectedFields: [],
|
||||
allColumns: [
|
||||
{ label: "耳号", prop: "manageEarTag" },
|
||||
{ label: "品种", prop: "variety" },
|
||||
{ label: "挤奶时间", prop: "milkingDate" },
|
||||
{ label: "干奶时间", prop: "dryDate" },
|
||||
{ label: "筛选天数", prop: "screeningDays" },
|
||||
{ label: "挤奶天数", prop: "milkingDays" },
|
||||
{ label: "校正后最大胎次", prop: "maxCorrectedParity" },
|
||||
{ label: "系统奶量之合计", prop: "systemMilkTotal" },
|
||||
{ label: "校正奶量之合计", prop: "correctedMilkTotal" },
|
||||
{ label: "校正日平均奶量", prop: "avgDailyCorrectedMilk" },
|
||||
{ label: "胎次1的总产奶量", prop: "parity1TotalMilk" },
|
||||
{ label: "胎次2的总产奶量", prop: "parity2TotalMilk" },
|
||||
{ label: "胎次3的总产奶量", prop: "parity3TotalMilk" },
|
||||
{ label: "胎次4的总产奶量", prop: "parity4TotalMilk" },
|
||||
{ label: "胎次1的日平均产量", prop: "parity1AvgDailyMilk" },
|
||||
{ label: "胎次2的日平均产量", prop: "parity2AvgDailyMilk" },
|
||||
{ label: "胎次3的日平均产量", prop: "parity3AvgDailyMilk" },
|
||||
{ label: "胎次4的日平均产量", prop: "parity4AvgDailyMilk" },
|
||||
{ label: "泌乳天数", prop: "lactationDays" },
|
||||
{ label: "过去7日日平均奶量", prop: "past7DaysAvgMilk" },
|
||||
{ label: "校正过去7日日平均奶量", prop: "past7DaysAvgCorrectedMilk" },
|
||||
{ label: "过去14日日平均奶量", prop: "past14DaysAvgMilk" },
|
||||
{ label: "过去30日日平均奶量", prop: "past30DaysAvgMilk" },
|
||||
{ label: "羊只类型", prop: "sheepType" },
|
||||
{ label: "生日", prop: "birthDate" },
|
||||
{ label: "当前胎次", prop: "currentParity" },
|
||||
{ label: "月龄", prop: "ageMonths" },
|
||||
{ label: "当前体重", prop: "currentWeight" },
|
||||
{ label: "繁育状态", prop: "breedStatus" },
|
||||
{ label: "父号", prop: "fatherTag" },
|
||||
{ label: "母号", prop: "motherTag" },
|
||||
{ label: "牧场名称", prop: "ranchName" },
|
||||
{ label: "家系", prop: "familyLine" },
|
||||
{ label: "母亲挤奶天数", prop: "motherMilkingDays" },
|
||||
{ label: "母亲校正奶量之合计", prop: "motherCorrectedMilkTotal" },
|
||||
{ label: "母亲校正后最大胎次", prop: "motherMaxCorrectedParity" },
|
||||
{ label: "母亲校正日平均奶量", prop: "motherAvgDailyCorrectedMilk" }
|
||||
]
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.selectedFields = this.allColumns.map(c => c.prop);
|
||||
this.getList();
|
||||
},
|
||||
computed: {
|
||||
visibleColumns() {
|
||||
return this.allColumns.filter(col => this.selectedFields.includes(col.prop));
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listSheepMilkAnalysis(this.queryParams).then(response => {
|
||||
this.list = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
resetQuery() {
|
||||
this.queryParams = {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
manageEarTag: null,
|
||||
screenDays: null
|
||||
};
|
||||
this.selectedFields = this.allColumns.map(c => c.prop);
|
||||
this.getList();
|
||||
},
|
||||
handlePageChange(pageNum) {
|
||||
this.queryParams.pageNum = pageNum;
|
||||
this.getList();
|
||||
},
|
||||
handleSizeChange(pageSize) {
|
||||
this.queryParams.pageSize = pageSize;
|
||||
this.getList();
|
||||
},
|
||||
handleExport() {
|
||||
exportSheepMilkAnalysis(this.queryParams).then(response => {
|
||||
const blob = new Blob([response], { type: 'application/vnd.ms-excel' });
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.setAttribute('download', '羊奶分析数据.xlsx');
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.filter-form .el-form-item {
|
||||
margin-right: 15px;
|
||||
}
|
||||
.button-group {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.checkbox-columns {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
172
src/views/fileManagement/sheep_structure/index.vue
Normal file
172
src/views/fileManagement/sheep_structure/index.vue
Normal file
@ -0,0 +1,172 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 顶部存栏总数 -->
|
||||
<el-row :gutter="20" class="top-summary">
|
||||
<el-col :span="24">
|
||||
<el-card shadow="hover" class="summary-card">
|
||||
<div class="summary-content">
|
||||
<el-icon size="48" color="#409EFF"><Collection /></el-icon>
|
||||
<div>
|
||||
<div class="summary-title">存栏羊只总数</div>
|
||||
<div class="summary-value">{{ inGroupCount }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 图表区域 -->
|
||||
<el-row :gutter="20" class="chart-row">
|
||||
<!-- 羊只类别 -->
|
||||
<el-col :xs="24" :sm="24" :md="12" :lg="12">
|
||||
<el-card shadow="hover" class="chart-card">
|
||||
<template #header>
|
||||
<span class="card-title">羊只类别分布</span>
|
||||
</template>
|
||||
<div ref="typePie" class="chart-box"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<!-- 泌乳羊胎次 -->
|
||||
<el-col :xs="24" :sm="24" :md="12" :lg="12">
|
||||
<el-card shadow="hover" class="chart-card">
|
||||
<template #header>
|
||||
<span class="card-title">泌乳羊胎次分布</span>
|
||||
</template>
|
||||
<div ref="parityPie" class="chart-box"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20" class="chart-row">
|
||||
<!-- 繁育状态 -->
|
||||
<el-col :xs="24" :sm="24" :md="12" :lg="12">
|
||||
<el-card shadow="hover" class="chart-card">
|
||||
<template #header>
|
||||
<span class="card-title">繁育状态分布</span>
|
||||
</template>
|
||||
<div ref="breedBar" class="chart-box"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<!-- 品种分布 -->
|
||||
<el-col :xs="24" :sm="24" :md="12" :lg="12">
|
||||
<el-card shadow="hover" class="chart-card">
|
||||
<template #header>
|
||||
<span class="card-title">品种分布</span>
|
||||
</template>
|
||||
<div ref="varietyBar" class="chart-box"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
import * as echarts from 'echarts'
|
||||
import { Collection } from '@element-plus/icons-vue'
|
||||
import {
|
||||
getInGroupCount,
|
||||
getSheepTypeStat,
|
||||
getBreedStatusStat,
|
||||
getVarietyStat,
|
||||
getLactationParityStat
|
||||
} from '@/api/fileManagement/sheep_file'
|
||||
|
||||
const inGroupCount = ref(0)
|
||||
const typePie = ref(null)
|
||||
const parityPie = ref(null)
|
||||
const breedBar = ref(null)
|
||||
const varietyBar = ref(null)
|
||||
|
||||
let chart1, chart2, chart3, chart4
|
||||
|
||||
onMounted(() => {
|
||||
chart1 = echarts.init(typePie.value)
|
||||
chart2 = echarts.init(parityPie.value)
|
||||
chart3 = echarts.init(breedBar.value)
|
||||
chart4 = echarts.init(varietyBar.value)
|
||||
|
||||
loadCharts()
|
||||
window.addEventListener('resize', () => {
|
||||
chart1.resize(); chart2.resize(); chart3.resize(); chart4.resize()
|
||||
})
|
||||
})
|
||||
|
||||
function loadCharts() {
|
||||
const pieOption = (data, title) => ({
|
||||
title: { text: title, left: 'center', textStyle: { fontWeight: 'bold' } },
|
||||
tooltip: { trigger: 'item' },
|
||||
legend: { orient: 'vertical', left: 'left' },
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: '60%',
|
||||
data,
|
||||
emphasis: {
|
||||
itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0,0,0,0.5)' }
|
||||
}
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
const barOption = (data, title) => ({
|
||||
title: { text: title, left: 'center', textStyle: { fontWeight: 'bold' } },
|
||||
tooltip: {},
|
||||
grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },
|
||||
xAxis: { type: 'category', data: data.map(i => i.name) },
|
||||
yAxis: { type: 'value' },
|
||||
series: [{ type: 'bar', data: data.map(i => i.value), itemStyle: { borderRadius: [4, 4, 0, 0] } }]
|
||||
})
|
||||
|
||||
getInGroupCount().then(res => (inGroupCount.value = res.data))
|
||||
getSheepTypeStat().then(res => chart1.setOption(pieOption(res.data, '羊只类别分布')))
|
||||
getLactationParityStat().then(res => chart2.setOption(pieOption(res.data, '泌乳羊胎次分布')))
|
||||
getBreedStatusStat().then(res => chart3.setOption(barOption(res.data, '繁育状态分布')))
|
||||
getVarietyStat().then(res => chart4.setOption(barOption(res.data, '品种分布')))
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 顶部卡片 */
|
||||
.top-summary {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.summary-card {
|
||||
border-radius: 12px;
|
||||
}
|
||||
.summary-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
}
|
||||
.summary-title {
|
||||
font-size: 16px;
|
||||
color: #909399;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.summary-value {
|
||||
font-size: 36px;
|
||||
font-weight: 700;
|
||||
color: #409EFF;
|
||||
}
|
||||
|
||||
/* 图表卡片 */
|
||||
.chart-row {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.chart-card {
|
||||
border-radius: 12px;
|
||||
height: 100%;
|
||||
}
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
.chart-box {
|
||||
height: 300px;
|
||||
}
|
||||
</style>
|
Loading…
x
Reference in New Issue
Block a user