<template>
<div class="app-container">
<el-tabs v-model="activeName" @tab-click="handleTabClick">
<el-tab-pane label="体况、粪便评分标准" name="first">
<div class="operation">
<el-button class="import" style="float: right;" @click="handleImport">导入</el-button>
<el-button class="export" style="float: right;margin-right: 10px;" @click="handleExport">导出</el-button>
</div>
<div class="table1">
<el-table
:key="table1.tableKey"
v-loading="table1.listLoading"
element-loading-text="给我一点时间"
:data="table1.list"
border
fit
highlight-current-row
style="width: 100%;"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
>
<el-table-column label="序号" align="center" type="index" width="50px">
<template slot-scope="scope">
<span>{{ scope.$index + (table1.pageNum-1) * table1.pageSize + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="配方名称" min-width="130px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.ftname }}</span>
</template>
</el-table-column>
<el-table-column label="体况评分标准" align="center" min-width="300px">
<el-table-column label="体况评分标准（分）" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.bodystandard }}</span>
</template>
</el-table-column>
<el-table-column label="数据来源" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.bodysource }}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="粪便评分标准" align="center" min-width="300px">
<el-table-column label="粪便评分标准（分）" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.dungstandard }}</span>
</template>
</el-table-column>
<el-table-column label="数据来源" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.dungsource }}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="操作" align="center" width="100" class-name="small-padding fixed-width" fixed="right">
<template slot-scope="{row}">
<el-button class="miniSuccess" @click="handleUpdate(row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
<el-tab-pane label="宾州筛、粪便筛标准范围" name="second">
<div class="operation">
<el-button class="import" style="float: right;" @click="handleImport">导入</el-button>
<el-button class="export" style="float: right;margin-right: 10px;" @click="handleExport">导出</el-button>
</div>
<div class="table2">
<el-table
:key="table2.tableKey"
v-loading="table2.listLoading"
element-loading-text="给我一点时间"
:data="table2.list"
border
fit
highlight-current-row
style="width: 100%;"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
>
<el-table-column label="序号" align="center" type="index" width="50px">
<template slot-scope="scope">
<span>{{ scope.$index + (table2.pageNum-1) * table2.pageSize + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="牲畜类别" align="center" min-width="200px">
<el-table-column label="牲畜父类" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.parentname }}</span>
</template>
</el-table-column>
<el-table-column label="牲畜子类" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.cowname }}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="宾州筛" align="center" min-width="200px">
<el-table-column label="宾州筛一层（%）" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.bzonemin }} - {{ scope.row.bzonemax }}</span>
</template>
</el-table-column>
<el-table-column label="宾州筛二层（%）" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.bztwomin }} - {{ scope.row.bztwomax }}</span>
</template>
</el-table-column>
<el-table-column label="宾州筛三层（%）" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.bzthreemin }} - {{ scope.row.bzthreemax }}</span>
</template>
</el-table-column>
<el-table-column label="宾州筛四层（%）" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.bzfourmin }} - {{ scope.row.bzfourmax }}</span>
</template>
</el-table-column>
<el-table-column label="数据来源" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.bzsource }}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="粪便筛" align="center" min-width="300px">
<el-table-column label="粪便筛一层（%）" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.fbonemin }} - {{ scope.row.fbonemax }}</span>
</template>
</el-table-column>
<el-table-column label="粪便筛二层（%）" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.fbtwomin }} - {{ scope.row.fbtwomax }}</span>
</template>
</el-table-column>
<el-table-column label="粪便筛三层（%）" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.fbthreemin }} - {{ scope.row.fbthreemax }}</span>
</template>
</el-table-column>
<el-table-column label="数据来源" min-width="80px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.fbsource }}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="操作" align="center" width="100" class-name="small-padding fixed-width" fixed="right">
<template slot-scope="{row}">
<el-button class="miniSuccess" @click="handleUpdate(row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
</el-tabs>
<!-- 体况、粪便评分标准 -->
<el-dialog :title="textMap[table1.dialogStatus]" :visible.sync="table1.dialogFormVisible" :close-on-click-modal="false" width="80%">
<div class="app-add">
<el-form ref="temp" :rules="table1.rules" :model="table1.temp" label-position="right" label-width="160px" style="width: 90%;margin:0 auto 50px">
<el-row>
<el-col :span="12">
<h3 style="width: 160px;float: left;">配方</h3>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="配方名称：" prop="ftname">
<span>{{ table1.temp.ftname }}</span>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<h3 style="width: 160px;float: left;">体况评分标准</h3>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="体况评分标准（分）:" prop="bodystandard">
<el-select v-model="table1.temp.bodystandard" filterable placeholder="评分标准" class="filter-item" style="width: 100%;">
<el-option v-for="item in physicalList" :key="item.value" :label="item.label" :value="item.label" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="数据来源：" prop="bodysource">
<el-input v-model="table1.temp.bodysource" type="textarea" placeholder="1-255字符":autosize="{ minRows: 1, maxRows: 4}" style="width:100%;" maxlength="255" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<h3 style="width: 160px;float: left;">粪便评分标准</h3>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="粪便评分标准（分）:" prop="dungstandard">
<el-select v-model="table1.temp.dungstandard" filterable placeholder="评分标准" class="filter-item" style="width: 100%;">
<el-option v-for="item in physicalList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="数据来源：" prop="dungsource">
<el-input v-model="table1.temp.dungsource" type="textarea" placeholder="1-255字符" :autosize="{ minRows: 1, maxRows: 4}" style="width:100%;" maxlength="255" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button class="cancel" @click="table1.dialogFormVisible = false;getList() ">关闭</el-button>
<el-button class="success" :disabled="isokDisable" @click="updateData()">确认</el-button>
</div>
</div>
</el-dialog>
<!-- 宾州筛、粪便筛标准范围 -->
<el-dialog :title="textMap[table2.dialogStatus]" :visible.sync="table2.dialogFormVisible" :close-on-click-modal="false" width="80%">
<div class="app-add">
<el-form ref="temp" :rules="table2.rules" :model="table2.temp" label-position="right" label-width="160px" style="width: 90%;margin:0 auto 50px">
<el-row>
<el-col :span="10">
<h3 style="width: 160px;float: left;">牲畜类别</h3>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item label="牲畜父类：" prop="parentname">
<span>{{ table2.temp.parentname }}</span>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="牲畜子类：" prop="cowname">
<span>{{ table2.temp.cowname }}</span>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<h3 style="width: 160px;float: left;">宾州筛</h3>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item label="宾州筛第一层（%）:">
<el-input-number v-model="table2.temp.bzonemin" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最小值" />
<span style="width: 1%;">-</span>
<el-input-number v-model="table2.temp.bzonemax" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最大值" />
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="宾州筛第二层（%）:">
<el-input-number v-model="table2.temp.bztwomin" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最小值" />
<span style="width: 1%;">-</span>
<el-input-number v-model="table2.temp.bztwomax" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最大值" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item label="宾州筛第三层（%）:">
<el-input-number v-model="table2.temp.bzthreemin" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最小值" />
<span style="width: 1%;">-</span>
<el-input-number v-model="table2.temp.bzthreemax" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最大值" />
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="宾州筛第四层（%）:">
<el-input-number v-model="table2.temp.bzfourmin" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最小值" />
<span style="width: 1%;">-</span>
<el-input-number v-model="table2.temp.bzfourmax" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最大值" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item label="数据来源：" prop="bzsource">
<el-input v-model="table2.temp.bzsource" type="textarea" placeholder="1-255字符" :autosize="{ minRows: 1, maxRows: 4}" style="width:100%;" maxlength="255" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<h3 style="width: 160px;float: left;">粪便筛</h3>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item label="粪便筛第一层（%）:">
<el-input-number v-model="table2.temp.fbonemin" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最小值" />
<span style="width: 1%;">-</span>
<el-input-number v-model="table2.temp.fbonemax" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最大值" />
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="粪便筛第二层（%）:">
<el-input-number v-model="table2.temp.fbtwomin" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最小值" />
<span style="width: 1%;">-</span>
<el-input-number v-model="table2.temp.fbtwomax" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最大值" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10">
<el-form-item label="粪便筛第三层（%）:">
<el-input-number v-model="table2.temp.fbthreemin" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最小值" />
<span style="width: 1%;">-</span>
<el-input-number v-model="table2.temp.fbthreemax" :min="0" :max="100" :controls="false" style="width:44%;" placeholder="最大值" />
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="数据来源：" prop="fbsource">
<el-input v-model="table2.temp.fbsource" type="textarea" placeholder="1-255字符" :autosize="{ minRows: 1, maxRows: 4}" style="width:100%;" maxlength="255" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button class="cancel" @click="table2.dialogFormVisible = false; getList2()">关闭</el-button>
<el-button class="success" :disabled="isokDisable" @click="updateData()">确认</el-button>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import { GetDataByName, PostDataByName, failproccess, GetDataByNames } from '@/api/common'
import Cookies from 'js-cookie'
export default {
name: 'StandardParameters',
data() {
return {
activeName: 'first',
requestParams: [
{ name: 'getDictByName', offset: 0, pagecount: 0, params: ['评分标准'] }
],
physicalList: [], // 标准体况评分
faecesList: [{ id: 0, name: '1' }, { id: 1, name: '2' }, { id: 2, name: '3' }, { id: 3, name: '4' }, { id: 4, name: '5' }], // 标准粪便评分
table1: {
getdataListParm: {
name: 'getOptscoreList',
page: 1,
offset: 1,
pagecount: 10,
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
enable: ''
}
},
tableKey: 0,
list: [],
total: 0,
listLoading: true,
// 编辑
dialogFormVisible: false,
dialogStatus: '',
temp: {},
rules: {
bodystandard: [{ type: 'string', required: true, message: '必填', trigger: 'blur' }],
dungstandard: [{ type: 'string', required: true, message: '必填', trigger: 'blur' }]
}
},
table2: {
getdataListParm: {
name: 'getOptrangeList',
page: 1,
offset: 1,
pagecount: 10,
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid')
}
},
tableKey: 0,
list: [],
total: 0,
listLoading: true,
// 编辑
dialogFormVisible: false,
dialogStatus: '',
temp: {},
rules: {}
},
textMap: {
update: '编辑'
},
requestParam: {},
isokDisable: false,
rowStyle: { maxHeight: 50 + 'px', height: 45 + 'px' },
cellStyle: { padding: 0 + 'px' }
}
},
created() {
this.getList()
this.getDownList()
},
methods: {
getDownList() {
GetDataByNames(this.requestParams).then(response => {
this.physicalList = response.data.getDictByName.list
})
},
handleTabClick(tab, event) {
console.log(tab, event)
if (tab.name === 'first') {
this.getList()
} else if (tab.name === 'second') {
this.getList2()
}
},
getList() {
this.table1.listLoading = true
GetDataByName(this.table1.getdataListParm).then(response => {
console.log('table1数据', response.data.list)
if (response.data.list !== null) {
this.table1.list = response.data.list
this.table1.pageNum = response.data.pageNum
this.table1.pageSize = response.data.pageSize
this.table1.total = response.data.total
} else {
this.table1.list = []
}
setTimeout(() => {
this.table1.listLoading = false
}, 100)
})
},
getList2() {
this.table2.listLoading = true
GetDataByName(this.table2.getdataListParm).then(response => {
console.log('table1数据', response.data.list)
if (response.data.list !== null) {
this.table2.list = response.data.list
this.table2.pageNum = response.data.pageNum
this.table2.pageSize = response.data.pageSize
if (response.data.total) {
this.table2.total = response.data.total
}
} else {
this.table2.list = []
}
setTimeout(() => {
this.table2.listLoading = false
}, 100)
})
},
// 编辑
handleUpdate(row) {
if (this.activeName === 'first') {
console.log('点击了体况、粪便评分标准编辑')
this.table1.dialogStatus = 'update'
this.table1.dialogFormVisible = true
this.table1.temp = Object.assign({}, row)
} else if (this.activeName === 'second') {
console.log('点击了宾州筛、粪便筛标准范围编辑')
this.table2.dialogStatus = 'update'
this.table2.dialogFormVisible = true
this.table2.temp = Object.assign({}, row)
}
},
updateData() {
if (this.activeName === 'first') {
console.log('点击了体况、粪便评分标准编辑保存')
this.isokDisable = true
setTimeout(() => {
this.isokDisable = false
}, 1000)
this.requestParam.name = 'updateOptscore'
this.requestParam.parammaps = this.table1.temp
PostDataByName(this.requestParam).then(response => {
console.log('新增保存发送参数', this.requestParam)
if (response.msg !== 'fail') {
this.$notify({ title: '成功', message: '保存成功', type: 'success', duration: 2000 })
this.table1.dialogFormVisible = false
this.getList()
} else {
failproccess(response, this.$notify)
}
})
} else if (this.activeName === 'second') {
console.log('点击了宾州筛、粪便筛标准范围编辑保存')
this.isokDisable = true
setTimeout(() => {
this.isokDisable = false
}, 1000)
// 若最小值大于最大值
if (parseFloat(this.table2.temp.bzonemin) >= parseFloat(this.table2.temp.bzonemax)) {
this.$message({ type: 'error', message: '宾州筛第一层最大值不可小于等于最小值', duration: 2000 })
return false
}
if (parseFloat(this.table2.temp.bztwomin) >= parseFloat(this.table2.temp.bztwomax)) {
this.$message({ type: 'error', message: '宾州筛第二层最大值不可小于等于最小值', duration: 2000 })
return false
}
if (parseFloat(this.table2.temp.bzthreemin) >= parseFloat(this.table2.temp.bzthreemax)) {
this.$message({ type: 'error', message: '宾州筛第三层最大值不可小于等于最小值', duration: 2000 })
return false
}
if (parseFloat(this.table2.temp.bzfourmin) >= parseFloat(this.table2.temp.bzfourmax)) {
this.$message({ type: 'error', message: '宾州筛第四层最大值不可小于等于最小值', duration: 2000 })
return false
}
if (parseFloat(this.table2.temp.fbonemin) >= parseFloat(this.table2.temp.fbonemax)) {
this.$message({ type: 'error', message: '粪便筛第一层最大值不可小于等于最小值', duration: 2000 })
return false
}
if (parseFloat(this.table2.temp.fbtwomin) >= parseFloat(this.table2.temp.fbtwomax)) {
this.$message({ type: 'error', message: '粪便筛第二层最大值不可小于等于最小值', duration: 2000 })
return false
}
if (parseFloat(this.table2.temp.fbthreemin) >= parseFloat(this.table2.temp.fbthreemax)) {
this.$message({ type: 'error', message: '粪便筛第三层最大值不可小于等于最小值', duration: 2000 })
return false
}
// 若最大值最小值为空
if (this.table2.temp.bzonemin == '' || this.table2.temp.bzonemin == undefined) { this.table2.temp.bzonemin = '0' }
if (this.table2.temp.bzonemax == '' || this.table2.temp.bzonemax == undefined) { this.table2.temp.bzonemax = '0' }
if (this.table2.temp.bztwomin == '' || this.table2.temp.bztwomin == undefined) { this.table2.temp.bztwomin = '0' }
if (this.table2.temp.bztwomax == '' || this.table2.temp.bztwomax == undefined) { this.table2.temp.bztwomax = '0' }
if (this.table2.temp.bzthreemin == '' || this.table2.temp.bzthreemin == undefined) { this.table2.temp.bzthreemin = '0' }
if (this.table2.temp.bzthreemax == '' || this.table2.temp.bzthreemax == undefined) { this.table2.temp.bzthreemax = '0' }
if (this.table2.temp.bzfourmin == '' || this.table2.temp.bzfourmin == undefined) { this.table2.temp.bzfourmin = '0' }
if (this.table2.temp.bzfourmax == '' || this.table2.temp.bzfourmax == undefined) { this.table2.temp.bzfourmax = '0' }
if (this.table2.temp.fbonemin == '' || this.table2.temp.fbonemin == undefined) { this.table2.temp.fbonemin = '0' }
if (this.table2.temp.fbonemax == '' || this.table2.temp.fbonemax == undefined) { this.table2.temp.fbonemax = '0' }
if (this.table2.temp.fbtwomin == '' || this.table2.temp.fbtwomin == undefined) { this.table2.temp.fbtwomin = '0' }
if (this.table2.temp.fbtwomax == '' || this.table2.temp.fbtwomax == undefined) { this.table2.temp.fbtwomax = '0' }
if (this.table2.temp.fbthreemin == '' || this.table2.temp.fbthreemin == undefined) { this.table2.temp.fbthreemin = '0' }
if (this.table2.temp.fbthreemax == '' || this.table2.temp.fbthreemax == undefined) { this.table2.temp.fbthreemax = '0' }
this.requestParam.name = 'insertOptrange'
this.requestParam.parammaps = this.table2.temp
PostDataByName(this.requestParam).then(response => {
console.log('新增保存发送参数', this.requestParam)
if (response.msg !== 'fail') {
this.$notify({ title: '成功', message: '保存成功', type: 'success', duration: 2000 })
this.table2.dialogFormVisible = false
this.getList2()
this.activeName = 'second'
} else {
failproccess(response, this.$notify)
if (this.table2.temp.bzonemin == '0') { this.table2.temp.bzonemin = '' }
if (this.table2.temp.bzonemax == '0') { this.table2.temp.bzonemax = '' }
if (this.table2.temp.bztwomin == '0') { this.table2.temp.bztwomin = '' }
if (this.table2.temp.bztwomax == '0') { this.table2.temp.bztwomax = '' }
if (this.table2.temp.bzthreemin == '0') { this.table2.temp.bzthreemin = '' }
if (this.table2.temp.bzthreemax == '0') { this.table2.temp.bzthreemax = '' }
if (this.table2.temp.bzfourmin == '0') { this.table2.temp.bzfourmin = '' }
if (this.table2.temp.bzfourmax == '0') { this.table2.temp.bzfourmax = '' }
if (this.table2.temp.fbonemin == '0') { this.table2.temp.fbonemin = '' }
if (this.table2.temp.fbonemax == '0') { this.table2.temp.fbonemax = '' }
if (this.table2.temp.fbtwomin == '0') { this.table2.temp.fbtwomin = '' }
if (this.table2.temp.fbtwomax == '0') { this.table2.temp.fbtwomax = '' }
if (this.table2.temp.fbthreemin == '0') { this.table2.temp.fbthreemin = '' }
if (this.table2.temp.fbthreemax == '0') { this.table2.temp.fbthreemax = '' }
}
})
}
},
// 导出
handleExport() {
if (this.activeName === 'first') {
console.log('体况、粪便评分标准/导出')
} else if (this.activeName === 'second') {
console.log('宾州筛、粪便筛标准范围/导出')
}
},
// 导入
handleImport() {
if (this.activeName === 'first') {
console.log('体况、粪便评分标准/导入')
} else if (this.activeName === 'second') {
console.log('宾州筛、粪便筛标准范围/导入')
}
}
}
}
</script>
<style lang="scss" scoped>
.operation{
position: relative;
height: 50px;
.export{position: absolute;right: 110px;bottom: 10px;}
.import{position: absolute;right: 0;bottom: 10px;}
}
</style>