完成 生产预警、设备故障

package.json

@@ -13,6 +13,7 @@
     "default-passive-events": "^2.0.0",
     "echarts": "^4.8.0",
     "element-ui": "^2.13.2",
+    "moment": "^2.27.0",
     "vue": "^2.6.10",
     "vue-echarts": "^5.0.0-beta.0",
     "vue-module-loader": "^1.0.3",

src/App.vue

@@ -19,6 +19,6 @@ body,
 html {
     height: 100%;
     width: 100%;
-    margin: 0 0 0 0;
+    margin: 0;
 }
 </style>

src/aaaabbb.vue

@@ -0,0 +1,30 @@
+<template>
+    <div class="softwareSet">
+        <h2 style="margin-bottom: 20px;padding-bottom:7px;border-bottom:2px solid #ddd">软件配置</h2>
+        <section class="section">
+
+        </section>
+    </div>
+</template>
+
+
+<script>
+export default {
+    name: "softwareSet",
+    data() {
+        return {
+            
+        };
+    },
+    created() {},
+    methods: {}
+};
+</script>
+
+<style lang="scss" scoped>
+.softwareSet {
+    .section {
+        
+    }
+}
+</style>

src/api/groupManagment.js

@@ -1,5 +0,0 @@
-import { ajax } from "../sdk/ajax";
-// groupManagment
-
-/* 个体数据 */
-export const reqReportList = (data) => ajax("post", "/analyse/eartag/reportList", data)

src/api/infoInform.js

@@ -0,0 +1,9 @@
+import { ajax } from "../sdk/ajax";
+// 消息通知
+
+/* 设备故障  DvFault == DeviceFault*/
+export const reqDvFaultList = (data) => ajax("post", "/farm-huyang/device/list", data)
+
+export const reqAddDvFault = (data) => ajax("post", "/farm-huyang/device/add", data)
+
+export const reqDelDvFault = (id) => ajax("post", "/farm-huyang/device/delete", {id})

src/api/system.js

@@ -0,0 +1,9 @@
+import { ajax } from "../sdk/ajax";
+// 系统配置
+
+/* 设备故障  DvFault == DeviceFault*/
+export const reqDvFaultList = (data) => ajax("post", "/farm-huyang/device/list", data)
+
+export const reqAddDvFault = (data) => ajax("post", "/farm-huyang/device/add", data)
+
+export const reqDelDvFault = (id) => ajax("post", "/farm-huyang/device/delete", {id})

src/main.js

@@ -10,44 +10,15 @@ import vueModuleLoader from 'vue-module-loader'
 import 'default-passive-events' // ( https://www.jianshu.com/p/23850d4cade8 )
 import localModule from './module'
 import './assets/css/reset.scss'
-
 import echarts from "echarts";
-Vue.prototype.$echarts = echarts;
-
-/* 按需导入 */
-// import echarts from 'echarts/lib/echarts'
-//  // 引入折线图/柱状图等组件
-// import 'echarts/lib/chart/line'
-// import 'echarts/lib/chart/bar'
-// import 'echarts/lib/component/title'
-// import 'echarts/lib/component/toolbox'
-// import 'echarts/lib/component/markPoint' // 最值
-// import 'echarts/lib/component/markLine' // 平均值
-// import 'echarts/lib/component/legendScroll'
-// Vue.prototype.$echarts = echarts
+import moment from 'moment'
+moment.locale('zh-cn');  // 汉化
+Vue.prototype.$moment = moment; 
 
+Vue.prototype.$echarts = echarts;
 
 
 Vue.use(vueModuleLoader, { store }).use(ElementUI);
