From 7ab64112ecc627ecfda4a3a9c020ffceec93700f Mon Sep 17 00:00:00 2001
From: nbgnb <12862071+nbgnb@user.noreply.gitee.com>
Date: Sat, 15 Jul 2023 16:03:51 +0800
Subject: [PATCH 1/2] 11

---
 .../src/views/Equipment/VideoMonitoring.vue   |   1 -
 .../src/views/ParkPanoramicVR/index.vue       | 157 +++++++++++++++++-
 2 files changed, 156 insertions(+), 2 deletions(-)

diff --git a/FlowerGully/src/views/Equipment/VideoMonitoring.vue b/FlowerGully/src/views/Equipment/VideoMonitoring.vue
index 57582db..a912907 100644
--- a/FlowerGully/src/views/Equipment/VideoMonitoring.vue
+++ b/FlowerGully/src/views/Equipment/VideoMonitoring.vue
@@ -275,7 +275,6 @@ export default {
 
 ::v-deep .el-input__inner {
     background-color: transparent !important;
-
     height: 40px;
 }
 
diff --git a/FlowerGully/src/views/ParkPanoramicVR/index.vue b/FlowerGully/src/views/ParkPanoramicVR/index.vue
index 6566647..ab7f5e0 100644
--- a/FlowerGully/src/views/ParkPanoramicVR/index.vue
+++ b/FlowerGully/src/views/ParkPanoramicVR/index.vue
@@ -3,13 +3,103 @@
         <div class="title">
             <div class="title-l"><span class="span1">农产品质量安全追溯平台</span> &nbsp;<div class="span2">PRODUCT TRACEABILITY</div>
             </div>
-            <div class="title-r"></div>
+            <div class="title-r">
+                <el-input placeholder="请输入内容" v-model="input" class="input-with-select">
+                    <el-button slot="append">搜索</el-button>
+                </el-input>
+            </div>
+        </div>
+        <div class=" body">
+            <div class="box">
+                <div class="box-left">
+                    <img src="" alt="">
+                </div>
+                <div class="box-right">
+                    <p style="margin-top:0">漫江红 宁红龙须茶12粒礼盒装</p>
+                    <p class="p">生产厂家：江西省宁红有限责任公司</p>
+                    <p class="p">溯源次数：514次</p>
+                    <el-button type="primary"
+                        style="width: 160px;height: 30px;line-height: 6px;background: #00a1fa;">主要按钮</el-button>
+                </div>
+            </div>
+            <div class="box">
+                <div class="box-left">
+                    <img src="" alt="">
+                </div>
+                <div class="box-right">
+                    <p style="margin-top:0">漫江红 宁红龙须茶12粒礼盒装</p>
+                    <p class="p">生产厂家：江西省宁红有限责任公司</p>
+                    <p class="p">溯源次数：514次</p>
+                    <el-button type="primary"
+                        style="width: 160px;height: 30px;line-height: 6px;background: #00a1fa;">主要按钮</el-button>
+                </div>
+            </div>
+            <div class="box">
+                <div class="box-left">
+                    <img src="" alt="">
+                </div>
+                <div class="box-right">
+                    <p style="margin-top:0">漫江红 宁红龙须茶12粒礼盒装</p>
+                    <p class="p">生产厂家：江西省宁红有限责任公司</p>
+                    <p class="p">溯源次数：514次</p>
+                    <el-button type="primary"
+                        style="width: 160px;height: 30px;line-height: 6px;background: #00a1fa;">主要按钮</el-button>
+                </div>
+            </div>
+            <div class="box">
+                <div class="box-left">
+                    <img src="" alt="">
+                </div>
+                <div class="box-right">
+                    <p style="margin-top:0">漫江红 宁红龙须茶12粒礼盒装</p>
+                    <p class="p">生产厂家：江西省宁红有限责任公司</p>
+                    <p class="p">溯源次数：514次</p>
+                    <el-button type="primary"
+                        style="width: 160px;height: 30px;line-height: 6px;background: #00a1fa;">主要按钮</el-button>
+                </div>
+            </div>
+            <div class="box">
+                <div class="box-left">
+                    <img src="" alt="">
+                </div>
+                <div class="box-right">
+                    <p style="margin-top:0">漫江红 宁红龙须茶12粒礼盒装</p>
+                    <p class="p">生产厂家：江西省宁红有限责任公司</p>
+                    <p class="p">溯源次数：514次</p>
+                    <el-button type="primary"
+                        style="width: 160px;height: 30px;line-height: 6px;background: #00a1fa;">主要按钮</el-button>
+                </div>
+            </div>
+            <div class="box">
+                <div class="box-left">
+                    <img src="" alt="">
+                </div>
+                <div class="box-right">
+                    <p style="margin-top:0">漫江红 宁红龙须茶12粒礼盒装</p>
+                    <p class="p">生产厂家：江西省宁红有限责任公司</p>
+                    <p class="p">溯源次数：514次</p>
+                    <el-button type="primary"
+                        style="width: 160px;height: 30px;line-height: 6px;background: #00a1fa;">主要按钮</el-button>
+                </div>
+            </div>
+        </div>
+        <div class="botton">
+            <div class="botton-left">产品数：34 企业数：23 溯源查看数：10975</div>
+            <div class="botton-right">
+                <el-pagination background layout="prev, pager, next" :total="1000" style="opacity:0.8;margin-top: 10px;">
+                </el-pagination>
+            </div>
         </div>
     </div>
 </template>
 
 <script>
 export default {
+    data() {
+        return {
+            input: ''
+        }
+    }
 
 }
 </script>
@@ -23,6 +113,12 @@ export default {
     background-image: url('~@/assets/allimg/归档/切图/编组 10.png');
 }
 
+::v-deep .el-input__inner {
+    background-color: transparent !important;
+    border: 1px solid #044bb6;
+    height: 40px;
+}
+
 .title {
     width: 100%;
     display: flex;
@@ -53,5 +149,64 @@ export default {
             white-space: nowrap;
         }
     }
+
+    .title-r {
+        margin-right: 20px;
+    }
+}
+
+.body {
+    width: 100%;
+    height: 488px;
+    display: flex;
+    justify-content: space-around;
+    flex-flow: row wrap;
+
+
+    .box {
+        width: 400px;
+        height: 228px;
+        background-image: url("~@/assets/allimg/归档/切图/产品溯源/编组 9.png");
+        background-size: 400px 228px;
+        margin: 10px;
+        padding: 30px 20px;
+        display: flex;
+        justify-content: space-between;
+
+        .box-left {
+            width: 45%;
+            background: #000;
+        }
+
+        .box-right {
+            width: 55%;
+            font-size: 13px;
+            padding-left: 10px;
+            color: #fff;
+
+            .p {
+                margin: 20px 0;
+                font-size: 10px;
+                color: #9aa3b0;
+                transform: scale(0.83333);
+                transform-origin: 0 0;
+                white-space: nowrap;
+            }
+        }
+    }
+}
+
+.botton {
+    width: 100%;
+    height: 40px;
+
+    display: flex;
+    justify-content: space-between;
+
+    .botton-left {
+        line-height: 40px;
+        color: #fff;
+        padding: 0 20px;
+    }
 }
 </style>
