diff --git a/FlowerGully/src/assets/7.gif b/FlowerGully/src/assets/7.gif
new file mode 100644
index 0000000000000000000000000000000000000000..67eb144e9e9bc3df42e6ac82f652345306a319df
Binary files /dev/null and b/FlowerGully/src/assets/7.gif differ
diff --git a/FlowerGully/src/views/BasicInformation/Variety.vue b/FlowerGully/src/views/BasicInformation/Variety.vue
index 32ad6db299b5b7ed7a984e5850928f89f726b09a..c7c91ece59c090796d8c5dc6a3134c9bba62ab9b 100644
--- a/FlowerGully/src/views/BasicInformation/Variety.vue
+++ b/FlowerGully/src/views/BasicInformation/Variety.vue
@@ -71,6 +71,7 @@
                 <el-button type="primary" @click="dialogVisible1 = false">确 定</el-button>
             </span>
         </el-dialog>
+>>>>>>> master
     </div>
 </template>
 
@@ -215,4 +216,5 @@ export default {
     height: 178px;
     display: block;
 }
-</style>
\ No newline at end of file
+</style>
+>>>>>>> master
diff --git a/FlowerGully/src/views/Equipment/VideoMonitoring.vue b/FlowerGully/src/views/Equipment/VideoMonitoring.vue
index d445e676b4e2be6a3a67be5ab1793f94b780b63a..91153eb303392969f64e9bbff26ecd7d01edfc72 100644
--- a/FlowerGully/src/views/Equipment/VideoMonitoring.vue
+++ b/FlowerGully/src/views/Equipment/VideoMonitoring.vue
@@ -1,15 +1,203 @@
 <template>
-    <div>
-        视频监控
+    <div class="boder">
+        <h6 class="title">
+            <span class="span1">视频监控</span> &nbsp;<div class="span2">REAL TIME MONITORING</div>
+        </h6>
+        <div class="main">
+            <div class="left">
+                <div class="box">{{ time }}</div>
+                <div class="box">{{ time }}</div>
+                <div class="box">{{ time }}</div>
+                <div class="box">{{ time }}</div>
+            </div>
+            <div class="right">
+                <h6 class="title2">
+                    <span class="span1">选择监控点</span> &nbsp;<div class="span2">SELECT MONITORING POINT</div>
+                </h6>
+                <div style="width:100%;height:2px;margin:10px 0;background:#233855"></div>
+                <div class="shang">
+                    <h6>选择监控点</h6>
+                    <el-select v-model="value" placeholder="武功山花涧里大棚基地" class="select">
+                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
+                        </el-option>
+                    </el-select>
+                </div>
+            </div>
+        </div>
     </div>
 </template>
 
 <script>
-    export default {
-        
-    }
+export default {
+    data() {
+        return {
+            time: '',
+            options: [{
+                value: '选项1',
+                label: '武功山花涧里大棚基地'
+            }, {
+                value: '选项2',
+                label: '武功山花涧里大棚基地'
+            }, {
+                value: '选项3',
+                label: '武功山花涧里大棚基地'
+            }, {
+                value: '选项4',
+                label: '武功山花涧里大棚基地'
+            }, {
+                value: '选项5',
+                label: '武功山花涧里大棚基地'
+            }],
+            value: ''
+        }
+    },
+    mounted() {
+        this.getNowTime(); //进入页面调用该方法获取当前时间
+        clearInterval(myTimeDisplay); //销毁之前定时器
+        var myTimeDisplay = setInterval(() => {
+            this.getNowTime(); //每秒更新一次时间
+        }, 1000);
+
+    },
+    methods: {
+        getNowTime() {
+            var date = new Date();
+            var time =
+                date.getFullYear() +
+                "年 " +
+                (date.getMonth() + 1) +
+                "月 " +
+                date.getDate() +
+                "日 " +
+                this.addZero(date.getHours()) +
+                ":" +
+                this.addZero(date.getMinutes()) +
+                ":" +
+                this.addZero(date.getSeconds());
+            this.time = time;
+        },
+        //根据自己的需求，看要不要在时间不大于10的时候在前面补0，如果需要直接this.addZero(date.getMinutes()),其它与之相同，如果不需要删掉addZero（）方法即可。
+        //小于10的拼接上0字符串
+        addZero(s) {
+            return s < 10 ? "0" + s : s;
+        },
+    },
+
+
+}
 </script>
 
 <style lang="scss" scoped>