-/* 
-Element-UI用到的图标 
-import {
-  Menu,
-  Submenu,
-  MenuItem,
-  MenuItemGroup,
-  Input,
-  Button,
-  ButtonGroup,
-  Form,
-  FormItem,
-  Icon,
-  Row,
-  Col,
-  Select,
-  Option
-} from 'element-ui';
-*/
 
 const app = new Vue({
   router,

src/router/routes.js

@@ -9,14 +9,14 @@ import Crop from '@/views/statisticAnalysis/Crop.vue'
 import back from '@/views/statisticAnalysis/back.vue'
 /* 消息通知 */
 import productionWarn from '@/views/infoInform/productionWarn.vue'
+import deviceFault from '@/views/infoInform/deviceFault.vue'
 /* 系统配置 */
-import parameterSetting from '@/views/system/parameterSetting.vue'
+import deviceConfig from '@/views/system/deviceConfig.vue'
+import softwareSet from '@/views/system/softwareSet.vue'
+/* 档案信息 */
+import prairieConfig from '@/views/fileInfo/prairieConfig.vue'
 
 
-/* 群体管理 */
-import GroupRecord from '../views/groupManagment/GroupRecord.vue'
-import UnityTrace from '../views/groupManagment/UnityTrace/UnityTrace.vue'
-
 /* 模板 */
 import Aa from '../views/template/Aa.vue'
 import Ab from '../views/template/Ab.vue'
@@ -71,22 +71,27 @@ export default [
 			},
 			/* 系统配置 */
 			{
-				path: 'parameterSetting',
-				name: 'parameterSetting',
-				component: parameterSetting
+				path: 'deviceConfig',
+				name: 'deviceConfig',
+				component: deviceConfig
+			},
+			{
+				path: 'softwareSet',
+				name: 'softwareSet',
+				component: softwareSet
 			},
-			// 个体管理 deliveryRoom
 			{
-				path: 'UnityTrace',
-				name: 'UnityTrace',
-				component: UnityTrace
+				path: 'deviceFault',
+				name: 'deviceFault',
+				component: deviceFault
 			},
-			// 群体管理
+			/* 档案信息 */
 			{
-				path: 'GroupRecord',
-				name: 'GroupRecord',
-				component: GroupRecord
+				path: 'prairieConfig',
+				name: 'prairieConfig',
+				component: prairieConfig
 			},
+			
 			// 模板
 			{
 				path: 'aa',

src/store/index.js

@@ -1,24 +1,19 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
+import publicType from './publicType.js' // 公共的类型 
 
 Vue.use(Vuex)
 
 export default new Vuex.Store({
 	strict: true,
 	state: {
-		token: localStorage.getItem("token")
+		...publicType
 	},
 	getters: {
-		token: state => state.token,
 	},
 	mutations: {
-		setToken(state, token) {
-			state.token = token
-		}
+		
 	},
 	actions: {
-		login({ commit }, token) {
-			commit('setToken', token)
-		},
 	}
 })

src/store/publicType.js

@@ -0,0 +1,21 @@
+// 设备类型  
+const deviceType = [
+    { label: "温度", value: 1 },
+    { label: "湿度", value: 2 },
+    { label: "摄像头", value: 3 }
+]
+
+// 设备状态  
+const deviceStatus = [
+    { label: "正常工作", value: 1 },
+    { label: "暂停使用", value: 2 },
+    { label: "故障", value: 3 }
+]
+
+export default {
+    deviceType, deviceStatus
+}
+
+
+
+

src/views/Home/Home - 副本.vue

@@ -1,316 +0,0 @@
-<template>
-    <div class="home">
-        <header class="header">
-            <div class="left">
-                慧牧科技 
-                <el-button
-                    @click="onMenuCollapse"
-                    circle
-                    style="font-size: 20px"
-                    :icon="menuCollapse? 'el-icon-s-unfold' : 'el-icon-s-fold'"
-                ></el-button>
-            </div>
-            <div class="right">
-                <span class="warp">
-                    <el-dropdown  @command="onLogOut">
-                        <span class="el-dropdown-link">
-                            账号管理
-                            <i class="el-icon-arrow-down el-icon--right"></i>
-                        </span>
-                        <el-dropdown-menu slot="dropdown">
-                            <el-dropdown-item>退出登录</el-dropdown-item>
-                            <el-dropdown-item>切换账号</el-dropdown-item>
-                        </el-dropdown-menu>
-                    </el-dropdown>
-                </span>
-                <span>
-                    <el-dropdown @command="onLogOut">
-                        <span class="el-dropdown-link">
-                            权限切换
-                            <i class="el-icon-arrow-down el-icon--right"></i>
-                        </span>
-                        <el-dropdown-menu slot="dropdown">
-                            <el-dropdown-item disabled>权限一</el-dropdown-item>
-                            <el-dropdown-item divided>权限二</el-dropdown-item>
-                        </el-dropdown-menu>
-                    </el-dropdown>
-                </span>
-            </div>
-        </header>
-        <section class="section">
-            <div class="tac">
-                <div class="col1">
-                    <el-menu
-                        default-active="2"
-                        class="el-menu-vertical-demo"
-                        @open="handleOpen"
-                        @close="handleClose"
-                        :collapse="menuCollapse"
-                        :unique-opened="true"
-                        :default-openeds="defaultUnfoldedMenu"
-                        select="1-1"
-                        background-color="rgba(46,38,87)"
-                        text-color="#fff"
-                        active-text-color="#ffd04b"
-                    >
-                        <div v-for="(item) in menuData " :key="item.index">
-                            <el-submenu
-                                v-if="item.childList && item.childList.length > 0"
-                                :index="item.index"
-                            >
-                                <template slot="title">
-                                    <i :class="item.iconClassName"></i>
-                                    <span slot="title">{{ !menuCollapse? item.optionName : '' }}</span>
-                                    <!-- <span slot="title">{{ item.oneMenuName }}</span> -->
-                                </template>
-                                <el-menu-item
-                                    v-for="(item1) in item.childList"
-                                    :key="item1.index"
-                                    :index="item1.index"
-                                    :routerName="item1.routerName"
-                                    @click="onClickMenu(item1)"
-                                >{{ item1.optionName }}</el-menu-item>
-                            </el-submenu>
-                            <el-menu-item
-                                v-else
-                                :index="item.index"
-                                :disabled="item.disabled"
-                                :routerName="item.routerName"
-                                @click="onClickMenu(item)"
-                            >
-                                <i :class="item.iconClassName"></i>
-                                <span slot="title">{{ !menuCollapse? item.optionName : '' }}</span>
-                            </el-menu-item>
-                        </div>
-                    </el-menu>
-                </div>
-                <div class="col2">
-                    <header class="col2_header">
-                        <el-tag
-                            v-for="tag in tags"
-                            :key="tag.routerName"
-                            closable
-                            @close="close(tag)"
-                            @click="clickTag(tag)"
-                            :type="tag.type?tag.type:'info'"
-                            class="item"
-                        >{{tag.name}}</el-tag>
-                    </header>
-                    <div class="warp">
-                        <router-view />
-                    </div>
-                </div>
-            </div>
-        </section>
-    </div>
-</template>
-
-<script>
-import { menuData } from "./mencCofig.js";
-
-export default {
-    data() {
-        return {
-            // 菜单配置
-            menuData,
-            menuCollapse: false, //是否水平折叠收起菜单
-            defaultUnfoldedMenu: [menuData[0].index], // 默认展开第一项
-            tags: []
-        };
-    },
-    created() {
-        console.log(this)
-        console.log('========')
-        console.log(this.$http)
-        this.defaultUnfoldedMenu = [
-            localStorage.getItem("defaultUnfoldedMenu")
-        ];
-        this.menuCollapse = JSON.parse(localStorage.getItem("menuCollapse"));
-        this.tags = JSON.parse(localStorage.getItem("tagsNavList")) || [];
-    },
-    methods: {
-        // 收取菜单按钮
-        onMenuCollapse() {
-            this.menuCollapse = !this.menuCollapse;
-            localStorage.setItem("menuCollapse", this.menuCollapse);
-            this.defaultUnfoldedMenu = [
-                localStorage.getItem("defaultUnfoldedMenu")
-            ];
-        },
-        // 菜单展开
-        handleOpen(key, keyPath) {
-            console.log(key, keyPath);
-            localStorage.setItem("defaultUnfoldedMenu", "" + key);
-        },
-        // 菜单收取
-        handleClose(key, keyPath) {
-            console.log(key, keyPath);
-        },
-        // 点击菜单项
-        onClickMenu(item) {
-            let _this = this;
-            // 如果要跳转的路由和当前路由一致就 return
-            if (this.$router.history.current.name == item.routerName) return;
-            this.$router.push({
-                name: item.routerName
-            });
-            // 如果tags中已经存在 return
-            let temp = includes(item.routerName);
-            if (temp) {
-                this.tags.forEach(item => {
-                    item.type = "info";
-                });
-                temp.type = "success";
-                return;
-            }
-            this.tags.forEach(item => {
-                item.type = "info";
-            });
-            this.tags.push({
-                name: item.optionName,
-                routerName: item.routerName,
-                type: "success"
-            });
-
-            this.changeTagColor(item.routerName);
-            localStorage.setItem("tagsNavList", JSON.stringify(this.tags));
-            // 查看当前 tags里有没有传进来的路由，返回 true false
-
-            function includes(routerName) {
-                let tags = _this.tags;
-                return tags.find(item => {
-                    return item.routerName == routerName;
-                });
-            }
-        },
-        // 点击 tag
-        clickTag(tag) {
-            console.log(tag.routerName);
-            if (this.$router.history.current.name == tag.routerName) return;
-            this.$router.push({
-                name: tag.routerName
-            });
-            this.changeTagColor(tag.routerName);
-            localStorage.setItem("tagsNavList", JSON.stringify(this.tags));
-        },
-        // 点击 tag 的小×
-        close(tag) {
-            console.log(tag);
-            let spliceIndex = this.tags.findIndex(item => {
-                return item.routerName == tag.routerName;
-            });
-            console.log(spliceIndex);
-            this.tags.splice(spliceIndex, 1);
-            localStorage.setItem("tagsNavList", JSON.stringify(this.tags));
-        },
-        // 改变tag的颜色 公用的
-        changeTagColor(routerName) {
-            this.tags.forEach(item => {
-                if (item.routerName == routerName) {
-                    item.type = "success";
-                } else {
-                    item.type = "info";
-                }
-            });
-        },
-        onLogOut() {
-            this.$router.push('login')
-        }
-    }
-};
-</script>
-
-<style lang="scss" scoped>
-.home {
-    height: 100%;
-    overflow: hidden;
-    box-sizing: border-box;
-    background-color: #eee;
-    display: flex;
-    flex-direction: column;
-    .header {
-        // background-color: #029b62;
-        // background-color: rgb(46,38,87);
-        background-color: rgb(85, 70, 148);
-        height: 40px;
-        padding: 10px 20px;
-        margin-bottom: 5px;
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        .left {
-            font-size: 25px;
-            color: #fff;
-            /deep/ .is-circle {
-                margin-left: 40px;
-            }
-        }
-        .right {
-            .warp {
-                margin-right: 20px;
-            }
-        }
-    }
-    .section {
-        flex: 1;
-        box-sizing: border-box;
-        overflow: auto;
-        .tac {
-            flex: 1;
-            display: flex;
-            height: 96%;
-            box-sizing: border-box;
-            .col1 {
-                margin-right: 5px;
-                background-color: rgb(46,38,87);
-                // background-image: linear-gradient(to bottom, rgb(85, 70, 148) , rgb(41, 33, 85), rgb(41, 33, 85));
-            }
-            .col2 {
-                flex: 1;
-                background-color: #fff;
-                padding: 0 15px 15px 15px;
-                border-radius: 5px;
-                margin-right: 5px;
-                height: 100%;
-                overflow: auto;
-                .col2_header {
-                    position: relative;
-                    width: 85%;
-                    height: 50px;
-                    overflow: hidden;
-                    border-bottom: 2px solid #eee;
-                    background-color: #fff;
-                    padding: 10px;
-                    display: flex;
-                    align-items: center;
-                    box-sizing: border-box;
-                    z-index: 3;
-                    position: fixed;
-                    .item {
-                        margin-right: 8px;
-                        cursor: pointer;
-                    }
-                }
-                .warp {
-                    margin: 15px;
-                    padding-top: 55px;
-                }
-            }
-        }
-    }
-    // border: 1px solid #f00;
-}
-
-.el-menu-vertical-demo:not(.el-menu--collapse) {
-    width: 200px;
-    min-height: 400px;
-}
-// 下拉菜单
-.el-dropdown-link {
-    cursor: pointer;
-    color: #fff;
-}
-.el-icon-arrow-down {
-    font-size: 12px;
-}
-</style>

src/views/Home/Home.vue

@@ -2,7 +2,7 @@
     <div class="home">
         <header class="header">
             <div class="left">
-                湖羊养殖管理 
+                猪仔管家 
                 <el-button
                     @click="onMenuCollapse"
                     circle

src/views/Home/mencCofig.js

@@ -1,4 +1,3 @@
-
 export const menuData = [
     {
         optionName: "首页",
@@ -72,6 +71,11 @@ export const menuData = [
                 index: '21-1',
                 routerName: "productionWarn"
             },
+            {
+                optionName: '设备故障',
+                index: '21-2',
+                routerName: "deviceFault"
+            },
         ]
     },
     {
@@ -81,9 +85,14 @@ export const menuData = [
         disabled: false,
         childList: [
             {
-                optionName: '参数配置',
+                optionName: '设备配置',
                 index: '4-1',
-                routerName: "parameterSetting"
+                routerName: "deviceConfig"
+            },
+            {
+                optionName: '软件配置',
+                index: '4-2',
+                routerName: "softwareSet"
             }
         ]
     },
@@ -96,7 +105,7 @@ export const menuData = [
             {
                 optionName: '牧场配置',
                 index: '5-2',
-                routerName: ""
+                routerName: "prairieConfig"
             }
         ]
     },

src/views/deliveryRoomManagement/DeliveryRoom.vue

@@ -4,7 +4,7 @@
         <header style="margin-bottom:20px">
             <el-row type="flex" :gutter="20" align="middle">
                 <el-col :span="3">
-                    <el-input v-model="S_form.area" placeholder="请输入厂房号"></el-input>
+                    <el-input v-model="S_form.area" placeholder="请输入产床号"></el-input>
                 </el-col>
                 <el-col :span="3">
                     <el-select v-model="S_form.area" placeholder="请选择栋舍">
@@ -13,7 +13,7 @@
                     </el-select>
                 </el-col>
                 <el-col :span="3">
-                    <el-select v-model="S_form.area" placeholder="请选择区域">
+                    <el-select v-model="S_form.area" placeholder="请选择产房">
                         <el-option label="选项一" :value="1"></el-option>
                         <el-option label="选项二" :value="1"></el-option>
                     </el-select>
@@ -34,7 +34,7 @@
                     v-for="(item, index) in list"
                     :key="index"
                 >
-                    <h5>产房00{{ index+1 }}</h5>
+                    <h5>产床00{{ index+1 }}</h5>
                     <img class="img" :src="typeImgUrl[item.type - 1]" />
                     <p v-if="item.type == 1" class="info fontC">空床时间{{ 4 }}天</p>
                     <div class="info" v-if="item.type == 2">

src/views/groupManagment/GroupRecord.vue

@@ -1,114 +0,0 @@
-<template>
-    <div class="GroupRecord">
-        <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-row>
-        </header>
-        <section>
-            <article class="table">
-                <el-table :data="tableData" border style="width: 100%">
-                    <el-table-column prop="date" sortable label="日期" width="180"></el-table-column>
-                    <el-table-column  sortable label="猪编号" width="180"></el-table-column>
-                    <el-table-column prop="name" label="状态" width="180"></el-table-column>
-                    <el-table-column prop="address" label="耳标号"></el-table-column>
-                    <el-table-column label="操作" width="150">
-                        <template slot-scope="scope">
-                            <el-button @click="look(scope.row)" type="text" size="small">查看</el-button>
-                            <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="10"
-                        ></el-pagination>
-                    </el-col>
-                </el-row>
-            </article>
-        </section>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            value: "",
-            tableData: [
-                {
-                    date: "2016-05-02",
-                    name: "可用",
-                    address: "6895564457554"
-                },
-                {
-                    date: "2016-05-04",
-                    name: "不可用",
-                    address: "6895564456725"
-                },
-                {
-                    date: "2016-05-01",
-                    name: "不可用",
-                    address: "6895564415514"
-                },
-                {
-                    date: "2016-05-03",
-                    name: "可用",
-                    address: "6895564457594"
-                }
-            ]
-        };
-    },
-    created() {},
-    methods: {
-        look(row) {
-            this.$router.push({
-                path: 'UnityTrace'
-            })
-        },
-        edit(row) {},
-        del(row) {},
-        pageChange(p) {
-            console.log(p)
-        }
-    }
-};
-</script>
-
-<style lang="scss" scoped>
-#header {
-    margin-bottom: 15px;
-}
-.table {
-    .pagination {
-        margin-top: 20px;
-    }
-}
-</style>

