销售统计完成

src/api/productManagement.js

@@ -12,6 +12,14 @@ export const reqDelProductInfo = (id) => ajax("post", "/farm-huyang/product-file
 
 
 /* 分割登记  SplitLog*/
+export const reqSplitLogList = (data) => ajax("post", "/farm-huyang/registration-split/list", data)
+
+export const reqAddSplitLog = (data) => ajax("post", "/farm-huyang/registration-split/add", data)
+
+export const reqUpdateSplitLog = (data) => ajax("post", "/farm-huyang/registration-split/update", data)
+
+export const reqDelSplitLog = (id) => ajax("post", "/farm-huyang/registration-split/delete", {id})
+
 
 
 /* 羊皮登记  SheepskinLog*/

src/api/slaughterManagment.js

@@ -90,3 +90,15 @@ export const reqAddDrainageAcid = (data) => ajax("post", "/farm-huyang/acid-drai
 export const reqUpdateDrainageAcid = (data) => ajax("post", "/farm-huyang/acid-drainage-loss/update", data)
 
 export const reqDelDrainageAcid = (id) => ajax("post", "/farm-huyang/acid-drainage-loss/delete", {id})
+
+
+/* 分割批次  SplitBatch*/
+export const reqSplitBatchList = (data) => ajax("post", "/farm-huyang/split-batch/list", data)
+
+export const reqAddSplitBatch = (data) => ajax("post", "/farm-huyang/split-batch/add", data)
+
+export const reqUpdateSplitBatch = (data) => ajax("post", "/farm-huyang/split-batch/update", data)
+
+export const reqDelSplitBatch = (id) => ajax("post", "/farm-huyang/split-batch/delete", {id})
+
+export const reqCreateBatch = (data) => ajax("post", "/farm-huyang/split-batch//create-batch", data)

src/router/routes.js

@@ -10,8 +10,8 @@ import slaughterWeight from '@/views/slaughterManagment/slaughterWeight.vue'
 import inStore from '@/views/slaughterManagment/inStore.vue'
 import outStore from '@/views/slaughterManagment/outStore.vue'
 import drainageAcid from '@/views/slaughterManagment/drainageAcid.vue'
-
 import segmentation from '@/views/slaughterManagment/segmentation.vue'
+import splitBatch from '@/views/slaughterManagment/splitBatch.vue'
 import costAccounting from '@/views/slaughterManagment/costAccounting.vue'
 /* 销售管理 */
 import client from '@/views/sellManagement/client.vue'
@@ -89,13 +89,17 @@ export default [
 				name: 'outStore',
 				component: outStore
 			},
-
 			{
 				path: 'segmentation',
 				name: 'segmentation',
 				component: segmentation
 			},
 			{
+				path: 'splitBatch',
+				name: 'splitBatch',
+				component: splitBatch
+			},
+			{
 				path: 'costAccounting',
 				name: 'costAccounting',
 				component: costAccounting

src/views/Home/mencCofig.js

@@ -60,8 +60,13 @@ export const menuData = [
                 routerName: "drainageAcid"
             },
             {
-                optionName: '成本核算',
+                optionName: '分割批次',
                 index: '1-10',
+                routerName: "splitBatch"
+            },
+            {
+                optionName: '成本核算',
+                index: '1-11',
                 routerName: "costAccounting"
             }
         ]

src/views/productManagement/productInfo.vue

@@ -23,10 +23,10 @@
                     style="width: 100%"
                 >
                     <el-table-column prop="id" label="序号" width="80"></el-table-column>
-                    <el-table-column prop="code" label="ID编码" width="180"></el-table-column>
-                    <el-table-column prop="productName" label="产品名称" width="180"></el-table-column>
+                    <el-table-column prop="code" label="ID编码"></el-table-column>
+                    <el-table-column prop="productName" label="产品名称"></el-table-column>
                     <el-table-column prop="batchNo" label="所属批次"></el-table-column>
-                    <el-table-column prop="specificModel" label="规格型号" width="180"></el-table-column>
+                    <el-table-column prop="specificModel" label="规格型号"></el-table-column>
                     <el-table-column prop="productPrice" label="产品价格"></el-table-column>
                     <el-table-column prop="storageLocation" label="存放地点"></el-table-column>
                     <el-table-column prop="shelfLife" label="保质期(天)"></el-table-column>

src/views/productManagement/splitLog.vue

@@ -1,5 +1,217 @@
 <template>
-    <div>
-        分割登记
+    <div class="SplitLog">
+        <h2 style="margin-bottom: 20px;padding-bottom:7px;border-bottom:2px solid #ddd">分割登记</h2>
+        <header id="header">
+            <el-row type="flex" :gutter="20">
+                <el-col :span="4">
+                    <el-input v-model="search" placeholder="请选择"></el-input>
+                </el-col>
+                <el-col :span="4">
+                    <el-button type="primary" @click="getSplitLogList">查找</el-button>
+                </el-col>
+                <el-col :span="4">
+                    <el-button type="primary" @click="add">新增</el-button>
+                </el-col>
+            </el-row>
+        </header>
+        <section>
+            <article class="table">
+                <el-table
+                    ref="multipleTable"
+                    :data="tableData"
+                    tooltip-effect="dark"
+                    style="width: 100%"
+                >
+                    <el-table-column prop="id" label="序号" width="80"></el-table-column>
+                    <el-table-column prop="productUniqueNo" label="产品编号"></el-table-column>
+                    <el-table-column prop="productName" label="产品名称"></el-table-column>
+                    <el-table-column prop="splitTime" label="分割时间"></el-table-column>
+                    <el-table-column prop="weight" label="重量"></el-table-column>
+                    <el-table-column prop="splitBatchNo" label="分割批次"></el-table-column>
+                    <el-table-column prop="salesNo" 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>
+                        </template>
+                    </el-table-column>
+                </el-table>
+
+                <el-row type="flex" justify="end">
+                    <el-col :span="8" class="pagination">
+                        <el-pagination
+                            @current-change="pageChange"
+                            background
+                            layout="prev, pager, next"
+                            :page-count="Number(totalPages)"
+                        ></el-pagination>
+                    </el-col>
+                </el-row>
+            </article>
+        </section>
+
+        <el-dialog title="新增/编辑" :visible.sync="isShow" width="40%">
+            <el-row type="flex">
+                <el-col :span="20">
+                    <el-form ref="addSplitLog" :model="formData" :rules="rules" label-width="140px">
+                        <el-form-item label="产品编号">
+                            <el-input v-model="formData.productUniqueNo"></el-input>
+                        </el-form-item>
+                        <el-form-item label="产品名称">
+                            <el-input v-model="formData.productName"></el-input>
+                        </el-form-item>
+                        <el-form-item label="分割时间">
+                            <el-date-picker
+                                v-model="formData.splitTime"
+                                type="date"
+                                value-format="yyyy-MM-dd HH:mm:ss"
+                                placeholder="选择日期"
+                            ></el-date-picker>
+                        </el-form-item>
+                        <el-form-item label="重量">
+                            <el-input v-model="formData.weight"></el-input>
+                        </el-form-item>
+                        <el-form-item label="分割批次">
+                            <el-input v-model="formData.splitBatchNo"></el-input>
+                        </el-form-item>
+                        <el-form-item label="销售单号">
+                            <el-input v-model.number="formData.salesNo"></el-input>
+                        </el-form-item>
+                        <el-form-item>
+                            <el-button @click="isShow=false">取 消</el-button>
+                            <el-button type="primary" @click="submitForm('addSplitLog')">保 存</el-button>
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+            </el-row>
+        </el-dialog>
     </div>
-</template>
+</template>
+
+<script>
+import {
+    reqSplitLogList,
+    reqAddSplitLog,
+    reqUpdateSplitLog,
+    reqDelSplitLog
+} from "@/api/productManagement.js";
+
+const pageSize = 10;
+const rules = {};
+
+export default {
+    name: "SplitLog",
+    data() {
+        return {
+            search: "",
+            page: 1,
+            tableData: [],
+            totalPages: 0,
+            isShow: false,
+            formData: {
+                productUniqueNo: "",
+                productName: "带骨羊前腿",
+                splitTime: this.$moment().format("YYYY-MM-DD"),
+                weight: "35",
+                splitBatchNo: "1548",
+                salesNo: 'D15GAE56684'
+            },
+            isAdd: false,
+            rules
+        };
+    },
+    created() {
+        // 出仓管理列表
+        this.getSplitLogList();
+    },
+    methods: {
+        submitForm(formName) {
+            this.$refs[formName].validate(valid => {
+                if (valid) {
+                    if (this.isAdd) {
+                        reqAddSplitLog(this.formData)
+                            .then(res => {
+                                // 出仓管理列表
+                                this.getSplitLogList();
+                                this.$message.success("添加成功！");
+                            })
+                            .catch(err => {
+                                console.log(err);
+                                this.$message.error("添加失败！");
+                            });
+                    } else {
+                        reqUpdateSplitLog(this.formData)
+                            .then(res => {
+                                // 出仓管理列表
+                                this.getSplitLogList();
+                                this.$message.success("编辑成功！");
+                            })
+                            .catch(err => {
+                                console.log(err);
+                                this.$message.error("编辑失败！");
+                            });
+                    }
+                } else {
+                    return false;
+                }
+            });
+        },
+        // 出仓管理列表
+        getSplitLogList() {
+            reqSplitLogList({
+                searchStr: this.search,
+                pageSize,
+                pageNum: this.page
+            })
+                .then(res => {
+                    this.tableData = res.content;
+                    this.totalPages = res.totalPages;
+                })
+                .catch(err => {
+                    console.log(err);
+                });
+        },
+        add() {
+            this.isShow = true;
+            this.isAdd = true;
+        },
+        edit(row) {
+            this.formData = row;
+            this.isShow = true;
+            this.isAdd = false;
+        },
+        del(row) {
+            reqDelSplitLog(row.id)
+                .then(res => {
+                    console.log(res);
+                    // 出仓管理列表
+                    this.getSplitLogList();
+                    this.$message.success("删除成功！");
+                })
+                .catch(err => {
+                    console.log(err);
+                    this.$message.error("删除失败！");
+                });
+        },
+        pageChange(p) {
+            console.log(p);
+            this.page = p;
+            // 出仓管理列表
+            this.getSplitLogList();
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+#header {
+    margin-bottom: 15px;
+}
+.table {
+    .pagination {
+        margin-top: 20px;
+    }
+}
+</style>

src/views/sellManagement/charts/E-BuySellNum.vue

@@ -0,0 +1,76 @@
+<template>
+    <div class="container">
+        <!-- EBuySellNum 销售统计-->
+        <div id="EBuySellNum" style="height:330px;"></div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "EBuySellNum",
+    data() {
+        return {};
+    },
+    mounted() {
+        this.drawChart();
+    },
+    methods: {
+        drawChart() {
+            // 基于准备好的dom，初始化echarts实例
+            let myChart = this.$echarts.init(
+                document.getElementById("EBuySellNum")
+            );
+            // 指定图表的配置项和数据
+            let option = {
+                title: {
+                    text: "采购与销售数量",
+                    left: "center",
+                    bottom: 0
+                },
+                color: ["#7c92f7"],
+                tooltip: {
+                    trigger: "axis",
+                    axisPointer: {
+                        // 坐标轴指示器，坐标轴触发有效
+                        type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
+                    }
+                },
+                grid: {
+                    left: "8%",
+                    right: "4%",
+                    bottom: "10%",
+                    containLabel: true
+                },
+                xAxis: [
+                    {
+                        type: "category",
+                        data: ["采购数量", "销售数量"],
+                        axisTick: {
+                            alignWithLabel: true
+                        }
+                    }
+                ],
+                yAxis: [
+                    {
+                        type: "value"
+                    }
+                ],
+                series: [
+                    {
+                        name: "数量",
+                        type: "bar",
+                        barWidth: "40%",
+                        data: [828, 512]
+                    }
+                ]
+            };
+            // 使用刚指定的配置项和数据显示图表。
+            myChart.setOption(option);
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/sellManagement/charts/E-Saleroom.vue

@@ -0,0 +1,101 @@
+<template>
+    <div class="container">
+        <!-- ESaleroom 销售额统计-->
+        <div id="ESaleroom" style="height:450px;"></div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "ESaleroom",
+    data() {
+        return {};
+    },
+    mounted() {
+        this.drawChart();
+    },
+    methods: {
+        drawChart() {
+            // 基于准备好的dom，初始化echarts实例
+            let myChart = this.$echarts.init(
+                document.getElementById("ESaleroom")
+            );
+            // 指定图表的配置项和数据
+            let option = {
+                title: {
+                    text: "销售额统计",
+                    left: "center",
+                    bottom: 0
+                },
+                color: ["#7c92f7"],
+                tooltip: {
+                    trigger: "axis",
+                    axisPointer: {
+                        // 坐标轴指示器，坐标轴触发有效
+                        type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
+                    }
+                },
+                grid: {
+                    left: "0%",
+                    right: "2%",
+                    bottom: "10%",
+                    containLabel: true
+                },
+                yAxis: [
+                    {
+                        type: "category",
+                        data: [
+                            "羔羊龙骨",
+                            "羔羊全排",
+                            "羔羊千棒骨",
+                            "羔羊前腿骨",
+                            "羔羊后腿骨",
+                            "羔羊后腿肉卷",
+                            "带骨羊后腿",
+                            "中式羊后腿",
+                            "法式羊后腿",
+                            "羔羊精卷",
+                            "带羊肉卷",
+                            "带羊骨前腿",
+                        ],
+                        axisTick: {
+                            alignWithLabel: true
+                        }
+                    }
+                ],
+                xAxis: [
+                    {
+                        type: "value"
+                    }
+                ],
+                series: [
+                    {
+                        name: "数量",
+                        type: "bar",
+                        barWidth: "60%",
+                        data: [
+                            76,
+                            70,
+                            98,
+                            144,
+                            190,
+                            238,
+                            258,
+                            263,
+                            244,
+                            188,
+                            142,
+                            97
+                        ]
+                    }
+                ]
+            };
+            // 使用刚指定的配置项和数据显示图表。
+            myChart.setOption(option);
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

src/views/sellManagement/sellRegister.vue

@@ -1,212 +1,137 @@
 <template>
-    <div class="price">
+    <div class="sellRegister">
         <h2 style="margin-bottom: 20px;padding-bottom:7px;border-bottom:2px solid #ddd">销售统计</h2>
-        <header id="header">
-            <el-row type="flex" :gutter="20">
-                <el-col :span="4">
-                    <el-input v-model="search" placeholder="请选择"></el-input>
-                </el-col>
-                <el-col :span="4">
-                    <el-button type="primary" @click="getPriceList">查找</el-button>
-                </el-col>
-                <el-col :span="4">
-                    <el-button type="primary" @click="add">新增</el-button>
-                </el-col>
-            </el-row>
-        </header>
-        <section>
-            <article class="table">
-                <el-table
-                    ref="multipleTable"
-                    :data="tableData"
-                    tooltip-effect="dark"
-                    style="width: 100%"
-                >
-                    <el-table-column prop="id" label="序号" width="80"></el-table-column>
-                    <el-table-column prop="productName" label="产品名称" width="180"></el-table-column>
-                    <el-table-column prop="specificModel" label="规格型号" width="180"></el-table-column>
-                    <el-table-column prop="category" label="所属类别"></el-table-column>
-                    <el-table-column prop="price" label="价格(元)"></el-table-column>
-                    <el-table-column prop="operation" 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>
-                        </template>
-                    </el-table-column>
-                </el-table>
-
-                <el-row type="flex" justify="end">
-                    <el-col :span="8" class="pagination">
-                        <el-pagination
-                            @current-change="pageChange"
-                            background
-                            layout="prev, pager, next"
-                            :page-count="Number(totalPages)"
-                        ></el-pagination>
-                    </el-col>
-                </el-row>
-            </article>
+        <section class="section">
+            <div class="left">
+                <el-button-group>
+                    <el-button :type="btnFlag1?'primary':''" @click="btn_shift_1(true)">近一周</el-button>
+                    <el-button :type="btnFlag1==false?'primary':''" @click="btn_shift_1(false)">近一月</el-button>
+                </el-button-group>
+                <EBuySellNum class="EBuySellNum"></EBuySellNum>
+            </div>
+            <aside class="aside">
+                <h2>近一年销售记录</h2>
+                <section class="middle">
+                    <h4 class="title">累计销售</h4>
+                    <div class="content">
+                        <div class="num">348.2</div>
+                        <span class="unit">万元</span>
+                    </div>
+                </section>
+                <footer class="bottom">
+                    <div class="cel">
+                        当前月
+                        <span class="num">32</span>
+                        万
+                    </div>
+                    <div class="cel">
+                        上个月
+                        <span class="num">76</span>
+                        万
+                    </div>
+                </footer>
+            </aside>
         </section>
-
-        <el-dialog title="新增/编辑" :visible.sync="isShow" width="40%">
-            <el-row type="flex">
-                <el-col :span="20">
-                    <el-form ref="addPrice" :model="formData" :rules="rules" label-width="140px">
-                        <el-form-item label="产品名称">
-                            <el-input v-model="formData.productName"></el-input>
-                        </el-form-item>
-
-                        <el-form-item label="规格型号">
-                            <el-input v-model="formData.specificModel"></el-input>
-                        </el-form-item>
-
-                        <el-form-item label="所属类别">
-                            <el-input v-model="formData.category"></el-input>
-                        </el-form-item>
-
-                        <el-form-item label="价格(元)">
-                            <el-input v-model="formData.price"></el-input>
-                        </el-form-item>
-
-                        <el-form-item label="操作">
-                            <el-input v-model="formData.operation"></el-input>
-                        </el-form-item>
-
-                        <el-form-item>
-                            <el-button @click="isShow=false">取 消</el-button>
-                            <el-button type="primary" @click="submitForm('addPrice')">保 存</el-button>
-                        </el-form-item>
-                    </el-form>
-                </el-col>
-            </el-row>
-        </el-dialog>
+        <footer class="footer">
+            <el-button-group>
+                <el-button :type="btnFlag2?'primary':''" @click="btn_shift_2(true)">近一周</el-button>
+                <el-button :type="btnFlag2==false?'primary':''" @click="btn_shift_2(false)">近一月</el-button>
+            </el-button-group>
+            <E-Saleroom></E-Saleroom>
+        </footer>
     </div>
 </template>
 
 <script>
-import {
-    reqPriceList,
-    reqAddPrice,
-    reqUpdatePrice,
-    reqDelPrice
-} from "@/api/sellManagement.js";
-
-const pageSize = 10;
-const rules = {};
+import EBuySellNum from "./charts/E-BuySellNum";
+import ESaleroom from "./charts/E-Saleroom";
 
 export default {
-    name: "price",
+    name: "sellRegister",
+    components: {
+        EBuySellNum,
+        ESaleroom
+    },
     data() {
         return {
-            search: "",
-            page: 1,
-            tableData: [],
-            totalPages: 0,
-            isShow: false,
-            formData: {
-                productName: "大羊排",
-                specificModel: "2500g/袋",
-                category: "成品",
-                price: "198",
-                operation: 1
-            },
-            isAdd: false,
-            rules
+            btnFlag1: true,
+            btnFlag2: true
         };
     },
-    created() {
-        // 出仓管理列表
-        this.getPriceList();
-    },
+    created() {},
     methods: {
-        submitForm(formName) {
-            this.$refs[formName].validate(valid => {
-                if (valid) {
-                    if (this.isAdd) {
-                        reqAddPrice(this.formData)
-                            .then(res => {
-                                // 出仓管理列表
-                                this.getPriceList();
-                                this.$message.success("添加成功！");
-                            })
-                            .catch(err => {
-                                console.log(err);
-                                this.$message.error("添加失败！");
-                            });
-                    } else {
-                        reqUpdatePrice(this.formData)
-                            .then(res => {
-                                // 出仓管理列表
-                                this.getPriceList();
-                                this.$message.success("编辑成功！");
-                            })
-                            .catch(err => {
-                                console.log(err);
-                                this.$message.error("编辑失败！");
-                            });
-                    }
-                } else {
-                    return false;
-                }
-            });
-        },
-        // 出仓管理列表 
-        getPriceList() {
-            reqPriceList({
-                searchStr: this.search,
-                pageSize,
-                pageNum: this.page
-            })
-                .then(res => {
-                    this.tableData = res.content;
-                    this.totalPages = res.totalPages;
-                })
-                .catch(err => {
-                    console.log(err);
-                });
+        btn_shift_1(flag) {
+            this.btnFlag1 = flag;
         },
-        add() {
-            this.isShow = true;
-            this.isAdd = true
-        },
-        edit(row) {
-            this.formData = row;
-            this.isShow = true;
-            this.isAdd = false
-        },
-        del(row) {
-            reqDelPrice(row.id)
-                .then(res => {
-                    console.log(res);
-                    // 出仓管理列表
-                    this.getPriceList();
-                    this.$message.success("删除成功！");
-                })
-                .catch(err => {
-                    console.log(err);
-                    this.$message.error("删除失败！");
-                });
-        },
-        pageChange(p) {
-            console.log(p);
-            this.page = p;
-            // 出仓管理列表
-            this.getPriceList();
+        btn_shift_2(flag) {
+            this.btnFlag2 = flag;
         }
     }
 };
 </script>
 
 <style lang="scss" scoped>
-#header {
-    margin-bottom: 15px;
-}
-.table {
-    .pagination {
-        margin-top: 20px;
+.sellRegister {
+    
+    .section {
+        padding: 0 5%;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 20px;
+        .EBuySellNum {
+            width: 700px;
+        }
+        .aside {
+            width: 500px;
+            height: 300px;
+            color: #eee;
+            border-radius: 10px;
+            padding: 14px 18px;
+            background-color: #1f47a5;
+            .middle {
+                margin: 10% 0 0 0;
+                .title {
+                    padding-left: 10%;
+                    font-size: 20px;
+                }
+                .content {
+                    display: flex;
+                    justify-content: center;
+                    position: relative;
+                    .num {
+                        min-width: 200px;
+                        text-align: right;
+                        font-size: 50px;
+                        font-weight: 600;
+                        background-color: #0b2c8f;
+                        border-radius: 8px;
+                        padding: 6px;
+                        margin: 8px 10px;
+                    }
+                    .unit {
+                        font-size: 30px;
+                        position: relative;
+                        bottom: -45px;
+                        right: 0;
+                    }
+                }
+            }
+            .bottom {
+                display: flex;
+                justify-content: center;
+                font-size: 18px;
+                .cel {
+                    margin: 25px 15px;
+                    .num {
+                        font-size: 30px;
+                    }
+                }
+            }
+        }
+    }
+    .footer{
+        padding: 0 5%;
     }
 }
 </style>

src/views/slaughterManagment/splitBatch.vue

@@ -0,0 +1,266 @@
+<template>
+    <div class="SplitBatch">
+        <h2 style="margin-bottom: 20px;padding-bottom:7px;border-bottom:2px solid #ddd">分割批次</h2>
+        <header id="header">
+            <el-row type="flex" :gutter="20">
+                <el-col :span="4">
+                    <el-input v-model="search" placeholder="请选择"></el-input>
+                </el-col>
+                <el-col :span="4">
+                    <el-button type="primary" @click="getSplitBatchList">查找</el-button>
+                </el-col>
+                <el-col :span="4">
+                    <el-button type="primary" @click="add">新增</el-button>
+                </el-col>
+            </el-row>
+        </header>
+        <section>
+            <article class="table">
+                <el-table
+                    ref="multipleTableSplitBach"
+                    :data="tableData"
+                    tooltip-effect="dark"
+                    style="width: 100%"
+                    @selection-change="handleSelectionChange"
+                    :row-key="getRowKeys"
+                >
+                    <el-table-column type="selection" :reserve-selection="true" width="55"></el-table-column>
+                    <el-table-column prop="id" label="序号" width="80"></el-table-column>
+                    <el-table-column prop="carcassCode" label="胴体编码" width="180"></el-table-column>
+                    <el-table-column prop="weight" label="重量(kg)" width="180"></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>
+                        </template>
+                    </el-table-column>
+                </el-table>
+
+                <el-row type="flex" style="padding-top: 20px">
+                    <el-col>
+                        <el-button @click="toggleSelection()">取消选择</el-button>
+                        <el-button type="primary" plain @click="createBatch">
+                            生产批次
+                            <i class="el-icon-arrow-right el-icon--right"></i>
+                        </el-button>
+                    </el-col>
+                    <el-col :span="8">
+                        <el-pagination
+                            @current-change="pageChange"
+                            background
+                            layout="prev, pager, next"
+                            :page-count="Number(totalPages)"
+                        ></el-pagination>
+                    </el-col>
+                </el-row>
+            </article>
+        </section>
+
+        <el-dialog title="新增/编辑" :visible.sync="isShow" width="40%">
+            <el-row type="flex">
+                <el-col :span="20">
+                    <el-form
+                        ref="addSplitBatch"
+                        :model="formData"
+                        :rules="rules"
+                        label-width="140px"
+                    >
+                        <el-form-item label="胴体编码">
+                            <el-input v-model="formData.carcassCode"></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="重量">
+                            <el-input v-model="formData.weight"></el-input>
+                        </el-form-item>
+
+                        <el-form-item>
+                            <el-button @click="isShow=false">取 消</el-button>
+                            <el-button type="primary" @click="submitForm('addSplitBatch')">保 存</el-button>
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+            </el-row>
+        </el-dialog>
+
+        <el-dialog title="创建批次" :visible.sync="isShowCreateBatch" width="40%">
+            <el-row type="flex">
+                <el-col :span="20">
+                    <el-form label-width="140px">
+                        <el-form-item label="胴体编码">
+                            <el-input v-model="operator"></el-input>
+                        </el-form-item>
+                        <el-form-item>
+                            <el-button @click="isShow=false">取 消</el-button>
+                            <el-button type="primary" @click="saveCreateBatch">确 定</el-button>
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+            </el-row>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import {
+    reqSplitBatchList,
+    reqAddSplitBatch,
+    reqUpdateSplitBatch,
+    reqDelSplitBatch,
+    reqCreateBatch
+} from "@/api/slaughterManagment.js";
+
+const pageSize = 10;
+const rules = {};
+
+export default {
+    name: "SplitBatch",
+    data() {
+        return {
+            search: "",
+            page: 1,
+            tableData: [],
+            totalPages: 0,
+            isShow: false,
+            formData: {
+                carcassCode: "1006",
+                weight: "32"
+            },
+            getRowKeys(row) {
+                return row.id;
+            },
+            isShowCreateBatch: false,
+            multipleSelection: [],
+            operator: "张亚洲",
+            isAdd: false,
+            rules
+        };
+    },
+    created() {
+        // 分割批次列表
+        this.getSplitBatchList();
+    },
+    methods: {
+        submitForm(formName) {
+            this.$refs[formName].validate(valid => {
+                if (valid) {
+                    if (this.isAdd) {
+                        reqAddSplitBatch(this.formData)
+                            .then(res => {
+                                // 分割批次列表
+                                this.getSplitBatchList();
+                                this.$message.success("添加成功！");
+                            })
+                            .catch(err => {
+                                console.log(err);
+                                this.$message.error("添加失败！");
+                            });
+                    } else {
+                        reqUpdateSplitBatch(this.formData)
+                            .then(res => {
+                                // 分割批次列表
+                                this.getSplitBatchList();
+                                this.$message.success("编辑成功！");
+                            })
+                            .catch(err => {
+                                console.log(err);
+                                this.$message.error("编辑失败！");
+                            });
+                    }
+                } else {
+                    return false;
+                }
+            });
+        },
+        // 分割批次列表
+        getSplitBatchList() {
+            reqSplitBatchList({
+                searchStr: this.search,
+                pageSize,
+                pageNum: this.page
+            })
+                .then(res => {
+                    this.tableData = res.content;
+                    this.totalPages = res.totalPages;
+                })
+                .catch(err => {
+                    console.log(err);
+                });
+        },
+
+        toggleSelection(rows) {
+            if (rows) {
+                rows.forEach(row => {
+                    this.$refs.multipleTableSplitBach.toggleRowSelection(row);
+                });
+            } else {
+                this.$refs.multipleTableSplitBach.clearSelection();
+            }
+        },
+        handleSelectionChange(val) {
+            this.multipleSelection = val.map(item => item.id);
+        },
+        add() {
+            this.isShow = true;
+            this.isAdd = true;
+        },
+        edit(row) {
+            this.formData = row;
+            this.isShow = true;
+            this.isAdd = false;
+        },
+        del(row) {
+            reqDelSplitBatch(row.id)
+                .then(res => {
+                    console.log(res);
+                    // 分割批次列表
+                    this.getSplitBatchList();
+                    this.$message.success("删除成功！");
+                })
+                .catch(err => {
+                    console.log(err);
+                    this.$message.error("删除失败！");
+                });
+        },
+        createBatch() {
+            if (this.multipleSelection.length <= 0) {
+                this.$message.warning("请选择胴体");
+                return;
+            }
+            this.isShowCreateBatch = true;
+        },
+        saveCreateBatch() {
+            reqCreateBatch({
+                ids: this.multipleSelection.toString(),
+                operator: this.operator
+            })
+                .then(res => {
+                    console.log(res);
+                    if (res.errCode) {
+                        this.$message.error(res.errMsg);
+                    } else {
+                        // 分割批次列表
+                        this.getSplitBatchList();
+                        this.$message.success("创建批次成功！");
+                        this.isShowCreateBatch = false
+                    }
+                })
+                .catch(err => {
+                    console.error(err);
+                });
+        },
+        pageChange(p) {
+            this.page = p;
+            // 分割批次列表
+            this.getSplitBatchList();
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+#header {
+    margin-bottom: 15px;
+}
+</style>