+::-webkit-scrollbar {
+    display: none;
+    /* Chrome Safari */
+}
+
+.boder {
+    width: 100%;
+    height: 596px;
+    padding: 10px;
+    overflow: auto;
+    background-image: url('~@/assets/allimg/归档/切图/编组 10.png');
+}
+
+.title {
+    width: 296px;
+    height: 30px;
+    margin: 20px 10px;
+    border-bottom: 1px solid #ccc;
+    background: url('~@/assets/allimg/归档/切图/产品溯源/编组 9备份 7.png');
+    background-size: 300px 30px;
+}
+
+.title2 {
+    margin: 0;
+    height: 20px;
+    background: url('~@/assets/allimg/归档/切图/产品溯源/编组 9备份 7.png');
+    background-size: 262px 40px;
+}
+
+.span1 {
+    color: #fff;
+    font-size: 12px;
+    line-height: 24px;
+    margin-left: 14px;
+}
+
+
+.span2 {
+    color: #7a83aa;
+    display: inline-block;
+    font-size: 10px;
+    transform: scale(0.83333);
+    transform-origin: 0 0;
+    white-space: nowrap;
+}
+
+.main {
+    width: 100%;
+    height: 506px;
+    display: flex;
+    justify-content: space-between;
+}
 
+.left {
+    width: 76%;
+    display: flex;
+    justify-content: space-around;
+    flex-flow: row wrap;
+}
+
+.right {
+    width: 280px;
+    height: 492px;
+    padding: 10px;
+    overflow: hidden;
+    background-image: url('~@/assets/allimg/归档/切图/价格指数/矩形备份 44.png');
+    background-size: 280px 492px;
+}
+
+.box {
+    width: 416px;
+    height: 240px;
+    margin: 0 10px 10px 0;
+    padding: 10px;
+    font-size: 12px;
+    border-radius: 8px;
+    background-image: url('~@/assets/7.gif');
+}
+
+.shang {
+    width: 100%;
+    height: 60px;
+
+    h6 {
+        margin: 0;
+        font-size: 10px;
+        color: #fff;
+        margin-bottom: 10px;
+    }
+
+}
+
+::v-deep .el-input__inner {
+    background-color: transparent !important;
+
+    height: 40px;
+}
+
+/**修改边框和字体颜色 */
+::v-deep .el-select {
+    position: relative;
+    width: 258px;
+
+    .el-input {
+        input {
+            height: 40px;
+            border: 1px solid #044bb6;
+            color: #fff;
+            font-size: 12px;
+        }
+    }
+}
 </style>
\ No newline at end of file
diff --git a/FlowerGully/src/views/Sales/index.vue b/FlowerGully/src/views/Sales/index.vue
index e9b2870d308df8423c68db0d02bb9baa9ba56c1a..ce60f99250af997afea7ca28d25f846e40826e3c 100644
--- a/FlowerGully/src/views/Sales/index.vue
+++ b/FlowerGully/src/views/Sales/index.vue
@@ -1,6 +1,418 @@
 <template>