src/views/groupManagment/UnityTrace/UnityTrace.vue

@@ -1,232 +0,0 @@
-<template>
-    <div class="UnityTrace">
-        <header class="header">
-            <h5>基本信息</h5>
-            <ul>
-                <el-row type="flex" class="row">
-                    <el-col :span="8" class="col">
-                        <span class="title">猪编号：</span>
-                        <span class="content">1540</span>
-                    </el-col>
-                    <el-col class="col">
-                        <span class="title">出生天数：</span>
-                        <span class="content">51</span>
-                    </el-col>
-                </el-row>
-                <el-row type="flex" class="row">
-                    <el-col :span="8" class="col">
-                        <span class="title">出生日期：</span>
-                        <span class="content">2020-05-01</span>
-                    </el-col>
-                    <el-col class="col">
-                        <span class="title">耳标号：</span>
-                        <span class="content">A3525DF3542</span>
-                    </el-col>
-                </el-row>
-                <el-row type="flex" class="row">
-                    <el-col :span="8" class="col">
-                        <span class="title">批次：</span>
-                        <span class="content">13543</span>
-                    </el-col>
-                    <el-col class="col">
-                        <span class="title">当前位置：</span>
-                        <span class="content">育肥舍四栋</span>
-                    </el-col>
-                </el-row>
-                <el-row type="flex" class="row">
-                    <el-col :span="8" class="col">
-                        <span class="title">品种：</span>
-                        <span class="content">大白</span>
-                    </el-col>
-                    <el-col class="col">
-                        <span class="title">饲养员：</span>
-                        <span class="content">某某某</span>
-                    </el-col>
-                </el-row>
-            </ul>
-        </header>
-        <section class="section">
-            <el-date-picker
-                v-model="value2"
-                type="datetimerange"
-                :picker-options="pickerOptions"
-                @change="pickerChange"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"
-                align="right"
-                class="date-picker"
-            ></el-date-picker>
-            <article v-if="dateArr.length > 0">
-                <chart-a :dateArr="dateArr" :data="animalTempArr" class="charts"></chart-a>
-                <chart-b :dateArr="dateArr" :data="envTempArr" class="charts"></chart-b>
-                <chart-c :dateArr="dateArr" :data="batteryArr" class="charts"></chart-c>
-            </article>
-            <p v-else class="hint"> 当前时间段无数据... </p>
-        </section>
-        
-    </div>
-</template>
-
-<script>
-import { reqReportList } from "@/api/groupManagment";
-
-import chart_a from "./charts/chart_a";
-import chart_b from "./charts/chart_b";
-import chart_c from "./charts/chart_c";
-
-const pickerOptions = {
-    shortcuts: [
-        {
-            text: "最近一小时",
-            onClick(picker) {
-                const end = new Date();
-                const start = new Date();
-                start.setTime(start.getTime() - 3600 * 1000 * 1);
-                picker.$emit("pick", [start, end]);
-            }
-        },
-        {
-            text: "最近半天",
-            onClick(picker) {
-                const end = new Date();
-                const start = new Date();
-                start.setTime(start.getTime() - 3600 * 1000 * 12);
-                picker.$emit("pick", [start, end]);
-            }
-        },
-         {
-            text: "最近一天",
-            onClick(picker) {
-                const end = new Date();
-                const start = new Date();
-                start.setTime(start.getTime() - 3600 * 1000 * 24);
-                picker.$emit("pick", [start, end]);
-            }
-        },
-        {
-            text: "最近三天",
-            onClick(picker) {
-                const end = new Date();
-                const start = new Date();
-                start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
-                picker.$emit("pick", [start, end]);
-            }
-        },
-        {
-            text: "最近一周",
-            onClick(picker) {
-                const end = new Date();
-                const start = new Date();
-                start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
-                picker.$emit("pick", [start, end]);
-            }
-        }
-    ]
-};
-
-export default {
-    name: "UnityTrace",
-    components: {
-        "chart-a": chart_a,
-        "chart-b": chart_b,
-        "chart-c": chart_c
-    },
-    data() {
-        return {
-            dateArr: [],
-            animalTempArr: [],
-            envTempArr: [],
-            batteryArr: [],
-            pickerOptions,
-            value2: null,
-            timer_1: null,
-            SData: Math.floor(( new Date().getTime() - 3600 * 1000 * 6 ) / 1000), // 默认最近六小时 
-            EData: Math.ceil(new Date().getTime() / 1000)
-        };
-    },
-    created() {
-        // 一分钟更新一次   后端10分钟更新一次数据
-        this.getReportList()
-        this.timer_1 = setInterval(() => {
-            this.getReportList()
-            console.log("getReportList")
-        }, 1000 * 60);
-    },
-    mounted() {},
-    beforeDestroy() {
-        window.clearInterval(this.timer_1)
-    },
-    methods: {
-        // 事件选择器值改变
-        pickerChange(value) {
-            console.log(value)
-            this.SData = Math.floor(new Date(value[0]).getTime() / 1000)
-            this.EData = Math.ceil(new Date(value[1]).getTime() / 1000)
-            console.log(this.SData, this.EData)
-            this.getReportList()
-        },
-        // 请求个体数据  id  825   826 830
-        getReportList() {
-            reqReportList({ deviceId:825, start:this.SData, end:this.EData })
-                .then(res => {
-                    let dateArr = [], 
-                        animalTempArr = [],
-                        envTempArr = [],
-                        batteryArr = []
-                    res.forEach((item, index) => {
-                        dateArr.push(item.created)
-                        animalTempArr.push(item.animalTemp)
-                        batteryArr.push(item.battery*100)
-                        envTempArr.push(item.envTemp)
-                    });
-                    this.dateArr = dateArr
-                    this.animalTempArr = animalTempArr
-                    this.envTempArr = envTempArr
-                    this.batteryArr = batteryArr
-
-                })
-                .catch(err => {
-                    console.log( err);
-                });
-        },
-    }
-};
-</script>
-
-<style lang="scss" scoped>
-.UnityTrace {
-    .header {
-        border: 1px solid #eee;
-        padding: 10px;
-        h5 {
-            font-size: 18px;
-        }
-        .row {
-            padding-left: 100px;
-            margin-bottom: 10px;
-            .col {
-                overflow: ellipsis;
-                .title {
-                    font-size: 15px;
-                }
-                .content {
-                    font-size: 14px;
-                    color: #555;
-                }
-            }
-        }
-    }
-    .section {
-        .date-picker {
-            margin-left: 48%;
-            margin-top: 30px;
-            margin-bottom: 20px;
-        }
-        .charts{
-            border-top: 1px solid #ccc;
-            padding-top: 25px;
-        }
-    }
-}
-</style>