\ No newline at end of file
-- 
Gitee


From db4c2200b5988c4fc41f0f0c889efd4328e7e811 Mon Sep 17 00:00:00 2001
From: nbgnb <12862071+nbgnb@user.noreply.gitee.com>
Date: Mon, 17 Jul 2023 14:38:45 +0800
Subject: [PATCH 2/2] 11

---
 FlowerGully/package.json                     |  1 +
 FlowerGully/src/main.js                      |  2 +
 FlowerGully/src/views/GreenhouseVR/index.vue | 39 +++++++++++++++++++-
 3 files changed, 41 insertions(+), 1 deletion(-)

diff --git a/FlowerGully/package.json b/FlowerGully/package.json
index ccba1d5..ab62f4d 100644
--- a/FlowerGully/package.json
+++ b/FlowerGully/package.json
@@ -16,6 +16,7 @@
   "dependencies": {
     "axios": "^0.18.1",
     "core-js": "3.6.5",
+    "echarts": "^5.4.2",
     "element-ui": "2.13.2",
     "js-cookie": "2.2.0",
     "normalize.css": "7.0.0",
diff --git a/FlowerGully/src/main.js b/FlowerGully/src/main.js
index 4df3557..8f2225c 100644
--- a/FlowerGully/src/main.js
+++ b/FlowerGully/src/main.js
@@ -17,6 +17,8 @@ if (process.env.NODE_ENV === 'production') {
   const { mockXHR } = require('../mock')
   mockXHR()
 }
+import echarts from 'echarts'
+Vue.prototype.$echarts = echarts
 Vue.prototype.$axios = axios
 Vue.config.productionTip = false
 //配置请求的基准地址
diff --git a/FlowerGully/src/views/GreenhouseVR/index.vue b/FlowerGully/src/views/GreenhouseVR/index.vue
index 3896475..734a0e4 100644
--- a/FlowerGully/src/views/GreenhouseVR/index.vue
+++ b/FlowerGully/src/views/GreenhouseVR/index.vue
@@ -36,17 +36,27 @@
                 <h6 class="right-title">
                     <span class="span1">丝瓜价格指数变化趋势</span> &nbsp;<div class="span2">CHANGE TREND OF PRICE INDEX</div>
                 </h6>
+                <div ref="myDiv" class="radar-echart" />
             </div>
         </div>
         <div class="button">
             <h6 class="button-title">
-                <span class="span1">丝瓜价格指数变化趋势</span> &nbsp;<div class="span2">CHANGE TREND OF PRICE INDEX</div>
+                <span class="span1">2022年各省市综合价格分布趋势</span> &nbsp;<div class="span2">DISTRIBUTION TREND OF COMPREHENSIVE
+                    PRICES OF PROVINCES AND CITIES IN 2022</div>
             </h6>
         </div>
     </div>
 </template>
 
 <script>
+// import echarts from 'echarts'
+// 完成加载过程
+var echarts = require('echarts/lib/echarts') // 引入echarts主模块
+require('echarts/lib/chart/radar') // 引入雷达图
+
+// 引入提示框和标题组件
+require('echarts/lib/component/tooltip')
+require('echarts/lib/component/title')
 export default {
     data() {
         return {
@@ -57,9 +67,31 @@ export default {
         addbg() {
             console.log(this.row);
         }
+    },
+    mounted() {
+        const myChart = echarts.init(this.$refs.myDiv) // 得到图表实例
+        myChart.setOption({
+            xAxis: {
+                type: 'category',
+                boundaryGap: false,
+                data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+            },
+            yAxis: {
+                type: 'value'
+            },
+            series: [
+                {
+                    data: [820, 932, 901, 934, 1290, 1330, 1320],
+                    type: 'line',
+                    areaStyle: {}
+                }
+            ]
+        })
+
     }
 
 }
+
 </script>
 
 <style lang="scss" scoped>
@@ -179,6 +211,11 @@ export default {
             background-image: url('~@/assets/allimg/归档/切图/价格指数/编组 9备份 11.png');
             background-size: 420px 38px;
         }
+
+        .radar-echart {
+            width: 420px;
+            height: 200px;
+        }
     }
 }
 
-- 
Gitee