-    <div>
-        销售管理
+    <div class="boder">
+        <h6 class="title">
+            <span class="span1">智能灌溉</span> &nbsp;<div class="span2">INTELLIGENT IRRIGATION</div>
+        </h6>
+        <div class="body">
+            <div class="box">
+                <div class="bt">
+                    <span><img src="@/assets/allimg/归档/切图/智能灌溉/温室、大棚.png" alt=""></span>
+                    <span>大棚4号</span>
+                </div>
+                <div>
+                    <img src="" alt="" style="width:338px;height:228px;">
+                </div>
+                <div class="red">
+                    <div class="tem1">
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 17.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">温度</span>
+                            </div>
+                            <div style="color:#01e4e5">36</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 16.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">湿度</span>
+                            </div>
+                            <div style="color:#01e4e5">40</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 15.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">光照</span>
+                            </div>
+                            <div style="color:#01e4e5">32</div>
+                        </div>
+                        <div class="tem-a" style="border-right:none">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/土壤湿度.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">土壤</span>
+                            </div>
+                            <div style="color:#01e4e5">34</div>
+                        </div>
+                    </div>
+                    <div class="tem2">
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/暖通.png" alt=""></div>
+                            <div>卷帘</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/水浸.png" alt=""></div>
+                            <div>滴灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/排烟管.png" alt=""></div>
+                            <div>风扇</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/喷淋.png" alt=""></div>
+                            <div>喷灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/照明.png" alt=""></div>
+                            <div>灯光</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="box">
+                <div class="bt">
+                    <span><img src="@/assets/allimg/归档/切图/智能灌溉/温室、大棚.png" alt=""></span>
+                    <span>大棚4号</span>
+                </div>
+                <div>
+                    <img src="" alt="" style="width:338px;height:228px;">
+                </div>
+                <div class="red">
+                    <div class="tem1">
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 17.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">温度</span>
+                            </div>
+                            <div style="color:#01e4e5">36</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 16.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">湿度</span>
+                            </div>
+                            <div style="color:#01e4e5">40</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 15.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">光照</span>
+                            </div>
+                            <div style="color:#01e4e5">32</div>
+                        </div>
+                        <div class="tem-a" style="border-right:none">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/土壤湿度.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">土壤</span>
+                            </div>
+                            <div style="color:#01e4e5">34</div>
+                        </div>
+                    </div>
+                    <div class="tem2">
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/暖通.png" alt=""></div>
+                            <div>卷帘</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/水浸.png" alt=""></div>
+                            <div>滴灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/排烟管.png" alt=""></div>
+                            <div>风扇</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/喷淋.png" alt=""></div>
+                            <div>喷灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/照明.png" alt=""></div>
+                            <div>灯光</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="box">
+                <div class="bt">
+                    <span><img src="@/assets/allimg/归档/切图/智能灌溉/温室、大棚.png" alt=""></span>
+                    <span>大棚4号</span>
+                </div>
+                <div>
+                    <img src="" alt="" style="width:338px;height:228px;">
+                </div>
+                <div class="red">
+                    <div class="tem1">
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 17.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">温度</span>
+                            </div>
+                            <div style="color:#01e4e5">36</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 16.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">湿度</span>
+                            </div>
+                            <div style="color:#01e4e5">40</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 15.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">光照</span>
+                            </div>
+                            <div style="color:#01e4e5">32</div>
+                        </div>
+                        <div class="tem-a" style="border-right:none">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/土壤湿度.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">土壤</span>
+                            </div>
+                            <div style="color:#01e4e5">34</div>
+                        </div>
+                    </div>
+                    <div class="tem2">
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/暖通.png" alt=""></div>
+                            <div>卷帘</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/水浸.png" alt=""></div>
+                            <div>滴灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/排烟管.png" alt=""></div>
+                            <div>风扇</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/喷淋.png" alt=""></div>
+                            <div>喷灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/照明.png" alt=""></div>
+                            <div>灯光</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="box">
+                <div class="bt">
+                    <span><img src="@/assets/allimg/归档/切图/智能灌溉/温室、大棚.png" alt=""></span>
+                    <span>大棚4号</span>
+                </div>
+                <div>
+                    <img src="" alt="" style="width:338px;height:228px;">
+                </div>
+                <div class="red">
+                    <div class="tem1">
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 17.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">温度</span>
+                            </div>
+                            <div style="color:#01e4e5">36</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 16.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">湿度</span>
+                            </div>
+                            <div style="color:#01e4e5">40</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 15.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">光照</span>
+                            </div>
+                            <div style="color:#01e4e5">32</div>
+                        </div>
+                        <div class="tem-a" style="border-right:none">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/土壤湿度.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">土壤</span>
+                            </div>
+                            <div style="color:#01e4e5">34</div>
+                        </div>
+                    </div>
+                    <div class="tem2">
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/暖通.png" alt=""></div>
+                            <div>卷帘</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/水浸.png" alt=""></div>
+                            <div>滴灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/排烟管.png" alt=""></div>
+                            <div>风扇</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/喷淋.png" alt=""></div>
+                            <div>喷灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/照明.png" alt=""></div>
+                            <div>灯光</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="box">
+                <div class="bt">
+                    <span><img src="@/assets/allimg/归档/切图/智能灌溉/温室、大棚.png" alt=""></span>
+                    <span>大棚4号</span>
+                </div>
+                <div>
+                    <img src="" alt="" style="width:338px;height:228px;">
+                </div>
+                <div class="red">
+                    <div class="tem1">
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 17.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">温度</span>
+                            </div>
+                            <div style="color:#01e4e5">36</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 16.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">湿度</span>
+                            </div>
+                            <div style="color:#01e4e5">40</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 15.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">光照</span>
+                            </div>
+                            <div style="color:#01e4e5">32</div>
+                        </div>
+                        <div class="tem-a" style="border-right:none">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/土壤湿度.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">土壤</span>
+                            </div>
+                            <div style="color:#01e4e5">34</div>
+                        </div>
+                    </div>
+                    <div class="tem2">
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/暖通.png" alt=""></div>
+                            <div>卷帘</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/水浸.png" alt=""></div>
+                            <div>滴灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/排烟管.png" alt=""></div>
+                            <div>风扇</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/喷淋.png" alt=""></div>
+                            <div>喷灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/照明.png" alt=""></div>
+                            <div>灯光</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="box">
+                <div class="bt">
+                    <span><img src="@/assets/allimg/归档/切图/智能灌溉/温室、大棚.png" alt=""></span>
+                    <span>大棚4号</span>
+                </div>
+                <div>
+                    <img src="" alt="" style="width:338px;height:228px;">
+                </div>
+                <div class="red">
+                    <div class="tem1">
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 17.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">温度</span>
+                            </div>
+                            <div style="color:#01e4e5">36</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 16.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">湿度</span>
+                            </div>
+                            <div style="color:#01e4e5">40</div>
+                        </div>
+                        <div class="tem-a">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/编组 15.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">光照</span>
+                            </div>
+                            <div style="color:#01e4e5">32</div>
+                        </div>
+                        <div class="tem-a" style="border-right:none">
+                            <div style="display: flex;justify-content: center;">
+                                <img src="@/assets/allimg/归档/切图/智能灌溉/土壤湿度.png" alt=""><span
+                                    style="margin-top: 1px;color:#fff">土壤</span>
+                            </div>
+                            <div style="color:#01e4e5">34</div>
+                        </div>
+                    </div>
+                    <div class="tem2">
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/暖通.png" alt=""></div>
+                            <div>卷帘</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/水浸.png" alt=""></div>
+                            <div>滴灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/排烟管.png" alt=""></div>
+                            <div>风扇</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/喷淋.png" alt=""></div>
+                            <div>喷灌</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                        <div class="tem-b">
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/照明.png" alt=""></div>
+                            <div>灯光</div>
+                            <div><img src="@/assets/allimg/归档/切图/智能灌溉/开关备份.png" alt=""></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
     </div>
 </template>
 