src/views/groupManagment/UnityTrace/charts/Ae.vue

@@ -1,42 +0,0 @@
-<template>
-    <div class="Ad">
-        <h1>{{title}}</h1>
-    </div>
-</template>
-
-<script>
-import { mapActions } from "vuex";
-
-export default {
-    
-    name: "Ad",
-    props: {
-        title:{default: 'default'}
-    },
-    data() {
-        return {};
-    },
-    
-    created() {
-        console.log(this.title)
-    },
-    methods: {
-        ...mapActions(["fetch"]),
-        get() {
-            this.fetch({
-                api: "aaa",
-                method: "GET",
-                data: {},
-                success: res => {
-                    console.log(res);
-                },
-                fail: err => {
-                    console.log(err);
-                    if (err.errMsg) this.$message.error(err.errMsg);
-                    else this.$message.error("服务器发生异常");
-                }
-            });
-        }
-    }
-};
-</script>

src/views/groupManagment/UnityTrace/charts/chart_a.vue

@@ -1,114 +0,0 @@
-<template>
-    <div class="chart_a">
-        
-        <div id="chart_a" style="width: 80%;height:400px;"></div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            orgOptions: {},
-            // subtext: "副标题"
-        };
-    },
-    props: {
-         dateArr:{type:Array},
-         data:{type:Array}
-     },
-    created() {
-        
-    },
-    watch: {
-        dateArr(nVal,oVal) {
-            this.drawChart();
-        }
-    },
-    mounted() {
-        this.drawChart();
-    },
-    methods: {
-        drawChart() {
-            // 基于准备好的dom，初始化echarts实例
-            let myChart = this.$echarts.init(
-                document.getElementById('chart_a')
-            );
-            // 指定图表的配置项和数据
-            let option = {
-                title: {
-                    text: "耳根温度",
-                    // subtext: this.subtext,
-                    left: 100
-                },
-                tooltip: {
-                    trigger: "axis"
-                },
-                toolbox: {
-                    show: true,
-                    feature: {
-                        dataZoom: {
-                            yAxisIndex: "none"
-                        },
-                        dataView: { readOnly: false },
-                        magicType: { type: ["line", "bar"] },
-                        restore: {},
-                        saveAsImage: {}
-                    }
-                },
-                color: {
-                    type: "linear",
-                    x: 0,
-                    y: 0,
-                    x2: 0,
-                    y2: 1,
-                    colorStops: [
-                        {
-                            offset: 0,
-                            color: "red" // 0% 处的颜色
-                        },
-                        {
-                            offset: 1,
-                            color: "blue" // 100% 处的颜色
-                        }
-                    ]
-                },
-                xAxis: {
-                    type: "category",
-                    boundaryGap: false,
-                    data: this.dateArr
-                },
-                yAxis: {
-                    type: "value",
-                    axisLabel: {
-                        formatter: "{value} °C"
-                    },
-                    scale: true
-                },
-                series: [
-                    {
-                        name: "耳温",
-                        type: "line",
-                        data: this.data,
-                        markPoint: {
-                            data: [
-                                { type: "max", name: "最大值" },
-                                { type: "min", name: "最小值" }
-                            ]
-                        },
-                        markLine: {
-                            data: [{ type: "average", name: "平均值" }]
-                        }
-                    }
-                ]
-            };
-            // 使用刚指定的配置项和数据显示图表。
-            myChart.setOption(option);
-        }
-    }
-};
-</script>
-
-<style lang="scss" scoped>
-
-</style>

