|
@@ -1,73 +1,36 @@
|
|
|
<template>
|
|
|
<!-- 静态 虚拟配种 virtualMating-->
|
|
|
<div class="virtualMating">
|
|
|
- <el-page-header @back="$router.go(-1)" style="margin-bottom: 15px;">
|
|
|
+ <el-page-header @back="$router.go(-1)" style="margin-bottom: 55px;">
|
|
|
<template v-slot:content>
|
|
|
- <h4>虚拟配种</h4>
|
|
|
+ <h3>虚拟配种</h3>
|
|
|
</template>
|
|
|
</el-page-header>
|
|
|
|
|
|
- <header id="header">
|
|
|
- <el-row type="flex">
|
|
|
- <el-col :span="4">
|
|
|
- <el-select v-model="value" placeholder="请选择">
|
|
|
- <el-option label="1区" value="11"></el-option>
|
|
|
- <el-option label="2区" value="22"></el-option>
|
|
|
- </el-select>
|
|
|
- </el-col>
|
|
|
- <el-col :span="4">
|
|
|
- <el-select v-model="value" placeholder="请选择">
|
|
|
- <el-option label="1舍" value="13"></el-option>
|
|
|
- <el-option label="2舍" value="24"></el-option>
|
|
|
- </el-select>
|
|
|
- </el-col>
|
|
|
- <el-col :span="4">
|
|
|
- <el-select v-model="value" placeholder="请选择">
|
|
|
- <el-option label="可用" value="15"></el-option>
|
|
|
- <el-option label="可用" value="26"></el-option>
|
|
|
- </el-select>
|
|
|
- </el-col>
|
|
|
- <el-col :span="4">
|
|
|
- <el-button type="primary">查找</el-button>
|
|
|
- </el-col>
|
|
|
- <el-col :span="4">
|
|
|
- <el-button type="primary">新增</el-button>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </header>
|
|
|
<section>
|
|
|
<article class="table">
|
|
|
<el-table
|
|
|
- ref="multipleTable"
|
|
|
:data="tableData"
|
|
|
- tooltip-effect="dark"
|
|
|
- style="width: 100%"
|
|
|
- @selection-change="handleSelectionChange"
|
|
|
+ :span-method="objectSpanMethod"
|
|
|
+ border
|
|
|
+ style="width: 100%; margin-top: 20px"
|
|
|
>
|
|
|
- <el-table-column type="selection" width="55"></el-table-column>
|
|
|
- <el-table-column prop="a" label="屠宰批次"></el-table-column>
|
|
|
- <el-table-column prop="b" label="产品名称"></el-table-column>
|
|
|
- <el-table-column prop="c" label="排酸时间"></el-table-column>
|
|
|
- <el-table-column prop="d" label="排酸前重量"></el-table-column>
|
|
|
- <el-table-column prop="e" label="排酸后重量"></el-table-column>
|
|
|
- <el-table-column prop="f" label="排酸损耗"></el-table-column>
|
|
|
- <el-table-column prop="g" label="负责人员"></el-table-column>
|
|
|
- <!-- <el-table-column label="操作" width="150">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
|
|
|
- <el-popconfirm title="是否删除此设备的信息?" @onConfirm="del(scope.row)">
|
|
|
- <el-button slot="reference" type="text" size="small">删除</el-button>
|
|
|
- </el-popconfirm>
|
|
|
+ <el-table-column label="母羊编号" width="300" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <h2 style="color: #333">{{ scope.row.id }}</h2>
|
|
|
</template>
|
|
|
- </el-table-column> -->
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="母羊编号" width="300" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <h2 style="color: #333">{{ scope.row.name }}</h2>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="amount1" label="公羊编号"></el-table-column>
|
|
|
+ <el-table-column prop="amount2" label="公羊级别"></el-table-column>
|
|
|
+ <el-table-column prop="amount3" label="特性一"></el-table-column>
|
|
|
</el-table>
|
|
|
- <div style="margin-top: 20px">
|
|
|
- <el-button @click="toggleSelection([tableData[1], tableData[2]])">切换第二、第三行的选中状态</el-button>
|
|
|
- <el-button @click="toggleSelection()">取消选择</el-button>
|
|
|
- <el-button @click="inStore">入待宰栏</el-button>
|
|
|
- </div>
|
|
|
|
|
|
- <el-row type="flex" justify="end">
|
|
|
+ <el-row type="flex" justify="end" style="margin-top: 30px;">
|
|
|
<el-col :span="8" class="pagination">
|
|
|
<el-pagination
|
|
|
@current-change="pageChange"
|
|
@@ -83,57 +46,114 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-
|
|
|
-const pageSize = 10
|
|
|
+const pageSize = 10;
|
|
|
const tableData = [
|
|
|
- {
|
|
|
- a: "15463",
|
|
|
- b: "胴体",
|
|
|
- c: "2020-07-14",
|
|
|
- d: "49kg",
|
|
|
- e: "48kg",
|
|
|
- f: "1.6%",
|
|
|
- g: "张小刚",
|
|
|
- },
|
|
|
- {
|
|
|
- a: "15463",
|
|
|
- b: "带骨羊前腿",
|
|
|
- c: "2020-07-14",
|
|
|
- d: "49kg",
|
|
|
- e: "48kg",
|
|
|
- f: "1.6%",
|
|
|
- g: "张小刚",
|
|
|
- },
|
|
|
- {
|
|
|
- a: "15463",
|
|
|
- b: "羔羊肉卷",
|
|
|
- c: "2020-07-14",
|
|
|
- d: "49kg",
|
|
|
- e: "48kg",
|
|
|
- f: "1.6%",
|
|
|
- g: "张小刚",
|
|
|
- },
|
|
|
- {
|
|
|
- a: "15463",
|
|
|
- b: "胴体",
|
|
|
- c: "2020-07-14",
|
|
|
- d: "49kg",
|
|
|
- e: "48kg",
|
|
|
- f: "1.6%",
|
|
|
- g: "张小刚",
|
|
|
- },
|
|
|
- {
|
|
|
- a: "15463",
|
|
|
- b: "羔羊肉卷",
|
|
|
- c: "2020-07-14",
|
|
|
- d: "49kg",
|
|
|
- e: "48kg",
|
|
|
- f: "1.6%",
|
|
|
- g: "张小刚",
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- ]
|
|
|
+ {
|
|
|
+ id: "12987121",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "234",
|
|
|
+ amount2: "3.2",
|
|
|
+ amount3: 10
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987122",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "234",
|
|
|
+ amount2: "3.2",
|
|
|
+ amount3: 10
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987123",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "165",
|
|
|
+ amount2: "4.43",
|
|
|
+ amount3: 12
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987124",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "324",
|
|
|
+ amount2: "1.9",
|
|
|
+ amount3: 9
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987125",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "621",
|
|
|
+ amount2: "2.2",
|
|
|
+ amount3: 17
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987126",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987127",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987128",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987129",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987130",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987131",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987132",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987133",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987134",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "12987135",
|
|
|
+ name: "王小虎",
|
|
|
+ amount1: "539",
|
|
|
+ amount2: "4.1",
|
|
|
+ amount3: 15
|
|
|
+ },
|
|
|
+];
|
|
|
|
|
|
export default {
|
|
|
data() {
|
|
@@ -146,22 +166,31 @@ export default {
|
|
|
},
|
|
|
created() {},
|
|
|
methods: {
|
|
|
- toggleSelection(rows) {
|
|
|
- if (rows) {
|
|
|
- rows.forEach(row => {
|
|
|
- this.$refs.multipleTable.toggleRowSelection(row);
|
|
|
- });
|
|
|
- } else {
|
|
|
- this.$refs.multipleTable.clearSelection();
|
|
|
+ arraySpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
+ if (rowIndex % 12 === 0) {
|
|
|
+ if (columnIndex === 0) {
|
|
|
+ return [1, 12];
|
|
|
+ } else if (columnIndex === 1) {
|
|
|
+ return [0, 1];
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
- // 入待宰栏
|
|
|
- inStore() {},
|
|
|
- handleSelectionChange(val) {
|
|
|
- this.multipleSelection = val;
|
|
|
+
|
|
|
+ objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
+ if (columnIndex === 0 || columnIndex === 1) {
|
|
|
+ if (rowIndex % 12 === 0) {
|
|
|
+ return {
|
|
|
+ rowspan: 12,
|
|
|
+ colspan: 1
|
|
|
+ };
|
|
|
+ } else {
|
|
|
+ return {
|
|
|
+ rowspan: 0,
|
|
|
+ colspan: 2
|
|
|
+ };
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
- edit(row) {},
|
|
|
- del(row) {},
|
|
|
pageChange(p) {
|
|
|
console.log(p);
|
|
|
}
|
|
@@ -170,12 +199,4 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-#header {
|
|
|
- margin-bottom: 15px;
|
|
|
-}
|
|
|
-.table {
|
|
|
- .pagination {
|
|
|
- margin-top: 20px;
|
|
|
- }
|
|
|
-}
|
|
|
</style>
|