@@ -10,4 +422,116 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped></style>
\ No newline at end of file
+<style lang="scss" scoped>
+.boder {
+    width: 100%;
+    height: 596px;
+    padding: 10px;
+    overflow: auto;
+    background-image: url('~@/assets/allimg/归档/切图/编组 10.png');
+}
+
+.title {
+    width: 296px;
+    height: 30px;
+    margin: 20px;
+    border-bottom: 1px solid #ccc;
+    background: url('~@/assets/allimg/归档/切图/产品溯源/编组 9备份 7.png');
+    background-size: 300px 30px;
+}
+
+.span1 {
+    color: #fff;
+    line-height: 24px;
+    margin-left: 14px;
+}
+
+.span2 {
+    color: #7a83aa;
+    display: inline-block;
+    font-size: 10px;
+    transform: scale(0.83333);
+    transform-origin: 0 0;
+    white-space: nowrap;
+}
+
+.body {
+    width: 100%;
+    height: 900px;
+    display: flex;
+    justify-content: space-around;
+    flex-flow: row wrap;
+}
+
+.box {
+    width: 358px;
+    height: 400px;
+    background-image: url("~@/assets/allimg/归档/切图/智能灌溉/矩形备份 41 2.png");
+    background-size: 358px 400px;
+    margin: 10px;
+    padding: 10px;
+}
+
+.bt {
+    display: flex;
+    justify-content: left;
+
+    span {
+        color: #fff;
+        line-height: 26px;
+        font-size: 12px;
+        margin-right: 5px;
+    }
+}
+
+.tem1 {
+    width: 100%;
+    height: 40px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .tem-a {
+        width: 25%;
+        height: 32px;
+        font-size: 12px;
+        text-align: center;
+        line-height: 18px;
+        border-right: 1px solid #2b4654;
+        // background-color: green;
+    }
+}
+
+.tem2 {
+    width: 100%;
+    height: 60px;
+    display: flex;
+    justify-content: space-between;
+    flex-flow: row wrap;
+
+    .tem-b {
+        width: 84px;
+        height: 38px;
+        padding: 10px 10px 0 10px;
+        background-image: url('~@/assets/allimg/归档/切图/智能灌溉/矩形备份 43.png');
+        background-size: 89px 45px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        color: #fff;
+        font-size: 10px;
+        transform: scale(0.83333);
+        transform-origin: 0 0;
+        white-space: nowrap;
+
+        div {
+            margin: 0 1px;
+        }
+    }
+}
+
+.red {
+    width: 338px;
+    height: 120px;
+}
+</style>
\ No newline at end of file