src/views/groupManagment/UnityTrace/charts/chart_b.vue

@@ -1,110 +0,0 @@
-<template>
-    <div class="chart_b">
-        <div id="chart_b" style="width: 80%;height:400px;"></div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            orgOptions: {},
-            // subtext: "副标题"
-        };
-    },
-    created() {},
-    props: {
-        dateArr:{type:Array},
-        data:{type:Array}
-    },
-    watch: {
-        dateArr(nVal,oVal) {
-            this.drawChart();
-        }
-    },
-
-    mounted() {
-        this.drawChart();
-    },
-    methods: {
-        drawChart() {
-            // 基于准备好的dom，初始化echarts实例
-            let myChart = this.$echarts.init(document.getElementById("chart_b"));
-            // 指定图表的配置项和数据
-            let option = {
-                title: {
-                    text: "环境温度",
-                    // subtext: this.subtext,
-                    left: 100
-                },
-                tooltip: {
-                    trigger: "axis"
-                },
-                toolbox: {
-                    show: true,
-                    feature: {
-                        dataZoom: {
-                            yAxisIndex: "none"
-                        },
-                        dataView: { readOnly: false },
-                        magicType: { type: ["line", "bar"] },
-                        restore: {},
-                        saveAsImage: {}
-                    }
-                },
-                color: {
-                    type: "linear",
-                    x: 0,
-                    y: 0,
-                    x2: 0,
-                    y2: 1,
-                    colorStops: [
-                        {
-                            offset: 0,
-                            color: "red" // 0% 处的颜色
-                        },
-                        {
-                            offset: 1,
-                            color: "blue" // 100% 处的颜色
-                        }
-                    ]
-                },
-                xAxis: {
-                    type: "category",
-                    boundaryGap: false,
-                    data: this.dateArr || []
-                },
-                yAxis: {
-                    type: "value",
-                    axisLabel: {
-                        formatter: "{value} °C"
-                    },
-                    scale: true
-                },
-                series: [
-                    {
-                        name: "耳温",
-                        type: "line",
-                        // data: [32.5, 32.6, 32.4, 32.5, 32.4, 32.6, 32.4],
-                        data: this.data,
-                        markPoint: {
-                            data: [
-                                { type: "max", name: "最大值" },
-                                { type: "min", name: "最小值" }
-                            ]
-                        },
-                        markLine: {
-                            data: [{ type: "average", name: "平均值" }]
-                        }
-                    }
-                ]
-            };
-            // 使用刚指定的配置项和数据显示图表。
-            myChart.setOption(option);
-        }
-    }
-};
-</script>
-
-<style lang="scss" scoped>
-</style>

src/views/groupManagment/UnityTrace/charts/chart_c.vue

@@ -1,109 +0,0 @@
-<template>
-    <div class="chart_c">
-        <div id="chart_c" style="width: 80%;height:400px;"></div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            orgOptions: {},
-            // subtext: "副标题"
-        };
-    },
-    created() {},
-    props: {
-        dateArr:{type:Array},
-        data:{type:Array}
-    },
-    watch: {
-        dateArr(nVal,oVal) {
-            this.drawChart();
-        }
-    },
-    mounted() {
-        this.drawChart();
-    },
-    methods: {
-        drawChart() {
-            // 基于准备好的dom，初始化echarts实例
-            let myChart = this.$echarts.init(document.getElementById("chart_c"));
-            // 指定图表的配置项和数据
-            let option = {
-                title: {
-                    text: "电池电量",
-                    // subtext: this.subtext,
-                    left: 100
-                },
-                tooltip: {
-                    trigger: "axis"
-                },
-                toolbox: {
-                    show: true,
-                    feature: {
-                        dataZoom: {
-                            yAxisIndex: "none"
-                        },
-                        dataView: { readOnly: false },
-                        magicType: { type: ["line", "bar"] },
-                        restore: {},
-                        saveAsImage: {}
-                    }
-                },
-                color: {
-                    type: "linear",
-                    x: 0,
-                    y: 0,
-                    x2: 0,
-                    y2: 1,
-                    colorStops: [
-                        {
-                            offset: 0,
-                            color: "red" // 0% 处的颜色
-                        },
-                        {
-                            offset: 1,
-                            color: "blue" // 100% 处的颜色
-                        }
-                    ]
-                },
-                xAxis: {
-                    type: "category",
-                    boundaryGap: false,
-                    data: this.dateArr
-                },
-                yAxis: {
-                    type: "value",
-                    axisLabel: {
-                        formatter: "{value} %"
-                    },
-                    scale: true
-                },
-                series: [
-                    {
-                        name: "电量",
-                        type: "line",
-                        // data: [32.5, 32.6, 32.4, 32.5, 32.4, 32.6, 32.4],
-                        data: this.data,
-                        markPoint: {
-                            data: [
-                                { type: "max", name: "最大值" },
-                                { type: "min", name: "最小值" }
-                            ]
-                        },
-                        markLine: {
-                            data: [{ type: "average", name: "平均值" }]
-                        }
-                    }
-                ]
-            };
-            // 使用刚指定的配置项和数据显示图表。
-            myChart.setOption(option);
-        }
-    }
-};
-</script>
-
-<style lang="scss" scoped>
-</style>

src/views/infoInform/deviceFault.vue

@@ -0,0 +1,253 @@
+<template>
+    <div class="DvFault">
+        <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="getDvFaultList">查找</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 :data="tableData" tooltip-effect="dark" style="width: 100%">
+                    <el-table-column prop="id" label="序号" width="100"></el-table-column>
+                    <!-- <el-table-column prop="farmId" label="农场ID"></el-table-column> -->
+                    <el-table-column label="安装日期">
+                        <template v-slot="scope">
+                            <span>{{ scope.row['installTime'].substr(0,10) }}</span>
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="name" label="设备名称"></el-table-column>
+                    <el-table-column label="设备类型">
+                        <template v-slot="scope">
+                            <div v-for="item in $store.state['deviceType']" :key="item.value">
+                                <span v-if="item.value == scope.row['style']">{{ item.label }}</span>
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="设备状态">
+                        <template v-slot="scope">
+                            <div v-for="item in $store.state['deviceStatus']" :key="item.value">
+                                <el-tag
+                                    :type="scope.row['status']==3?'danger':scope.row['status']==2?'info':''"
+                                    v-if="item.value == scope.row['status']"
+                                    size="mini"
+                                >{{ item.label }}</el-tag>
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="code" label="产品编码"></el-table-column>
+                    <el-table-column prop="position" label="地址"></el-table-column>
+                    <el-table-column label="操作" width="150">
+                        <template v-slot="scope">
+                            <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="addDvFault" :model="formData" :rules="rules" label-width="140px">
+                        <el-form-item label="安装日期">
+                            <el-date-picker
+                                v-model="formData.installTime"
+                                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.name"></el-input>
+                        </el-form-item>
+                        <el-form-item label="设备类型">
+                            <el-select v-model="formData.style" filterable placeholder="请选择">
+                                <el-option
+                                    v-for="item in $store.state['deviceType']"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                ></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <!-- <el-form-item label="设备状态">
+                            <el-radio-group v-model="formData.status">
+                                <el-radio
+                                    v-for="item in $store.state['deviceStatus']"
+                                    :key="item.value"
+                                    :label="item.value"
+                                >{{ item.label }}</el-radio>
+                            </el-radio-group>
+                        </el-form-item> -->
+                        <el-form-item label="产品编码">
+                            <el-input v-model="formData.code"></el-input>
+                        </el-form-item>
+                        <el-form-item label="地址">
+                            <el-input v-model="formData.position"></el-input>
+                        </el-form-item>
+                        <el-form-item>
+                            <el-button @click="isShow=false">取 消</el-button>
+                            <el-button type="primary" @click="submitForm('addDvFault')">保 存</el-button>
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+            </el-row>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import { reqDvFaultList, reqAddDvFault, reqDelDvFault } from "@/api/infoInform.js";
+
+const pageSize = 10;
+const rules = {};
+const farmId = 1;
+
+export default {
+    name: "DvFault",
+    data() {
+        let _this = this;
+        return {
+            search: "",
+            pageNum: 1,
+            tableData: [],
+            totalPages: 0,
+            isShow: false,
+            formData: {
+                farmId,
+                installTime: this.$moment().format("YYYY-MM-DD HH:mm:ss"),
+                name: "温度传感器",
+                style: null,
+                // status: this.$store.state['deviceStatus'][0].value,
+                code: "6565464",
+                position: "分娩一舍"
+            },
+            rules
+        };
+    },
+    created() {
+        // 设备故障列表
+        this.getDvFaultList();
+    },
+    watch: {
+        "formData.weight"(v, ov) {
+            if (Number(v).toString() == "NaN") {
+                this.$message.error("请输入数字");
+                return;
+            }
+            this.formData.sum = (v * this.formData.price).toFixed(2);
+        },
+        "formData.price"(v, ov) {
+            if (Number(v).toString() == "NaN") {
+                this.$message.error("请输入数字");
+                return;
+            }
+            this.formData.sum = (this.formData.weight * v).toFixed(2);
+        }
+    },
+    methods: {
+        submitForm(formName) {
+            this.$refs[formName].validate(valid => {
+                if (valid) {
+                    reqAddDvFault(this.formData)
+                        .then(res => {
+                            // 设备故障列表
+                            this.getDvFaultList();
+                            // this.$message.success("成功！");
+                            if (res.errCode) {
+                                this.$message.error(res.errMsg);
+                            } else {
+                                this.$message.success("成功");
+                            }
+                            // this.isShow = false
+                        })
+                        .catch(err => {
+                            console.log(err);
+                            this.$message.error("失败！");
+                        });
+                } else {
+                    return false;
+                }
+            });
+        },
+        // 设备故障列表
+        getDvFaultList() {
+            reqDvFaultList({
+                searchStr: this.search,
+                farmId,
+                pageSize,
+                pageNum: this.pageNum
+            })
+                .then(res => {
+                    this.tableData = res.content;
+                    this.totalPages = res.totalPages;
+                })
+                .catch(err => {
+                    console.log(err);
+                });
+        },
+        add() {
+            this.isShow = true;
+            // 有id是update 没id是add
+            delete this.formData.id;
+        },
+        del(row) {
+            console.log(row);
+            reqDelDvFault(row.id)
+                .then(res => {
+                    // 设备故障列表
+                    this.getDvFaultList();
+                    if (res.code == "success") {
+                        this.$message.success(res.msg);
+                    }
+                    if (res.errCode == "delete failed") {
+                        this.$message.error(res.errMsg);
+                    }
+                })
+                .catch(err => {
+                    console.log(err);
+                    this.$message.error("删除失败！");
+                });
+        },
+        pageChange(p) {
+            console.log(p);
+            this.pageNum = p;
+            // 设备故障列表
+            this.getDvFaultList();
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+#header {
+    margin-bottom: 15px;
+}
+.table {
+    .pagination {
+        margin-top: 20px;
+    }
+}
+</style>

src/views/infoInform/productionWarn.vue

@@ -3,62 +3,91 @@
         <h2 style="margin-bottom: 20px;padding-bottom:7px;border-bottom:2px solid #ddd">生产预警</h2>
         <section class="section">
             <h3>预警信息：</h3>
-            <article class="item item_1">
-                <div class="left el-icon-mobile-phone"></div>
-                <div class="right">
-                    <p class="top">消息警报</p>
-                    <p class="middle">伊维菌素已经低于安全库存请及时补充！</p>
-                    <span class="bottom">查看详情</span>
-                </div>
-            </article>
-            <article class="item item_1">
-                <div class="left el-icon-mobile-phone"></div>
-                <div class="right">
-                    <p class="top">消息警报</p>
-                    <p class="middle">2622种母羊还有七天到达预产期请注意！</p>
-                    <span class="bottom">查看详情</span>
-                </div>
-            </article>
-            <article class="item item_1">
-                <div class="left el-icon-mobile-phone"></div>
-                <div class="right">
-                    <p class="top">消息警报</p>
-                    <p class="middle">3456种母羊已经到达可断奶日期，请及时断奶！</p>
-                    <span class="bottom">查看详情</span>
-                </div>
-            </article>
-            <article class="item item_1">
-                <div class="left el-icon-mobile-phone"></div>
-                <div class="right">
-                    <p class="top">消息警报</p>
-                    <p class="middle">伊维菌素已经低于安全库存请及时补充！</p>
-                    <span class="bottom">查看详情</span>
-                </div>
-            </article>
-            <article class="item item_1">
-                <div class="left el-icon-mobile-phone"></div>
-                <div class="right">
-                    <p class="top">消息警报</p>
-                    <p class="middle">2622种母羊还有七天到达预产期请注意！</p>
-                    <span class="bottom">查看详情</span>
-                </div>
-            </article>
-            <article class="item item_1">
-                <div class="left el-icon-mobile-phone"></div>
-                <div class="right">
-                    <p class="top">消息警报</p>
-                    <p class="middle">3456种母羊已经到达可断奶日期，请及时断奶！</p>
-                    <span class="bottom">查看详情</span>
-                </div>
-            </article>
+            <el-table :data="tableData" tooltip-effect="dark" style="width: 70%">
+                <el-table-column label="公告标题">
+                    <template v-slot="props">
+                        <span>【通知】</span>
+                        <span>{{ props.row['title'] }}</span>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="time" label="公告时间" fixed="right" width="180"></el-table-column>
+            </el-table>
         </section>
     </div>
 </template>
 
 <script>
 export default {
+    name: "productionWarn",
     data() {
-        return {};
+        return {
+            tableData: [
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+                {
+                    title: "产床001上的仔猪预计七天后可进行断奶，请留意观察",
+                    time: "2020-08-24 14:28:43"
+                },
+            ]
+        };
     },
     created() {},
     methods: {}
@@ -67,48 +96,13 @@ export default {
 
 <style lang="scss" scoped>
 .productionWarn {
-    .section{
+    .section {
         padding: 0 3%;
-        h3{
+        h3 {
             color: #333;
             font-size: 22px;
             margin-bottom: 30px;
         }
-        .item{
-            height: 110px;
-            margin: 15px 0;
-            display: flex;
-            box-sizing: border-box;
-            border-radius: 10px;
-            align-items: center;
-            
-            .left{
-                font-size: 30px;
-                margin-left: 20px;
-                margin-right: 20px;
-            }
-            .right{
-                .top{
-                    font-size: 20px;
-                    font-weight: 600;
-                    color: #746363;
-                }
-                .middle{
-                    font-size: 16px;
-                    color: #999;
-                }
-                .bottom{
-                    font-size: 16px;
-                    color: rgb(48, 115, 240);
-                }
-            }
-        }
-        .item_1{
-            background-color: #FFF5E6;
-            .left{
-                color: #FE9400;
-            }
-        }
     }
 }
 </style>

src/views/system/deviceConfig.vue

@@ -0,0 +1,90 @@
+<template>
+    <div class="deviceConfig">
+        <h2 style="margin-bottom: 20px;padding-bottom:7px;border-bottom:2px solid #ddd">设备配置</h2>
+        <section class="section">
+            <el-row type="flex">
+                <el-col :span="20">
+                    <el-form
+                        ref="deviceConfig"
+                        :model="formData"
+                        :rules="rules"
+                        label-width="140px"
+                    >
+                        <el-form-item label="服务器地址">
+                            <el-input v-model="formData.serverAddress"></el-input>
+                        </el-form-item>
+                        <el-form-item label="上传间隔">
+                            <el-input v-model="formData.timeInterval">
+                                <template slot="append">分钟 [ 1-60 ]</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="1-3日龄高温">
+                            <el-input v-model="formData.T1_3">
+                                <template slot="append">摄氏度 [ 20-35℃ ]</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="4-7日龄高温">
+                            <el-input v-model="formData.T4_7">
+                                <template slot="append">摄氏度 [ 20-35℃ ]</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="8-14日龄高温">
+                            <el-input v-model="formData.T8_14">
+                                <template slot="append">摄氏度 [ 20-35℃ ]</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="15-30日龄高温">
+                            <el-input v-model="formData.T15_30">
+                                <template slot="append">摄氏度 [ 20-35℃ ]</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item>
+                            <el-row type="flex" justify="end">
+                                <el-button type="primary" @click="submitForm('deviceConfig')">保 存</el-button>
+                            </el-row>
+                        </el-form-item>
+                    </el-form>
+                    <p>本机系列号：4579285745856</p>
+                </el-col>
+            </el-row>
+        </section>
+    </div>
+</template>
+
+
+<script>
+const rules = {};
+
+export default {
+    name: "deviceConfig",
+    data() {
+        return {
+            rules,
+            formData: {}
+        };
+    },
+    created() {},
+    methods: {
+        submitForm(formName) {
+            this.$refs[formName].validate(valid => {
+                if (valid) {
+                    console.log("555")
+                } else {
+                    return false;
+                }
+            });
+        },
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+.deviceConfig {
+    .section {
+        width: 650px;
+        background-color: #eee;
+        border-radius: 15px;
+        padding: 30px;
+    }
+}
+</style>

src/views/system/parameterSetting.vue

@@ -1,5 +0,0 @@
-<template>
-    <div>
-        <h2 style="margin-bottom: 20px;padding-bottom:7px;border-bottom:2px solid #ddd">参数配置</h2>
-    </div>
-</template>

src/views/system/softwareSet.vue

@@ -0,0 +1,121 @@
+<template>
+    <div class="softwareSet">
+        <h2 style="margin-bottom: 20px;padding-bottom:7px;border-bottom:2px solid #ddd">软件配置</h2>
+        <section class="section">
+            <article style="margin-bottom: 50px;">
+                <h3 class="title">淘汰母猪条件设置</h3>
+                <el-row type="flex" align="middle">
+                    日龄超过
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.aa" @blur="save"></el-input>
+                    </el-col>的母猪
+                </el-row>
+                <el-row type="flex" align="middle">
+                    分娩胎次超过
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.bb" @blur="save"></el-input>
+                    </el-col>的母猪
+                </el-row>
+                <el-row type="flex" align="middle">
+                    连续
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.cc" @blur="save"></el-input>
+                    </el-col>胎或者累计
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.dd" @blur="save"></el-input>
+                    </el-col>胎以上分娩仔猪在
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.ee" @blur="save"></el-input>
+                    </el-col>头以下的母猪
+                </el-row>
+                <el-row type="flex" align="middle">
+                    连续
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.ff" @blur="save"></el-input>
+                    </el-col>胎或者累计
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.gg" @blur="save"></el-input>
+                    </el-col>胎以上分娩仔猪存活率低于
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model="formData.hh" @blur="save"></el-input>
+                    </el-col>% 头以下的母猪
+                </el-row>
+                <el-row type="flex" align="middle">
+                    连续
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.ii" @blur="save"></el-input>
+                    </el-col>胎或者累计
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.jj" @blur="save"></el-input>
+                    </el-col>胎以上断奶仔猪存活率低于
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model="formData.kk" @blur="save"></el-input>
+                    </el-col>% 头以下的母猪
+                </el-row>
+            </article>
+            <article>
+                <h3 class="title">淘汰母猪条件设置</h3>
+                <el-row type="flex" align="middle">
+                    到达预产期前
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.ac" @blur="save"></el-input>
+                    </el-col>天提醒关注
+                </el-row>
+                <el-row type="flex" align="middle">
+                    分娩后
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.ad" @blur="save"></el-input>
+                    </el-col>天提醒断奶
+                </el-row>
+                <el-row type="flex" align="middle">
+                    断奶后
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.ae" @blur="save"></el-input>
+                    </el-col>天提醒转舍
+                </el-row>
+                <el-row type="flex" align="middle">
+                    母猪温度高于
+                    <el-col :span="2" style="margin:10px 8px">
+                        <el-input v-model.number="formData.af" @blur="save"></el-input>
+                    </el-col>℃提醒高温预警
+                </el-row>
+            </article>
+        </section>
+    </div>
+</template>
+
+
+<script>
+export default {
+    name: "softwareSet",
+    data() {
+        return {
+            formData: {}
+        };
+    },
+    created() {},
+    methods: {
+        save() {
+            console.log(this.formData)
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+.softwareSet {
+    .section {
+        width: 800px;
+        background-color: #eee;
+        border-radius: 15px;
+        padding: 30px;
+        article {
+            color: #666;
+            
+            .title {
+                color: #555;
+            }
+        }
+    }
+}
+</style>