feat: 水肥功能的开发

components/Draw/comps/panel.vue

@@ -1,6 +1,11 @@
 <template>
   <div class="my-panel">
-    <el-button v-show="reIdentify" class="resetPest" @click="resetPest" size="small" type="primary"
+    <el-button
+      v-show="reIdentify"
+      class="resetPest"
+      @click="resetPest"
+      size="small"
+      type="primary"
       >重新识别</el-button
     >
     <el-tabs type="border-card" class="infoCard">
@@ -24,58 +29,58 @@ export default {
   props: {
     rectangles: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     reIdentify: {
       type: Boolean,
-      default: true
+      default: true,
     },
     title: {
       type: String,
-      default: '目录'
-    }
+      default: '目录',
+    },
   },
   data() {
-    return {}
+    return {};
   },
   computed: {
     pestObj() {
-      let obj = {}
-      this.rectangles.forEach(item => {
+      let obj = {};
+      this.rectangles.forEach((item) => {
         if (obj[item.text]) {
-          obj[item.text]++
+          obj[item.text]++;
         } else {
-          obj[item.text] = 1
+          obj[item.text] = 1;
         }
-      })
-      return obj
-    }
+      });
+      return obj;
+    },
   },
   created() {},
   mounted() {
-    let obj = {}
-    this.rectangles.forEach(item => {
+    let obj = {};
+    this.rectangles.forEach((item) => {
       if (obj[item.text]) {
-        obj[item.text]++
+        obj[item.text]++;
       } else {
-        obj[item.text] = 0
+        obj[item.text] = 0;
       }
-    })
-    console.log('子组件mounted', obj)
+    });
+    console.log('子组件mounted', obj);
   },
   watch: {},
   methods: {
     resetPest() {
       // 通知业务上层处理逻辑
-      this.$emit('resetPest')
-    }
+      this.$emit('resetPest');
+    },
   },
-  components: {}
-}
+  components: {},
+};
 </script>
 
 <style scoped lang="less">
-/deep/ .custom-ffffff .el-tabs--border-card {
+::v-deep .custom-ffffff .el-tabs--border-card {
   box-shadow: none;
 }
 .my-panel {
@@ -95,7 +100,7 @@ export default {
   box-sizing: border-box;
   // box-shadow: none !important;
   border: 1px solid #e4e7ed;
-  /deep/ .el-tabs__content {
+  ::v-deep .el-tabs__content {
     height: calc(100% - 70px);
     overflow: auto;
     padding: 14px 0 !important;

components/Draw/index.vue

@@ -1,14 +1,13 @@
 <template>
   <div class="canvas-container" ref="canvasContainer">
-    <div
-      class="canvas float-left"
-      ref="yfcontainer"
-      v-loading="loading"
-    >
+    <div class="canvas float-left" ref="yfcontainer" v-loading="loading">
       <!-- 画布 -->
       <canvas
-        :style="{width: canvasSize.width + 'px', height: canvasSize.height + 'px'}"
-		canvas-id="yfCanvas" 
+        :style="{
+          width: canvasSize.width + 'px',
+          height: canvasSize.height + 'px',
+        }"
+        canvas-id="yfCanvas"
         id="yfCanvas"
       ></canvas>
       <!-- 文本标签 -->
@@ -24,82 +23,81 @@
         </span>
       </div> -->
     </div>
-
   </div>
 </template>
 
 <script>
-import Panel from './comps/panel.vue'
-import Tools from './comps/tools.vue'
-import Annotation from './comps/Annotation.vue'
-let myRatio = 1
+import Panel from './comps/panel.vue';
+import Tools from './comps/tools.vue';
+import Annotation from './comps/Annotation.vue';
+let myRatio = 1;
 export default {
   props: {
     markItem: {
       type: Object,
       default: () => ({
         addr: 'https://bigdata-image.oss-cn-hangzhou.aliyuncs.com/Basics/cbd/666000000000001/2025/7/11/001.jpg',
-		mark:[],
-		is_mark:0,
-		label: "[{'71': [480, 47, 520, 91, 1.0]}, {'71': [513, 102, 545, 155, 1.0]}, {'71': [690, 238, 740, 272, 1.0]}, {'71': [298, 471, 335, 514, 1.0]}, {'71': [250, 379, 300, 407, 1.0]}, {'71': [106, 40, 143, 89, 1.0]}, {'71': [46, 12, 124, 58, 0.99]}, {'71': [2, 90, 41, 133, 0.98]}, {'71': [767, 189, 799, 237, 0.98]}, {'71': [721, 175, 758, 216, 0.92]}, {'71': [685, 132, 727, 166, 0.35]}]",
-	  })
+        mark: [],
+        is_mark: 0,
+        label:
+          "[{'71': [480, 47, 520, 91, 1.0]}, {'71': [513, 102, 545, 155, 1.0]}, {'71': [690, 238, 740, 272, 1.0]}, {'71': [298, 471, 335, 514, 1.0]}, {'71': [250, 379, 300, 407, 1.0]}, {'71': [106, 40, 143, 89, 1.0]}, {'71': [46, 12, 124, 58, 0.99]}, {'71': [2, 90, 41, 133, 0.98]}, {'71': [767, 189, 799, 237, 0.98]}, {'71': [721, 175, 758, 216, 0.92]}, {'71': [685, 132, 727, 166, 0.35]}]",
+      }),
     },
     isInitFullScreen: {
       type: Boolean,
-      default: false
+      default: false,
     },
     reIdentify: {
       type: Boolean,
-      default: true
+      default: true,
     },
     title: {
       type: String,
-      default: '目录'
+      default: '目录',
     },
 
     typeName: {
       type: Number,
-      default: 1 // 1: 测报灯  2：病虫害可视监测 3：吸虫塔 4：孢子仪
-    }
+      default: 1, // 1: 测报灯  2：病虫害可视监测 3：吸虫塔 4：孢子仪
+    },
   },
   watch: {
     markItem: {
       handler(newVal) {
-        console.log('markItem变化:', newVal, this.ctx)
+        console.log('markItem变化:', newVal, this.ctx);
         // 当markItem变化时，重新加载图片和标注
         if (!newVal.addr && this.ctx) {
-          this.clearCanvas()
-          return
+          this.clearCanvas();
+          return;
         }
         if (this.ctx) {
-          this.loadImage()
+          this.loadImage();
         }
       },
-      deep: true
-    }
+      deep: true,
+    },
   },
   components: {
     Panel,
     Tools,
-    Annotation
+    Annotation,
   },
   name: 'Draw',
   computed: {
     inputStyle() {
       return {
         left: `${this.inputPosition.x}px`,
-        top: `${this.inputPosition.y}px`
-      }
+        top: `${this.inputPosition.y}px`,
+      };
     },
     canvasStyle() {
       return {
-        cursor: this.mode === 'draw' ? 'crosshair' : 'grab'
-      }
+        cursor: this.mode === 'draw' ? 'crosshair' : 'grab',
+      };
     },
     fullScreenHtml() {
-      return this.$refs.canvasContainer
-    }
-    
+      return this.$refs.canvasContainer;
+    },
   },
   data() {
     return {
@@ -115,7 +113,7 @@ export default {
       modeLabels: {
         draw: 'D绘制',
         drag: 'S拖拽',
-        select: '空格选择'
+        select: '空格选择',
       },
       isDragging: false,
       isDrawing: false,
@@ -147,299 +145,301 @@ export default {
       colorIndex: 0,
       originDataLength: 0, // 用于记录原始数据长度
       pestLibrary: {},
-	  canvasSize:{width:310,height:279}
-    }
+      canvasSize: { width: 310, height: 279 },
+    };
   },
   created() {
-    this.getAllPestList()
+    this.getAllPestList();
   },
   mounted() {
     // console.log('初始化markItem:', this.markItem)
-	
-	uni.getSystemInfo({
-	  success: (res) => {
-	    this.canvasSize.width = res.windowWidth-(24*2+16*2)
-	  }
-	}) 
-	this.$nextTick(()=>{
-		
-	})
-  },
-  beforeDestroy() {
- 
+
+    uni.getSystemInfo({
+      success: (res) => {
+        this.canvasSize.width = res.windowWidth - (24 * 2 + 16 * 2);
+      },
+    });
+    this.$nextTick(() => {});
   },
+  beforeDestroy() {},
   methods: {
-
     // 切换上一个下一个
     changeItem(type) {
-  
-	  this.$emit('changeItem', { type: type, isFullScreen: this.isFullScreen })
+      this.$emit('changeItem', { type: type, isFullScreen: this.isFullScreen });
     },
     changeMode(modeType) {
-      this.mode = modeType
+      this.mode = modeType;
     },
 
     resetPest() {
       // 通知业务上层处理逻辑
-      this.exitFullScreen()
-      this.$emit('resetPest')
+      this.exitFullScreen();
+      this.$emit('resetPest');
     },
     // 查看原图
     checkImagePreview() {
-      this.$refs.imgPreview.click()
+      this.$refs.imgPreview.click();
     },
 
     linkStyle(tag) {
-      let x = Math.min(tag.startX, tag.endX)
-      let y = Math.min(tag.startY, tag.endY)
+      let x = Math.min(tag.startX, tag.endX);
+      let y = Math.min(tag.startY, tag.endY);
 
-      const top = y * this.scale + this.offsetY - 20 + 'px'
-      const left = x * this.scale + this.offsetX + 'px'
+      const top = y * this.scale + this.offsetY - 20 + 'px';
+      const left = x * this.scale + this.offsetX + 'px';
       return {
         top,
         left,
         color: tag.color,
-        'pointer-events': this.isMoving ? 'none' : 'auto'
-      }
+        'pointer-events': this.isMoving ? 'none' : 'auto',
+      };
     },
     initCanvas() {
-
-		this.ctx = uni.createCanvasContext('yfCanvas', this)
-      console.log(this.ctx)
-      this.loadImage()
-      
+      this.ctx = uni.createCanvasContext('yfCanvas', this);
+      console.log(this.ctx);
+      this.loadImage();
     },
 
     loadImage() {
       if (!this.markItem.addr) {
-        this.loading = false
-        return
+        this.loading = false;
+        return;
       }
 
-	  uni.getImageInfo({
-	    src: this.markItem.addr,
-	    success: (res) => {
-	  		this.imageLoaded = true
-	  		this.backgroundImage = res
-	  		this.originalImageSize = {
-	  		  width: this.backgroundImage.width,
-	  		  height: this.backgroundImage.height
-	  		}
-	  		this.rectangles = [] // 清除之前的标注
-	  		this.selectedRect = null
-	  		this.adjustImagePosition()
-	  		this.initMarkData()
-	  		this.draw()
-	  		this.loading = false
-	    },
-	    fail: (err) => {
-	      this.loading = false
-	      this.$message.error('图片加载失败')
-	    }
-	  })
-
+      uni.getImageInfo({
+        src: this.markItem.addr,
+        success: (res) => {
+          this.imageLoaded = true;
+          this.backgroundImage = res;
+          this.originalImageSize = {
+            width: this.backgroundImage.width,
+            height: this.backgroundImage.height,
+          };
+          this.rectangles = []; // 清除之前的标注
+          this.selectedRect = null;
+          this.adjustImagePosition();
+          this.initMarkData();
+          this.draw();
+          this.loading = false;
+        },
+        fail: (err) => {
+          this.loading = false;
+          this.$message.error('图片加载失败');
+        },
+      });
     },
 
     adjustImagePosition() {
-      if (!this.imageLoaded) return
+      if (!this.imageLoaded) return;
 
-      const canvas = this.canvasSize 
-      const canvasAspect = canvas.width / canvas.height
-      const imageAspect = this.originalImageSize.width / this.originalImageSize.height
+      const canvas = this.canvasSize;
+      const canvasAspect = canvas.width / canvas.height;
+      const imageAspect =
+        this.originalImageSize.width / this.originalImageSize.height;
 
       // 计算等比缩放的尺寸
       if (imageAspect > canvasAspect) {
-        this.imageScale = canvas.width / this.originalImageSize.width
+        this.imageScale = canvas.width / this.originalImageSize.width;
       } else {
-        this.imageScale = canvas.height / this.originalImageSize.height
+        this.imageScale = canvas.height / this.originalImageSize.height;
       }
       // this.imageScale = 0.8
       // 根据图片的宽度来定义缩放比例
       if (this.originalImageSize.width >= 5000) {
-        this.baseScale = 0.25
+        this.baseScale = 0.25;
       } else if (this.originalImageSize.width >= 4000) {
-        this.baseScale = 0.31
+        this.baseScale = 0.31;
       } else if (this.originalImageSize.width < 4000) {
-        this.baseScale = 0.4
+        this.baseScale = 0.4;
       }
       // 用来处理图片等比例显示
-      this.markScale = 1 - (this.baseScale - this.imageScale) / this.baseScale
+      this.markScale = 1 - (this.baseScale - this.imageScale) / this.baseScale;
       // 窗口大小改变的时候使用
-      myRatio = this.imageScale / this.lastImageScale
+      myRatio = this.imageScale / this.lastImageScale;
 
-      this.lastImageScale = this.imageScale
+      this.lastImageScale = this.imageScale;
       // 计算图片显示区域
       this.imageRect = {
         x: 0,
         y: 0,
         width: this.originalImageSize.width * this.imageScale,
-        height: this.originalImageSize.height * this.imageScale
-      }
+        height: this.originalImageSize.height * this.imageScale,
+      };
 
       // 初始位置居中
-      this.scale = 1
-      this.offsetX = (canvas.width - this.imageRect.width) / 2
-      this.offsetY = (canvas.height - this.imageRect.height) / 2
+      this.scale = 1;
+      this.offsetX = (canvas.width - this.imageRect.width) / 2;
+      this.offsetY = (canvas.height - this.imageRect.height) / 2;
     },
 
     isPointInImage(x, y) {
-      return x >= 0 && x <= this.imageRect.width && y >= 0 && y <= this.imageRect.height
+      return (
+        x >= 0 &&
+        x <= this.imageRect.width &&
+        y >= 0 &&
+        y <= this.imageRect.height
+      );
     },
     constrainRect(rect) {
       // 确保矩形完全在图片区域内
-      const startX = Math.max(0, Math.min(this.imageRect.width, rect.startX))
-      const startY = Math.max(0, Math.min(this.imageRect.height, rect.startY))
-      const endX = Math.max(0, Math.min(this.imageRect.width, rect.endX))
-      const endY = Math.max(0, Math.min(this.imageRect.height, rect.endY))
+      const startX = Math.max(0, Math.min(this.imageRect.width, rect.startX));
+      const startY = Math.max(0, Math.min(this.imageRect.height, rect.startY));
+      const endX = Math.max(0, Math.min(this.imageRect.width, rect.endX));
+      const endY = Math.max(0, Math.min(this.imageRect.height, rect.endY));
 
       return {
         ...rect,
         startX,
         startY,
         endX,
-        endY
-      }
+        endY,
+      };
     },
 
-
     handleLabelChange() {
-      this.draw()
+      this.draw();
     },
 
     getRectAt(x, y) {
       // 从后往前检查，这样最后绘制的矩形会优先被选中
       for (let i = this.rectangles.length - 1; i >= 0; i--) {
-        const rect = this.rectangles[i]
-        const left = Math.min(rect.startX, rect.endX)
-        const right = Math.max(rect.startX, rect.endX)
-        const top = Math.min(rect.startY, rect.endY)
-        const bottom = Math.max(rect.startY, rect.endY)
+        const rect = this.rectangles[i];
+        const left = Math.min(rect.startX, rect.endX);
+        const right = Math.max(rect.startX, rect.endX);
+        const top = Math.min(rect.startY, rect.endY);
+        const bottom = Math.max(rect.startY, rect.endY);
 
         if (x >= left && x <= right && y >= top && y <= bottom) {
-          return rect
+          return rect;
         }
       }
-      return null
+      return null;
     },
 
     deleteSelected() {
       if (this.selectedRect) {
-        this.deleteRect(this.selectedRect.id)
-        this.selectedRect = null
+        this.deleteRect(this.selectedRect.id);
+        this.selectedRect = null;
       }
     },
 
     deleteRect(id) {
-      this.rectangles = this.rectangles.filter(rect => rect.id !== id)
+      this.rectangles = this.rectangles.filter((rect) => rect.id !== id);
       if (this.selectedRect && this.selectedRect.id === id) {
-        this.selectedRect = null
+        this.selectedRect = null;
       }
-      this.showInput = false
-      this.currentRectId = null
-      this.draw()
+      this.showInput = false;
+      this.currentRectId = null;
+      this.draw();
     },
     deleteSpan(e, id) {
-      e.preventDefault()
-      e.stopPropagation()
-      this.isDrawing = false
-      this.deleteRect(id)
+      e.preventDefault();
+      e.stopPropagation();
+      this.isDrawing = false;
+      this.deleteRect(id);
     },
     clearCanvas() {
-      this.loading = false
-      this.imageLoaded = false
-      this.rectangles = []
-      this.selectedRect = null
-      this.showInput = false
-      this.currentRectId = null
-      const canvas = this.canvasSize
-      const ctx = this.ctx
+      this.loading = false;
+      this.imageLoaded = false;
+      this.rectangles = [];
+      this.selectedRect = null;
+      this.showInput = false;
+      this.currentRectId = null;
+      const canvas = this.canvasSize;
+      const ctx = this.ctx;
 
       // 清除画布
-      ctx.clearRect(0, 0, canvas.width, canvas.height)
+      ctx.clearRect(0, 0, canvas.width, canvas.height);
     },
     // 修改后的 draw 方法
     draw() {
-      const canvas = this.canvasSize
-      const ctx = this.ctx
+      const canvas = this.canvasSize;
+      const ctx = this.ctx;
 
       // 清除画布
-      ctx.clearRect(0, 0, canvas.width, canvas.height)
-	console.log(this.offsetX, this.offsetY)
-     // 保存当前状态
-     ctx.save()
-     
-     // 应用变换（缩放和平移）
-     ctx.translate(this.offsetX, this.offsetY)
-     ctx.scale(this.scale, this.scale)
-		
+      ctx.clearRect(0, 0, canvas.width, canvas.height);
+      console.log(this.offsetX, this.offsetY);
+      // 保存当前状态
+      ctx.save();
+
+      // 应用变换（缩放和平移）
+      ctx.translate(this.offsetX, this.offsetY);
+      ctx.scale(this.scale, this.scale);
+
       // 绘制背景图片（不再除以this.scale）
       if (this.imageLoaded && this.backgroundImage) {
-        const displayWidth = this.originalImageSize.width * this.imageScale
-        const displayHeight = this.originalImageSize.height * this.imageScale
+        const displayWidth = this.originalImageSize.width * this.imageScale;
+        const displayHeight = this.originalImageSize.height * this.imageScale;
         // ctx.imageSmoothingEnabled = true
         // ctx.imageSmoothingQuality = 'high'
-        ctx.drawImage(this.backgroundImage.path, 0, 0, displayWidth, displayHeight)
-		
-	  }
-	console.log('绘制：：',this.rectangles)
+        ctx.drawImage(
+          this.backgroundImage.path,
+          0,
+          0,
+          displayWidth,
+          displayHeight
+        );
+      }
+      console.log('绘制：：', this.rectangles);
       // 绘制所有已保存的矩形（添加约束）
-      this.rectangles.forEach(rect => {
-        const constrainedRect = this.constrainRect(rect)
-        this.drawRectangle(constrainedRect, rect === this.selectedRect)
-      })
+      this.rectangles.forEach((rect) => {
+        const constrainedRect = this.constrainRect(rect);
+        this.drawRectangle(constrainedRect, rect === this.selectedRect);
+      });
 
       // 绘制当前正在绘制的矩形（添加约束）
       if (this.currentRect) {
-        const constrainedRect = this.constrainRect(this.currentRect)
-        this.drawRectangle(constrainedRect, false)
+        const constrainedRect = this.constrainRect(this.currentRect);
+        this.drawRectangle(constrainedRect, false);
       }
-		
+
       // 恢复状态
-      ctx.restore()
-	  ctx.draw()
+      ctx.restore();
+      ctx.draw();
     },
 
     drawRectangle(rect, isSelected) {
-      const ctx = this.ctx
+      const ctx = this.ctx;
 
-      const x = Math.min(rect.startX, rect.endX)
-      const y = Math.min(rect.startY, rect.endY)
-      const width = Math.abs(rect.endX - rect.startX)
-      const height = Math.abs(rect.endY - rect.startY)
+      const x = Math.min(rect.startX, rect.endX);
+      const y = Math.min(rect.startY, rect.endY);
+      const width = Math.abs(rect.endX - rect.startX);
+      const height = Math.abs(rect.endY - rect.startY);
 
       // 绘制矩形填充
 
-      ctx.strokeStyle = rect.color
-      ctx.lineWidth = 2 / this.scale
-      ctx.strokeRect(x, y, width, height)
+      ctx.strokeStyle = rect.color;
+      ctx.lineWidth = 2 / this.scale;
+      ctx.strokeRect(x, y, width, height);
       // 绘制标签文本
       if (rect.text) {
-        ctx.fillStyle = rect.color
-        ctx.font = `${14 / this.scale}px Arial`
-        ctx.fillText(rect.text, x + 12 / this.scale, y - 6 / this.scale)
+        ctx.fillStyle = rect.color;
+        ctx.font = `${14 / this.scale}px Arial`;
+        ctx.fillText(rect.text, x + 12 / this.scale, y - 6 / this.scale);
       }
-	
-      
     },
 
     // 获取数据
     getData() {
-      const data = this.rectangles.map(rect => {
+      const data = this.rectangles.map((rect) => {
         return {
           startX: parseFloat((rect.startX / this.markScale).toFixed(2)),
           startY: parseFloat((rect.startY / this.markScale).toFixed(2)),
-          width: parseFloat((Math.abs(rect.startX - rect.endX) / this.markScale).toFixed(2)),
-          height: parseFloat((Math.abs(rect.startY - rect.endY) / this.markScale).toFixed(2)),
-          text: rect.text
-        }
-      })
-      this.originDataLength = data.length
-      return data
+          width: parseFloat(
+            (Math.abs(rect.startX - rect.endX) / this.markScale).toFixed(2)
+          ),
+          height: parseFloat(
+            (Math.abs(rect.startY - rect.endY) / this.markScale).toFixed(2)
+          ),
+          text: rect.text,
+        };
+      });
+      this.originDataLength = data.length;
+      return data;
       // return JSON.stringify(data)
     },
     // 处理渲染数据
     async initMarkData() {
-		
       const colorList = [
         '#FF0000',
         '#00FFC2',
@@ -456,25 +456,26 @@ export default {
         '#007880',
         '#00C2FF',
         '#C74C4C',
-        '#EB00FF'
-      ]
+        '#EB00FF',
+      ];
       if (this.markItem.is_mark === 0) {
         // 机器标注，取label
-        let aiLabel = []
+        let aiLabel = [];
         if (this.markItem.label) {
-          aiLabel = JSON.parse(this.markItem.label.replace(/'/g, '"'))
+          aiLabel = JSON.parse(this.markItem.label.replace(/'/g, '"'));
         }
-        this.rectangles = []
-		console.log('00000',aiLabel)
+        this.rectangles = [];
+        console.log('00000', aiLabel);
         aiLabel.forEach((item, index) => {
           for (let key in item) {
-            const [startX, startY, endX, endY] = item[key]
-            const text = this.pestLibrary[key]
+            const [startX, startY, endX, endY] = item[key];
+            const text = this.pestLibrary[key];
             if (!this.colorMap[text]) {
-              this.colorMap[text] = colorList[this.colorIndex % colorList.length]
-              this.colorIndex += 1
+              this.colorMap[text] =
+                colorList[this.colorIndex % colorList.length];
+              this.colorIndex += 1;
               if (this.colorIndex >= colorList.length) {
-                this.colorIndex = 0
+                this.colorIndex = 0;
               }
             }
             this.rectangles.push({
@@ -485,22 +486,22 @@ export default {
               endX: endX * this.imageScale,
               endY: endY * this.imageScale,
               color: this.colorMap[text],
-              imageScale: this.imageScale
-            })
+              imageScale: this.imageScale,
+            });
           }
-        })
-        this.originDataLength = this.rectangles.length
+        });
+        this.originDataLength = this.rectangles.length;
       } else {
         // 人工标注，取mark
-        console.log('this.colorIndex', this.colorIndex)
-        this.rectangles = []
+        console.log('this.colorIndex', this.colorIndex);
+        this.rectangles = [];
         this.markItem.mark.map((item, index) => {
-          const { startX, startY, width, height, text } = item
+          const { startX, startY, width, height, text } = item;
           if (!this.colorMap[text]) {
-            this.colorMap[text] = colorList[this.colorIndex % colorList.length]
-            this.colorIndex += 1
+            this.colorMap[text] = colorList[this.colorIndex % colorList.length];
+            this.colorIndex += 1;
             if (this.colorIndex >= colorList.length) {
-              this.colorIndex = 0
+              this.colorIndex = 0;
             }
           }
           this.rectangles.push({
@@ -508,39 +509,40 @@ export default {
             text: text,
             startX: Number(startX) * this.markScale,
             startY: Number(startY) * this.markScale,
-            endX: Number(startX) * this.markScale + Number(width) * this.markScale,
-            endY: Number(startY) * this.markScale + Number(height) * this.markScale,
+            endX:
+              Number(startX) * this.markScale + Number(width) * this.markScale,
+            endY:
+              Number(startY) * this.markScale + Number(height) * this.markScale,
             color: this.colorMap[text],
-            imageScale: this.imageScale
-          })
-        })
-        this.originDataLength = this.rectangles.length
+            imageScale: this.imageScale,
+          });
+        });
+        this.originDataLength = this.rectangles.length;
       }
-      console.log('原始rectangles', this.rectangles)
+      console.log('原始rectangles', this.rectangles);
     },
     // 保存标注
     saveLabel() {
-      this.$emit('saveLabel', this.getData())
+      this.$emit('saveLabel', this.getData());
     },
     async getAllPestList() {
-		const res = await this.$myRequest({
-			url: '/api/api_gateway?method=forecast.pest_info.pest_dict',
-			data: {
-				type_name: this.typeName
-			}
-		})
-		// console.log('获取到的病虫害数据', res)
-		this.pestLibrary = res
-		this.initCanvas()
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.pest_info.pest_dict',
+        data: {
+          type_name: this.typeName,
+        },
+      });
+      // console.log('获取到的病虫害数据', res)
+      this.pestLibrary = res;
+      this.initCanvas();
     },
- 
-  }
-}
+  },
+};
 </script>
 
 <style lang="less" scoped>
 @primary-color: #018b3f !important;
-/deep/ .el-button--primary {
+::v-deep .el-button--primary {
   background-color: @primary-color !important;
 }
 .canvas-container {

components/customCard/customCard.vue

@@ -0,0 +1,56 @@
+<template>
+  <view class="custom-card">
+    <view class="custom-card-header">
+      <view class="custom-card-action" @tap="BackPage">
+        <u-icon name="arrow-left" color="#333333" size="32rpx" />
+        <view class="custom-card-action-text">
+          <slot name="backText"></slot>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+export default {
+  name: 'custom-card',
+  props: {},
+  data() {
+    return {};
+  },
+  methods: {
+    BackPage() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.custom-card {
+  border-radius: 16upx;
+  opacity: 1;
+}
+
+.custom-card-header {
+  padding: 0 23upx;
+  height: 90rpx;
+  color: #333333;
+  font-size: 27upx;
+  font-weight: 600;
+  font-family: 'PingFang SC';
+  line-height: 44upx;
+  .custom-card-action {
+    display: flex;
+    align-items: center;
+    height: 90rpx;
+    line-height: 90rpx;
+    .custom-card-action-text {
+      width: 90%;
+      text-align: center;
+      color: #042118;
+      font-size: 34rpx;
+    }
+  }
+}
+</style>

main.js

@@ -1,63 +1,70 @@
-import Vue from 'vue'
-import App from './App'
-import uView from "uview-ui"
-Vue.use(uView)
-import {myRequest} from './util/api.js'
-Vue.prototype.$myRequest=myRequest
+import Vue from 'vue';
+import App from './App';
+import uView from 'uview-ui';
+Vue.use(uView);
+import { myRequest } from './util/api.js';
+Vue.prototype.$myRequest = myRequest;
 
+Vue.config.productionTip = false;
 
-Vue.config.productionTip = false
+App.mpType = 'app';
 
-App.mpType = 'app'
-
-Vue.prototype.$imghost = 'http://www.hnyfwlw.com:8006/projectimg' // 线上图片服务器路径常量
+Vue.prototype.$imghost = 'http://www.hnyfwlw.com:8006/projectimg'; // 线上图片服务器路径常量
 // http://www.hnyfwlw.com:8006/bigdata_app/image/10ca93e17420371a82826073c8425c0.png
-Vue.prototype.$appimghost = 'http://www.hnyfwlw.com:8006/bigdata_app'
+Vue.prototype.$appimghost = 'http://www.hnyfwlw.com:8006/bigdata_app';
 
-import config from "./util/neutral.js"
-Vue.prototype.$isneutral = config.isneutral
+import config from './util/neutral.js';
+Vue.prototype.$isneutral = config.isneutral;
 
-import {QueryPermission} from './util/QueryPermission.js'
+import { QueryPermission } from './util/QueryPermission.js';
 // Vue.use(QueryPermission)
 Vue.prototype.$QueryPermission = QueryPermission;
+// 自定义卡片
+import customCard from './components/customCard/customCard.vue';
+Vue.component('customCard', customCard);
+Vue.filter('timeFormat', function (time) {
+  function fun(a) {
+    return String(a).length == 1 ? '0' + a : a;
+  }
+  let date = new Date(time * 1000);
+  let y = date.getFullYear();
+  let m = date.getMonth() + 1;
+  let d = date.getDate();
+  let h = date.getHours();
+  let min = date.getMinutes();
+  let sec = date.getSeconds();
+  return `${y}-${fun(m)}-${fun(d)} ${fun(h)}:${fun(min)}:${fun(sec)}`;
+});
 
-Vue.filter('timeFormat',function(time){
-	function fun(a){
-		return	String(a).length==1?'0'+a: a
-	}
-	let date= new Date(time*1000)
-	let y=date.getFullYear()
-	let m=date.getMonth()+1
-	let d=date.getDate()
-	let h=date.getHours()
-	let min=date.getMinutes()
-	let sec=date.getSeconds()
-	return `${y}-${fun(m)}-${fun(d)} ${fun(h)}:${fun(min)}:${fun(sec)}`
-})
-
- Vue.prototype.formatTime = function (thistime,fmt = 'yyyy-MM-dd hh:mm:ss') {
-        let $this = new Date(thistime)
-        let o = {
-          'M+': $this.getMonth() + 1,
-          'd+': $this.getDate(),
-          'h+': $this.getHours(),
-          'm+': $this.getMinutes(),
-          's+': $this.getSeconds(),
-          'q+': Math.floor(($this.getMonth() + 3) / 3),
-          'S': $this.getMilliseconds()
-        }
-        if (/(y+)/.test(fmt)) {
-          fmt = fmt.replace(RegExp.$1, ($this.getFullYear() + '').substr(4 - RegExp.$1.length))
-        }
-        for (var k in o) {
-          if (new RegExp('(' + k + ')').test(fmt)) {
-            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
-          }
-        }
-        return fmt
-      }
+Vue.prototype.formatTime = function (thistime, fmt = 'yyyy-MM-dd hh:mm:ss') {
+  let $this = new Date(thistime);
+  let o = {
+    'M+': $this.getMonth() + 1,
+    'd+': $this.getDate(),
+    'h+': $this.getHours(),
+    'm+': $this.getMinutes(),
+    's+': $this.getSeconds(),
+    'q+': Math.floor(($this.getMonth() + 3) / 3),
+    S: $this.getMilliseconds(),
+  };
+  if (/(y+)/.test(fmt)) {
+    fmt = fmt.replace(
+      RegExp.$1,
+      ($this.getFullYear() + '').substr(4 - RegExp.$1.length)
+    );
+  }
+  for (var k in o) {
+    if (new RegExp('(' + k + ')').test(fmt)) {
+      fmt = fmt.replace(
+        RegExp.$1,
+        RegExp.$1.length === 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length)
+      );
+    }
+  }
+  return fmt;
+};
 
 const app = new Vue({
-    ...App
-})
-app.$mount()
+  ...App,
+});
+app.$mount();

package-lock.json

@@ -2,20 +2,6 @@
   "requires": true,
   "lockfileVersion": 1,
   "dependencies": {
-    "echarts": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/echarts/-/echarts-5.0.2.tgz",
-      "integrity": "sha512-En0VYpc96nw2/2AZoBWPHsGi471zMublttj50kfFpYAeR4geup0Tj9iVgEXh7QYZFPnRiruDJEjcB5PXZ+BYzQ==",
-      "requires": {
-        "tslib": "2.0.3",
-        "zrender": "5.0.4"
-      }
-    },
-    "highcharts": {
-      "version": "9.0.1",
-      "resolved": "https://registry.npmjs.org/highcharts/-/highcharts-9.0.1.tgz",
-      "integrity": "sha512-0UmcCz2RmFuqfT/Igu3h5sGnkeSqqZwfuYrTzJ/htptmJAo5SSxH62NFcTjVRk+3WstoBJmoXR0v5FVGQUzK5A=="
-    },
     "tslib": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.3.tgz",

pages/cb/cbd/equip-set/newhistoryfile.vue

@@ -371,7 +371,7 @@
 </script>
 
 <style lang="scss" scoped>
-	/deep/.u-calendar__action {
+	::v-deep .u-calendar__action {
 		display: flex;
 		justify-content: space-around;
 

pages/cb/cbd/equip-set/pestLine.vue

@@ -1,467 +1,487 @@
 <template>
-	<view>
-		<view class="title">虫情趋势矩阵图</view>
-		<view class="shuju_one">
-
-			<view class="canvastishi" v-if="!canvastishiTF && !dataloadingtf">
-				暂无数据
-			</view>
-			<view class="canvastishi" v-if="dataloadingtf">
-				<p class="dataloading">加载中</p>
-			</view>
-			<canvas v-show="canvastishiTF" canvas-id="canvasColumnB" id="canvasColumnB" class="charts"
-				@touchstart="touchLineA($event)" @touchmove="moveLineA($event)" @touchend="touchEndLineA($event)"
-				disable-scroll=true
-				:style="{'width':cWidth*pixelRatio+'px','height':cHeight*pixelRatio+'px', 'transform': 'scale('+(1/pixelRatio)+')','margin-left':-cWidth*(pixelRatio-1)/2+'px','margin-top':-cHeight*(pixelRatio-1)/2+'px'}"></canvas>
-		</view>
-		<view class="title">害虫排名</view>
-		<view class="shuju_one">
-
-			<view class="canvastishi" v-if="!canvastishiTF && !dataloadingtf">
-				暂无数据
-			</view>
-			<view class="canvastishi" v-if="dataloadingtf">
-				<p class="dataloading">加载中</p>
-			</view>
-			<canvas v-show="canvastishiTF" canvas-id="canvasColumnC" id="canvasColumnC" class="charts"
-				:style="{'width':cWidth*pixelRatio+'px','height':pestHeight*pixelRatio+'px', 'transform': 'scale('+(1/pixelRatio)+')','margin-left':-cWidth*(pixelRatio-1)/2+'px','margin-top':-cHeight*(pixelRatio-1)/2+'px'}"></canvas>
-		</view>
-
-	</view>
-
+  <view>
+    <view class="title">虫情趋势矩阵图</view>
+    <view class="shuju_one">
+      <view class="canvastishi" v-if="!canvastishiTF && !dataloadingtf">
+        暂无数据
+      </view>
+      <view class="canvastishi" v-if="dataloadingtf">
+        <p class="dataloading">加载中</p>
+      </view>
+      <canvas
+        v-show="canvastishiTF"
+        canvas-id="canvasColumnB"
+        id="canvasColumnB"
+        class="charts"
+        @touchstart="touchLineA($event)"
+        @touchmove="moveLineA($event)"
+        @touchend="touchEndLineA($event)"
+        disable-scroll="true"
+        :style="{
+          width: cWidth * pixelRatio + 'px',
+          height: cHeight * pixelRatio + 'px',
+          transform: 'scale(' + 1 / pixelRatio + ')',
+          'margin-left': (-cWidth * (pixelRatio - 1)) / 2 + 'px',
+          'margin-top': (-cHeight * (pixelRatio - 1)) / 2 + 'px',
+        }"
+      ></canvas>
+    </view>
+    <view class="title">害虫排名</view>
+    <view class="shuju_one">
+      <view class="canvastishi" v-if="!canvastishiTF && !dataloadingtf">
+        暂无数据
+      </view>
+      <view class="canvastishi" v-if="dataloadingtf">
+        <p class="dataloading">加载中</p>
+      </view>
+      <canvas
+        v-show="canvastishiTF"
+        canvas-id="canvasColumnC"
+        id="canvasColumnC"
+        class="charts"
+        :style="{
+          width: cWidth * pixelRatio + 'px',
+          height: pestHeight * pixelRatio + 'px',
+          transform: 'scale(' + 1 / pixelRatio + ')',
+          'margin-left': (-cWidth * (pixelRatio - 1)) / 2 + 'px',
+          'margin-top': (-cHeight * (pixelRatio - 1)) / 2 + 'px',
+        }"
+      ></canvas>
+    </view>
+  </view>
 </template>
 
 <script>
-	import uCharts from '../../../../components/js_sdk/u-charts/u-charts/u-charts.js';
-	let canvaColumnA = null;
-	let canvaColumnB = null;
-	const myColor = ['#FF5951', '#66EDED', '#E67B3E', '#6DE28B', '#FFC97A', '#E7EB4B', '#1561F3', '#FA73F5', '#159AFF',
-		'#FA73F5'
-	]
-	const temColor = ['#A2845E', '#018B3F', '#00C7BE']
-
-	export default {
-		data() {
-			return {
-
-				cWidth: '400',
-				cHeight: '400',
-				pixelRatio: 1,
-				canvastishiTF: false, //暂无数据提示
-				dataloadingtf: true, //加载中提示
-				pestHeight: '400',
-			}
-		},
-		props: {
-			start_time: {
-				type: String,
-				default: ''
-			},
-			end_time: {
-				type: String,
-				default: ''
-			},
-			device_type_id: {
-				type: String,
-				default: '35'
-			},
-			d_id: {
-				type: String,
-				default: 0
-			},
-			notify: {
-				type: Number,
-				default: 0
-			}
-		},
-		watch: {
-			notify: {
-				handler() {
-					this.pestLine()
-				}
-			}
-		},
-		computed: {
-
-		},
-		methods: {
-
-			async pestLine() { //害虫趋势折线图
-				this.dataloadingtf = true
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=new_gateway.photo_info.pest_order_and_char',
-					data: {
-						device_type_id: this.device_type_id,
-						id: this.d_id,
-						// device_type_id: 35,
-						// id: '11630161',
-						start: +new Date(this.start_time + ' 00:00:00') / 1000,
-						end: +new Date(this.end_time + ' 23:59:59') / 1000,
-						hour_st: '00',
-						hour_ed: '00'
-					}
-				})
-				this.dataloadingtf = false
-				const {
-					char_data,
-					pest_total,
-					at_ah_info: atah
-				} = res
-				console.log(res, '---------')
-				if (Object.keys(char_data).length == 0) {
-					this.canvastishiTF = false
-				} else {
-					this.canvastishiTF = true
-					
-					let arr1 = []
-					let arr2 = []
-					let arr3 = []
-					let xtitle = []
-					for (let i = 0; i < atah.length; i++) {
-						xtitle.push(this.formatTime(atah[i].addtime * 1000, 'yyyy-MM-dd'))
-						arr1.push(atah[i].height ? atah[i].height : 0)
-						arr2.push(atah[i].low ? atah[i].low : 0)
-						arr3.push(atah[i].ah ? atah[i].ah : 0)
-
-					}
-					// console.log(arr1)
-					let objList = [{
-						name: '高温',
-						data: arr1
-
-					}, {
-						name: '低温',
-						data: arr2
-					}, {
-						name: '湿度',
-						data: arr3
-					}]
-					Object.keys(char_data).forEach((item, index) => {
-						let countData = []
-						char_data[item].forEach((item1, index1) => {
-							countData.push(item1.sum)
-						})
-						let obj = {
-							name: item,
-
-							data: countData
-						}
-						objList.push(obj)
-					})
-
-					const pestName = Object.keys(pest_total)
-					const dataList = Object.values(pest_total).reverse().map((value, index) => {
-						let i = index % pestName.length
-						return {
-							value,
-							color: myColor[i]
-						}
-					})
-					const pestTotal = [{
-						name: '排名',
-						data: dataList
-					}]
-
-					this.showColumn("canvasColumnB", xtitle, objList)
-					this.showColumnBar("canvasColumnC", pestName.reverse(), pestTotal)
-				}
-			},
-
-
-			showColumn(id, xtitle, xinfo, yAxis) {
-				console.log(xinfo)
-				let _self = this
-				if (xinfo.length > 12) {
-					this.cHeight = xinfo.length * 15
-				}
-				// const canvas = document.getElementById(id);
-				// const ctx = canvas.getContext("2d");
-				const ctx = uni.createCanvasContext(id, this);
-				canvaColumnA = new uCharts({
-					context: ctx,
-					type: 'line',
-					legend: {
-						position: "top"
-					},
-					fontSize: 11,
-					background: '#FFFFFF',
-					pixelRatio: 1,
-					animation: true,
-					dataLabel: false,
-					categories: xtitle,
-					series: xinfo,
-					color: [...temColor, ...myColor],
-					enableScroll: true, //开启图表拖拽功能
-					xAxis: {
-						disableGrid: true,
-						type: 'grid',
-						gridType: 'dash',
-						itemCount: 4, //x轴单屏显示数据的数量，默认为5个
-						scrollShow: true, //新增是否显示滚动条，默认false
-						// scrollAlign: 'left', //滚动条初始位置
-						scrollBackgroundColor: '#F7F7FF', //默认为 #EFEBEF
-						scrollColor: '#DEE7F7', //默认为 #A6A6A6
-					},
-					yAxis: yAxis || {},
-					width: _self.cWidth * 1,
-					height: _self.cHeight * 1,
-					extra: {
-						line: {
-							type: 'curve'
-						}
-					}
-				});
-			},
-			showColumnBar(id, xtitle, xinfo) {
-				console.log(xtitle, xinfo)
-				let _self = this
-				if (xtitle.length > 12) {
-					this.pestHeight = xtitle.length * 20
-				}
-
-				const ctx = uni.createCanvasContext(id, this);
-				canvaColumnB = new uCharts({
-					context: ctx,
-					type: 'bar',
-
-					legend: {
-						show: false
-					},
-					padding: [5, 25, 5, 0],
-					fontSize: 11,
-					background: '#FFFFFF',
-					pixelRatio: 1,
-					animation: true,
-					// dataLabel: false,
-					categories: xtitle,
-					series: xinfo,
-					// enableScroll: true, //开启图表拖拽功能
-					xAxis: {
-						boundaryGap: "justify",
-						disableGrid: false,
-						axisLine: false
-					},
-					yAxis: {
-
-					},
-					width: _self.cWidth * 1,
-					height: _self.pestHeight * 1,
-					extra: {
-						bar: {
-							type: "group",
-							width: 30,
-
-							barBorderCircle: true,
-							seriesGap: 4,
-							categoryGap: 4
-						}
-					}
-				});
-			},
-			touchLineA(e) {
-				console.log(e)
-				canvaColumnA.scrollStart(e);
-			},
-			moveLineA(e) {
-				canvaColumnA.scroll(e);
-			},
-			touchEndLineA(e) {
-				canvaColumnA.scrollEnd(e);
-				//下面是toolTip事件，如果滚动后不需要显示，可不填写
-				canvaColumnA.showToolTip(e, {
-					format: function(item, category) {
-						return category + ' ' + item.name + ':' + item.data
-					}
-				});
-			},
-			touchLineB(e) {
-				console.log(e)
-				canvaColumnB.scrollStart(e);
-			},
-			moveLineB(e) {
-				canvaColumnB.scroll(e);
-			},
-			touchEndLineB(e) {
-				canvaColumnB.scrollEnd(e);
-
-			},
-		},
-		mounted() {
-			this.cWidth = uni.upx2px(650);
-			this.cHeight = uni.upx2px(500);
-			this.pestLine()
-			console.log('mounted')
-		},
-		onLoad() {
-			console.log('load')
-
-		},
-		onShow() {
-			console.log('show')
-		},
-
-	}
+import uCharts from '../../../../components/js_sdk/u-charts/u-charts/u-charts.js';
+let canvaColumnA = null;
+let canvaColumnB = null;
+const myColor = [
+  '#FF5951',
+  '#66EDED',
+  '#E67B3E',
+  '#6DE28B',
+  '#FFC97A',
+  '#E7EB4B',
+  '#1561F3',
+  '#FA73F5',
+  '#159AFF',
+  '#FA73F5',
+];
+const temColor = ['#A2845E', '#018B3F', '#00C7BE'];
+
+export default {
+  data() {
+    return {
+      cWidth: '400',
+      cHeight: '400',
+      pixelRatio: 1,
+      canvastishiTF: false, //暂无数据提示
+      dataloadingtf: true, //加载中提示
+      pestHeight: '400',
+    };
+  },
+  props: {
+    start_time: {
+      type: String,
+      default: '',
+    },
+    end_time: {
+      type: String,
+      default: '',
+    },
+    device_type_id: {
+      type: String,
+      default: '35',
+    },
+    d_id: {
+      type: String,
+      default: 0,
+    },
+    notify: {
+      type: Number,
+      default: 0,
+    },
+  },
+  watch: {
+    notify: {
+      handler() {
+        this.pestLine();
+      },
+    },
+  },
+  computed: {},
+  methods: {
+    async pestLine() {
+      //害虫趋势折线图
+      this.dataloadingtf = true;
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=new_gateway.photo_info.pest_order_and_char',
+        data: {
+          device_type_id: this.device_type_id,
+          id: this.d_id,
+          // device_type_id: 35,
+          // id: '11630161',
+          start: +new Date(this.start_time + ' 00:00:00') / 1000,
+          end: +new Date(this.end_time + ' 23:59:59') / 1000,
+          hour_st: '00',
+          hour_ed: '00',
+        },
+      });
+      this.dataloadingtf = false;
+      const { char_data, pest_total, at_ah_info: atah } = res;
+      console.log(res, '---------');
+      if (Object.keys(char_data).length == 0) {
+        this.canvastishiTF = false;
+      } else {
+        this.canvastishiTF = true;
+
+        let arr1 = [];
+        let arr2 = [];
+        let arr3 = [];
+        let xtitle = [];
+        for (let i = 0; i < atah.length; i++) {
+          xtitle.push(this.formatTime(atah[i].addtime * 1000, 'yyyy-MM-dd'));
+          arr1.push(atah[i].height ? atah[i].height : 0);
+          arr2.push(atah[i].low ? atah[i].low : 0);
+          arr3.push(atah[i].ah ? atah[i].ah : 0);
+        }
+        // console.log(arr1)
+        let objList = [
+          {
+            name: '高温',
+            data: arr1,
+          },
+          {
+            name: '低温',
+            data: arr2,
+          },
+          {
+            name: '湿度',
+            data: arr3,
+          },
+        ];
+        Object.keys(char_data).forEach((item, index) => {
+          let countData = [];
+          char_data[item].forEach((item1, index1) => {
+            countData.push(item1.sum);
+          });
+          let obj = {
+            name: item,
+
+            data: countData,
+          };
+          objList.push(obj);
+        });
+
+        const pestName = Object.keys(pest_total);
+        const dataList = Object.values(pest_total)
+          .reverse()
+          .map((value, index) => {
+            let i = index % pestName.length;
+            return {
+              value,
+              color: myColor[i],
+            };
+          });
+        const pestTotal = [
+          {
+            name: '排名',
+            data: dataList,
+          },
+        ];
+
+        this.showColumn('canvasColumnB', xtitle, objList);
+        this.showColumnBar('canvasColumnC', pestName.reverse(), pestTotal);
+      }
+    },
+
+    showColumn(id, xtitle, xinfo, yAxis) {
+      console.log(xinfo);
+      let _self = this;
+      if (xinfo.length > 12) {
+        this.cHeight = xinfo.length * 15;
+      }
+      // const canvas = document.getElementById(id);
+      // const ctx = canvas.getContext("2d");
+      const ctx = uni.createCanvasContext(id, this);
+      canvaColumnA = new uCharts({
+        context: ctx,
+        type: 'line',
+        legend: {
+          position: 'top',
+        },
+        fontSize: 11,
+        background: '#FFFFFF',
+        pixelRatio: 1,
+        animation: true,
+        dataLabel: false,
+        categories: xtitle,
+        series: xinfo,
+        color: [...temColor, ...myColor],
+        enableScroll: true, //开启图表拖拽功能
+        xAxis: {
+          disableGrid: true,
+          type: 'grid',
+          gridType: 'dash',
+          itemCount: 4, //x轴单屏显示数据的数量，默认为5个
+          scrollShow: true, //新增是否显示滚动条，默认false
+          // scrollAlign: 'left', //滚动条初始位置
+          scrollBackgroundColor: '#F7F7FF', //默认为 #EFEBEF
+          scrollColor: '#DEE7F7', //默认为 #A6A6A6
+        },
+        yAxis: yAxis || {},
+        width: _self.cWidth * 1,
+        height: _self.cHeight * 1,
+        extra: {
+          line: {
+            type: 'curve',
+          },
+        },
+      });
+    },
+    showColumnBar(id, xtitle, xinfo) {
+      console.log(xtitle, xinfo);
+      let _self = this;
+      if (xtitle.length > 12) {
+        this.pestHeight = xtitle.length * 20;
+      }
+
+      const ctx = uni.createCanvasContext(id, this);
+      canvaColumnB = new uCharts({
+        context: ctx,
+        type: 'bar',
+
+        legend: {
+          show: false,
+        },
+        padding: [5, 25, 5, 0],
+        fontSize: 11,
+        background: '#FFFFFF',
+        pixelRatio: 1,
+        animation: true,
+        // dataLabel: false,
+        categories: xtitle,
+        series: xinfo,
+        // enableScroll: true, //开启图表拖拽功能
+        xAxis: {
+          boundaryGap: 'justify',
+          disableGrid: false,
+          axisLine: false,
+        },
+        yAxis: {},
+        width: _self.cWidth * 1,
+        height: _self.pestHeight * 1,
+        extra: {
+          bar: {
+            type: 'group',
+            width: 30,
+
+            barBorderCircle: true,
+            seriesGap: 4,
+            categoryGap: 4,
+          },
+        },
+      });
+    },
+    touchLineA(e) {
+      console.log(e);
+      canvaColumnA.scrollStart(e);
+    },
+    moveLineA(e) {
+      canvaColumnA.scroll(e);
+    },
+    touchEndLineA(e) {
+      canvaColumnA.scrollEnd(e);
+      //下面是toolTip事件，如果滚动后不需要显示，可不填写
+      canvaColumnA.showToolTip(e, {
+        format: function (item, category) {
+          return category + ' ' + item.name + ':' + item.data;
+        },
+      });
+    },
+    touchLineB(e) {
+      console.log(e);
+      canvaColumnB.scrollStart(e);
+    },
+    moveLineB(e) {
+      canvaColumnB.scroll(e);
+    },
+    touchEndLineB(e) {
+      canvaColumnB.scrollEnd(e);
+    },
+  },
+  mounted() {
+    this.cWidth = uni.upx2px(650);
+    this.cHeight = uni.upx2px(500);
+    this.pestLine();
+    console.log('mounted');
+  },
+  onLoad() {
+    console.log('load');
+  },
+  onShow() {
+    console.log('show');
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-	page {
-		background: #f7f7f7;
-	}
-
-	.title {
-		color: #999999;
-		margin: 32rpx 0;
-	}
-
-	.date {
-		height: 92rpx;
-		line-height: 92rpx;
-		border-radius: 92rpx;
-		background: #fff;
-		display: flex;
-		justify-content: space-between;
-		margin-top: 16rpx;
-		padding: 0 48rpx;
-		position: relative;
-
-		/deep/.u-calendar__action {
-			display: flex;
-			justify-content: space-around;
-
-			.u-calendar__action__text {
-				line-height: 25px;
-			}
-		}
-	}
-
-	.shuju_one,
-	.shuju_two {
-		// position: absolute;
-		// top: 54px;
-		width: 100%;
-		// left: 5%;
-		// box-shadow: 0 0 10rpx #bcb9ca;
-		padding-top: 20rpx;
-		height: 550rpx;
-		background-color: #fff;
-		border-radius: 24rpx;
-		overflow: scroll;
-		position: relative;
-		.canvastishi {
-			font-size: 32rpx;
-			position: absolute;
-			top: 50%;
-			left: 50%;
-			margin-left: -64rpx;
-			margin-top: -21rpx;
-
-			.dataloading:after {
-				overflow: hidden;
-				display: inline-block;
-				vertical-align: bottom;
-				animation: ellipsis 2s infinite;
-				content: "\2026";
-			}
-
-			@keyframes ellipsis {
-				from {
-					width: 2px;
-				}
-
-				to {
-					width: 15px;
-				}
-			}
-		}
-
-
-	}
-
-	.refresh {
-		// position: absolute;
-		// top: 700rpx;
-		// left: 5%;
-		font-size: 12px;
-		float: right;
-		padding: 0 10rpx;
-		height: 40rpx;
-		border-radius: 8rpx;
-		background-color: #018B3F;
-		color: #FFFFFF;
-		line-height: 40rpx;
-		text-align: center;
-	}
-
-	.condition {
-		// position: absolute;
-		// top: 770rpx;
-		display: flex;
-		flex-wrap: wrap;
-		width: 100%;
-		// left: 5%;
-		// box-shadow: 0 0 10rpx #bcb9ca;
-		margin-bottom: 30rpx;
-
-		.scroll-X {
-			width: 100%;
-			margin: 20rpx auto;
-
-			.table {
-				width: 1672px;
-			}
-
-			.tr {
-				display: flex;
-				overflow: hidden;
-
-				.th,
-				.td {
-					display: inline-block;
-					padding: 4rpx;
-					width: 286rpx;
-					text-align: center;
-					height: 52rpx;
-					line-height: 52rpx;
-					border: 2rpx solid #F1F1F1;
-				}
-
-				.th:first-child,
-				.td:first-child {
-					width: 300rpx;
-				}
-			}
-
-			.tr:nth-child(2n-1) {
-				background-color: #f5fff8;
-			}
-
-			.tr:first-child {
-				background-color: #57c878;
-				color: #fff;
-			}
-		}
-
-		.pagenumber {
-			display: flex;
-			margin: 20rpx auto;
-
-			button {
-				width: 150rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-				background-color: #17BB89;
-				color: #FFFFFF;
-			}
-
-			.pagenumber_page {
-				width: 100rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-			}
-		}
-	}
-</style>
+page {
+  background: #f7f7f7;
+}
+
+.title {
+  color: #999999;
+  margin: 32rpx 0;
+}
+
+.date {
+  height: 92rpx;
+  line-height: 92rpx;
+  border-radius: 92rpx;
+  background: #fff;
+  display: flex;
+  justify-content: space-between;
+  margin-top: 16rpx;
+  padding: 0 48rpx;
+  position: relative;
+
+  ::v-deep .u-calendar__action {
+    display: flex;
+    justify-content: space-around;
+
+    .u-calendar__action__text {
+      line-height: 25px;
+    }
+  }
+}
+
+.shuju_one,
+.shuju_two {
+  // position: absolute;
+  // top: 54px;
+  width: 100%;
+  // left: 5%;
+  // box-shadow: 0 0 10rpx #bcb9ca;
+  padding-top: 20rpx;
+  height: 550rpx;
+  background-color: #fff;
+  border-radius: 24rpx;
+  overflow: scroll;
+  position: relative;
+  .canvastishi {
+    font-size: 32rpx;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin-left: -64rpx;
+    margin-top: -21rpx;
+
+    .dataloading:after {
+      overflow: hidden;
+      display: inline-block;
+      vertical-align: bottom;
+      animation: ellipsis 2s infinite;
+      content: '\2026';
+    }
+
+    @keyframes ellipsis {
+      from {
+        width: 2px;
+      }
+
+      to {
+        width: 15px;
+      }
+    }
+  }
+}
+
+.refresh {
+  // position: absolute;
+  // top: 700rpx;
+  // left: 5%;
+  font-size: 12px;
+  float: right;
+  padding: 0 10rpx;
+  height: 40rpx;
+  border-radius: 8rpx;
+  background-color: #018b3f;
+  color: #ffffff;
+  line-height: 40rpx;
+  text-align: center;
+}
+
+.condition {
+  // position: absolute;
+  // top: 770rpx;
+  display: flex;
+  flex-wrap: wrap;
+  width: 100%;
+  // left: 5%;
+  // box-shadow: 0 0 10rpx #bcb9ca;
+  margin-bottom: 30rpx;
+
+  .scroll-X {
+    width: 100%;
+    margin: 20rpx auto;
+
+    .table {
+      width: 1672px;
+    }
+
+    .tr {
+      display: flex;
+      overflow: hidden;
+
+      .th,
+      .td {
+        display: inline-block;
+        padding: 4rpx;
+        width: 286rpx;
+        text-align: center;
+        height: 52rpx;
+        line-height: 52rpx;
+        border: 2rpx solid #f1f1f1;
+      }
+
+      .th:first-child,
+      .td:first-child {
+        width: 300rpx;
+      }
+    }
+
+    .tr:nth-child(2n-1) {
+      background-color: #f5fff8;
+    }
+
+    .tr:first-child {
+      background-color: #57c878;
+      color: #fff;
+    }
+  }
+
+  .pagenumber {
+    display: flex;
+    margin: 20rpx auto;
+
+    button {
+      width: 150rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+      font-size: 26rpx;
+      text-align: center;
+      background-color: #17bb89;
+      color: #ffffff;
+    }
+
+    .pagenumber_page {
+      width: 100rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+      font-size: 26rpx;
+      text-align: center;
+    }
+  }
+}
+</style>

pages/cb/cbd/equip-set/photo.vue

@@ -1,344 +1,383 @@
 <template>
-	<view style="background-color: #f7f7f7;padding-top: 88rpx;height: calc(100vh - 88rpx);">
-		<uni-nav-bar @clickLeft="clickLeft" left-icon="back" title="查看图片" backgroundColor="#F7F7F7"></uni-nav-bar>
-		<view class="search-item">
-			<u-dropdown >
-				<u-dropdown-item @change="dropDownChange" v-model="searchObj.is_pest" title="害虫筛选" :options="pestOptions"></u-dropdown-item>
-			</u-dropdown>
-			<span v-if="!delShow" class="right" @click="imgOperate">
-				管理
-			</span>
-			<span v-else class="right"  @click="delShow = false">
-				完成
-			</span>
-			
-		</view>
-		<view style="padding: 0 48rpx;" v-if="searchObj.is_pest!='2'">
-			<u-search bg-color="#fff" height="92" shape="square"  placeholder="请输入害虫名称" v-model="searchObj.pest_name" @search="dropDownChange" :show-action='false'></u-search>
-		</view>
-		<u-calendar v-model="calendarShow" mode="range" @maxDate="maxDate" @change="change"></u-calendar>
-		<view class="tile-item">
-			
-			<view @click="calendarShow = true" class="calendar">{{start_time}} <span style="margin: 0 40rpx;"> -</span> {{end_time}}</view>
-			
-			<u-icon name="camera" color="#018B3F" size="52" @click="takephoto"></u-icon>
-		</view>
-		<view class="imglist" v-if="imglists.length>0">
-			<view class="imglist_box" v-for="(item,index) in imglists" :key="index" >
-				<view class="top">识别:{{item.indentify_count}} 
-					<span class="yficonfont icon-shanchu float-right" v-if="delShow" @click="delImage(item)"></span>
-					<!-- <u-icon v-if="delShow" @click="delImage(item)" class="float-right" name="trash-fill" color="#FF5951" size="28"></u-icon> -->
-				</view>
-				<!-- <image class="img-flex" v-if="showPlaceholder" src="/static/images/image.png"></image> -->
-				<image class="img-flex" @error="handleImgErr($event,index)" :src="item.addr+'?x-oss-process=image/resize,w_130/quality,q_50'" mode="" @click="imageDetail(item)"></image>
-				<view class="bottom">{{item.addtime}}</view>
-			</view>
-		</view>
-		<view v-else class="notip">
-			暂无数据
-		</view>
-	
-	</view>
+  <view
+    style="
+      background-color: #f7f7f7;
+      padding-top: 88rpx;
+      height: calc(100vh - 88rpx);
+    "
+  >
+    <uni-nav-bar
+      @clickLeft="clickLeft"
+      left-icon="back"
+      title="查看图片"
+      backgroundColor="#F7F7F7"
+    ></uni-nav-bar>
+    <view class="search-item">
+      <u-dropdown>
+        <u-dropdown-item
+          @change="dropDownChange"
+          v-model="searchObj.is_pest"
+          title="害虫筛选"
+          :options="pestOptions"
+        ></u-dropdown-item>
+      </u-dropdown>
+      <span v-if="!delShow" class="right" @click="imgOperate"> 管理 </span>
+      <span v-else class="right" @click="delShow = false"> 完成 </span>
+    </view>
+    <view style="padding: 0 48rpx" v-if="searchObj.is_pest != '2'">
+      <u-search
+        bg-color="#fff"
+        height="92"
+        shape="square"
+        placeholder="请输入害虫名称"
+        v-model="searchObj.pest_name"
+        @search="dropDownChange"
+        :show-action="false"
+      ></u-search>
+    </view>
+    <u-calendar
+      v-model="calendarShow"
+      mode="range"
+      @maxDate="maxDate"
+      @change="change"
+    ></u-calendar>
+    <view class="tile-item">
+      <view @click="calendarShow = true" class="calendar"
+        >{{ start_time }} <span style="margin: 0 40rpx"> -</span>
+        {{ end_time }}</view
+      >
+
+      <u-icon
+        name="camera"
+        color="#018B3F"
+        size="52"
+        @click="takephoto"
+      ></u-icon>
+    </view>
+    <view class="imglist" v-if="imglists.length > 0">
+      <view class="imglist_box" v-for="(item, index) in imglists" :key="index">
+        <view class="top"
+          >识别:{{ item.indentify_count }}
+          <span
+            class="yficonfont icon-shanchu float-right"
+            v-if="delShow"
+            @click="delImage(item)"
+          ></span>
+          <!-- <u-icon v-if="delShow" @click="delImage(item)" class="float-right" name="trash-fill" color="#FF5951" size="28"></u-icon> -->
+        </view>
+        <!-- <image class="img-flex" v-if="showPlaceholder" src="/static/images/image.png"></image> -->
+        <image
+          class="img-flex"
+          @error="handleImgErr($event, index)"
+          :src="item.addr + '?x-oss-process=image/resize,w_130/quality,q_50'"
+          mode=""
+          @click="imageDetail(item)"
+        ></image>
+        <view class="bottom">{{ item.addtime }}</view>
+      </view>
+    </view>
+    <view v-else class="notip"> 暂无数据 </view>
+  </view>
 </template>
 
 <script>
-	import jsencrypt from '@/components/jsencrypt/jsencrypt.vue';
-	export default {
-		data() {
-			return {
-				maxDate:'2050-12-31',
-				value1:'',
-				value2:'',
-				searchObj:{
-					is_pest:'',
-					pest_name:''
-				},
-				pestOptions:[
-					{label: '全部',value: ''},
-					{label: '有虫',value: '1'},
-					{label: '无虫',value: '2'},
-				],
-				timeend:'',
-				timestart:'',
-				imglists:[],
-				page:1,
-				device_type:'',
-				device_id:'',
-				d_id:'',
-				calendarShow:false,
-				start_time:'',
-				end_time:'',
-				delShow:false,
-				loadMore:true,
-				noImage:'/static/images/image.png'
-			}
-		},
-		methods: {
-			handleImgErr(e,index){
-				console.log(e,'图片加载出错了')
-				this.imglists[index].addr = this.noImage
-				// this.showPlaceholder = true
-			},
-			imageDetail(item){
-				console.log(item)
-				if(this.delShow){
-					return
-				}
-				uni.navigateTo({
-					url: '/pages/cb/cbd/equip-set/photoResults'  + '?d_id=' + this.d_id + "&device_id=" + this.device_id + "&device_type=" + this.device_type + "&time=" + item.addtime
-				});
-			},
-			imgOperate(){
-				this.delShow = true
-			},
-			clickLeft() {
-				uni.navigateBack()
-			},
-			dropDownChange(){
-				this.loadMore = true
-				this.page = 1
-				this.imglists = []
-				this.getImgData()
-			},
-			change(e){
-				this.loadMore = true
-				console.log(e)
-				this.start_time = e.startDate 
-				this.end_time = e.endDate 
-				this.page = 1
-				this.imglists = []
-				this.getImgData()
-			},
-			async getImgData(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=new_gateway.photo_info.photo_list',
-					data: {
-						id: this.d_id,
-						device_type_id:this.device_type,
-						page: this.page,
-						page_number: 12,
-						start: +new Date(this.start_time+' 00:00:00') / 1000,
-						end: +new Date(this.end_time+' 23:59:59') / 1000, 
-						...this.searchObj
-					}
-				})
-				if(res.data.length==0){
-					// 加载完了
-					this.loadMore = false
-					return
-				}
-				this.imglists = this.imglists.concat(res.data)
-				
-		
-			},
-			// 删除
-			delImage(item){
-				uni.showModal({
-				    title: '提示',
-				    content: '确认删除？',
-				    success:  async (res)=> {
-				        if (res.confirm) {
-				            const res = await this.$myRequest({
-				            	url: '/api/api_gateway?method=new_gateway.photo_info.delete_photo',
-				            	data: {
-				            		device_type_id: this.device_type,
-				            		ids: item.id
-				            	}
-				            })
-				            this.delShow = false
-				            
-				            uni.showToast({
-				            	title: res.msg,
-				            	duration: 2000
-				            });
-				            this.imglists = []
-				            this.getImgData()
-				        } else if (res.cancel) {
-				            
-				        }
-				    }
-				});
-				
-			},
-	
-			onReachBottom() {
-				if(this.loadMore){
-					this.page++
-					this.getImgData()
-				}
-				
-			},
-			anew() {
-				this.discern("again")
-				this.imgbg = true
-			},
-			examine(url) {
-				console.log(url)
-				var imgarr = []
-				imgarr.push(url.image)
-				console.log(imgarr)
-				uni.previewImage({
-					urls: imgarr
-				});
-			},
-			async takephoto() { //拍照
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=new_gateway.device_info.send_control',
-					data: {
-						device_type_id: this.device_type,
-						id: this.device_id,
-						cmd: "0004"
-					}
-				})
-				console.log(res)
-	
-				if (res == true) {
-					uni.showToast({
-						title: '指令下发成功！',
-						duration: 2000
-					});
-		
-				} else {
-					uni.showToast({
-						title: '指令下发失败！',
-						duration: 2000,
-						icon: "none"
-					});
-				}
-			
-			},
-		},
-		onLoad(option) {
+import jsencrypt from '@/components/jsencrypt/jsencrypt.vue';
+export default {
+  data() {
+    return {
+      maxDate: '2050-12-31',
+      value1: '',
+      value2: '',
+      searchObj: {
+        is_pest: '',
+        pest_name: '',
+      },
+      pestOptions: [
+        { label: '全部', value: '' },
+        { label: '有虫', value: '1' },
+        { label: '无虫', value: '2' },
+      ],
+      timeend: '',
+      timestart: '',
+      imglists: [],
+      page: 1,
+      device_type: '',
+      device_id: '',
+      d_id: '',
+      calendarShow: false,
+      start_time: '',
+      end_time: '',
+      delShow: false,
+      loadMore: true,
+      noImage: '/static/images/image.png',
+    };
+  },
+  methods: {
+    handleImgErr(e, index) {
+      console.log(e, '图片加载出错了');
+      this.imglists[index].addr = this.noImage;
+      // this.showPlaceholder = true
+    },
+    imageDetail(item) {
+      console.log(item);
+      if (this.delShow) {
+        return;
+      }
+      uni.navigateTo({
+        url:
+          '/pages/cb/cbd/equip-set/photoResults' +
+          '?d_id=' +
+          this.d_id +
+          '&device_id=' +
+          this.device_id +
+          '&device_type=' +
+          this.device_type +
+          '&time=' +
+          item.addtime,
+      });
+    },
+    imgOperate() {
+      this.delShow = true;
+    },
+    clickLeft() {
+      uni.navigateBack();
+    },
+    dropDownChange() {
+      this.loadMore = true;
+      this.page = 1;
+      this.imglists = [];
+      this.getImgData();
+    },
+    change(e) {
+      this.loadMore = true;
+      console.log(e);
+      this.start_time = e.startDate;
+      this.end_time = e.endDate;
+      this.page = 1;
+      this.imglists = [];
+      this.getImgData();
+    },
+    async getImgData() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=new_gateway.photo_info.photo_list',
+        data: {
+          id: this.d_id,
+          device_type_id: this.device_type,
+          page: this.page,
+          page_number: 12,
+          start: +new Date(this.start_time + ' 00:00:00') / 1000,
+          end: +new Date(this.end_time + ' 23:59:59') / 1000,
+          ...this.searchObj,
+        },
+      });
+      if (res.data.length == 0) {
+        // 加载完了
+        this.loadMore = false;
+        return;
+      }
+      this.imglists = this.imglists.concat(res.data);
+    },
+    // 删除
+    delImage(item) {
+      uni.showModal({
+        title: '提示',
+        content: '确认删除？',
+        success: async (res) => {
+          if (res.confirm) {
+            const res = await this.$myRequest({
+              url: '/api/api_gateway?method=new_gateway.photo_info.delete_photo',
+              data: {
+                device_type_id: this.device_type,
+                ids: item.id,
+              },
+            });
+            this.delShow = false;
+
+            uni.showToast({
+              title: res.msg,
+              duration: 2000,
+            });
+            this.imglists = [];
+            this.getImgData();
+          } else if (res.cancel) {
+          }
+        },
+      });
+    },
+
+    onReachBottom() {
+      if (this.loadMore) {
+        this.page++;
+        this.getImgData();
+      }
+    },
+    anew() {
+      this.discern('again');
+      this.imgbg = true;
+    },
+    examine(url) {
+      console.log(url);
+      var imgarr = [];
+      imgarr.push(url.image);
+      console.log(imgarr);
+      uni.previewImage({
+        urls: imgarr,
+      });
+    },
+    async takephoto() {
+      //拍照
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=new_gateway.device_info.send_control',
+        data: {
+          device_type_id: this.device_type,
+          id: this.device_id,
+          cmd: '0004',
+        },
+      });
+      console.log(res);
+
+      if (res == true) {
+        uni.showToast({
+          title: '指令下发成功！',
+          duration: 2000,
+        });
+      } else {
+        uni.showToast({
+          title: '指令下发失败！',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+  },
+  onLoad(option) {
+    console.log('图片详情', option);
+    this.device_id = option.device_id;
+    this.d_id = option.d_id;
+    this.device_type = option.device_type;
+    let endTime = +new Date() / 1000;
+    let startTime = endTime - 60 * 60 * 24;
 
-			console.log('图片详情',option)
-			this.device_id = option.device_id
-			this.d_id = option.d_id
-			this.device_type = option.device_type
-			let endTime = +new Date()/1000
-			let startTime = endTime - 60 * 60 * 24
-			
-			this.end_time = this.formatTime(endTime*1000,'yyyy-MM-dd')
-			this.start_time = this.formatTime(startTime*1000,'yyyy-MM-dd')
-			// this.imglists = []
-			
-			this.getImgData()
-		
-		},
-	}
+    this.end_time = this.formatTime(endTime * 1000, 'yyyy-MM-dd');
+    this.start_time = this.formatTime(startTime * 1000, 'yyyy-MM-dd');
+    // this.imglists = []
+
+    this.getImgData();
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-	/deep/.u-calendar__action {
-		display: flex;
-		justify-content: space-around;
-	
-		.u-calendar__action__text {
-			line-height: 25px;
-		}
-	}
-	/deep/.u-flex{
-		display: flex;
-	}
-	page {
-		background: #F7F7F7;
-		.notip{
-			text-align: center;
-			color: #666666;
-			margin-top: 100rpx;
-		}
-	.search-item{
-		// padding: 0rpx 48rpx;
-		box-sizing: border-box;
-		background: #F7F7F7;
-		line-height: 80rpx;
-		color: #656C74;
-		position: relative;
-		.right{
-			position: absolute;
-			z-index: 11;
-			right: 48rpx;
-			top: 0;
-		}
-		.right::before{
-			content: '|';
-			color: #C3CBCF;
-			padding-right: 10rpx;
-		}
-	}
-	.tile-item{
-		margin-top: 16rpx;
-		padding: 0rpx 48rpx;
-		box-sizing: border-box;
-		height: 92rpx;
-		line-height: 92rpx;
-		display: flex;
-		justify-content: space-between;
-		background: #F7F7F7;
-		.calendar{
-			width: 83%;
-			background-color: #fff;
-			border-radius: 10rpx;
-			padding: 0 18rpx;
-			color: #5C5C5C;
-			text-align: center;
-		}
-		.camera{
-			
-		}
-	}	
-		.imglist{
-				display: flex;
-				flex-flow: row wrap;
-				padding: 0rpx 48rpx;
-				box-sizing: border-box;
-				background: #F7F7F7;
-				margin-top: 6rpx;
-				// justify-content: space-around;
-				// gap: 16rpx;
-			.imglist_box{
-				box-sizing: border-box;
-				flex: 0 0 33.3333%;
-				height: 224rpx;
-				padding: 6rpx;
-				border-radius: 4rpx;
-				position: relative;
-				.top{
-					position: absolute;
-					top: 6rpx;
-					left: 6rpx;
-					background: rgba(0, 0, 0, 0.6);
-					color: #fff;
-					border-top-left-radius: 4rpx;
-					border-top-right-radius: 4rpx;
-					padding: 0 20rpx;
-					font-size: 10px;
-					z-index: 1;
-					width: 75.5%;
-					.float-right{
-						float: right;
-						color: #FF5951;
-						font-size: 36rpx;
-					}
-				}
-				.bottom{
-					position: absolute;
-					bottom: 6rpx;
-					left: 6rpx;
-					background: rgba(0, 0, 0, 0.6);
-					color: #fff;
-					border-bottom-left-radius: 4rpx;
-					border-bottom-right-radius: 4rpx;
-					text-align: center;
-					font-size: 10px;
-					width: 94.5%;
-					padding: 4rpx 0;
-				}
-				.img-flex{
-					border-radius: 4rpx;
-					width: 100%;
-					height: 100%;
-				}
-			}
-		}
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
+
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
+::v-deep .u-flex {
+  display: flex;
+}
+page {
+  background: #f7f7f7;
+  .notip {
+    text-align: center;
+    color: #666666;
+    margin-top: 100rpx;
+  }
+  .search-item {
+    // padding: 0rpx 48rpx;
+    box-sizing: border-box;
+    background: #f7f7f7;
+    line-height: 80rpx;
+    color: #656c74;
+    position: relative;
+    .right {
+      position: absolute;
+      z-index: 11;
+      right: 48rpx;
+      top: 0;
+    }
+    .right::before {
+      content: '|';
+      color: #c3cbcf;
+      padding-right: 10rpx;
+    }
+  }
+  .tile-item {
+    margin-top: 16rpx;
+    padding: 0rpx 48rpx;
+    box-sizing: border-box;
+    height: 92rpx;
+    line-height: 92rpx;
+    display: flex;
+    justify-content: space-between;
+    background: #f7f7f7;
+    .calendar {
+      width: 83%;
+      background-color: #fff;
+      border-radius: 10rpx;
+      padding: 0 18rpx;
+      color: #5c5c5c;
+      text-align: center;
+    }
+    .camera {
+    }
+  }
+  .imglist {
+    display: flex;
+    flex-flow: row wrap;
+    padding: 0rpx 48rpx;
+    box-sizing: border-box;
+    background: #f7f7f7;
+    margin-top: 6rpx;
+    // justify-content: space-around;
+    // gap: 16rpx;
+    .imglist_box {
+      box-sizing: border-box;
+      flex: 0 0 33.3333%;
+      height: 224rpx;
+      padding: 6rpx;
+      border-radius: 4rpx;
+      position: relative;
+      .top {
+        position: absolute;
+        top: 6rpx;
+        left: 6rpx;
+        background: rgba(0, 0, 0, 0.6);
+        color: #fff;
+        border-top-left-radius: 4rpx;
+        border-top-right-radius: 4rpx;
+        padding: 0 20rpx;
+        font-size: 10px;
+        z-index: 1;
+        width: 75.5%;
+        .float-right {
+          float: right;
+          color: #ff5951;
+          font-size: 36rpx;
+        }
+      }
+      .bottom {
+        position: absolute;
+        bottom: 6rpx;
+        left: 6rpx;
+        background: rgba(0, 0, 0, 0.6);
+        color: #fff;
+        border-bottom-left-radius: 4rpx;
+        border-bottom-right-radius: 4rpx;
+        text-align: center;
+        font-size: 10px;
+        width: 94.5%;
+        padding: 4rpx 0;
+      }
+      .img-flex {
+        border-radius: 4rpx;
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
 }
 </style>

pages/cb/cbd/equip-set/photoResults.vue

@@ -1,321 +1,349 @@
 <template>
-	<view style="background-color: #f7f7f7;padding-top: 88rpx;height: calc(100vh - 88rpx);">
-		
-		<uni-nav-bar @clickLeft="clickLeft" left-icon="back" title="识别结果" backgroundColor="#F7F7F7"></uni-nav-bar>
-		<u-calendar v-model="calendarShow" mode="range" @change="change" @maxDate="maxDate"></u-calendar>
-		<view class="img-result">
-			<view class="tile-item">
-				
-				<view @click="calendarShow = true" class="calendar">{{start_time}} <span style="margin: 0 40rpx;"> -</span> {{end_time}}</view>
-				
-			</view>
+  <view
+    style="
+      background-color: #f7f7f7;
+      padding-top: 88rpx;
+      height: calc(100vh - 88rpx);
+    "
+  >
+    <uni-nav-bar
+      @clickLeft="clickLeft"
+      left-icon="back"
+      title="识别结果"
+      backgroundColor="#F7F7F7"
+    ></uni-nav-bar>
+    <u-calendar
+      v-model="calendarShow"
+      mode="range"
+      @change="change"
+      @maxDate="maxDate"
+    ></u-calendar>
+    <view class="img-result">
+      <view class="tile-item">
+        <view @click="calendarShow = true" class="calendar"
+          >{{ start_time }} <span style="margin: 0 40rpx"> -</span>
+          {{ end_time }}</view
+        >
+      </view>
 
-		<view class="images_box">
-
-			<view class="canvas-bg">
-				<canvas-mark/>
-				<!-- <img v-if="photos.length>0" :src="photos[active].addr+'?x-oss-process=image/resize,w_130/quality,q_90'" alt=""  @click="examine()"/> -->
-			</view>
-			<view class="image-flex" >
-				<view v-for="(item,index) in photos" :key="index">
-					<image class="my-img" :class="active==index?'active':''" :src="item.addr" @click="imgClick(item,index)" mode=""></image>
-				</view>
-			</view>
-		</view>
-		<view class="information">
-			<view class="btn">
-				<p class="title">当前图片识别结果</p>
-				<u-button size="mini" :loading='respetLoading' class="btn_box" throttle-time="500" @click="resetPest" :customStyle="customStyle">重新识别</u-button>
-			</view>
-			<view class="notip" v-if="isObject(pestResult)">
-				暂无识别结果
-			</view>
-			<view v-else class="information_data" v-for="(value,key) in pestResult">
-				<p> <span>{{key}}</span> <span>{{value}}头</span> </p>
-			</view>
-		</view>
-		
-			
-		</view>
-	</view>
+      <view class="images_box">
+        <view class="canvas-bg">
+          <canvas-mark />
+          <!-- <img v-if="photos.length>0" :src="photos[active].addr+'?x-oss-process=image/resize,w_130/quality,q_90'" alt=""  @click="examine()"/> -->
+        </view>
+        <view class="image-flex">
+          <view v-for="(item, index) in photos" :key="index">
+            <image
+              class="my-img"
+              :class="active == index ? 'active' : ''"
+              :src="item.addr"
+              @click="imgClick(item, index)"
+              mode=""
+            ></image>
+          </view>
+        </view>
+      </view>
+      <view class="information">
+        <view class="btn">
+          <p class="title">当前图片识别结果</p>
+          <u-button
+            size="mini"
+            :loading="respetLoading"
+            class="btn_box"
+            throttle-time="500"
+            @click="resetPest"
+            :customStyle="customStyle"
+            >重新识别</u-button
+          >
+        </view>
+        <view class="notip" v-if="isObject(pestResult)"> 暂无识别结果 </view>
+        <view
+          v-else
+          class="information_data"
+          v-for="(value, key) in pestResult"
+        >
+          <p>
+            <span>{{ key }}</span> <span>{{ value }}头</span>
+          </p>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	import jsencrypt from '@/components/jsencrypt/jsencrypt.vue';
-	import insect_dict from "../../../../static/data/cbd_pest_library.js"
-	import canvasMark from '@/components/Draw/index.vue';
-	export default {
-		data() {
-			return {
-				maxDate:'2050-12-31',
-				device_type:'',
-				device_id:'',
-				d_id:'',
-				calendarShow:false,
-				start_time:'',
-				end_time:'',
-				photos:[],
-				
-				active:0,
-				respetLoading:false
-			}
-		},
-		components:{canvasMark},
-		computed:{
-			customStyle(){
-				return {
-					background: '#018B3F',
-					fontSize:'12px',
-					border:'none',
-					color:'#fff'
-				}
-			},
-			pestResult(){
-				if(this.photos==0){
-					return {}
-				}
-				let obj = {}
-				let item = this.photos[this.active]
-				console.log('选中',item)
-				if(item.is_mark==0){
-					// 机器识别
-					let aiLabel = []
-					if (item.label) {
-					    aiLabel = JSON.parse(item.label.replace(/'/g, '"'))
-						aiLabel.forEach(label => {
-							const text = Object.keys(label)[0]
-							if (obj[insect_dict[text]]) {
-								obj[insect_dict[text]]++
-							} else {
-								obj[insect_dict[text]] = 1
-							} 
-						})
-					}
-				}else{
-					item.mark.forEach(item => {
-					  if (obj[item.text]) {
-						obj[item.text]++
-					  } else {
-						obj[item.text] = 1
-					  }
-					})
-				}
-				return obj
-			},
-			previewImages(){
-				let list = []
-				if(this.photos.length>0){
-					this.photos.forEach(photo=>{
-						list.push(photo.addr)
-					})
-					return list
-				}else{
-					return []
-				}
-				
-			}
-		},
-		methods: {
-			clickLeft() {
-				uni.navigateBack()
-			},
-			isObject(obj){
-				return Object.keys(obj).length==0
-			},
-			change(e){
-				this.start_time = e.startDate 
-				this.end_time = e.endDate 
-				this.page = 1
-				this.photos = []
-				this.getImgData()
-			},
-			async getImgData(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=new_gateway.photo_info.photo_list',
-					data: {
-						id: this.d_id,
-						device_type_id:this.device_type,
-						page: 1,
-						page_number: 99999,
-						start: +new Date(this.start_time+' 00:00:00') / 1000,
-						end: +new Date(this.end_time+' 23:59:59') / 1000
-					}
-				})
-				this.photos = this.photos.concat(res.data)
-				console.log(this.photos,'---')
-				// this.photos = res.data
-			},
-			async resetPest(){
-				this.respetLoading = true
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=new_gateway.photo_info.identify_again',
-					data: {
-						id: this.photos[this.active].id,
-						device_type_id:this.device_type
-					}
-				})
-				this.respetLoading = false
-				if(res.code==2000){
-					uni.showToast({
-						title: '操作成功',
-						duration: 2000
-					})
-				}else{
-					uni.showToast({
-						title: res.msg,
-						duration: 2000
-					})
-				}
-			},
-			examine() {
-				uni.previewImage({
-					urls: this.previewImages
-				});
-			},
-			imgClick(item,index){
-				this.active = index	
-			}
-		},
-		onLoad(option) {
-			console.log('结果页面：',option)
-			this.device_id = option.device_id
-			this.d_id = option.d_id
-			this.device_type = option.device_type
-			let endTime = +new Date(option.time)/1000 + 60 * 60 * 24
-			let startTime = +new Date(option.time)/1000
-			
-			this.end_time = this.formatTime(endTime*1000,'yyyy-MM-dd')
-			this.start_time = this.formatTime(startTime*1000,'yyyy-MM-dd')
-			this.getImgData()
-		}
-	}
+import jsencrypt from '@/components/jsencrypt/jsencrypt.vue';
+import insect_dict from '../../../../static/data/cbd_pest_library.js';
+import canvasMark from '@/components/Draw/index.vue';
+export default {
+  data() {
+    return {
+      maxDate: '2050-12-31',
+      device_type: '',
+      device_id: '',
+      d_id: '',
+      calendarShow: false,
+      start_time: '',
+      end_time: '',
+      photos: [],
+
+      active: 0,
+      respetLoading: false,
+    };
+  },
+  components: { canvasMark },
+  computed: {
+    customStyle() {
+      return {
+        background: '#018B3F',
+        fontSize: '12px',
+        border: 'none',
+        color: '#fff',
+      };
+    },
+    pestResult() {
+      if (this.photos == 0) {
+        return {};
+      }
+      let obj = {};
+      let item = this.photos[this.active];
+      console.log('选中', item);
+      if (item.is_mark == 0) {
+        // 机器识别
+        let aiLabel = [];
+        if (item.label) {
+          aiLabel = JSON.parse(item.label.replace(/'/g, '"'));
+          aiLabel.forEach((label) => {
+            const text = Object.keys(label)[0];
+            if (obj[insect_dict[text]]) {
+              obj[insect_dict[text]]++;
+            } else {
+              obj[insect_dict[text]] = 1;
+            }
+          });
+        }
+      } else {
+        item.mark.forEach((item) => {
+          if (obj[item.text]) {
+            obj[item.text]++;
+          } else {
+            obj[item.text] = 1;
+          }
+        });
+      }
+      return obj;
+    },
+    previewImages() {
+      let list = [];
+      if (this.photos.length > 0) {
+        this.photos.forEach((photo) => {
+          list.push(photo.addr);
+        });
+        return list;
+      } else {
+        return [];
+      }
+    },
+  },
+  methods: {
+    clickLeft() {
+      uni.navigateBack();
+    },
+    isObject(obj) {
+      return Object.keys(obj).length == 0;
+    },
+    change(e) {
+      this.start_time = e.startDate;
+      this.end_time = e.endDate;
+      this.page = 1;
+      this.photos = [];
+      this.getImgData();
+    },
+    async getImgData() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=new_gateway.photo_info.photo_list',
+        data: {
+          id: this.d_id,
+          device_type_id: this.device_type,
+          page: 1,
+          page_number: 99999,
+          start: +new Date(this.start_time + ' 00:00:00') / 1000,
+          end: +new Date(this.end_time + ' 23:59:59') / 1000,
+        },
+      });
+      this.photos = this.photos.concat(res.data);
+      console.log(this.photos, '---');
+      // this.photos = res.data
+    },
+    async resetPest() {
+      this.respetLoading = true;
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=new_gateway.photo_info.identify_again',
+        data: {
+          id: this.photos[this.active].id,
+          device_type_id: this.device_type,
+        },
+      });
+      this.respetLoading = false;
+      if (res.code == 2000) {
+        uni.showToast({
+          title: '操作成功',
+          duration: 2000,
+        });
+      } else {
+        uni.showToast({
+          title: res.msg,
+          duration: 2000,
+        });
+      }
+    },
+    examine() {
+      uni.previewImage({
+        urls: this.previewImages,
+      });
+    },
+    imgClick(item, index) {
+      this.active = index;
+    },
+  },
+  onLoad(option) {
+    console.log('结果页面：', option);
+    this.device_id = option.device_id;
+    this.d_id = option.d_id;
+    this.device_type = option.device_type;
+    let endTime = +new Date(option.time) / 1000 + 60 * 60 * 24;
+    let startTime = +new Date(option.time) / 1000;
+
+    this.end_time = this.formatTime(endTime * 1000, 'yyyy-MM-dd');
+    this.start_time = this.formatTime(startTime * 1000, 'yyyy-MM-dd');
+    this.getImgData();
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-	/deep/.u-calendar__action {
-		display: flex;
-		justify-content: space-around;
-	
-		.u-calendar__action__text {
-			line-height: 25px;
-		}
-	}
-	page{
-		background: #F7F7F7;
-	}
-	.img-result{
-		padding: 0rpx 48rpx;
-		background-color: #F7F7F7;
-		// height: calc(100vh - 120rpx);
-	}
-	.tile-item{
-		margin-top: 32rpx;
-		// padding: 0rpx 32rpx;
-		box-sizing: border-box;
-		height: 92rpx;
-		line-height: 92rpx;
-		display: flex;
-		justify-content: space-between;
-		background: #F7F7F7;
-		.calendar{
-			width: 100%;
-			background-color: #fff;
-			border-radius: 24rpx;
-			padding: 0 18rpx;
-			color: #5C5C5C;
-			text-align: center;
-		}
-		.camera{
-			
-		}
-	}
-	.images_box {
-		width: 100%;
-		height: 742rpx;
-		padding: 32rpx;
-		margin: 32rpx 0;
-		box-sizing: border-box;
-		background: #fff;
-		border-radius: 24rpx;
-		.canvas-bg{
-			height: 558rpx;
-			position: relative;
-			margin-bottom: 16rpx;
-			img{
-				width: 100%;
-				height: 100%;
-			}
-		}
-		.image-flex {
-			width: 100%;
-			overflow-x: scroll;
-			display: flex;
-			flex-wrap: nowrap;
-			gap: 20rpx;
-			padding: 10rpx 0;
-			box-sizing: border-box;
-			.my-img {
-				width: 96rpx;
-				height: 96rpx;
-				border-radius: 4rpx;
-				opacity: 0.5;
-			}
-			.active{
-				border: 4px solid #ccc;
-				animation: borderAnimation 1s;
-				position: relative;
-				top: -4px;
-				opacity: 1;
-			}
-		}
-	}
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
+
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
+page {
+  background: #f7f7f7;
+}
+.img-result {
+  padding: 0rpx 48rpx;
+  background-color: #f7f7f7;
+  // height: calc(100vh - 120rpx);
+}
+.tile-item {
+  margin-top: 32rpx;
+  // padding: 0rpx 32rpx;
+  box-sizing: border-box;
+  height: 92rpx;
+  line-height: 92rpx;
+  display: flex;
+  justify-content: space-between;
+  background: #f7f7f7;
+  .calendar {
+    width: 100%;
+    background-color: #fff;
+    border-radius: 24rpx;
+    padding: 0 18rpx;
+    color: #5c5c5c;
+    text-align: center;
+  }
+  .camera {
+  }
+}
+.images_box {
+  width: 100%;
+  height: 742rpx;
+  padding: 32rpx;
+  margin: 32rpx 0;
+  box-sizing: border-box;
+  background: #fff;
+  border-radius: 24rpx;
+  .canvas-bg {
+    height: 558rpx;
+    position: relative;
+    margin-bottom: 16rpx;
+    img {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .image-flex {
+    width: 100%;
+    overflow-x: scroll;
+    display: flex;
+    flex-wrap: nowrap;
+    gap: 20rpx;
+    padding: 10rpx 0;
+    box-sizing: border-box;
+    .my-img {
+      width: 96rpx;
+      height: 96rpx;
+      border-radius: 4rpx;
+      opacity: 0.5;
+    }
+    .active {
+      border: 4px solid #ccc;
+      animation: borderAnimation 1s;
+      position: relative;
+      top: -4px;
+      opacity: 1;
+    }
+  }
+}
+
+.information {
+  padding-bottom: 2rpx;
+  .btn {
+    overflow: hidden;
+  }
+  .title {
+    float: left;
+    color: #999999;
+  }
+  .notip {
+    text-align: center;
+    color: #999999;
+    margin-top: 100rpx;
+  }
+  .btn_box {
+    float: right;
+    // border-radius: 8rpx;
+    // background: #018B3F;
+    // padding: 2rpx 10rpx;
+    // color: #fff;
+    // font-size: 24rpx;
+  }
+  .information_data {
+    margin: 32rpx 0;
+    display: flex;
+    background-color: #fff;
+    // padding: 20rpx 10rpx;
+    height: 104rpx;
+    line-height: 104rpx;
+    border-radius: 24rpx;
+    padding: 0 32rpx;
+    p {
+      // margin-right: 20rpx;
+      font-size: 24rpx;
+      color: #666666;
+    }
+  }
+}
 
-	.information {
-		padding-bottom: 2rpx;
-		.btn{
-			overflow: hidden;
-		}
-		.title {
-			float: left;
-			color: #999999;
-		}
-		.notip{
-			text-align: center;
-			color: #999999;
-			margin-top: 100rpx;
-		}
-		.btn_box{
-			float: right;
-			// border-radius: 8rpx;
-			// background: #018B3F;
-			// padding: 2rpx 10rpx;
-			// color: #fff;
-			// font-size: 24rpx;
-		}
-		.information_data {
-			margin: 32rpx 0;
-			display: flex;
-			background-color: #fff;
-			// padding: 20rpx 10rpx;
-			height: 104rpx;
-			line-height: 104rpx;
-			border-radius: 24rpx;
-			padding: 0 32rpx;
-			p {
-				// margin-right: 20rpx;
-				font-size: 24rpx;
-				color: #666666;
-				
-			}
-		}
-	}
-	
-	@keyframes borderAnimation {
-	  0% { 
-		opacity: 0.5;
-	  }
-	  100% { 
-		opacity: 1;
-	  }
-	}
+@keyframes borderAnimation {
+  0% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 1;
+  }
+}
 </style>

pages/cb/nlNewXy/nlNewXy.vue

@@ -1,371 +1,431 @@
 <template>
-	<view>
-		<view :class="['info',equipInfo.is_online==1?'on':'off']">
-			<view class="" @click="copy(equipInfo)">
-				设备ID：{{showId}}
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png" mode="" class="tishi">
-				</image>
-			</view>
-			<view class="">
-				设备名称：{{equipInfo.device_name==""?"无":equipInfo.device_name}}
-			</view>
-			<view class="">
-				设备类型：性诱监测
-			</view>
-			<view class="">
-				最新上报时间：{{equipInfo.uptime||equipInfo.uptime | timeFormat}}
-			</view>
-			<view class="">
-				设备地址：{{equipInfo.address}}
-			</view>
-			<view class="" @click="setdecoy">
-				诱芯名称：{{equipInfo.decoy}}
-				<u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
-			</view>
-			<view class="" @click="setdecoy">
-				诱芯到期时间：{{equipInfo.xy_expire}}
-				<u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
-			</view>
-		</view>
-		<u-popup v-model="yxShow" mode="center" width="600rpx">
-			<u-field label="害虫名称" label-width='240' required :error-message="xyErr" v-model="decoy" class="field"
-				:field-style="fieldstyle" placeholder="请填写害虫名称">
-			</u-field>
-			<u-field label="诱芯到期时间" label-width='240' required :error-message="xyErrtime" v-model="decoytime"
-				@click="settime" class="field" :field-style="fieldstyle" placeholder="请填写到期时间">
-			</u-field>
-			<view class="" style="text-align: center;color: #fa3534;">
-				{{tishitext}}
-			</view>
-			<view class="btn-box">
-				<u-button @click="yxSubmit" size="mini" type="success" class="box-item">确定</u-button>
-			</view>
-		</u-popup>
-		<u-calendar v-model="tiemshow" mode="date" :max-date="date" @change="tiemchange"></u-calendar>
-		<view class="caobox">
-			<view class="caobox_item" v-if="$QueryPermission(358)" @click="toset">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/4.png" mode="widthFix"></image>
-				<view class="">
-					设备控制
-				</view>
-			</view>
-			<view class="caobox_item" v-if="$QueryPermission(359)" @click="tohis">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/2.png" mode="widthFix"></image>
-				<view class="">
-					历史数据
-				</view>
-			</view>
-		</view>
-		<view class="realtime">
-			<view class="realtime_title">
-				<p>实时数据</p>
-			</view>
-			<view class="realtime_text">
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png" mode=""></image>
-					<view class="text">
-						<p>环境温度</p>
-						<p>{{at}}℃</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png" mode=""></image>
-					<view class="text">
-						<p>环境湿度</p>
-						<p>{{ah}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/tianqi.png" mode=""></image>
-					<view class="text">
-						<p>天气</p>
-						<p>{{wea}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/xiayu.png" mode=""></image>
-					<view class="text">
-						<p>是否下雨</p>
-						<p>{{rain}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png" mode=""></image>
-					<view class="text">
-						<p>诱虫次数</p>
-						<p>{{wormnum}}</p>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+    <view :class="['info', equipInfo.is_online == 1 ? 'on' : 'off']">
+      <view class="" @click="copy(equipInfo)">
+        设备ID：{{ showId }}
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png"
+          mode=""
+          class="tishi"
+        >
+        </image>
+      </view>
+      <view class="">
+        设备名称：{{
+          equipInfo.device_name == '' ? '无' : equipInfo.device_name
+        }}
+      </view>
+      <view class=""> 设备类型：性诱监测 </view>
+      <view class="">
+        最新上报时间：{{ equipInfo.uptime || equipInfo.uptime | timeFormat }}
+      </view>
+      <view class=""> 设备地址：{{ equipInfo.address }} </view>
+      <view class="" @click="setdecoy">
+        诱芯名称：{{ equipInfo.decoy }}
+        <u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
+      </view>
+      <view class="" @click="setdecoy">
+        诱芯到期时间：{{ equipInfo.xy_expire }}
+        <u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
+      </view>
+    </view>
+    <u-popup v-model="yxShow" mode="center" width="600rpx">
+      <u-field
+        label="害虫名称"
+        label-width="240"
+        required
+        :error-message="xyErr"
+        v-model="decoy"
+        class="field"
+        :field-style="fieldstyle"
+        placeholder="请填写害虫名称"
+      >
+      </u-field>
+      <u-field
+        label="诱芯到期时间"
+        label-width="240"
+        required
+        :error-message="xyErrtime"
+        v-model="decoytime"
+        @click="settime"
+        class="field"
+        :field-style="fieldstyle"
+        placeholder="请填写到期时间"
+      >
+      </u-field>
+      <view class="" style="text-align: center; color: #fa3534">
+        {{ tishitext }}
+      </view>
+      <view class="btn-box">
+        <u-button @click="yxSubmit" size="mini" type="success" class="box-item"
+          >确定</u-button
+        >
+      </view>
+    </u-popup>
+    <u-calendar
+      v-model="tiemshow"
+      mode="date"
+      :max-date="date"
+      @change="tiemchange"
+    ></u-calendar>
+    <view class="caobox">
+      <view class="caobox_item" v-if="$QueryPermission(358)" @click="toset">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/4.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> 设备控制 </view>
+      </view>
+      <view class="caobox_item" v-if="$QueryPermission(359)" @click="tohis">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/2.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> 历史数据 </view>
+      </view>
+    </view>
+    <view class="realtime">
+      <view class="realtime_title">
+        <p>实时数据</p>
+      </view>
+      <view class="realtime_text">
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>环境温度</p>
+            <p>{{ at }}℃</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>环境湿度</p>
+            <p>{{ ah }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/tianqi.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>天气</p>
+            <p>{{ wea }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/xiayu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>是否下雨</p>
+            <p>{{ rain }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>诱虫次数</p>
+            <p>{{ wormnum }}</p>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				showId:'',
-				baseimei: "",
-				equipInfo: {},
-				trapnum: 1,
-				at: "",
-				ah: "",
-				wind: "",
-				wea: "",
-				rain: "",
-				wormnum: "",
-				decoy: "",
-				xyErr: "",
-				xyErrtime: "",
-				decoytime: "",
-				yxShow: false,
-				tiemshow: false,
-				date: "",
-				fieldstyle: { //输入框样式
-					border: "2rpx solid #f6f6f6",
-					"border-radius": "24px",
-					"padding-left": "20rpx",
-					"background-color": "#f6f6f6"
-				},
-				tishitext:""
-			}
-		},
-		methods: {
-			toset() {
-				uni.navigateTo({
-					url: "./thxyset?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id +
-						"&dtype=" + this.equipInfo.dtype +
-						"&device_name=" + this.equipInfo.device_name
-				})
-			},
-			tohis() {
-				uni.navigateTo({
-					url: "./thxyhisdata?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id
-				})
-			},
-			copy(item) {
-				console.log(item)
-				uni.setClipboardData({
-					data: item.imei || item.device_id,
-					success: function() {
-						console.log('success');
-					}
-				});
-			},
-			async getbaseinfo() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_list',
-					data: {
-						device_id: this.baseimei,
-						device_type_id: "29",
-						page: "1",
-						page_size: "10",
-					}
-				})
-				console.log(res.data[0])
-				this.equipInfo = res.data[0]
-				this.getweather()
-				this.getworm()
-			},
-			async getweather() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=device.device_manage.weathers',
-					data: {
-						lng: Number(this.equipInfo.lng),
-						lat: Number(this.equipInfo.lat),
-					}
-				})
-				console.log(res)
-				// this.
-				if (res[0]) {
-					this.wea = res[0].wea;
-					this.rain = res[0].wea.indexOf("雨") == -1 ? "否" : "是";
-					this.ah = res[0].ah;
-					this.at = res[0].at;
-				} else {
-					this.wea = "暂无"
-					this.rain = "暂无"
-				}
-			},
-			async getworm() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.xycb_pest_chart_new',
-					data: {
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
-						end_time: Math.floor(+new Date() / 1000),
-						device_type_id: "29",
-						years: new Date().getFullYear()
-					}
-				})
-				console.log(res)
-				this.wormnum = res.total_num[new Date().getFullYear()]
-			},
-			setdecoy() {
-				this.decoy = this.equipInfo.decoy
-				this.decoytime = this.equipInfo.xy_expire
-				this.yxShow = true
-			},
-			settime() {
-				console.log(12)
-				this.tiemshow = true
-			},
-			tiemchange(e) {
-				console.log(e)
-				this.decoytime = e.result
-			},
-			async yxSubmit() {
-				var time = Math.floor(+new Date(this.decoytime) / 1000)
-				console.log(time)
-				if (this.decoy == "") {
-					this.tishitext = "请填写诱芯名称"
-					return
-				} else if (isNaN(time)) {
-					this.tishitext = "请填写诱芯到期时间"
-					return
-				}
-				this.tishitext = ""
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.set_decopy',
-					data: {
-						decoy: this.decoy,
-						device_id: this.equipInfo.imei,
-						device_type_id: "29",
-						expire_time: time,
-					}
-				})
-				console.log(res)
-				if (res.status) {
-					uni.showToast({
-						title: "设置成功",
-						icon: "none"
-					})
-					this.yxShow = false
-					this.getbaseinfo()
-				}
-			}
-		},
-		onLoad(option) {
-			var times = new Date()
-			this.date = times.getFullYear() + 1 + "-" + Number(times.getMonth() + 1) + "-" + times.getDate()
-			this.baseimei = option.imei;
-			this.showId = option.showId;
-			// console.log(this.equipInfo)
-			this.getbaseinfo()
-		},
-	}
+export default {
+  data() {
+    return {
+      showId: '',
+      baseimei: '',
+      equipInfo: {},
+      trapnum: 1,
+      at: '',
+      ah: '',
+      wind: '',
+      wea: '',
+      rain: '',
+      wormnum: '',
+      decoy: '',
+      xyErr: '',
+      xyErrtime: '',
+      decoytime: '',
+      yxShow: false,
+      tiemshow: false,
+      date: '',
+      fieldstyle: {
+        //输入框样式
+        border: '2rpx solid #f6f6f6',
+        'border-radius': '24px',
+        'padding-left': '20rpx',
+        'background-color': '#f6f6f6',
+      },
+      tishitext: '',
+    };
+  },
+  methods: {
+    toset() {
+      uni.navigateTo({
+        url:
+          './thxyset?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id +
+          '&dtype=' +
+          this.equipInfo.dtype +
+          '&device_name=' +
+          this.equipInfo.device_name,
+      });
+    },
+    tohis() {
+      uni.navigateTo({
+        url:
+          './thxyhisdata?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id,
+      });
+    },
+    copy(item) {
+      console.log(item);
+      uni.setClipboardData({
+        data: item.imei || item.device_id,
+        success: function () {
+          console.log('success');
+        },
+      });
+    },
+    async getbaseinfo() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_list',
+        data: {
+          device_id: this.baseimei,
+          device_type_id: '29',
+          page: '1',
+          page_size: '10',
+        },
+      });
+      console.log(res.data[0]);
+      this.equipInfo = res.data[0];
+      this.getweather();
+      this.getworm();
+    },
+    async getweather() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=device.device_manage.weathers',
+        data: {
+          lng: Number(this.equipInfo.lng),
+          lat: Number(this.equipInfo.lat),
+        },
+      });
+      console.log(res);
+      // this.
+      if (res[0]) {
+        this.wea = res[0].wea;
+        this.rain = res[0].wea.indexOf('雨') == -1 ? '否' : '是';
+        this.ah = res[0].ah;
+        this.at = res[0].at;
+      } else {
+        this.wea = '暂无';
+        this.rain = '暂无';
+      }
+    },
+    async getworm() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.xycb_pest_chart_new',
+        data: {
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
+          end_time: Math.floor(+new Date() / 1000),
+          device_type_id: '29',
+          years: new Date().getFullYear(),
+        },
+      });
+      console.log(res);
+      this.wormnum = res.total_num[new Date().getFullYear()];
+    },
+    setdecoy() {
+      this.decoy = this.equipInfo.decoy;
+      this.decoytime = this.equipInfo.xy_expire;
+      this.yxShow = true;
+    },
+    settime() {
+      console.log(12);
+      this.tiemshow = true;
+    },
+    tiemchange(e) {
+      console.log(e);
+      this.decoytime = e.result;
+    },
+    async yxSubmit() {
+      var time = Math.floor(+new Date(this.decoytime) / 1000);
+      console.log(time);
+      if (this.decoy == '') {
+        this.tishitext = '请填写诱芯名称';
+        return;
+      } else if (isNaN(time)) {
+        this.tishitext = '请填写诱芯到期时间';
+        return;
+      }
+      this.tishitext = '';
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.set_decopy',
+        data: {
+          decoy: this.decoy,
+          device_id: this.equipInfo.imei,
+          device_type_id: '29',
+          expire_time: time,
+        },
+      });
+      console.log(res);
+      if (res.status) {
+        uni.showToast({
+          title: '设置成功',
+          icon: 'none',
+        });
+        this.yxShow = false;
+        this.getbaseinfo();
+      }
+    },
+  },
+  onLoad(option) {
+    var times = new Date();
+    this.date =
+      times.getFullYear() +
+      1 +
+      '-' +
+      Number(times.getMonth() + 1) +
+      '-' +
+      times.getDate();
+    this.baseimei = option.imei;
+    this.showId = option.showId;
+    // console.log(this.equipInfo)
+    this.getbaseinfo();
+  },
+};
 </script>
 
-<style lang='less'>
-	page {
-		padding: 20rpx;
-		box-sizing: border-box;
+<style lang="less">
+page {
+  padding: 20rpx;
+  box-sizing: border-box;
 
-		.info {
-			padding: 20rpx 40rpx;
-			color: #fff;
-			line-height: 50rpx;
-			font-size: 26rpx;
-			background-size: 100% auto;
-			background-repeat: no-repeat;
-			background-color: #0DC6B6;
-			background-position: top left;
-			box-sizing: border-box;
-			width: 100%;
+  .info {
+    padding: 20rpx 40rpx;
+    color: #fff;
+    line-height: 50rpx;
+    font-size: 26rpx;
+    background-size: 100% auto;
+    background-repeat: no-repeat;
+    background-color: #0dc6b6;
+    background-position: top left;
+    box-sizing: border-box;
+    width: 100%;
 
-			.tishi {
-				width: 28rpx;
-				height: 28rpx;
-				margin: 0rpx 0 0 20rpx;
-			}
-		}
+    .tishi {
+      width: 28rpx;
+      height: 28rpx;
+      margin: 0rpx 0 0 20rpx;
+    }
+  }
 
-		.on {
-			background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png')
-		}
+  .on {
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png');
+  }
 
-		.off {
-			background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png')
-		}
+  .off {
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png');
+  }
 
-		.caobox {
-			display: flex;
-			flex-wrap: wrap;
-			text-align: center;
-			font-size: 28rpx;
-			color: #666;
-			line-height: 50rpx;
+  .caobox {
+    display: flex;
+    flex-wrap: wrap;
+    text-align: center;
+    font-size: 28rpx;
+    color: #666;
+    line-height: 50rpx;
 
-			image {
-				width: 52rpx;
-			}
+    image {
+      width: 52rpx;
+    }
 
-			.caobox_item {
-				padding: 20rpx 0;
-				box-sizing: border-box;
-				flex-basis: 25%;
-			}
-		}
+    .caobox_item {
+      padding: 20rpx 0;
+      box-sizing: border-box;
+      flex-basis: 25%;
+    }
+  }
 
-		.realtime {
-			width: 95%;
-			margin: 0rpx auto;
+  .realtime {
+    width: 95%;
+    margin: 0rpx auto;
 
-			.realtime_title {
-				font-size: 32rpx;
-				display: flex;
-				justify-content: space-between;
-				font-weight: 700;
+    .realtime_title {
+      font-size: 32rpx;
+      display: flex;
+      justify-content: space-between;
+      font-weight: 700;
 
-				.span {
-					color: #6e6c76;
-					font-size: 24rpx;
-					display: flex;
-					justify-content: space-between;
-					margin-top: 12rpx;
-				}
-			}
+      .span {
+        color: #6e6c76;
+        font-size: 24rpx;
+        display: flex;
+        justify-content: space-between;
+        margin-top: 12rpx;
+      }
+    }
 
-			.realtime_text {
-				margin-top: 20rpx;
-				display: flex;
-				justify-content: space-between;
-				flex-wrap: wrap;
+    .realtime_text {
+      margin-top: 20rpx;
+      display: flex;
+      justify-content: space-between;
+      flex-wrap: wrap;
 
-				.realtime_item {
-					width: 48%;
-					height: 100rpx;
-					display: flex;
-					box-shadow: 0 0 10rpx #bcb9ca;
-					margin-top: 20rpx;
-					padding: 20rpx 0;
+      .realtime_item {
+        width: 48%;
+        height: 100rpx;
+        display: flex;
+        box-shadow: 0 0 10rpx #bcb9ca;
+        margin-top: 20rpx;
+        padding: 20rpx 0;
 
-					image {
-						width: 60rpx;
-						height: 60rpx;
-						margin: 20rpx 20rpx 20rpx 40rpx;
-					}
+        image {
+          width: 60rpx;
+          height: 60rpx;
+          margin: 20rpx 20rpx 20rpx 40rpx;
+        }
 
-					.text {
-						padding: 10rpx 0 10rpx 30rpx;
-					}
-				}
-			}
-		}
-	}
+        .text {
+          padding: 10rpx 0 10rpx 30rpx;
+        }
+      }
+    }
+  }
+}
 
-	.btn-box {
-		text-align: center;
-		padding: 20rpx 30rpx;
-	}
+.btn-box {
+  text-align: center;
+  padding: 20rpx 30rpx;
+}
 
-	/deep/.u-calendar__action {
-		display: flex;
-		justify-content: space-around;
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
 
-		.u-calendar__action__text {
-			line-height: 25px;
-		}
-	}
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
 </style>

pages/cb/nlNewXy/thxyhisdata.vue

@@ -1,493 +1,515 @@
 <template>
-	<view>
-		<view class="timeandtype">
-			<view class="timebox">
-				<view class="firsttime" @click="timeshow=true">
-					<view class="" v-if="start_time!=''">
-						{{start_time/1000|timeFormat()}}
-					</view>
-					<view class="" v-else>
-						{{start_time==""?'请选择开始时间':start_time}}
-					</view>
-				</view>
-				<view class="jiange">
-					-
-				</view>
-				<view class="endtime" @click="timeshow=true">
-					<view class="" v-if="end_time!=''">
-						{{end_time/1000|timeFormat()}}
-					</view>
-					<view class="" v-else>
-						{{end_time==""?'请选择结束时间':end_time}}
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="shuju_one">
-			<view class="canvastishi" v-if="!canvastishiTF2">
-				暂无数据
-			</view>
-			<view class="canvastishi" v-if="dataloadingtf2">
-				<p class="dataloading">加载中</p>
-			</view>
-			<canvas v-if="canvastishiTF2" canvas-id="canvasColumnB" id="canvasColumnB" class="charts"
-				@touchstart="touchLineB($event)" @touchmove="moveLineB($event)" @touchend="touchEndLineB($event)"
-				disable-scroll=true
-				:style="{'width':cWidth*pixelRatio+'px','height':cHeight*pixelRatio+'px', 'transform': 'scale('+(1/pixelRatio)+')','margin-left':-cWidth*(pixelRatio-1)/2+'px','margin-top':-cHeight*(pixelRatio-1)/2+'px'}"></canvas>
-		</view>
-		<view class="condition">
-			<scroll-view scroll-top="0" scroll-x="true" class="scroll-X">
-				<table class="table">
-					<tr class="tr">
-						<th class="th" v-for="(item,index) in thdata" :key="'a'+index">{{item[0]}}</th>
-					</tr>
-					<tr class="tr" v-for="(items,indexs) in historylistdata" :key="'b'+indexs">
-						<td class="td" v-for="head in thdata" :key="'head'+ head[1]" >
-							<view v-if="head[1] == 'addtime'">{{items.d_h_t.addtime|timeFormat()}}</view>
-							<view v-else>
-								{{items.d_h_t[head[1]]}}
-							</view>
-						</td>
-					</tr>
-					<tr class="tr" v-if="forbidden">
-						<td class="td" v-for="item in 7">暂无数据</td>
-					</tr>
-				</table>
-			</scroll-view>
-			<view class="pagenumber">
-				<button @click="prev">上一页</button>
-				<view class="pagenumber_page">
-					第 {{page}} 页
-				</view>
-				<view class="pagenumber_page">
-					共 {{pagesum}} 页
-				</view>
-				<button @click="next" :disabled="forbidden">下一页</button>
-			</view>
-		</view>
-		<u-calendar v-model="timeshow" :mode="mode" @change="timechange"></u-calendar>
-	</view>
+  <view>
+    <view class="timeandtype">
+      <view class="timebox">
+        <view class="firsttime" @click="timeshow = true">
+          <view class="" v-if="start_time != ''">
+            {{ (start_time / 1000) | timeFormat() }}
+          </view>
+          <view class="" v-else>
+            {{ start_time == '' ? '请选择开始时间' : start_time }}
+          </view>
+        </view>
+        <view class="jiange"> - </view>
+        <view class="endtime" @click="timeshow = true">
+          <view class="" v-if="end_time != ''">
+            {{ (end_time / 1000) | timeFormat() }}
+          </view>
+          <view class="" v-else>
+            {{ end_time == '' ? '请选择结束时间' : end_time }}
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="shuju_one">
+      <view class="canvastishi" v-if="!canvastishiTF2"> 暂无数据 </view>
+      <view class="canvastishi" v-if="dataloadingtf2">
+        <p class="dataloading">加载中</p>
+      </view>
+      <canvas
+        v-if="canvastishiTF2"
+        canvas-id="canvasColumnB"
+        id="canvasColumnB"
+        class="charts"
+        @touchstart="touchLineB($event)"
+        @touchmove="moveLineB($event)"
+        @touchend="touchEndLineB($event)"
+        disable-scroll="true"
+        :style="{
+          width: cWidth * pixelRatio + 'px',
+          height: cHeight * pixelRatio + 'px',
+          transform: 'scale(' + 1 / pixelRatio + ')',
+          'margin-left': (-cWidth * (pixelRatio - 1)) / 2 + 'px',
+          'margin-top': (-cHeight * (pixelRatio - 1)) / 2 + 'px',
+        }"
+      ></canvas>
+    </view>
+    <view class="condition">
+      <scroll-view scroll-top="0" scroll-x="true" class="scroll-X">
+        <table class="table">
+          <tr class="tr">
+            <th class="th" v-for="(item, index) in thdata" :key="'a' + index">
+              {{ item[0] }}
+            </th>
+          </tr>
+          <tr
+            class="tr"
+            v-for="(items, indexs) in historylistdata"
+            :key="'b' + indexs"
+          >
+            <td class="td" v-for="head in thdata" :key="'head' + head[1]">
+              <view v-if="head[1] == 'addtime'">{{
+                items.d_h_t.addtime | timeFormat()
+              }}</view>
+              <view v-else>
+                {{ items.d_h_t[head[1]] }}
+              </view>
+            </td>
+          </tr>
+          <tr class="tr" v-if="forbidden">
+            <td class="td" v-for="item in 7">暂无数据</td>
+          </tr>
+        </table>
+      </scroll-view>
+      <view class="pagenumber">
+        <button @click="prev">上一页</button>
+        <view class="pagenumber_page"> 第 {{ page }} 页 </view>
+        <view class="pagenumber_page"> 共 {{ pagesum }} 页 </view>
+        <button @click="next" :disabled="forbidden">下一页</button>
+      </view>
+    </view>
+    <u-calendar
+      v-model="timeshow"
+      :mode="mode"
+      @change="timechange"
+    ></u-calendar>
+  </view>
 </template>
 
 <script>
-	import uCharts from '../../../components/js_sdk/u-charts/u-charts/u-charts.js';
-	import Circulation from "../../../static/js/equipState_dict.json"
-	var canvaColumnA = null;
-	var canvaColumnB = null
-	export default {
-		data() {
-			return {
-				start_time: "",
-				end_time: "",
-				timeshow: false,
-				mode: 'range',
-				cWidth: '400',
-				cHeight: '400',
-				pixelRatio: 1,
-				canvastishiTF: false,
-				dataloadingtf: false,
-				canvastishiTF2: false,
-				dataloadingtf2: false,
-				equipInfo: {},
-				historylistdata: [],
-				thdata: [
-					['上报时间', 'addtime'],
-					['电池功率', 'battery_p'],
-					['太阳能板电流', 'solar_c'],
-					['太阳能板功率', 'solar_p'],
-					['电池电压', 'battery_v'],
-					['太阳能板电压', 'solar_v'],
-					['电池电流', 'battery_c'],
-				],
-				page: 1,
-				pagesum: "10",
-				Circulation: Circulation,
-				forbidden: false
-			}
-		},
-		methods: {
-			timechange(e) {
-				this.start_time = +new Date(e.startDate)
-				this.end_time = +new Date(e.endDate)
-				this.page = 1;
-				this.history()
-				this.getworm()
-				this.getwind()
-			},
-			async history() { //历史数据列表折线图
-				this.dataloadingtf = true
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_at_ah',
-					data: {
-						device_type_id: 8,
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date(this.start_time) / 1000),
-						end_time: Math.floor(+new Date(this.end_time) / 1000),
-					}
-				})
-				console.log(res)
-				this.dataloadingtf = false
-				this.historydatas = res
-			},
-			async getworm() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.xycb_pest_chart_new',
-					data: {
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date(this.start_time) / 1000),
-						end_time: Math.floor(+new Date(this.end_time) / 1000),
-						device_type_id: 29,
-						years: new Date().getFullYear()
-					}
-				})
-				console.log(res)
-				this.dataloadingtf2 = false
-				var data = res.pest_data
-				if (data.length == 0) {
-					this.canvastishiTF2 = false
-				} else {
-					this.canvastishiTF2 = true
-					// console.log(arr1)
-					var obj = [{
-						name: '诱虫次数',
-						data: res.pest_data[0],
-						color: '#00E29D'
-					}]
-					this.showColumn2("canvasColumnB", res.md_lst, obj)
-				}
-			},
-			async getwind() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_history_data',
-					data: {
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date(this.start_time) / 1000),
-						end_time: Math.floor(+new Date(this.end_time) / 1000),
-						device_id: this.equipInfo.device_id,
-						page: this.page,
-					}
-				})
-				this.historylistdata = res.data
-				this.pagesum = Math.ceil(res.counts / 10)
-				if (res.data.length) {
-					this.forbidden = false
-				} else {
-					this.forbidden = true
-				}
-			},
-			prev() { //上一页
-				if (this.page > 1) {
-					this.page--
-					this.getwind()
-				}
-			},
-			next() { //下一页
-				if (this.page < this.pagesum) {
-					this.page++
-					this.getwind()
-				}
-			},
-			showColumn(id, xtitle, xinfo) {
-				var _self = this
-				const ctx = uni.createCanvasContext(id, this);
-				canvaColumnA = new uCharts({
-					context: ctx,
-					type: 'line',
-					legend: {
-						position: "top"
-					},
-					fontSize: 11,
-					background: '#FFFFFF',
-					pixelRatio: 1,
-					animation: true,
-					dataLabel: false,
-					categories: xtitle,
-					series: xinfo,
-					enableScroll: true, //开启图表拖拽功能
-					xAxis: {
-						disableGrid: true,
-						type: 'grid',
-						gridType: 'dash',
-						itemCount: 4, //x轴单屏显示数据的数量，默认为5个
-						scrollShow: true, //新增是否显示滚动条，默认false
-						// scrollAlign: 'left', //滚动条初始位置
-						scrollBackgroundColor: '#F7F7FF', //默认为 #EFEBEF
-						scrollColor: '#DEE7F7', //默认为 #A6A6A6
-					},
-					yAxis: {},
-					width: _self.cWidth * 1,
-					height: _self.cHeight * 1,
-					extra: {
-						line: {
-							type: 'curve'
-						}
-					}
-				});
-			},
-			showColumn2(id, xtitle, xinfo) {
-				var _self = this
-				const ctx = uni.createCanvasContext(id, this);
-				canvaColumnB = new uCharts({
-					context: ctx,
-					type: 'line',
-					legend: {
-						position: "top"
-					},
-					fontSize: 11,
-					background: '#FFFFFF',
-					pixelRatio: 1,
-					animation: true,
-					dataLabel: false,
-					categories: xtitle,
-					series: xinfo,
-					enableScroll: true, //开启图表拖拽功能
-					xAxis: {
-						disableGrid: true,
-						type: 'grid',
-						gridType: 'dash',
-						itemCount: 4, //x轴单屏显示数据的数量，默认为5个
-						scrollShow: true, //新增是否显示滚动条，默认false
-						// scrollAlign: 'left', //滚动条初始位置
-						scrollBackgroundColor: '#F7F7FF', //默认为 #EFEBEF
-						scrollColor: '#DEE7F7', //默认为 #A6A6A6
-					},
-					yAxis: {},
-					width: _self.cWidth * 1,
-					height: _self.cHeight * 1,
-					extra: {
-						line: {
-							type: 'curve'
-						}
-					}
-				});
-			},
-			touchLineA(e) {
-				console.log(e)
-				canvaColumnA.scrollStart(e);
-			},
-			moveLineA(e) {
-				canvaColumnA.scroll(e);
-			},
-			touchEndLineA(e) {
-				canvaColumnA.scrollEnd(e);
-				//下面是toolTip事件，如果滚动后不需要显示，可不填写
-				canvaColumnA.showToolTip(e, {
-					format: function(item, category) {
-						return category + ' ' + item.name + ':' + item.data
-					}
-				});
-			},
-			touchLineB(e) {
-				console.log(e)
-				canvaColumnB.scrollStart(e);
-			},
-			moveLineB(e) {
-				canvaColumnB.scroll(e);
-			},
-			touchEndLineB(e) {
-				canvaColumnB.scrollEnd(e);
-				//下面是toolTip事件，如果滚动后不需要显示，可不填写
-				canvaColumnB.showToolTip(e, {
-					format: function(item, category) {
-						return category + ' ' + item.name + ':' + item.data
-					}
-				});
-			},
-		},
-		onLoad(option) {
-			this.equipInfo = option
-			console.log(option)
-			this.end_time = +new Date()
-			this.start_time = +new Date() - 30 * 24 * 60 * 60 * 1000
-			this.cWidth = uni.upx2px(650);
-			this.cHeight = uni.upx2px(500);
-			this.history()
-			this.getworm()
-			this.getwind()
-		}
-	}
+import uCharts from '../../../components/js_sdk/u-charts/u-charts/u-charts.js';
+import Circulation from '../../../static/js/equipState_dict.json';
+var canvaColumnA = null;
+var canvaColumnB = null;
+export default {
+  data() {
+    return {
+      start_time: '',
+      end_time: '',
+      timeshow: false,
+      mode: 'range',
+      cWidth: '400',
+      cHeight: '400',
+      pixelRatio: 1,
+      canvastishiTF: false,
+      dataloadingtf: false,
+      canvastishiTF2: false,
+      dataloadingtf2: false,
+      equipInfo: {},
+      historylistdata: [],
+      thdata: [
+        ['上报时间', 'addtime'],
+        ['电池功率', 'battery_p'],
+        ['太阳能板电流', 'solar_c'],
+        ['太阳能板功率', 'solar_p'],
+        ['电池电压', 'battery_v'],
+        ['太阳能板电压', 'solar_v'],
+        ['电池电流', 'battery_c'],
+      ],
+      page: 1,
+      pagesum: '10',
+      Circulation: Circulation,
+      forbidden: false,
+    };
+  },
+  methods: {
+    timechange(e) {
+      this.start_time = +new Date(e.startDate);
+      this.end_time = +new Date(e.endDate);
+      this.page = 1;
+      this.history();
+      this.getworm();
+      this.getwind();
+    },
+    async history() {
+      //历史数据列表折线图
+      this.dataloadingtf = true;
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_at_ah',
+        data: {
+          device_type_id: 8,
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date(this.start_time) / 1000),
+          end_time: Math.floor(+new Date(this.end_time) / 1000),
+        },
+      });
+      console.log(res);
+      this.dataloadingtf = false;
+      this.historydatas = res;
+    },
+    async getworm() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.xycb_pest_chart_new',
+        data: {
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date(this.start_time) / 1000),
+          end_time: Math.floor(+new Date(this.end_time) / 1000),
+          device_type_id: 29,
+          years: new Date().getFullYear(),
+        },
+      });
+      console.log(res);
+      this.dataloadingtf2 = false;
+      var data = res.pest_data;
+      if (data.length == 0) {
+        this.canvastishiTF2 = false;
+      } else {
+        this.canvastishiTF2 = true;
+        // console.log(arr1)
+        var obj = [
+          {
+            name: '诱虫次数',
+            data: res.pest_data[0],
+            color: '#00E29D',
+          },
+        ];
+        this.showColumn2('canvasColumnB', res.md_lst, obj);
+      }
+    },
+    async getwind() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_history_data',
+        data: {
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date(this.start_time) / 1000),
+          end_time: Math.floor(+new Date(this.end_time) / 1000),
+          device_id: this.equipInfo.device_id,
+          page: this.page,
+        },
+      });
+      this.historylistdata = res.data;
+      this.pagesum = Math.ceil(res.counts / 10);
+      if (res.data.length) {
+        this.forbidden = false;
+      } else {
+        this.forbidden = true;
+      }
+    },
+    prev() {
+      //上一页
+      if (this.page > 1) {
+        this.page--;
+        this.getwind();
+      }
+    },
+    next() {
+      //下一页
+      if (this.page < this.pagesum) {
+        this.page++;
+        this.getwind();
+      }
+    },
+    showColumn(id, xtitle, xinfo) {
+      var _self = this;
+      const ctx = uni.createCanvasContext(id, this);
+      canvaColumnA = new uCharts({
+        context: ctx,
+        type: 'line',
+        legend: {
+          position: 'top',
+        },
+        fontSize: 11,
+        background: '#FFFFFF',
+        pixelRatio: 1,
+        animation: true,
+        dataLabel: false,
+        categories: xtitle,
+        series: xinfo,
+        enableScroll: true, //开启图表拖拽功能
+        xAxis: {
+          disableGrid: true,
+          type: 'grid',
+          gridType: 'dash',
+          itemCount: 4, //x轴单屏显示数据的数量，默认为5个
+          scrollShow: true, //新增是否显示滚动条，默认false
+          // scrollAlign: 'left', //滚动条初始位置
+          scrollBackgroundColor: '#F7F7FF', //默认为 #EFEBEF
+          scrollColor: '#DEE7F7', //默认为 #A6A6A6
+        },
+        yAxis: {},
+        width: _self.cWidth * 1,
+        height: _self.cHeight * 1,
+        extra: {
+          line: {
+            type: 'curve',
+          },
+        },
+      });
+    },
+    showColumn2(id, xtitle, xinfo) {
+      var _self = this;
+      const ctx = uni.createCanvasContext(id, this);
+      canvaColumnB = new uCharts({
+        context: ctx,
+        type: 'line',
+        legend: {
+          position: 'top',
+        },
+        fontSize: 11,
+        background: '#FFFFFF',
+        pixelRatio: 1,
+        animation: true,
+        dataLabel: false,
+        categories: xtitle,
+        series: xinfo,
+        enableScroll: true, //开启图表拖拽功能
+        xAxis: {
+          disableGrid: true,
+          type: 'grid',
+          gridType: 'dash',
+          itemCount: 4, //x轴单屏显示数据的数量，默认为5个
+          scrollShow: true, //新增是否显示滚动条，默认false
+          // scrollAlign: 'left', //滚动条初始位置
+          scrollBackgroundColor: '#F7F7FF', //默认为 #EFEBEF
+          scrollColor: '#DEE7F7', //默认为 #A6A6A6
+        },
+        yAxis: {},
+        width: _self.cWidth * 1,
+        height: _self.cHeight * 1,
+        extra: {
+          line: {
+            type: 'curve',
+          },
+        },
+      });
+    },
+    touchLineA(e) {
+      console.log(e);
+      canvaColumnA.scrollStart(e);
+    },
+    moveLineA(e) {
+      canvaColumnA.scroll(e);
+    },
+    touchEndLineA(e) {
+      canvaColumnA.scrollEnd(e);
+      //下面是toolTip事件，如果滚动后不需要显示，可不填写
+      canvaColumnA.showToolTip(e, {
+        format: function (item, category) {
+          return category + ' ' + item.name + ':' + item.data;
+        },
+      });
+    },
+    touchLineB(e) {
+      console.log(e);
+      canvaColumnB.scrollStart(e);
+    },
+    moveLineB(e) {
+      canvaColumnB.scroll(e);
+    },
+    touchEndLineB(e) {
+      canvaColumnB.scrollEnd(e);
+      //下面是toolTip事件，如果滚动后不需要显示，可不填写
+      canvaColumnB.showToolTip(e, {
+        format: function (item, category) {
+          return category + ' ' + item.name + ':' + item.data;
+        },
+      });
+    },
+  },
+  onLoad(option) {
+    this.equipInfo = option;
+    console.log(option);
+    this.end_time = +new Date();
+    this.start_time = +new Date() - 30 * 24 * 60 * 60 * 1000;
+    this.cWidth = uni.upx2px(650);
+    this.cHeight = uni.upx2px(500);
+    this.history();
+    this.getworm();
+    this.getwind();
+  },
+};
 </script>
 
 <style lang="less">
-	.timeandtype {
-		// background-color: #F6F6FB;
-		// padding: 20rpx;
-		box-sizing: border-box;
-		width: 90%;
-		margin: 40rpx auto 0;
+.timeandtype {
+  // background-color: #F6F6FB;
+  // padding: 20rpx;
+  box-sizing: border-box;
+  width: 90%;
+  margin: 40rpx auto 0;
 
-		.timebox {
-			box-shadow: 0 0 10rpx #bcb9ca;
-			display: flex;
-			background-color: #fff;
-			padding: 10px;
-			border-top-right-radius: 5px;
-			border-top-left-radius: 5px;
+  .timebox {
+    box-shadow: 0 0 10rpx #bcb9ca;
+    display: flex;
+    background-color: #fff;
+    padding: 10px;
+    border-top-right-radius: 5px;
+    border-top-left-radius: 5px;
 
-			.jiange {
-				width: 5%;
-				text-align: center;
-			}
+    .jiange {
+      width: 5%;
+      text-align: center;
+    }
 
-			.firsttime,
-			.endtime {
-				width: 45%;
-				text-align: center;
-			}
-		}
+    .firsttime,
+    .endtime {
+      width: 45%;
+      text-align: center;
+    }
+  }
 
-		.warntypebox {
-			display: flex;
-			justify-content: space-between;
-			background-color: #fff;
-			padding: 10px;
-			border-top: 1px solid #F6F6FB;
-			border-bottom-right-radius: 5px;
-			border-bottom-left-radius: 5px;
-		}
-	}
+  .warntypebox {
+    display: flex;
+    justify-content: space-between;
+    background-color: #fff;
+    padding: 10px;
+    border-top: 1px solid #f6f6fb;
+    border-bottom-right-radius: 5px;
+    border-bottom-left-radius: 5px;
+  }
+}
 
-	.shuju_one {
-		position: relative;
-		width: 90%;
-		margin: 30rpx auto;
-		box-shadow: 0 0 10rpx #bcb9ca;
-		padding-top: 20rpx;
-		height: 550rpx;
+.shuju_one {
+  position: relative;
+  width: 90%;
+  margin: 30rpx auto;
+  box-shadow: 0 0 10rpx #bcb9ca;
+  padding-top: 20rpx;
+  height: 550rpx;
 
-		.canvastishi {
-			font-size: 32rpx;
-			position: absolute;
-			top: 50%;
-			left: 50%;
-			margin-left: -64rpx;
-			margin-top: -21rpx;
+  .canvastishi {
+    font-size: 32rpx;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin-left: -64rpx;
+    margin-top: -21rpx;
 
-			.dataloading:after {
-				overflow: hidden;
-				display: inline-block;
-				vertical-align: bottom;
-				animation: ellipsis 2s infinite;
-				content: "\2026";
-			}
+    .dataloading:after {
+      overflow: hidden;
+      display: inline-block;
+      vertical-align: bottom;
+      animation: ellipsis 2s infinite;
+      content: '\2026';
+    }
 
-			@keyframes ellipsis {
-				from {
-					width: 2px;
-				}
+    @keyframes ellipsis {
+      from {
+        width: 2px;
+      }
 
-				to {
-					width: 15px;
-				}
-			}
-		}
+      to {
+        width: 15px;
+      }
+    }
+  }
 
-		.shuju_one_title {
-			width: 70%;
-			margin: 0 auto;
-			display: flex;
+  .shuju_one_title {
+    width: 70%;
+    margin: 0 auto;
+    display: flex;
 
-			.tltle_text {
-				width: 25%;
-				border: 2rpx solid #B2B2B2;
-				color: #57c878;
-				text-align: center;
-				font-size: 24rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-			}
+    .tltle_text {
+      width: 25%;
+      border: 2rpx solid #b2b2b2;
+      color: #57c878;
+      text-align: center;
+      font-size: 24rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+    }
 
-			.title_text_color {
-				width: 25%;
-				border: 2rpx solid #57c878;
-				background-color: #57c878;
-				color: #fff;
-				text-align: center;
-				font-size: 24rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-			}
-		}
-	}
+    .title_text_color {
+      width: 25%;
+      border: 2rpx solid #57c878;
+      background-color: #57c878;
+      color: #fff;
+      text-align: center;
+      font-size: 24rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+    }
+  }
+}
 
-	/deep/.u-calendar__action {
-		display: flex;
-		justify-content: space-around;
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
 
-		.u-calendar__action__text {
-			line-height: 25px;
-		}
-	}
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
 
-	.condition {
-		display: flex;
-		flex-wrap: wrap;
-		width: 90%;
-		margin: 30rpx auto;
-		box-shadow: 0 0 10rpx #bcb9ca;
-		margin-bottom: 30rpx;
+.condition {
+  display: flex;
+  flex-wrap: wrap;
+  width: 90%;
+  margin: 30rpx auto;
+  box-shadow: 0 0 10rpx #bcb9ca;
+  margin-bottom: 30rpx;
 
-		.scroll-X {
-			width: 95%;
-			margin: 20rpx auto;
+  .scroll-X {
+    width: 95%;
+    margin: 20rpx auto;
 
-			.table {
-				// width: 1672px;
-			}
+    .table {
+      // width: 1672px;
+    }
 
-			.tr {
-				display: flex;
-				overflow: hidden;
+    .tr {
+      display: flex;
+      overflow: hidden;
 
-				.th,
-				.td {
-					display: inline-block;
-					padding: 5rpx;
-					width: 240rpx;
-					text-align: center;
-					height: 52rpx;
-					line-height: 52rpx;
-					border: 2rpx solid #F1F1F1;
-				}
+      .th,
+      .td {
+        display: inline-block;
+        padding: 5rpx;
+        width: 240rpx;
+        text-align: center;
+        height: 52rpx;
+        line-height: 52rpx;
+        border: 2rpx solid #f1f1f1;
+      }
 
-				.th:first-child,
-				.td:first-child {
-					width: 300rpx;
-				}
-			}
+      .th:first-child,
+      .td:first-child {
+        width: 300rpx;
+      }
+    }
 
-			.tr:nth-child(2n-1) {
-				background-color: #f5fff8;
-			}
+    .tr:nth-child(2n-1) {
+      background-color: #f5fff8;
+    }
 
-			.tr:first-child {
-				background-color: #57c878;
-				color: #fff;
-			}
-		}
+    .tr:first-child {
+      background-color: #57c878;
+      color: #fff;
+    }
+  }
 
-		.pagenumber {
-			display: flex;
-			margin: 20rpx auto;
+  .pagenumber {
+    display: flex;
+    margin: 20rpx auto;
 
-			button {
-				width: 150rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-				background-color: #57c878;
-				color: #FFFFFF;
-			}
+    button {
+      width: 150rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+      font-size: 26rpx;
+      text-align: center;
+      background-color: #57c878;
+      color: #ffffff;
+    }
 
-			.pagenumber_page {
-				// width: 100rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-				margin: 0 20rpx;
-			}
-		}
-	}
-</style>
+    .pagenumber_page {
+      // width: 100rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+      font-size: 26rpx;
+      text-align: center;
+      margin: 0 20rpx;
+    }
+  }
+}
+</style>

pages/cb/shuifeiL/history.vue

@@ -4,9 +4,16 @@
       <scroll-view scroll-top="0" scroll-x="true" class="scroll-X">
         <table class="table">
           <tr class="tr">
-            <th class="th" v-for="(item, index) in thdata" :key="'a' + index">{{ item }}</th>
+            <th class="th" v-for="(item, index) in thdata" :key="'a' + index">
+              {{ item }}
+            </th>
           </tr>
-          <tr class="tr" v-for="(items, indexs) in statusList" :key="'b' + indexs" v-if="statusList.length > 0">
+          <tr
+            class="tr"
+            v-for="(items, indexs) in statusList"
+            :key="'b' + indexs"
+            v-if="statusList.length > 0"
+          >
             <td class="td">{{ items.device_name }}</td>
             <td class="td">{{ items.device_id }}</td>
             <td class="td">{{ items.name }}</td>
@@ -28,15 +35,11 @@
         </table>
       </scroll-view>
       <view class="pagenumber">
-					<button @click="prev">上一页</button>
-					<view class="pagenumber_page">
-						第 {{page}} 页
-					</view>
-					<view class="pagenumber_page">
-						共 {{pagesum}} 页
-					</view>
-					<button @click="next" :disabled="forbidden">下一页</button>
-				</view>
+        <button @click="prev">上一页</button>
+        <view class="pagenumber_page"> 第 {{ page }} 页 </view>
+        <view class="pagenumber_page"> 共 {{ pagesum }} 页 </view>
+        <button @click="next" :disabled="forbidden">下一页</button>
+      </view>
     </view>
   </view>
 </template>
@@ -46,8 +49,8 @@ export default {
   data() {
     return {
       device_id: {},
-      pagesum:1,
-      page:1,
+      pagesum: 1,
+      page: 1,
       type: '',
       statusList: [],
       thdata: [
@@ -58,22 +61,24 @@ export default {
         '从机名称',
         '时间',
         '值',
-      ]
-    }
+      ],
+    };
   },
   methods: {
-			prev() { //上一页
-				if (this.page > 1) {
-					this.page--
-					this.geDetail()
-				}
-			},
-			next() { //下一页
-				if (this.page < this.pagesum) {
-					this.page++
-					this.geDetail()
-				}
-			},
+    prev() {
+      //上一页
+      if (this.page > 1) {
+        this.page--;
+        this.geDetail();
+      }
+    },
+    next() {
+      //下一页
+      if (this.page < this.pagesum) {
+        this.page++;
+        this.geDetail();
+      }
+    },
     async geDetail() {
       const res = await this.$myRequest({
         url: '/api/api_gateway?method=irrigation_system.waterfertilizer.water_fer_history_data',
@@ -81,23 +86,23 @@ export default {
           dataPointId: this.device_id,
           page: this.page,
           page_size: 10,
-        }
-      })
-      this.pagesum = Math.ceil(res.data.nums / 10) || 1
+        },
+      });
+      this.pagesum = Math.ceil(res.data.nums / 10) || 1;
       if (res.data.length > 0) {
-        this.statusList = res.data
+        this.statusList = res.data;
       }
     },
   },
   onLoad(option) {
     this.device_id = option.device_id;
     this.type = option.type;
-    this.geDetail()
+    this.geDetail();
   },
-}
+};
 </script>
 
-<style lang='less'>
+<style lang="less">
 page {
   padding: 20rpx;
   box-sizing: border-box;
@@ -138,32 +143,31 @@ page {
         color: #fff;
       }
     }
-    
-		.pagenumber {
-			display: flex;
-			margin: 20rpx auto;
+
+    .pagenumber {
+      display: flex;
+      margin: 20rpx auto;
       width: 100%;
       justify-content: space-around;
 
-			button {
-				width: 150rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-				background-color: #57c878;
-				color: #FFFFFF;
-			}
-
-			.pagenumber_page {
-				// width: 100rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-			}
-		}
+      button {
+        width: 150rpx;
+        height: 50rpx;
+        line-height: 50rpx;
+        font-size: 26rpx;
+        text-align: center;
+        background-color: #57c878;
+        color: #ffffff;
+      }
 
+      .pagenumber_page {
+        // width: 100rpx;
+        height: 50rpx;
+        line-height: 50rpx;
+        font-size: 26rpx;
+        text-align: center;
+      }
+    }
   }
 }
 
@@ -172,7 +176,7 @@ page {
   padding: 20rpx 30rpx;
 }
 
-/deep/.u-calendar__action {
+::v-deep .u-calendar__action {
   display: flex;
   justify-content: space-around;
 
@@ -180,4 +184,4 @@ page {
     line-height: 25px;
   }
 }
-</style>
+</style>

pages/cb/shuifeiL/shuifeiL.vue

@@ -1,30 +1,37 @@
 <template>
   <view>
     <view :class="['info', equipInfo.is_online == 1 ? 'on' : 'off']">
+      <view class=""> 设备ID：{{ equipInfo.device_id }} </view>
       <view class="">
-        设备ID：{{ equipInfo.device_id }}
-      </view>
-      <view class="">
-        设备名称：{{ equipInfo.device_name == "" ? "无" : equipInfo.device_name }}水肥机
-      </view>
-      <view class="">
-        设备类型：{{ equipInfo.dver_num }}
-      </view>
-      <view class="">
-        设备地址：{{ equipInfo.city }}
+        设备名称：{{
+          equipInfo.device_name == '' ? '无' : equipInfo.device_name
+        }}水肥机
       </view>
+      <view class=""> 设备类型：{{ equipInfo.dver_num }} </view>
+      <view class=""> 设备地址：{{ equipInfo.city }} </view>
     </view>
     <view class="infoText">设备变量</view>
     <view class="realtime">
       <scroll-view scroll-top="0" scroll-x="true" class="scroll-X">
         <table class="table">
           <tr class="tr">
-            <th class="th" v-for="(item, index) in thdata" :key="'a' + index">{{ item }}</th>
+            <th class="th" v-for="(item, index) in thdata" :key="'a' + index">
+              {{ item }}
+            </th>
           </tr>
-          <tr class="tr" v-for="(items, indexs) in statusList" :key="'b' + indexs" v-if="statusList.length > 0">
+          <tr
+            class="tr"
+            v-for="(items, indexs) in statusList"
+            :key="'b' + indexs"
+            v-if="statusList.length > 0"
+          >
             <td class="td">{{ items.d_id }}</td>
             <td class="td">{{ items.name }}</td>
-            <td class="td"><u-button type="success" size="mini" @click="goHistory(items)">历史记录</u-button></td>
+            <td class="td">
+              <u-button type="success" size="mini" @click="goHistory(items)"
+                >历史记录</u-button
+              >
+            </td>
           </tr>
           <tr class="tr" v-else>
             <td class="td" v-for="item in 4">暂无数据</td>
@@ -41,12 +48,8 @@ export default {
     return {
       equipInfo: {},
       statusList: [],
-      thdata: [
-        '变量ID',
-        '变量名称',
-        '操作'
-      ]
-    }
+      thdata: ['变量ID', '变量名称', '操作'],
+    };
   },
   methods: {
     copy(item) {
@@ -54,23 +57,23 @@ export default {
         data: item.imei || item.device_id,
         success: function () {
           console.log('success');
-        }
+        },
       });
     },
     goHistory(items) {
       uni.navigateTo({
-        url: `./history?device_id=${items.d_id}&type=${items.types}`
-      })
+        url: `./history?device_id=${items.d_id}&type=${items.types}`,
+      });
     },
     async geDetail() {
       const res = await this.$myRequest({
         url: '/api/api_gateway?method=irrigation_system.waterfertilizer.water_fertilizer_list',
         data: {
           content: this.equipInfo.device_id,
-        }
-      })
+        },
+      });
       if (res.data.length > 0) {
-        this.equipInfo = res.data[0]
+        this.equipInfo = res.data[0];
       }
     },
     async geList() {
@@ -78,30 +81,36 @@ export default {
         url: '/api/api_gateway?method=irrigation_system.waterfertilizer.water_fertilizer_data_list',
         data: {
           device_id: this.equipInfo.device_id,
-        }
-      })
+        },
+      });
       if (res.length > 0) {
-        this.statusList = res
+        this.statusList = res;
       }
     },
   },
   onLoad(option) {
-    var times = new Date()
-    this.date = times.getFullYear() + 1 + "-" + Number(times.getMonth() + 1) + "-" + times.getDate()
+    var times = new Date();
+    this.date =
+      times.getFullYear() +
+      1 +
+      '-' +
+      Number(times.getMonth() + 1) +
+      '-' +
+      times.getDate();
     this.equipInfo = JSON.parse(option.detail);
-    this.geDetail()
-    this.geList()
+    this.geDetail();
+    this.geList();
   },
-}
+};
 </script>
 
-<style lang='less'>
+<style lang="less">
 page {
   padding: 20rpx;
   box-sizing: border-box;
 
   .infoText {
-    color: #0DC6B6;
+    color: #0dc6b6;
   }
 
   .info {
@@ -111,7 +120,7 @@ page {
     font-size: 26rpx;
     background-size: 100% auto;
     background-repeat: no-repeat;
-    background-color: #0DC6B6;
+    background-color: #0dc6b6;
     background-position: top left;
     box-sizing: border-box;
     width: 100%;
@@ -125,11 +134,11 @@ page {
   }
 
   .on {
-    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png')
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png');
   }
 
   .off {
-    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png')
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png');
   }
 
   .caobox {
@@ -187,7 +196,6 @@ page {
         color: #fff;
       }
     }
-
   }
 }
 
@@ -196,7 +204,7 @@ page {
   padding: 20rpx 30rpx;
 }
 
-/deep/.u-calendar__action {
+::v-deep .u-calendar__action {
   display: flex;
   justify-content: space-around;
 
@@ -204,4 +212,4 @@ page {
     line-height: 25px;
   }
 }
-</style>
+</style>

pages/cb/shuifeizs/components/base.vue

@@ -0,0 +1,88 @@
+<template>
+  <view class="base-container">
+    <view class="base-list">
+      <view class="base-item" v-for="(item, index) in dataList" :key="index">
+        <view class="base-item-value">{{ item.value }}</view>
+        <view class="base-item-label">{{
+          item.sfDisplayname || item.sfName
+        }}</view>
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+export default {
+  props: {
+    dataList: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  data() {
+    return {
+      list: [
+        {
+          label: 'PH值',
+          value: '0.00',
+        },
+        {
+          label: 'EC值',
+          value: '987 us',
+        },
+        {
+          label: '水温',
+          value: '20 ℃',
+        },
+        {
+          label: '管道压力',
+          value: '20 Pa',
+        },
+      ],
+    };
+  },
+};
+</script>
+<style scoped lang="scss">
+.base-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  height: 100%;
+  width: calc(100% - 64rpx);
+  height: 88rpx;
+  padding: 16rpx 0;
+  margin: 0 32rpx;
+  justify-content: space-between;
+  border-radius: 16rpx;
+  background: linear-gradient(180deg, #edfbfb 0%, #d2f2ed 100%);
+  margin-bottom: 30rpx;
+  .base-list {
+    width: 100%;
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    .base-item {
+      text-align: center;
+      .base-item-value {
+        width: 150rpx;
+        color: #042118;
+        font-family: 'Source Han Sans CN VF';
+        font-size: 32rpx;
+        font-weight: 500;
+        text-align: center;
+      }
+      .base-item-label {
+        width: 150rpx;
+        color: #687a74;
+        font-family: 'Source Han Sans CN VF';
+        text-align: center;
+        font-size: 28rpx;
+        font-weight: 400;
+        // 超出隐藏
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+  }
+}
+</style>

pages/cb/shuifeizs/components/facilitystate.vue

@@ -0,0 +1,328 @@
+<template>
+  <view class="facilitystate-container">
+    <view class="facilitystate-title-warp">
+      <view class="facilitystate-title">
+        <view class="radius-user"></view>使用中
+      </view>
+      <view class="facilitystate-subtitle">
+        <view class="radius-close"></view>
+      已关闭</view>
+    </view>
+    <view class="facilitystate-list">
+      <image :src="ggbCurrent.value == 1?bucketOpenTop:bucketCloseTop" class="bucketOpenTop" />
+      <image :src="sfbCurrent.value == 1?bucketOpenTop:bucketCloseTop" class="bucketOpenTop2"/>
+      <view class="facilitystate-list__left" />
+        <view
+          class="facilitystate-item"
+          v-for="(item, index) in alreadyfertilizerBucketList"
+          :key="index"
+        >
+          <view class="facilitystate-item__label">
+            <view class="facilitystate-item__label-text">{{getTopDeviceName(item.childrenList)}}</view>
+            <view class="facilitystate-item__label-value">{{getBottomDeviceName(item.childrenList)}}</view>
+          </view>
+          <view class="facilitystate-item__image">
+            <image :src="getJSCurrentValue(item.childrenList)?bucketOpen:bucketClose" class="bucketClose"/>
+            <image :src="fertTopBottom" v-if="index == alreadyfertilizerBucketList.length - 1? false:true" class="facilitystate-item__bg"/>
+            <image :src="fertTopBottomRadius" v-else class="facilitystate-item__bg2"/>
+            <view class="facilitystate-item-fan">
+              <view class="fertTopBottom">
+              <text class="fertTopBottom-text">{{item.sfDisplayname || item.sfName}}</text>
+              <image :src="getJBCurrentValue(item.childrenList)? fanRun : fan" class="fan" :class="{'fan-run': getJBCurrentValue(item.childrenList)}" />
+              </view>
+            </view>
+            <image :src="getXSCurrentValue(item.childrenList)?bucketOpen:bucketClose" class="bucketClose1" />
+          </view>
+        </view>
+      </view>
+      <irrigatedArea :irrigatedAreaList="irrigatedAreaList"/>
+    </view>
+  </view>
+</template>
+<script>
+import fertTopBottom from '../assets/fertTopBottom.png';
+import fertTopBottomRadius from '../assets/fertTopBottomRadius.png';
+import irrigatedArea from './irrigatedArea.vue';
+import fan from '../assets/fan.png';
+import fanRun from '../assets/fanRun.png';
+import bucketOpenTop from '../assets/bucketOpenTop.png';
+import bucketCloseTop from '../assets/bucketCloseTop.png';
+import bucketClose from '../assets/bucketClose.png';
+import bucketOpen from '../assets/bucketOpen.png';
+
+export default {
+  props:{
+    irrigatedAreaList:{
+      type:Array,
+      default:()=>[]
+    },
+    alreadyfertilizerBucketList:{
+      type:Array,
+      default:()=>[]
+    },
+    ggbCurrent:{
+      type:Object,
+      default:()=>{}
+    },
+    sfbCurrent:{
+      type:Object,
+      default:()=>{}
+    }
+  },
+  components:{
+    irrigatedArea
+  },
+  data() {
+    return {
+      fan,
+      fanRun,
+      fertTopBottom,
+      bucketOpenTop,
+      bucketOpenTopStatus:false,
+      bucketOpenTopStatus2:false,
+      bucketCloseTop,
+      bucketClose,
+      bucketOpen,
+      fertTopBottomRadius,
+    };
+  },
+  methods:{
+    getTopDeviceName(list){
+      let current = {}
+      list?.forEach(item =>{
+        if(item.sfType === '6'){
+          const name = item.sfCode;
+          if(name.indexOf('lsb') != -1){
+            current = item
+          }
+        }
+      })
+      return current?.value
+    },
+    getBottomDeviceName(list){
+      let current = {}
+      list?.forEach(item =>{
+        if(item.sfType === '6'){
+          const name = item.sfCode;
+         if(name.indexOf('llb') != -1){
+            current = item
+          }
+        }
+      })
+      return current?.value
+    },
+    getJSCurrentValue(list){
+      // 进水阀
+      let current = {};
+      list?.forEach(item =>{
+        if(item.sfType === '8'){
+          const name = item.sfCode;
+          current = item;
+        }
+      })
+      return current?.value == 1
+    },
+    getJBCurrentValue(list){
+      // 搅拌机
+      let current = {};
+      list?.forEach(item =>{
+        if(item.sfType === '3'){
+          const name = item.sfCode;
+            current = item
+        }
+      })
+      return current?.value == 1
+    },
+    getXSCurrentValue(list){
+      // 吸水泵
+      let current = {};
+      list?.forEach(item =>{
+        if(item.sfType === '2'){
+          const name = item.sfCode;
+            current = item
+        }
+      })
+      return current?.value == 1
+    },
+    handleClick(item){
+      item.fan = !item.fan;
+    },
+    handleOpenClick(){
+      this.bucketOpenTopStatus = !this.bucketOpenTopStatus;
+    },
+    handleOpenClick1(){
+      this.bucketOpenTopStatus2 = !this.bucketOpenTopStatus2;
+    },
+    handleBucketCloseClick(item){
+      item.isTopStatus = !item.isTopStatus;
+    },
+    handleBucketCloseClick1(item){
+      item.isBottomStatus = !item.isBottomStatus;
+    }
+  }
+};
+</script>
+<style scoped lang="scss">
+.facilitystate-container {
+  padding: 16rpx 32rpx;
+  justify-content: space-between;
+  border-radius: 16rpx;
+  position: relative;
+  .facilitystate-title-warp{
+    position: absolute;
+    right: 32rpx;
+    top: 10rpx;
+    display: flex;
+    align-items: center;
+    color: #374d59;
+    font-family: "Source Han Sans CN VF";
+    font-size: 24rpx;
+    font-weight: 400;
+    .facilitystate-title{
+      display: flex;
+      align-items: center;
+      margin-right: 32rpx;
+      .radius-user{
+        width: 16rpx;
+        height: 16rpx;
+        border-radius: 50%;
+        background: #14A478;
+        margin-right:8rpx;
+      }
+    }
+    .facilitystate-subtitle{
+      display: flex;
+      align-items: center;
+      .radius-close{
+        width: 16rpx;
+        height: 16rpx;
+        border-radius: 50%;
+        background: #7A8291;
+        margin-right:8rpx;
+      }
+    }
+  }
+  .facilitystate-list {
+    background: url('../assets/beijing.png') no-repeat center center;
+    background-size: 100%;
+    height: 350rpx;
+    width: 100%;
+    display: flex;
+    margin-bottom: 16rpx;
+    .bucketOpenTop{
+      width: 20rpx;
+      height: 20rpx;
+      position: absolute;
+      left: 140rpx;
+      top: 332rpx;
+    }
+    .bucketOpenTop2{
+      width: 20rpx;
+      height: 20rpx;
+      position: absolute;
+      left: 230rpx;
+      top: 76rpx;
+    }
+    &__left{
+      margin-left: 144rpx;
+    }
+    .facilitystate-item {
+      margin-top: 110rpx;
+      margin-left: -4rpx;
+      &__label{
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        width: 100rpx;
+        margin-bottom: 5rpx;
+      }
+      &__label-text,&__label-value {
+        color: #042118;
+        font-family: "Source Han Sans CN VF";
+        font-size: 24rpx;
+        font-weight: 400;
+        height: 36rpx;
+      }
+      &__image {
+        width: 100rpx;
+        height: 138rpx;
+        position: relative;
+        .facilitystate-item-fan{
+          position: absolute;
+          top: 20rpx;
+          left:0;
+          bottom:0;
+          right:0;
+          margin: auto;
+          z-index:100;
+        }
+        .bucketClose{
+          position: absolute;
+          width: 20rpx;
+          height: 20rpx;
+          left: 46rpx;
+          top: 6rpx;
+          z-index:100;
+        }
+        .bucketClose1{
+          position: absolute;
+          width: 20rpx;
+          height: 20rpx;
+          left: 46rpx;
+          bottom: -4rpx;
+          z-index:100;
+        }
+      }
+      &__bg{
+        width: 100rpx;
+        height: 154rpx;
+      }
+      &__bg2{
+        width: 55rpx;
+        height: 154rpx;
+        margin-top:-3rpx;
+        margin-left: -2rpx;
+      }
+      .fertTopBottom{
+        width: 70rpx;
+        height: 94rpx;
+        margin: 0 auto;
+        margin-top: 12rpx;
+        background: url('../assets/bucket.png') no-repeat center center;
+        background-size: 100% 100%;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        .fertTopBottom-text{
+          width: 70rpx;
+          font-size: 24rpx;
+          color: #FFB800;
+          text-align: center;
+          // 超出隐藏
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+        .fan{
+          width: 40rpx;
+          height:40rpx;
+          margin-left: 10rpx;
+        }
+        .fan-run{
+          animation: rotate .5s linear infinite;
+          @keyframes rotate {
+            from {
+              transform: rotate(0deg);
+            }
+            to {
+              transform: rotate(360deg);
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>

pages/cb/shuifeizs/components/irrigatedArea.vue

@@ -0,0 +1,127 @@
+<template>
+  <view class="irrigated-area">
+    <view class="irrigated-area-list">
+      <view
+        class="irrigated-area-item"
+        v-for="(item, index) in irrigatedAreaList"
+        :key="index"
+      >
+        <view class="irrigated-area-item-title">
+          <view class="irrigated-area-item-title-text">{{
+            item.sfDisplayname || item.sfName
+          }}</view>
+          <view class="irrigated-area-item-title-time"></view>
+        </view>
+        <view class="irrigated-area-item-content">
+          <view
+            class="irrigated-area-item-content-item"
+            v-for="(i, n) in item.childrenList"
+            :key="n"
+          >
+            <view class="irrigated-area-item-content-item-title">{{
+              i.sfDisplayname || i.sfName
+            }}</view>
+            <view class="irrigated-area-item-content-item-icon">
+              <image
+                :src="i.value !== '0' ? bucketOpen1 : bucketClose1"
+                class="bucket-icon"
+              />
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+import bucketOpen1 from '../assets/bucketOpen1.png';
+import bucketClose1 from '../assets/bucketClose1.png';
+export default {
+  props: {
+    irrigatedAreaList: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  data() {
+    return {
+      bucketOpen1,
+      bucketClose1,
+    };
+  },
+  methods: {
+    formartDate(date) {
+      return date.slice(0, 10);
+    },
+  },
+  components: {},
+  mounted() {},
+};
+</script>
+<style scoped lang="scss">
+.irrigated-area {
+  .irrigated-area-list {
+    .irrigated-area-item {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 10px;
+      background: #f5f7fa;
+      margin-bottom: 8rpx;
+      .irrigated-area-item-title {
+        width: 120rpx;
+        .irrigated-area-item-title-text {
+          color: #042118;
+          text-align: left;
+          font-family: 'Source Han Sans CN VF';
+          font-size: 24rpx;
+          font-weight: 500;
+          // 超出隐藏
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+        .irrigated-area-item-title-time {
+          color: #14a478;
+          font-family: 'Source Han Sans CN VF';
+          font-size: 24rpx;
+          font-weight: 500;
+          text-align: left;
+          margin-top: 8rpx;
+          height: 30rpx;
+        }
+      }
+      .irrigated-area-item-content {
+        display: flex;
+        width: calc(100% - 120rpx);
+        justify-content: start;
+        .irrigated-area-item-content-item {
+          width: 20%;
+          .irrigated-area-item-content-item-title {
+            width: 100%;
+            color: #333333;
+            font-family: 'Source Han Sans CN VF';
+            font-size: 24rpx;
+            font-weight: 400;
+            margin-bottom: 20rpx;
+            // 超出隐藏
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            text-align: center;
+          }
+          .irrigated-area-item-content-item-icon {
+            display: flex;
+            justify-content: center;
+            .bucket-icon {
+              width: 16rpx;
+              height: 16rpx;
+              margin-right: 10rpx;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>

pages/cb/shuifeizs/control.vue

@@ -0,0 +1,259 @@
+<template>
+  <view class="control-container">
+    <custom-card>
+      <block slot="backText">{{ title }}</block>
+    </custom-card>
+    <view class="control-content">
+      <view class="control-list-left">
+        <view
+          class="control-list-left-item"
+          v-for="(item, index) in leftList"
+          :key="index"
+          @click="controlClick(index)"
+          :class="{ 'control-list-left-item-active': index === activeIndex }"
+        >
+          <image
+            :src="borderRadius"
+            class="borderTopRadius"
+            v-if="index === activeIndex"
+          />
+          {{ item.sfDisplayname }}
+          <image
+            :src="borderRadius"
+            class="borderBottomRadius"
+            v-if="index === activeIndex"
+          />
+        </view>
+      </view>
+      <view class="control-list-right">
+        <view
+          class="control-list-right-item"
+          v-for="(item, index) in deviceList"
+          :key="index"
+        >
+          <view class="control-list-right-item-icon">
+            <image
+              :src="item.sfType == '3' ? stir : solenoidValve"
+              class="solenoid-valve"
+            />
+          </view>
+          <view class="control-list-right-item-title">{{
+            item.sfDisplayname || item.sfName
+          }}</view>
+          <view class="control-list-right-item-action">
+            <u-switch
+              :value="item.value == 1 ? true : false"
+              @change="changeSwitch(item)"
+              activeColor="#14A478"
+              size="40"
+              inactiveColor="rgb(230, 230, 230)"
+            ></u-switch>
+          </view>
+        </view>
+        <u-empty v-if="deviceList.length === 0" text="暂无数据"></u-empty>
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+import solenoidValve from './assets/solenoidValve.png';
+import stir from './assets/stir.png';
+import borderRadius from './assets/borderRadius.png';
+
+export default {
+  name: 'control',
+  data() {
+    return {
+      activeIndex: 0,
+      value: false,
+      solenoidValve,
+      stir,
+      borderRadius,
+      title: '控制面板',
+      leftList: [],
+      deviceList: [],
+      devBid: '',
+    };
+  },
+  methods: {
+    getChecked(item) {
+      return item.value == 1 ? true : false;
+    },
+    async changeSwitch(item) {
+      item.value = item.value == 1 ? 0 : 1;
+      const sfCode = item.sfCode;
+      const params = {};
+      params[sfCode] = item.value;
+      const payload = {
+        data: params,
+      };
+      const data = {
+        devBid: this.devBid,
+        data: params,
+      };
+      const res = await this.$myRequest({
+        url: '/api/v2/iot/mobile/device/sf/devctl/',
+        method: 'post',
+        data,
+        header: {
+          'Content-Type': 'application/json',
+        },
+      });
+      if (res.code === '000000') {
+        uni.showToast({
+          title: res.msg,
+          icon: 'none',
+        });
+      }
+    },
+    controlClick(index) {
+      this.activeIndex = index;
+      this.deviceList = this.leftList[this.activeIndex]?.childrenList || [];
+    },
+    /*
+      0	水源	泵类	负责水源进入管道的总泵或者阀
+      1	肥料	泵类	负责肥料进入管道的总阀或者泵
+      2	吸肥	泵类	控制肥料桶出肥的阀或者泵，每个肥料桶一个
+      3	搅拌	泵类	肥料桶的搅拌电机或者泵 每个肥料桶一个
+      4	肥料桶	泵类	肥料桶，每个施肥机有多个或者没有，不一定真实存在，只是逻辑上的概念
+      5	电磁阀	无	管道最末端每个田地里控制出水的阀门
+      6	传感器	无	水肥机上的 温度，压力，流速，PH EC等监测类要素
+      7	灌区    无	逻辑区域，电磁阀的分组
+      */
+    async getdeviceSfStatus() {
+      const res = await this.$myRequest({
+        url: '/api/v2/iot/mobile/device/sf/status/',
+        method: 'post',
+        data: {
+          devBid: this.devBid,
+        },
+      });
+      this.deviceList = [];
+      const sfCurrent = [
+        {
+          sfDisplayname: '水肥机',
+          childrenList: [],
+        },
+      ];
+      const irrigatedAreaList = [];
+      res?.forEach((item) => {
+        if (item.sfType === '0' || item.sfType === '1' || item.sfType === '2') {
+          sfCurrent[0].childrenList.push(item);
+        } else if (item.sfType === '4') {
+          const childrenList = item?.childrenList || [];
+          childrenList.forEach((child) => {
+            if (
+              child.sfType === '3' ||
+              child.sfType === '2' ||
+              child.sfType === '8'
+            ) {
+              sfCurrent[0].childrenList.push(child);
+            }
+          });
+        } else if (item.sfType === '7') {
+          irrigatedAreaList.push(item);
+        }
+      });
+      this.leftList = [...sfCurrent, ...irrigatedAreaList];
+      this.deviceList = this.leftList[this.activeIndex]?.childrenList || [];
+    },
+  },
+  onLoad(options) {
+    const { devBid } = options;
+    this.devBid = devBid;
+    this.getdeviceSfStatus();
+  },
+};
+</script>
+<style scoped lang="scss">
+uni-page-body {
+  position: relative;
+  height: 100%;
+}
+.control-container {
+  background: linear-gradient(180deg, #ffffff00 0%, #fff 23.64%, #fff 100%),
+    linear-gradient(102deg, #bfeadd 6.77%, #b8f1e7 40.15%, #b9eef5 84.02%);
+  height: 100%;
+  width: 100%;
+  overflow-x: hidden;
+  overflow-y: hidden;
+  .control-content {
+    display: flex;
+    width: 100%;
+    height: calc(100% - 102rpx);
+    overflow-x: hidden;
+    overflow-y: auto;
+    padding: 8px 0;
+    border-radius: 8px 8px 0 0;
+    background: #fff;
+    .control-list-left {
+      width: 250rpx;
+      position: fixed;
+      height: calc(100% - 90rpx);
+      overflow-x: hidden;
+      overflow-y: auto;
+      .control-list-left-item {
+        width: 240rpx;
+        height: 96rpx;
+        line-height: 96rpx;
+        background: #f5f7fa;
+        padding-left: 24rpx;
+        color: #364d46;
+        font-family: 'Source Han Sans CN VF';
+        font-size: 32rpx;
+        font-weight: 400;
+        position: relative;
+      }
+      .control-list-left-item-active {
+        background: #ffffff;
+        border-radius: 0 -16rpx -16rpx 0;
+      }
+      .borderTopRadius {
+        position: absolute;
+        width: 30rpx;
+        height: 30rpx;
+        right: -4rpx;
+        top: -20rpx;
+        transform: rotate(90deg);
+        z-index: 100;
+      }
+      .borderBottomRadius {
+        position: absolute;
+        width: 30rpx;
+        height: 30rpx;
+        right: -4rpx;
+        bottom: -20rpx;
+        z-index: 100;
+      }
+    }
+    .control-list-right {
+      width: calc(100% - 250rpx);
+      margin: 0 32rpx;
+      margin-left: 280rpx;
+      .control-list-right-item {
+        height: 96rpx;
+        display: flex;
+        padding: 0rpx 16rpx;
+        align-items: center;
+        border-radius: 8rpx;
+        background: #f5f7fa;
+        margin-bottom: 22rpx;
+        position: relative;
+        .control-list-right-item-icon {
+          .solenoid-valve {
+            width: 40rpx;
+            height: 40rpx;
+          }
+        }
+        .control-list-right-item-title {
+          margin-left: 8rpx;
+        }
+        .control-list-right-item-action {
+          position: absolute;
+          right: 16rpx;
+        }
+      }
+    }
+  }
+}
+</style>

pages/cb/shuifeizs/detail.vue

@@ -0,0 +1,184 @@
+<template>
+  <view class="facilitystate-page">
+    <custom-card>
+      <block slot="backText">{{ title }}</block>
+    </custom-card>
+    <view class="facilitystate-top">
+      <view
+        class="facilitystate-top__item"
+        v-for="(item, index) in deviceList"
+        :key="index"
+        @click="nativeTo(item)"
+      >
+        <image class="item-icon" :src="item.icon" />
+        <view class="facilitystate-top__item-text">{{ item.title }}</view>
+      </view>
+    </view>
+    <Base :dataList="dataList" />
+    <facilitystate
+      :ggbCurrent="ggbCurrent"
+      :sfbCurrent="sfbCurrent"
+      :irrigatedAreaList="irrigatedAreaList"
+      :alreadyfertilizerBucketList="alreadyfertilizerBucketList"
+    />
+  </view>
+</template>
+
+<script>
+import manualControl from './assets/manualControl.png';
+import wheelIrrigation from './assets/wheelIrrigation.png';
+import timing from './assets/timing.png';
+import masterStop from './assets/masterStop.png';
+import fertilizationFormula from './assets/fertilizationFormula.png';
+import backwashControl from './assets/backwashControl.png';
+import basicSetting from './assets/basicSetting.png';
+import operatingRecord from './assets/operatingRecord.png';
+import Base from './components/base.vue';
+import facilitystate from './components/facilitystate.vue';
+export default {
+  data() {
+    return {
+      title: '水肥一体机',
+      manualControl,
+      devBid: '',
+      dataList: [],
+      irrigatedAreaList: [],
+      alreadyfertilizerBucketList: [],
+      deviceList: [
+        {
+          icon: manualControl,
+          title: '手动控制',
+          url: '/pages/cb/shuifeizs/control',
+        },
+        {
+          icon: wheelIrrigation,
+          title: '轮灌控制',
+          url: '',
+        },
+        {
+          icon: timing,
+          title: '定时计划',
+          url: '',
+        },
+        {
+          icon: masterStop,
+          title: '总停',
+          url: '',
+        },
+        {
+          icon: fertilizationFormula,
+          title: '施肥配方',
+          url: '',
+        },
+        {
+          icon: backwashControl,
+          title: '反冲洗控制',
+          url: '',
+        },
+        {
+          icon: basicSetting,
+          title: '基础设置',
+          url: '',
+        },
+        {
+          icon: operatingRecord,
+          title: '操作记录',
+          url: '/pages/cb/shuifeizs/history',
+        },
+      ],
+      ggbCurrent: {},
+      sfbCurrent: {},
+    };
+  },
+  components: {
+    Base,
+    facilitystate,
+  },
+  onLoad(options) {
+    /*
+      0	水源	泵类	负责水源进入管道的总泵或者阀
+      1	肥料	泵类	负责肥料进入管道的总阀或者泵
+      2	吸肥	泵类	控制肥料桶出肥的阀或者泵，每个肥料桶一个
+      3	搅拌	泵类	肥料桶的搅拌电机或者泵 每个肥料桶一个
+      4	肥料桶	泵类	肥料桶，每个施肥机有多个或者没有，不一定真实存在，只是逻辑上的概念
+      5	电磁阀	无	管道最末端每个田地里控制出水的阀门
+      6	传感器	无	水肥机上的 温度，压力，流速，PH EC等监测类要素
+      7	灌区    无	逻辑区域，电磁阀的分组
+      */
+    const { devBid } = options;
+    this.devBid = devBid;
+    this.deviceList[0].url = `/pages/cb/shuifeizs/control?devBid=${options.devBid}`;
+    this.deviceList[
+      this.deviceList.length - 1
+    ].url = `/pages/cb/shuifeizs/history?devBid=${options.devBid}`;
+    devBid && this.getdeviceSfStatus();
+  },
+  methods: {
+    async getdeviceSfStatus() {
+      const res = await this.$myRequest({
+        url: '/api/v2/iot/mobile/device/sf/status/',
+        method: 'post',
+        data: {
+          devBid: this.devBid,
+        },
+      });
+      this.dataList = [];
+      this.irrigatedAreaList = [];
+      this.alreadyfertilizerBucketList = [];
+      res.forEach((item) => {
+        if (item.sfType === '0') {
+          this.ggbCurrent = item;
+        } else if (item.sfType === '1') {
+          this.sfbCurrent = item;
+        } else if (item.sfType === '4') {
+          this.alreadyfertilizerBucketList.push(item);
+        } else if (item.sfType === '6') {
+          this.dataList.push(item);
+        } else if (item.sfType === '7') {
+          this.irrigatedAreaList.push(item);
+        }
+      });
+    },
+    nativeTo(item) {
+      uni.navigateTo({
+        url: item.url,
+      });
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+uni-page-body {
+  position: relative;
+  height: 100%;
+}
+
+.facilitystate-page {
+  background: linear-gradient(180deg, #ffffff00 0%, #fff 23.64%, #fff 100%),
+    linear-gradient(102deg, #bfeadd 6.77%, #b8f1e7 40.15%, #b9eef5 84.02%);
+  height: 100%;
+  width: 100%;
+  overflow-x: hidden;
+  overflow-y: scroll;
+  .facilitystate-top {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    text-align: center;
+    margin-top: 18rpx;
+    &__item {
+      margin-bottom: 32rpx;
+      .item-icon {
+        width: 96rpx;
+        height: 96rpx;
+      }
+    }
+    &__item-text {
+      color: #042118;
+      font-family: 'Source Han Sans CN VF';
+      font-size: 28rpx;
+      font-weight: 400;
+      margin-top: 16rpx;
+    }
+  }
+}
+</style>

pages/cb/shuifeizs/history.vue

@@ -0,0 +1,286 @@
+<template>
+  <view class="history-container">
+    <custom-card>
+      <block slot="backText">{{ title }}</block>
+    </custom-card>
+    <view class="calendar" @tap="handleCalendarClick">
+      <view class="calendar__label">选择日期</view>
+      <view class="calendar__content">
+        <text>{{ startTime }}</text>
+        <text class="separate">-</text>
+        <text>{{ endTime }} </text>
+      </view>
+      <view class="calendar__link">
+        <u-icon name="arrow-right" color="#4e5969"></u-icon>
+      </view>
+    </view>
+    <view class="history-form-container">
+      <view class="form-header">
+        <view class="form-header__title">设备名称</view>
+        <view class="form-header__title">操作内容</view>
+        <view class="form-header__title">操作人</view>
+        <view class="form-header__title">操作时间</view>
+      </view>
+      <view class="scroll-container">
+        <scroll-view
+          class="main__right"
+          v-if="historyList.length !== 0"
+          scroll-y="true"
+          style="height: 100%"
+          @scrolltolower="scrolltolower"
+          :show-scrollbar="true"
+        >
+          <view class="form-content" v-for="item in historyList" :key="item">
+            <view class="form-content__item">{{ item.oprecdName }}</view>
+            <view class="form-content__item">
+              <view class="item-open" v-if="item.oprecdContent == '打开'"
+                >打开</view
+              >
+              <view class="item-close" v-else>{{ item.oprecdContent }}</view>
+            </view>
+            <view class="form-content__item">{{ item.oprcdCreatorName }}</view>
+            <view class="form-content__item">
+              <view class="item-time">{{
+                getTopTime(item.oprcdCreateddate)
+              }}</view>
+              <view class="item-date">{{
+                getYearTime(item.oprcdCreateddate)
+              }}</view>
+            </view>
+          </view>
+        </scroll-view>
+        <u-empty v-else style="height: 80%"
+      /></view>
+    </view>
+    <u-calendar
+      v-model="show"
+      mode="range"
+      @change="handleConfirm"
+    ></u-calendar>
+  </view>
+</template>
+<script>
+import solenoidValve from './assets/solenoidValve.png';
+export default {
+  name: 'actionHistory',
+  data() {
+    return {
+      title: '操作记录',
+      devBid: '',
+      pageSize: 20,
+      pageNum: 1,
+      show: false,
+      // 获取当前日期向前3个月
+      startTime: this.formartDate(3),
+      endTime: this.formartDate(),
+      historyList: [],
+      total: 0,
+    };
+  },
+  computed: {
+    hasMore() {
+      return this.total > 0 && this.total > this.pageNum * this.pageSize;
+    },
+  },
+  methods: {
+    getTopTime(date) {
+      return date.split(' ')[1];
+    },
+    getYearTime(date) {
+      return date.split(' ')[0];
+    },
+    async getHistory() {
+      const res = await this.$myRequest({
+        url: '/api/v2/iot/mobile/device/sf/op/record/list/',
+        method: 'post',
+        data: {
+          pageSize: this.pageSize,
+          pageNum: this.pageNum,
+          startTime: this.startTime + ' 00:00:00',
+          endTime: this.endTime + ' 23:59:59',
+          devBid: this.devBid,
+        },
+        sfType: true,
+      });
+      this.historyList = this.historyList.concat(res?.data);
+      this.total = res.total;
+    },
+    formartDate(month = 0) {
+      const time = month * 30 * 24 * 60 * 60 * 1000;
+      const timeStamp = new Date(new Date().getTime() - time);
+      const year = timeStamp.getFullYear();
+      const monthDate = timeStamp.getMonth() + 1;
+      const monthStr = monthDate < 10 ? `0${monthDate}` : monthDate;
+      const day = new Date().getDate();
+      const dayStr = day < 10 ? `0${day}` : day;
+      return `${year}-${monthStr}-${dayStr}`;
+    },
+    handleCalendarClick() {
+      this.show = true;
+    },
+    handleClose() {
+      this.show = false;
+    },
+    scrolltolower() {
+      console.log('scroll');
+      if (this.hasMore) {
+        this.pageNum++;
+        this.getHistory();
+      }
+    },
+    handleConfirm(e) {
+      this.pageNum = 1;
+      const { startDate, endDate } = e;
+      this.startTime = startDate;
+      this.endTime = endDate;
+      this.getHistory();
+    },
+  },
+  onLoad(options) {
+    const { devBid } = options;
+    this.devBid = devBid;
+    this.getHistory();
+  },
+};
+</script>
+<style scoped lang="scss">
+uni-page-body {
+  position: relative;
+  height: 100%;
+}
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+::v-deep .u-hover-class {
+  opacity: 0.6;
+}
+.scroll-container {
+  height: calc(100% - 160rpx);
+}
+.history-container {
+  background: linear-gradient(180deg, #ffffff00 0%, #fff 23.64%, #fff 100%),
+    linear-gradient(102deg, #bfeadd 6.77%, #b8f1e7 40.15%, #b9eef5 84.02%);
+  height: 100%;
+  width: 100%;
+  overflow-x: hidden;
+  overflow-y: hidden;
+  .calendar {
+    position: relative;
+    display: flex;
+    align-items: center;
+    padding: 0 32rpx;
+    line-height: 64rpx;
+    border-radius: 16rpx;
+    background-color: #fff;
+    margin: 0 32rpx;
+    &__icon {
+      margin-right: 12rpx;
+    }
+
+    &__label {
+      font-size: 28rpx;
+      color: #666;
+      margin-right: 10rpx;
+    }
+
+    &__content {
+      font-size: 28rpx;
+      color: #666;
+      margin-left: 64rpx;
+      .separate {
+        margin: 0 6rpx;
+      }
+    }
+
+    &__link {
+      position: absolute;
+      right: 20rpx;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+  }
+  .history-form-container {
+    width: calc(100% - 64rpx);
+    height: calc(100% - 128rpx);
+    margin: 32rpx;
+    border-radius: 16rpx;
+    background: #fff;
+    overflow-x: hidden;
+    overflow-y: scroll;
+    .form-header {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      height: 80rpx;
+      width: 100%;
+      border-bottom: 2rpx solid #e4e7ed;
+      &__title {
+        width: 25%;
+        text-align: center;
+        font-size: 28rpx;
+        color: #042118;
+        font-family: 'Source Han Sans CN VF';
+        font-style: normal;
+        font-weight: 400;
+        line-height: normal;
+      }
+    }
+    .form-content {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      height: 96rpx;
+      width: 100%;
+      border-bottom: 2rpx solid #e4e7ed;
+      &__item {
+        width: 25%;
+        text-align: center;
+        font-size: 28rpx;
+        font-family: 'Source Han Sans CN VF';
+        font-style: normal;
+        color: #042118;
+        .item-open {
+          display: inline-flex;
+          height: 40rpx;
+          padding: 4rpx 16rpx;
+          justify-content: center;
+          align-items: center;
+          border-radius: 20rpx;
+          background: #14a47824;
+          color: #14a478;
+          font-family: 'Source Han Sans CN VF';
+          font-size: 24rpx;
+          font-weight: 400;
+        }
+        .item-close {
+          display: inline-flex;
+          height: 40rpx;
+          padding: 4rpx 16rpx;
+          justify-content: center;
+          align-items: center;
+          border-radius: 20rpx;
+          background: #7a82911a;
+          color: #7a8291;
+          font-family: 'Source Han Sans CN VF';
+          font-size: 24rpx;
+          font-weight: 400;
+        }
+        .item-time {
+          color: #042118;
+          font-family: 'Source Han Sans CN VF';
+          font-size: 28rpx;
+          font-weight: 400;
+        }
+        .item-date {
+          color: #042118;
+          font-family: 'Source Han Sans CN VF';
+          font-size: 24rpx;
+          font-weight: 400;
+        }
+      }
+    }
+  }
+}
+</style>

pages/cb/smallPest/photolist.vue

@@ -1,278 +1,303 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view class="" style="position: relative;top: 44px;">
-			<view style="position: fixed;z-index: 100;">
-				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" title="查看图片" rightIcon="camera"
-					@clickRight="clickRight"></uni-nav-bar>
-			</view>
-			<!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
-			<view class="selecttimes" @click="tiemshow=!tiemshow">
-				<view class="timesbox">
-					<image
-						:src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
-						mode=""></image>
-					<p>{{timetab(timestate)}}</p>
-					<p class="or">~</p>
-					<p>{{timetab(timeend)}}</p>
-					<u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
-				</view>
-				<u-calendar v-model="tiemshow" mode="range" @change="tiemchange"></u-calendar>
-			</view>
-			<view class="imglist">
-				<view class="imglist_box" v-for="(item,index) in imglists" :key="index">
-					<view class="imglist_left">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif" mode="">
-						</image>
-						<image :src="item.addr" mode="" @click="examine(index)"></image>
-					</view>
-					<view class="imglist_right">
-						<view class="">
-							{{item.time}}
-						</view>
-						<view class="">
-							害虫数量:{{item.pest_counts}}
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="top" v-if="isTop" @click="top">
-			<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/6209a98f0cb3b5086f2ca36152c9269.png'"
-				mode=""></image>
-		</view>
-	</view>
+  <view>
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view style="position: fixed; z-index: 100">
+        <uni-nav-bar
+          @clickLeft="clickLeft"
+          left-icon="back"
+          title="查看图片"
+          rightIcon="camera"
+          @clickRight="clickRight"
+        ></uni-nav-bar>
+      </view>
+      <!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
+      <view class="selecttimes" @click="tiemshow = !tiemshow">
+        <view class="timesbox">
+          <image
+            :src="
+              'http://www.hnyfwlw.com:8006/bigdata_app' +
+              '/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'
+            "
+            mode=""
+          ></image>
+          <p>{{ timetab(timestate) }}</p>
+          <p class="or">~</p>
+          <p>{{ timetab(timeend) }}</p>
+          <u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
+        </view>
+        <u-calendar
+          v-model="tiemshow"
+          mode="range"
+          @change="tiemchange"
+        ></u-calendar>
+      </view>
+      <view class="imglist">
+        <view
+          class="imglist_box"
+          v-for="(item, index) in imglists"
+          :key="index"
+        >
+          <view class="imglist_left">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif"
+              mode=""
+            >
+            </image>
+            <image :src="item.addr" mode="" @click="examine(index)"></image>
+          </view>
+          <view class="imglist_right">
+            <view class="">
+              {{ item.time }}
+            </view>
+            <view class=""> 害虫数量:{{ item.pest_counts }} </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="top" v-if="isTop" @click="top">
+      <image
+        :src="
+          'http://www.hnyfwlw.com:8006/bigdata_app' +
+          '/image/6209a98f0cb3b5086f2ca36152c9269.png'
+        "
+        mode=""
+      ></image>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				tiemshow:false,
-				timestate:"",
-				timeend:"",
-				isTop:false,
-				imglists:[],
-				device_id:"",
-				page:1,
-				d_id:""
-			}
-		},
-		methods: {
-			clickLeft(){
-				uni.navigateBack({
-					delta:1
-				})
-			},
-			clickRight(){
-				this.takephoto()
-			},
-			timetab(e) {
-				e = new Date(e * 1000)
-				var year = e.getFullYear()
-				var month = e.getMonth() + 1 < 10 ? "0" + (e.getMonth() + 1) : e.getMonth() + 1
-				var day = e.getDate() < 10 ? "0" + e.getDate() : e.getDate()
-				var time = year + "/" + month + "/" + day
-				return time
-			},
-			examine(index){
-				var imgarr = []
-				for (var i = 0; i < this.imglists.length; i++) {
-					imgarr.push(this.imglists[i].addr)
-				}
-				uni.previewImage({
-					urls: imgarr,
-					current: index
-				});
-			},
-			async getimglist(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
-					data: {
-						cmd: "cbd_XCT",
-						device_id: this.device_id,
-						page: this.page,
-						page_number: "12",
-						time_begin: Math.floor(this.timestate),
-						time_end: Math.floor(this.timeend),
-					}
-				})
-				console.log(res)
-				this.imglists = res.data
-			},
-			top() {
-				uni.pageScrollTo({
-					scrollTop: 0,
-					duration: 500
-				})
-			},
-			tiemchange(e){
-				// console.log(e)
-				this.imglists = []
-				this.page = 1
-				console.log(e)
-				this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60
-				this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60
-				this.getimglist()
-			},
-			async takephoto() { //拍照
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
-					data: {
-						device_type_id: 28,
-						d_id: this.d_id,
-						cmd: "takephoto"
-					}
-				})
-				console.log(res)
-				if (res == true) {
-					uni.showToast({
-						title: '指令下发成功！',
-						duration: 2000
-					});
-					var that = this
-					setTimeout(() => {
-						that.getimglist()
-					}, 1000)
-				} else {
-					uni.showToast({
-						title: '指令下发失败！',
-						duration: 2000,
-						icon: "none"
-					});
-				}
-			
-			},
-		},
-		onLoad(option) {
-			this.d_id =  option.d_id
-			this.device_id = option.device_id
-			this.timeend = +new Date() / 1000
-			this.timestate = this.timeend - 60 * 60 * 24 * 7
-			this.getimglist()
-		},
-		onReachBottom() {
-			this.page++
-			this.getimglist()
-		},
-		onPageScroll(e) { //nvue暂不支持滚动监听，可用bindingx代替
-			if (e.scrollTop > 200) { //距离大于200时显示
-				this.isTop = true
-			} else { //距离小于200时隐藏
-				this.isTop = false
-			}
-		}
-	}
+export default {
+  data() {
+    return {
+      tiemshow: false,
+      timestate: '',
+      timeend: '',
+      isTop: false,
+      imglists: [],
+      device_id: '',
+      page: 1,
+      d_id: '',
+    };
+  },
+  methods: {
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    clickRight() {
+      this.takephoto();
+    },
+    timetab(e) {
+      e = new Date(e * 1000);
+      var year = e.getFullYear();
+      var month =
+        e.getMonth() + 1 < 10 ? '0' + (e.getMonth() + 1) : e.getMonth() + 1;
+      var day = e.getDate() < 10 ? '0' + e.getDate() : e.getDate();
+      var time = year + '/' + month + '/' + day;
+      return time;
+    },
+    examine(index) {
+      var imgarr = [];
+      for (var i = 0; i < this.imglists.length; i++) {
+        imgarr.push(this.imglists[i].addr);
+      }
+      uni.previewImage({
+        urls: imgarr,
+        current: index,
+      });
+    },
+    async getimglist() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
+        data: {
+          cmd: 'cbd_XCT',
+          device_id: this.device_id,
+          page: this.page,
+          page_number: '12',
+          time_begin: Math.floor(this.timestate),
+          time_end: Math.floor(this.timeend),
+        },
+      });
+      console.log(res);
+      this.imglists = res.data;
+    },
+    top() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 500,
+      });
+    },
+    tiemchange(e) {
+      // console.log(e)
+      this.imglists = [];
+      this.page = 1;
+      console.log(e);
+      this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60;
+      this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60;
+      this.getimglist();
+    },
+    async takephoto() {
+      //拍照
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
+        data: {
+          device_type_id: 28,
+          d_id: this.d_id,
+          cmd: 'takephoto',
+        },
+      });
+      console.log(res);
+      if (res == true) {
+        uni.showToast({
+          title: '指令下发成功！',
+          duration: 2000,
+        });
+        var that = this;
+        setTimeout(() => {
+          that.getimglist();
+        }, 1000);
+      } else {
+        uni.showToast({
+          title: '指令下发失败！',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+  },
+  onLoad(option) {
+    this.d_id = option.d_id;
+    this.device_id = option.device_id;
+    this.timeend = +new Date() / 1000;
+    this.timestate = this.timeend - 60 * 60 * 24 * 7;
+    this.getimglist();
+  },
+  onReachBottom() {
+    this.page++;
+    this.getimglist();
+  },
+  onPageScroll(e) {
+    //nvue暂不支持滚动监听，可用bindingx代替
+    if (e.scrollTop > 200) {
+      //距离大于200时显示
+      this.isTop = true;
+    } else {
+      //距离小于200时隐藏
+      this.isTop = false;
+    }
+  },
+};
 </script>
 
 <style lang="scss">
-	.tishi {
-		position: absolute;
-		top: 104px;
-		width: 95%;
-		left: 2.5%;
-		text-align: center;
-		font-size: 40rpx;
-	}
+.tishi {
+  position: absolute;
+  top: 104px;
+  width: 95%;
+  left: 2.5%;
+  text-align: center;
+  font-size: 40rpx;
+}
 
-	.selecttimes {
-		width: 100%;
-		position: fixed;
-		top: 85px;
-		left: 0;
-		z-index: 100;
-		background-color: #fff;
-		padding-top: 30rpx;
+.selecttimes {
+  width: 100%;
+  position: fixed;
+  top: 85px;
+  left: 0;
+  z-index: 100;
+  background-color: #fff;
+  padding-top: 30rpx;
 
-		.timesbox {
-			display: flex;
-			width: 95%;
-			margin: 0 auto;
-			justify-content: space-around;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 10rpx 20rpx;
-			box-sizing: border-box;
+  .timesbox {
+    display: flex;
+    width: 95%;
+    margin: 0 auto;
+    justify-content: space-around;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 10rpx 20rpx;
+    box-sizing: border-box;
 
-			image {
-				width: 30rpx;
-				height: 30rpx;
-				margin-top: 6rpx;
-			}
+    image {
+      width: 30rpx;
+      height: 30rpx;
+      margin-top: 6rpx;
+    }
 
-			.icon {
-				color: #949494;
-				text-align: right;
-				margin-left: 30rpx;
+    .icon {
+      color: #949494;
+      text-align: right;
+      margin-left: 30rpx;
+    }
+  }
 
-			}
-		}
+  ::v-deep .u-calendar__action {
+    display: flex;
+    justify-content: space-around;
 
-		/deep/.u-calendar__action {
-			display: flex;
-			justify-content: space-around;
+    .u-calendar__action__text {
+      line-height: 25px;
+    }
+  }
+}
+.imglist {
+  position: absolute;
+  top: 100px;
+  width: 95%;
+  left: 2.5%;
 
-			.u-calendar__action__text {
-				line-height: 25px;
-			}
-		}
-	}
-	.imglist {
-		position: absolute;
-		top: 100px;
-		width: 95%;
-		left: 2.5%;
-	
-		.imglist_box {
-			display: flex;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 20rpx;
-			margin-bottom: 20rpx;
-			height: 140px;
-		}
-	
-		.imglist_left {
-			width: 50%;
-			position: relative;
-	
-			image {
-				position: absolute;
-				top: 0;
-				left: 0;
-				width: 100%;
-				height: 280rpx;
-			}
-		}
-	
-		.imglist_right {
-			margin-left: 40rpx;
-			padding: 10rpx 0;
-	
-			.icon_box {
-				margin-bottom: 12rpx;
-				font-size: 24rpx;
-	
-				.iconfont {
-					margin-right: 20rpx;
-					color: #56C877;
-					font-size: 32rpx;
-				}
-			}
-	
-			p:last-child {
-				margin-bottom: 0;
-			}
-	
-		}
-	}
+  .imglist_box {
+    display: flex;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 20rpx;
+    margin-bottom: 20rpx;
+    height: 140px;
+  }
+
+  .imglist_left {
+    width: 50%;
+    position: relative;
+
+    image {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 280rpx;
+    }
+  }
+
+  .imglist_right {
+    margin-left: 40rpx;
+    padding: 10rpx 0;
+
+    .icon_box {
+      margin-bottom: 12rpx;
+      font-size: 24rpx;
+
+      .iconfont {
+        margin-right: 20rpx;
+        color: #56c877;
+        font-size: 32rpx;
+      }
+    }
+
+    p:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
 .top {
-		position: fixed;
-		right: 30px;
-		bottom: 100px;
-		z-index: 100;
+  position: fixed;
+  right: 30px;
+  bottom: 100px;
+  z-index: 100;
 
-		image {
-			width: 100rpx;
-			height: 100rpx;
-		}
-	}
+  image {
+    width: 100rpx;
+    height: 100rpx;
+  }
+}
 </style>

pages/cb/sy/detail.vue

@@ -1,272 +1,304 @@
 <template>
-	<view>
-		<view :class="['info',equipInfo.is_online==1?'on':'off']">
-			<view class="" @click="copy(equipInfo)">
-				设备ID：{{equipInfo.imei||equipInfo.device_id}}
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png" mode="" class="tishi">
-				</image>
-			</view>
-			<view class="">
-				设备名称：{{equipInfo.device_name==""?"无":equipInfo.device_name}}
-			</view>
-			<view class="">
-				设备类型：病虫害可视监测
-			</view>
-			<view class="">
-				最新上报时间：{{equipInfo.addtime||equipInfo.uptime | timeFormat}}
-			</view>
-			<view class="">
-				设备地址：{{equipInfo.address}}
-			</view>
-		</view>
-		<view class="caobox">
-			<view class="caobox_item" v-if="$QueryPermission(187)" @click="tophoto">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/1.png" mode="widthFix"></image>
-				<view class="">
-					查看图片
-				</view>
-			</view>
-			<view class="caobox_item" v-if="$QueryPermission(181)" @click="tohis">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/2.png" mode="widthFix"></image>
-				<view class="">
-					历史数据
-				</view>
-			</view>
-			<view class="caobox_item" v-if="$QueryPermission(244)" @click="simRouter">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/6.png" mode="widthFix"></image>
-				<view class="">
-					SIM卡信息
-				</view>
-			</view>
-		</view>
-		<view class="realtime">
-			<view class="realtime_title">
-				<p>实时数据</p>
-			</view>
-			<view class="realtime_text">
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png" mode=""></image>
-					<view class="text">
-						<p>环境温度</p>
-						<p>{{at}}℃</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png" mode=""></image>
-					<view class="text">
-						<p>环境湿度</p>
-						<p>{{ah}}%RH</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/icon02.png" mode=""></image>
-					<view class="text">
-						<p>开机状态</p>
-						<p>{{status == 1 ? '开机' : '关机'}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png" mode=""></image>
-					<view class="text">
-						<p>版本号</p>
-						<p>{{version}}</p>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+    <view :class="['info', equipInfo.is_online == 1 ? 'on' : 'off']">
+      <view class="" @click="copy(equipInfo)">
+        设备ID：{{ equipInfo.imei || equipInfo.device_id }}
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png"
+          mode=""
+          class="tishi"
+        >
+        </image>
+      </view>
+      <view class="">
+        设备名称：{{
+          equipInfo.device_name == '' ? '无' : equipInfo.device_name
+        }}
+      </view>
+      <view class=""> 设备类型：病虫害可视监测 </view>
+      <view class="">
+        最新上报时间：{{ equipInfo.addtime || equipInfo.uptime | timeFormat }}
+      </view>
+      <view class=""> 设备地址：{{ equipInfo.address }} </view>
+    </view>
+    <view class="caobox">
+      <view class="caobox_item" v-if="$QueryPermission(187)" @click="tophoto">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/1.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> 查看图片 </view>
+      </view>
+      <view class="caobox_item" v-if="$QueryPermission(181)" @click="tohis">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/2.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> 历史数据 </view>
+      </view>
+      <view class="caobox_item" v-if="$QueryPermission(244)" @click="simRouter">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/6.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> SIM卡信息 </view>
+      </view>
+    </view>
+    <view class="realtime">
+      <view class="realtime_title">
+        <p>实时数据</p>
+      </view>
+      <view class="realtime_text">
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>环境温度</p>
+            <p>{{ at }}℃</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>环境湿度</p>
+            <p>{{ ah }}%RH</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/icon02.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>开机状态</p>
+            <p>{{ status == 1 ? '开机' : '关机' }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>版本号</p>
+            <p>{{ version }}</p>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				equipInfo: {},
-				trapnum: 1,
-				at: "",
-				ah: "",
-				status: "",
-				version: "",
-				xyErr: "",
-				xyErrtime: "",
-				decoytime: "",
-				yxShow: false,
-				tiemshow: false,
-				date: "",
-				fieldstyle: { //输入框样式
-					border: "2rpx solid #f6f6f6",
-					"border-radius": "24px",
-					"padding-left": "20rpx",
-					"background-color": "#f6f6f6"
-				},
-				tishitext:""
-			}
-		},
-		methods: {
-			tophoto() {
-				uni.navigateTo({
-					url: "./imgList?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id
-				})
-			},
-			tohis() {
-				uni.navigateTo({
-					url: "./history?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id
-				})
-			},
-			simRouter() {
-				uni.navigateTo({
-					url: "/pages/prevention/sim?id=" + this.equipInfo.d_id
-				})
-			},
-			copy(item) {
-				console.log(item)
-				uni.setClipboardData({
-					data: item.imei || item.device_id,
-					success: function() {
-						console.log('success');
-					}
-				});
-			},
-			async getatah() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.color_attract_data',
-          data: {
-            device_id: this.equipInfo.imei,
-					}
-				})
-				console.log(res)
-				if (res) {
-					this.at = res.at/10
-          this.ah = res.ah / 10
-          this.status = res.ds
-          this.version = res.dver
-				} else {
-					this.at = "暂无"
-					this.ah = "暂无"
-				}
-			},
-		},
-		onLoad(option) {
-			var times = new Date()
-			this.date = times.getFullYear() + 1 + "-" + Number(times.getMonth() + 1) + "-" + times.getDate()
-      this.equipInfo = JSON.parse(option.detail);
-      console.log(this.equipInfo)
-      this.getatah()
-			// console.log(this.equipInfo)
-			// this.getbaseinfo()
-		},
-	}
+export default {
+  data() {
+    return {
+      equipInfo: {},
+      trapnum: 1,
+      at: '',
+      ah: '',
+      status: '',
+      version: '',
+      xyErr: '',
+      xyErrtime: '',
+      decoytime: '',
+      yxShow: false,
+      tiemshow: false,
+      date: '',
+      fieldstyle: {
+        //输入框样式
+        border: '2rpx solid #f6f6f6',
+        'border-radius': '24px',
+        'padding-left': '20rpx',
+        'background-color': '#f6f6f6',
+      },
+      tishitext: '',
+    };
+  },
+  methods: {
+    tophoto() {
+      uni.navigateTo({
+        url:
+          './imgList?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id,
+      });
+    },
+    tohis() {
+      uni.navigateTo({
+        url:
+          './history?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id,
+      });
+    },
+    simRouter() {
+      uni.navigateTo({
+        url: '/pages/prevention/sim?id=' + this.equipInfo.d_id,
+      });
+    },
+    copy(item) {
+      console.log(item);
+      uni.setClipboardData({
+        data: item.imei || item.device_id,
+        success: function () {
+          console.log('success');
+        },
+      });
+    },
+    async getatah() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.color_attract_data',
+        data: {
+          device_id: this.equipInfo.imei,
+        },
+      });
+      console.log(res);
+      if (res) {
+        this.at = res.at / 10;
+        this.ah = res.ah / 10;
+        this.status = res.ds;
+        this.version = res.dver;
+      } else {
+        this.at = '暂无';
+        this.ah = '暂无';
+      }
+    },
+  },
+  onLoad(option) {
+    var times = new Date();
+    this.date =
+      times.getFullYear() +
+      1 +
+      '-' +
+      Number(times.getMonth() + 1) +
+      '-' +
+      times.getDate();
+    this.equipInfo = JSON.parse(option.detail);
+    console.log(this.equipInfo);
+    this.getatah();
+    // console.log(this.equipInfo)
+    // this.getbaseinfo()
+  },
+};
 </script>
 
-<style lang='less'>
-	page {
-		padding: 20rpx;
-		box-sizing: border-box;
+<style lang="less">
+page {
+  padding: 20rpx;
+  box-sizing: border-box;
 
-		.info {
-			padding: 20rpx 40rpx;
-			color: #fff;
-			line-height: 50rpx;
-			font-size: 26rpx;
-			background-size: 100% auto;
-			background-repeat: no-repeat;
-			background-color: #0DC6B6;
-			background-position: top left;
-			box-sizing: border-box;
-			width: 100%;
+  .info {
+    padding: 20rpx 40rpx;
+    color: #fff;
+    line-height: 50rpx;
+    font-size: 26rpx;
+    background-size: 100% auto;
+    background-repeat: no-repeat;
+    background-color: #0dc6b6;
+    background-position: top left;
+    box-sizing: border-box;
+    width: 100%;
 
-			.tishi {
-				width: 28rpx;
-				height: 28rpx;
-				margin: 0rpx 0 0 20rpx;
-			}
-		}
+    .tishi {
+      width: 28rpx;
+      height: 28rpx;
+      margin: 0rpx 0 0 20rpx;
+    }
+  }
 
-		.on {
-			background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png')
-		}
+  .on {
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png');
+  }
 
-		.off {
-			background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png')
-		}
+  .off {
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png');
+  }
 
-		.caobox {
-			display: flex;
-			flex-wrap: wrap;
-			text-align: center;
-			font-size: 28rpx;
-			color: #666;
-			line-height: 50rpx;
+  .caobox {
+    display: flex;
+    flex-wrap: wrap;
+    text-align: center;
+    font-size: 28rpx;
+    color: #666;
+    line-height: 50rpx;
 
-			image {
-				width: 52rpx;
-			}
+    image {
+      width: 52rpx;
+    }
 
-			.caobox_item {
-				padding: 20rpx 0;
-				box-sizing: border-box;
-				flex-basis: 25%;
-			}
-		}
+    .caobox_item {
+      padding: 20rpx 0;
+      box-sizing: border-box;
+      flex-basis: 25%;
+    }
+  }
 
-		.realtime {
-			width: 95%;
-			margin: 0rpx auto;
+  .realtime {
+    width: 95%;
+    margin: 0rpx auto;
 
-			.realtime_title {
-				font-size: 32rpx;
-				display: flex;
-				justify-content: space-between;
-				font-weight: 700;
+    .realtime_title {
+      font-size: 32rpx;
+      display: flex;
+      justify-content: space-between;
+      font-weight: 700;
 
-				.span {
-					color: #6e6c76;
-					font-size: 24rpx;
-					display: flex;
-					justify-content: space-between;
-					margin-top: 12rpx;
-				}
-			}
+      .span {
+        color: #6e6c76;
+        font-size: 24rpx;
+        display: flex;
+        justify-content: space-between;
+        margin-top: 12rpx;
+      }
+    }
 
-			.realtime_text {
-				margin-top: 20rpx;
-				display: flex;
-				justify-content: space-between;
-				flex-wrap: wrap;
+    .realtime_text {
+      margin-top: 20rpx;
+      display: flex;
+      justify-content: space-between;
+      flex-wrap: wrap;
 
-				.realtime_item {
-					width: 48%;
-					height: 100rpx;
-					display: flex;
-					box-shadow: 0 0 10rpx #bcb9ca;
-					margin-top: 20rpx;
-					padding: 20rpx 0;
+      .realtime_item {
+        width: 48%;
+        height: 100rpx;
+        display: flex;
+        box-shadow: 0 0 10rpx #bcb9ca;
+        margin-top: 20rpx;
+        padding: 20rpx 0;
 
-					image {
-						width: 60rpx;
-						height: 60rpx;
-						margin: 20rpx 20rpx 20rpx 40rpx;
-					}
+        image {
+          width: 60rpx;
+          height: 60rpx;
+          margin: 20rpx 20rpx 20rpx 40rpx;
+        }
 
-					.text {
-						padding: 10rpx 0 10rpx 30rpx;
-					}
-				}
-			}
-		}
-	}
+        .text {
+          padding: 10rpx 0 10rpx 30rpx;
+        }
+      }
+    }
+  }
+}
 
-	.btn-box {
-		text-align: center;
-		padding: 20rpx 30rpx;
-	}
+.btn-box {
+  text-align: center;
+  padding: 20rpx 30rpx;
+}
 
-	/deep/.u-calendar__action {
-		display: flex;
-		justify-content: space-around;
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
 
-		.u-calendar__action__text {
-			line-height: 25px;
-		}
-	}
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
 </style>

pages/cb/sy/history.vue

@@ -1,391 +1,404 @@
 <template>
-	<view>
-		<view class="">
-			<view class="timeandtype">
-				<view class="timebox">
-					<view class="firsttime" @click="timeshow=true">
-						<view class="" v-if="start_time!=''">
-							{{(start_time==""?'请选择开始时间':start_time)/1000|timeFormat()}}
-						</view>
-						<view class="" v-else>
-							{{start_time==""?'请选择开始时间':start_time}}
-						</view>
-					</view>
-					<view class="jiange">
-						-
-					</view>
-					<view class="endtime" @click="timeshow=true">
-						<view class="" v-if="end_time!=''">
-							{{(end_time==""?'请选择结束时间':end_time)/1000|timeFormat()}}
-						</view>
-						<view class="" v-else>
-							{{end_time==""?'请选择结束时间':end_time}}
-						</view>
-					</view>
-				</view>
-			</view>
-			<view class="refresh" @click="refresh">
-				刷 新
-			</view>
-			<view class="condition">
-				<scroll-view scroll-top="0" scroll-x="true" class="scroll-X">
-					<table class="table">
-						<tr class="tr">
-							<th class="th" v-for="(item,index) in thdata" :key="'a'+index">{{item}}</th>
-						</tr>
-						<tr class="tr" v-for="(items,indexs) in historylistdata" :key="'b'+indexs" v-if="!forbidden">
-							<td class="td">{{items.addtime|timeFormat()}}</td>
-							<td class="td">{{items.at==""?"--":items.ah/10}}</td>
-							<td class="td">{{items.ah==""?"--":items.at/10}}</td>
-							<td class="td">{{items.ds==1?"开机":"关机"}}</td>
-						</tr>
-						<tr class="tr" v-if="forbidden">
-							<td class="td" v-for="item in 8">暂无数据</td>
-						</tr>
-					</table>
-				</scroll-view>
-				<view class="pagenumber">
-					<button @click="prev">上一页</button>
-					<view class="pagenumber_page">
-						第 {{page}} 页
-					</view>
-					<view class="pagenumber_page">
-						共 {{pagesum}} 页
-					</view>
-					<button @click="next" :disabled="forbidden">下一页</button>
-				</view>
-			</view>
-		</view>
-		<u-calendar v-model="timeshow" :mode="mode" @change="timechange"></u-calendar>
-	</view>
+  <view>
+    <view class="">
+      <view class="timeandtype">
+        <view class="timebox">
+          <view class="firsttime" @click="timeshow = true">
+            <view class="" v-if="start_time != ''">
+              {{
+                ((start_time == '' ? '请选择开始时间' : start_time) / 1000)
+                  | timeFormat()
+              }}
+            </view>
+            <view class="" v-else>
+              {{ start_time == '' ? '请选择开始时间' : start_time }}
+            </view>
+          </view>
+          <view class="jiange"> - </view>
+          <view class="endtime" @click="timeshow = true">
+            <view class="" v-if="end_time != ''">
+              {{
+                ((end_time == '' ? '请选择结束时间' : end_time) / 1000)
+                  | timeFormat()
+              }}
+            </view>
+            <view class="" v-else>
+              {{ end_time == '' ? '请选择结束时间' : end_time }}
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="refresh" @click="refresh"> 刷 新 </view>
+      <view class="condition">
+        <scroll-view scroll-top="0" scroll-x="true" class="scroll-X">
+          <table class="table">
+            <tr class="tr">
+              <th class="th" v-for="(item, index) in thdata" :key="'a' + index">
+                {{ item }}
+              </th>
+            </tr>
+            <tr
+              class="tr"
+              v-for="(items, indexs) in historylistdata"
+              :key="'b' + indexs"
+              v-if="!forbidden"
+            >
+              <td class="td">{{ items.addtime | timeFormat() }}</td>
+              <td class="td">{{ items.at == '' ? '--' : items.ah / 10 }}</td>
+              <td class="td">{{ items.ah == '' ? '--' : items.at / 10 }}</td>
+              <td class="td">{{ items.ds == 1 ? '开机' : '关机' }}</td>
+            </tr>
+            <tr class="tr" v-if="forbidden">
+              <td class="td" v-for="item in 8">暂无数据</td>
+            </tr>
+          </table>
+        </scroll-view>
+        <view class="pagenumber">
+          <button @click="prev">上一页</button>
+          <view class="pagenumber_page"> 第 {{ page }} 页 </view>
+          <view class="pagenumber_page"> 共 {{ pagesum }} 页 </view>
+          <button @click="next" :disabled="forbidden">下一页</button>
+        </view>
+      </view>
+    </view>
+    <u-calendar
+      v-model="timeshow"
+      :mode="mode"
+      @change="timechange"
+    ></u-calendar>
+  </view>
 </template>
 
 <script>
-	import uCharts from '../../../components/js_sdk/u-charts/u-charts/u-charts.js';
-	var canvaColumnA = null;
-	export default {
-		data() {
-			return {
-				styles: {
-					// width: "650rpx",
-					height: "400rpx"
-				},
-				d_id: '',
-				start_time: "",
-				end_time: "",
-				historydatas: [],
-				titletext: ["24小时", "近一个月", "近半年", "近一年"],
-				titleidnex: 0,
-				device_id: '',
-				page: 1,
-				historylistdata: [],
-				thdata: ["上报时间", "空气湿度(%RH)", "空气温度(°C)", "开机状态"],
-				forbidden: false,
-				pixelRatio: 1,
-				canvastishiTF: false, //暂无数据提示
-				dataloadingtf: true, //加载中提示
-				pagesum: 1,
-				worms: [],
-				timeshow:false,
-				mode: 'range',
-			}
-		},
-		methods: {
-			//forecast.worm_lamp.device_history_data历史数据列表
-			async historylist() { //历史数据列表
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.color_attract_list',
-					data: {
-						d_id: this.d_id,
-						start_time: parseInt(this.start_time / 1000),
-						end_time: parseInt(this.end_time / 1000),
-            page: this.page,
-            page_size: 10
-					}
-				})
-				this.historylistdata = res.data
-				console.log(res.data)
-				this.pagesum = Math.ceil(res.counts / 10) || 1
-				if (res.data.length == 0) {
-					this.forbidden = true
-				} else {
-					this.forbidden = false
-				}
-				console.log(this.historylistdata)
-			},
-			// forecast.send_control.get_device_config 获取当前时间的数据
-			// async newdata() {
-			// 	const res = await this.$myRequest({
-			// 		url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_mqtt',
-			// 		data: {
-			// 			d_id: this.d_id
-			// 		}
-			// 	})
-			// 	if (res) {
-			// 		uni.showToast({
-			// 			title: '刷新成功',
-			// 			duration: 2000,
-			// 			icon: "none"
-			// 		});
-			// 	} else {
-			// 		uni.showToast({
-			// 			title: '刷新失败',
-			// 			duration: 2000,
-			// 			icon: "none"
-			// 		});
-			// 	}
-			// },
-			refresh() { //获取当前时间的数据
-				this.historylist()
-			},
-			prev() { //上一页
-				if (this.page > 1) {
-					this.page--
-					this.historylist()
-				}
-			},
-			next() { //下一页
-				if (this.page < this.pagesum) {
-					this.page++
-					this.historylist()
-				}
-			},
-			clickLeft() {
-				uni.navigateBack({
-					delta: 1
-				})
-			},
-			closetime() {
-				this.start_time = ""
-				this.end_time = ""
-				this.listpage = 1
-				this.historylist()
-			},
-			timechange(e) {
-				console.log(e)
-				this.start_time = +new Date(e.startDate)
-				this.end_time = +new Date(e.endDate)
-				this.listpage = 1
-				this.historylist()
-			},
-		},
-		onLoad(option) {
-			console.log(option)
-			this.d_id = option.d_id
-			this.device_id = option.device_id
-		},
-		onShow() {
-			this.end_time = +new Date() + 1000
-			this.start_time = this.end_time - 24 * 60 * 60 * 1000
-			console.log(new Date(this.end_time), new Date(this.start_time))
-			this.historylist()
-		},
-		onPullDownRefresh() {
-			console.log('refresh');
-			this.historylist()
-			setTimeout(function() {
-				uni.stopPullDownRefresh();
-			}, 1000);
-		}
-	}
+import uCharts from '../../../components/js_sdk/u-charts/u-charts/u-charts.js';
+var canvaColumnA = null;
+export default {
+  data() {
+    return {
+      styles: {
+        // width: "650rpx",
+        height: '400rpx',
+      },
+      d_id: '',
+      start_time: '',
+      end_time: '',
+      historydatas: [],
+      titletext: ['24小时', '近一个月', '近半年', '近一年'],
+      titleidnex: 0,
+      device_id: '',
+      page: 1,
+      historylistdata: [],
+      thdata: ['上报时间', '空气湿度(%RH)', '空气温度(°C)', '开机状态'],
+      forbidden: false,
+      pixelRatio: 1,
+      canvastishiTF: false, //暂无数据提示
+      dataloadingtf: true, //加载中提示
+      pagesum: 1,
+      worms: [],
+      timeshow: false,
+      mode: 'range',
+    };
+  },
+  methods: {
+    //forecast.worm_lamp.device_history_data历史数据列表
+    async historylist() {
+      //历史数据列表
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.color_attract_list',
+        data: {
+          d_id: this.d_id,
+          start_time: parseInt(this.start_time / 1000),
+          end_time: parseInt(this.end_time / 1000),
+          page: this.page,
+          page_size: 10,
+        },
+      });
+      this.historylistdata = res.data;
+      console.log(res.data);
+      this.pagesum = Math.ceil(res.counts / 10) || 1;
+      if (res.data.length == 0) {
+        this.forbidden = true;
+      } else {
+        this.forbidden = false;
+      }
+      console.log(this.historylistdata);
+    },
+    // forecast.send_control.get_device_config 获取当前时间的数据
+    // async newdata() {
+    // 	const res = await this.$myRequest({
+    // 		url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_mqtt',
+    // 		data: {
+    // 			d_id: this.d_id
+    // 		}
+    // 	})
+    // 	if (res) {
+    // 		uni.showToast({
+    // 			title: '刷新成功',
+    // 			duration: 2000,
+    // 			icon: "none"
+    // 		});
+    // 	} else {
+    // 		uni.showToast({
+    // 			title: '刷新失败',
+    // 			duration: 2000,
+    // 			icon: "none"
+    // 		});
+    // 	}
+    // },
+    refresh() {
+      //获取当前时间的数据
+      this.historylist();
+    },
+    prev() {
+      //上一页
+      if (this.page > 1) {
+        this.page--;
+        this.historylist();
+      }
+    },
+    next() {
+      //下一页
+      if (this.page < this.pagesum) {
+        this.page++;
+        this.historylist();
+      }
+    },
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    closetime() {
+      this.start_time = '';
+      this.end_time = '';
+      this.listpage = 1;
+      this.historylist();
+    },
+    timechange(e) {
+      console.log(e);
+      this.start_time = +new Date(e.startDate);
+      this.end_time = +new Date(e.endDate);
+      this.listpage = 1;
+      this.historylist();
+    },
+  },
+  onLoad(option) {
+    console.log(option);
+    this.d_id = option.d_id;
+    this.device_id = option.device_id;
+  },
+  onShow() {
+    this.end_time = +new Date() + 1000;
+    this.start_time = this.end_time - 24 * 60 * 60 * 1000;
+    console.log(new Date(this.end_time), new Date(this.start_time));
+    this.historylist();
+  },
+  onPullDownRefresh() {
+    console.log('refresh');
+    this.historylist();
+    setTimeout(function () {
+      uni.stopPullDownRefresh();
+    }, 1000);
+  },
+};
 </script>
 
 <style lang="less">
-	.timeandtype {
-		// background-color: #F6F6FB;
-		// padding: 20rpx;
-		box-sizing: border-box;
-		width: 90%;
-		margin: 40rpx auto 0;
-		.timebox {
-			box-shadow: 0 0 10rpx #bcb9ca;
-			display: flex;
-			background-color: #fff;
-			padding: 10px;
-			border-top-right-radius: 5px;
-			border-top-left-radius: 5px;
-	
-			.jiange {
-				width: 5%;
-				text-align: center;
-			}
-	
-			.firsttime,
-			.endtime {
-				width: 45%;
-				text-align: center;
-			}
-		}
-	
-		.warntypebox {
-			display: flex;
-			justify-content: space-between;
-			background-color: #fff;
-			padding: 10px;
-			border-top: 1px solid #F6F6FB;
-			border-bottom-right-radius: 5px;
-			border-bottom-left-radius: 5px;
-		}
-	}
-	.shuju_one,
-	.shuju_two {
-		// position: absolute;
-		// top: 100px;
-		// width: 90%;
-		// left: 5%;
-		width: 90%;
-		margin: 40rpx auto;
-		box-shadow: 0 0 10rpx #bcb9ca;
-		padding-top: 20rpx;
-		height: 550rpx;
+.timeandtype {
+  // background-color: #F6F6FB;
+  // padding: 20rpx;
+  box-sizing: border-box;
+  width: 90%;
+  margin: 40rpx auto 0;
+  .timebox {
+    box-shadow: 0 0 10rpx #bcb9ca;
+    display: flex;
+    background-color: #fff;
+    padding: 10px;
+    border-top-right-radius: 5px;
+    border-top-left-radius: 5px;
 
-		.canvastishi {
-			font-size: 32rpx;
-			position: absolute;
-			top: 50%;
-			left: 50%;
-			margin-left: -64rpx;
-			margin-top: -21rpx;
+    .jiange {
+      width: 5%;
+      text-align: center;
+    }
 
-			.dataloading:after {
-				overflow: hidden;
-				display: inline-block;
-				vertical-align: bottom;
-				animation: ellipsis 2s infinite;
-				content: "\2026";
-			}
+    .firsttime,
+    .endtime {
+      width: 45%;
+      text-align: center;
+    }
+  }
 
-			@keyframes ellipsis {
-				from {
-					width: 2px;
-				}
+  .warntypebox {
+    display: flex;
+    justify-content: space-between;
+    background-color: #fff;
+    padding: 10px;
+    border-top: 1px solid #f6f6fb;
+    border-bottom-right-radius: 5px;
+    border-bottom-left-radius: 5px;
+  }
+}
+.shuju_one,
+.shuju_two {
+  // position: absolute;
+  // top: 100px;
+  // width: 90%;
+  // left: 5%;
+  width: 90%;
+  margin: 40rpx auto;
+  box-shadow: 0 0 10rpx #bcb9ca;
+  padding-top: 20rpx;
+  height: 550rpx;
 
-				to {
-					width: 15px;
-				}
-			}
-		}
+  .canvastishi {
+    font-size: 32rpx;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin-left: -64rpx;
+    margin-top: -21rpx;
 
-		.shuju_one_title {
-			width: 70%;
-			margin: 0 auto;
-			display: flex;
+    .dataloading:after {
+      overflow: hidden;
+      display: inline-block;
+      vertical-align: bottom;
+      animation: ellipsis 2s infinite;
+      content: '\2026';
+    }
 
-			.tltle_text {
-				width: 25%;
-				border: 2rpx solid #B2B2B2;
-				color: #57c878;
-				text-align: center;
-				font-size: 24rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-			}
+    @keyframes ellipsis {
+      from {
+        width: 2px;
+      }
 
-			.title_text_color {
-				width: 25%;
-				border: 2rpx solid #57c878;
-				background-color: #57c878;
-				color: #fff;
-				text-align: center;
-				font-size: 24rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-			}
-		}
-	}
+      to {
+        width: 15px;
+      }
+    }
+  }
 
-	.refresh {
-		width: 90%;
-		// margin: 40rpx auto;
-		margin-left: 5%;
-    margin-top: 20rpx;
-		width: 160rpx;
-		height: 50rpx;
-		background-color: #57c878;
-		color: #FFFFFF;
-		line-height: 50rpx;
-		text-align: center;
-	}
+  .shuju_one_title {
+    width: 70%;
+    margin: 0 auto;
+    display: flex;
 
-	.condition {
-		width: 90%;
-		margin: 40rpx auto;
-		display: flex;
-		flex-wrap: wrap;
-		width: 90%;
-		box-shadow: 0 0 10rpx #bcb9ca;
-		margin-bottom: 30rpx;
+    .tltle_text {
+      width: 25%;
+      border: 2rpx solid #b2b2b2;
+      color: #57c878;
+      text-align: center;
+      font-size: 24rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+    }
 
-		.scroll-X {
-			width: 95%;
-			margin: 20rpx auto;
+    .title_text_color {
+      width: 25%;
+      border: 2rpx solid #57c878;
+      background-color: #57c878;
+      color: #fff;
+      text-align: center;
+      font-size: 24rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+    }
+  }
+}
 
-			.table {
-				width: 100%;
-			}
+.refresh {
+  width: 90%;
+  // margin: 40rpx auto;
+  margin-left: 5%;
+  margin-top: 20rpx;
+  width: 160rpx;
+  height: 50rpx;
+  background-color: #57c878;
+  color: #ffffff;
+  line-height: 50rpx;
+  text-align: center;
+}
 
-			.tr {
-				width: 1070rpx;
-				display: flex;
-				overflow: hidden;
+.condition {
+  width: 90%;
+  margin: 40rpx auto;
+  display: flex;
+  flex-wrap: wrap;
+  width: 90%;
+  box-shadow: 0 0 10rpx #bcb9ca;
+  margin-bottom: 30rpx;
 
-				.th,
-				.td {
-					display: inline-block;
-					padding: 5rpx;
-					width: 240rpx;
-					text-align: center;
-					height: 52rpx;
-					line-height: 52rpx;
-				}
+  .scroll-X {
+    width: 95%;
+    margin: 20rpx auto;
 
-				.th:first-child,
-				.td:first-child {
-					width: 350rpx;
-				}
-			}
+    .table {
+      width: 100%;
+    }
 
-			.tr:nth-child(2n-1) {
-				background-color: #f5fff8;
-			}
+    .tr {
+      width: 1070rpx;
+      display: flex;
+      overflow: hidden;
 
-			.tr:first-child {
-				background-color: #57c878;
-				color: #fff;
-			}
-		}
+      .th,
+      .td {
+        display: inline-block;
+        padding: 5rpx;
+        width: 240rpx;
+        text-align: center;
+        height: 52rpx;
+        line-height: 52rpx;
+      }
 
-		.pagenumber {
-			display: flex;
-			margin: 20rpx auto;
-      width: 100%;
-      justify-content: space-around;
+      .th:first-child,
+      .td:first-child {
+        width: 350rpx;
+      }
+    }
+
+    .tr:nth-child(2n-1) {
+      background-color: #f5fff8;
+    }
+
+    .tr:first-child {
+      background-color: #57c878;
+      color: #fff;
+    }
+  }
+
+  .pagenumber {
+    display: flex;
+    margin: 20rpx auto;
+    width: 100%;
+    justify-content: space-around;
+
+    button {
+      width: 150rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+      font-size: 26rpx;
+      text-align: center;
+      background-color: #57c878;
+      color: #ffffff;
+    }
 
-			button {
-				width: 150rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-				background-color: #57c878;
-				color: #FFFFFF;
-			}
+    .pagenumber_page {
+      // width: 100rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+      font-size: 26rpx;
+      text-align: center;
+    }
+  }
+}
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
 
-			.pagenumber_page {
-				// width: 100rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-			}
-		}
-	}
-	/deep/.u-calendar__action {
-		display: flex;
-		justify-content: space-around;
-	
-		.u-calendar__action__text {
-			line-height: 25px;
-		}
-	}
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
 </style>

pages/cb/sy/imgList.vue

@@ -1,285 +1,310 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view class="" style="position: relative;top: 44px;">
-			<view style="position: fixed;z-index: 100;">
-				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" title="查看图片" rightIcon="camera"
-					@clickRight="clickRight"></uni-nav-bar>
-			</view>
-			<!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
-			<view class="selecttimes" @click="tiemshow=!tiemshow">
-				<view class="timesbox">
-					<image
-						:src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
-						mode=""></image>
-					<p>{{timetab(timestate)}}</p>
-					<p class="or">~</p>
-					<p>{{timetab(timeend)}}</p>
-					<u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
-				</view>
-				<u-calendar v-model="tiemshow" mode="range" @change="tiemchange"></u-calendar>
-			</view>
-			<view class="imglist">
-				<view class="imglist_box" v-for="(item,index) in imglists" :key="index">
-					<view class="imglist_left">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif" mode="">
-						</image>
-						<image :src="item.addr" mode="" @click="examine(index)"></image>
-					</view>
-					<view class="imglist_right">
-						<view class="">
-							{{item.time}}
-						</view>
-						<view class="">
-							害虫数量:{{item.pest_counts}}
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="top" v-if="isTop" @click="top">
-			<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/6209a98f0cb3b5086f2ca36152c9269.png'"
-				mode=""></image>
-		</view>
-	</view>
+  <view>
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view style="position: fixed; z-index: 100">
+        <uni-nav-bar
+          @clickLeft="clickLeft"
+          left-icon="back"
+          title="查看图片"
+          rightIcon="camera"
+          @clickRight="clickRight"
+        ></uni-nav-bar>
+      </view>
+      <!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
+      <view class="selecttimes" @click="tiemshow = !tiemshow">
+        <view class="timesbox">
+          <image
+            :src="
+              'http://www.hnyfwlw.com:8006/bigdata_app' +
+              '/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'
+            "
+            mode=""
+          ></image>
+          <p>{{ timetab(timestate) }}</p>
+          <p class="or">~</p>
+          <p>{{ timetab(timeend) }}</p>
+          <u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
+        </view>
+        <u-calendar
+          v-model="tiemshow"
+          mode="range"
+          @change="tiemchange"
+        ></u-calendar>
+      </view>
+      <view class="imglist">
+        <view
+          class="imglist_box"
+          v-for="(item, index) in imglists"
+          :key="index"
+        >
+          <view class="imglist_left">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif"
+              mode=""
+            >
+            </image>
+            <image :src="item.addr" mode="" @click="examine(index)"></image>
+          </view>
+          <view class="imglist_right">
+            <view class="">
+              {{ item.time }}
+            </view>
+            <view class=""> 害虫数量:{{ item.pest_counts }} </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="top" v-if="isTop" @click="top">
+      <image
+        :src="
+          'http://www.hnyfwlw.com:8006/bigdata_app' +
+          '/image/6209a98f0cb3b5086f2ca36152c9269.png'
+        "
+        mode=""
+      ></image>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				tiemshow:false,
-				timestate:"",
-				timeend:"",
-				isTop:false,
-				imglists:[],
-				device_id:"",
-				page:1,
-				d_id:""
-			}
-		},
-		methods: {
-			clickLeft(){
-				uni.navigateBack({
-					delta:1
-				})
-			},
-			clickRight(){
-				this.takephoto()
-			},
-			timetab(e) {
-				e = new Date(e * 1000)
-				var year = e.getFullYear()
-				var month = e.getMonth() + 1 < 10 ? "0" + (e.getMonth() + 1) : e.getMonth() + 1
-				var day = e.getDate() < 10 ? "0" + e.getDate() : e.getDate()
-				var time = year + "/" + month + "/" + day
-				return time
-			},
-			examine(index){
-				var imgarr = []
-				for (var i = 0; i < this.imglists.length; i++) {
-					imgarr.push(this.imglists[i].addr)
-				}
-				uni.previewImage({
-					urls: imgarr,
-					current: index
-				});
-			},
-			async getimglist(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
-					data: {
-						cmd: "color",
-						device_id: this.device_id,
-						page: this.page,
-						page_number: "12",
-						time_begin: Math.floor(this.timestate),
-						time_end: Math.floor(this.timeend),
-					}
-				})
-				console.log(res)
-        this.imglists = [...this.imglists, ...res.data]
-        if(this.imglists.length == 0) {
-					uni.showToast({
-						title: '数据为空',
-						duration: 2000,
-						icon:'none'
-					});
-				}
-			},
-			top() {
-				uni.pageScrollTo({
-					scrollTop: 0,
-					duration: 500
-				})
-			},
-			tiemchange(e){
-				// console.log(e)
-				this.imglists = []
-				this.page = 1
-				console.log(e)
-				this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60
-				this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60
-				this.getimglist()
-			},
-			async takephoto() { //拍照
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
-					data: {
-						device_type_id: 8,
-						d_id: this.d_id,
-						cmd: "takephoto"
-					}
-				})
-				console.log(res)
-				if (res == true) {
-					uni.showToast({
-						title: '指令下发成功！',
-						duration: 2000
-					});
-					var that = this
-					setTimeout(() => {
-						that.getimglist()
-					}, 1000)
-				} else {
-					uni.showToast({
-						title: '指令下发失败！',
-						duration: 2000,
-						icon: "none"
-					});
-				}
-			
-			},
-		},
-		onLoad(option) {
-			this.d_id =  option.d_id
-			this.device_id = option.device_id
-			this.timeend = +new Date() / 1000
-			this.timestate = this.timeend - 60 * 60 * 24
-			this.getimglist()
-		},
-		onReachBottom() {
-			this.page++
-			this.getimglist()
-		},
-		onPageScroll(e) { //nvue暂不支持滚动监听，可用bindingx代替
-			if (e.scrollTop > 200) { //距离大于200时显示
-				this.isTop = true
-			} else { //距离小于200时隐藏
-				this.isTop = false
-			}
-		}
-	}
+export default {
+  data() {
+    return {
+      tiemshow: false,
+      timestate: '',
+      timeend: '',
+      isTop: false,
+      imglists: [],
+      device_id: '',
+      page: 1,
+      d_id: '',
+    };
+  },
+  methods: {
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    clickRight() {
+      this.takephoto();
+    },
+    timetab(e) {
+      e = new Date(e * 1000);
+      var year = e.getFullYear();
+      var month =
+        e.getMonth() + 1 < 10 ? '0' + (e.getMonth() + 1) : e.getMonth() + 1;
+      var day = e.getDate() < 10 ? '0' + e.getDate() : e.getDate();
+      var time = year + '/' + month + '/' + day;
+      return time;
+    },
+    examine(index) {
+      var imgarr = [];
+      for (var i = 0; i < this.imglists.length; i++) {
+        imgarr.push(this.imglists[i].addr);
+      }
+      uni.previewImage({
+        urls: imgarr,
+        current: index,
+      });
+    },
+    async getimglist() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
+        data: {
+          cmd: 'color',
+          device_id: this.device_id,
+          page: this.page,
+          page_number: '12',
+          time_begin: Math.floor(this.timestate),
+          time_end: Math.floor(this.timeend),
+        },
+      });
+      console.log(res);
+      this.imglists = [...this.imglists, ...res.data];
+      if (this.imglists.length == 0) {
+        uni.showToast({
+          title: '数据为空',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+    top() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 500,
+      });
+    },
+    tiemchange(e) {
+      // console.log(e)
+      this.imglists = [];
+      this.page = 1;
+      console.log(e);
+      this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60;
+      this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60;
+      this.getimglist();
+    },
+    async takephoto() {
+      //拍照
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
+        data: {
+          device_type_id: 8,
+          d_id: this.d_id,
+          cmd: 'takephoto',
+        },
+      });
+      console.log(res);
+      if (res == true) {
+        uni.showToast({
+          title: '指令下发成功！',
+          duration: 2000,
+        });
+        var that = this;
+        setTimeout(() => {
+          that.getimglist();
+        }, 1000);
+      } else {
+        uni.showToast({
+          title: '指令下发失败！',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+  },
+  onLoad(option) {
+    this.d_id = option.d_id;
+    this.device_id = option.device_id;
+    this.timeend = +new Date() / 1000;
+    this.timestate = this.timeend - 60 * 60 * 24;
+    this.getimglist();
+  },
+  onReachBottom() {
+    this.page++;
+    this.getimglist();
+  },
+  onPageScroll(e) {
+    //nvue暂不支持滚动监听，可用bindingx代替
+    if (e.scrollTop > 200) {
+      //距离大于200时显示
+      this.isTop = true;
+    } else {
+      //距离小于200时隐藏
+      this.isTop = false;
+    }
+  },
+};
 </script>
 
 <style lang="scss">
-	.tishi {
-		position: absolute;
-		top: 104px;
-		width: 95%;
-		left: 2.5%;
-		text-align: center;
-		font-size: 40rpx;
-	}
+.tishi {
+  position: absolute;
+  top: 104px;
+  width: 95%;
+  left: 2.5%;
+  text-align: center;
+  font-size: 40rpx;
+}
 
-	.selecttimes {
-		width: 100%;
-		position: fixed;
-		top: 85px;
-		left: 0;
-		z-index: 100;
-		background-color: #fff;
-		padding-top: 30rpx;
+.selecttimes {
+  width: 100%;
+  position: fixed;
+  top: 85px;
+  left: 0;
+  z-index: 100;
+  background-color: #fff;
+  padding-top: 30rpx;
 
-		.timesbox {
-			display: flex;
-			width: 95%;
-			margin: 0 auto;
-			justify-content: space-around;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 10rpx 20rpx;
-			box-sizing: border-box;
+  .timesbox {
+    display: flex;
+    width: 95%;
+    margin: 0 auto;
+    justify-content: space-around;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 10rpx 20rpx;
+    box-sizing: border-box;
 
-			image {
-				width: 30rpx;
-				height: 30rpx;
-				margin-top: 6rpx;
-			}
+    image {
+      width: 30rpx;
+      height: 30rpx;
+      margin-top: 6rpx;
+    }
 
-			.icon {
-				color: #949494;
-				text-align: right;
-				margin-left: 30rpx;
+    .icon {
+      color: #949494;
+      text-align: right;
+      margin-left: 30rpx;
+    }
+  }
 
-			}
-		}
+  ::v-deep .u-calendar__action {
+    display: flex;
+    justify-content: space-around;
 
-		/deep/.u-calendar__action {
-			display: flex;
-			justify-content: space-around;
+    .u-calendar__action__text {
+      line-height: 25px;
+    }
+  }
+}
+.imglist {
+  position: absolute;
+  top: 100px;
+  width: 95%;
+  left: 2.5%;
 
-			.u-calendar__action__text {
-				line-height: 25px;
-			}
-		}
-	}
-	.imglist {
-		position: absolute;
-		top: 100px;
-		width: 95%;
-		left: 2.5%;
-	
-		.imglist_box {
-			display: flex;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 20rpx;
-			margin-bottom: 20rpx;
-			height: 155px;
-		}
-	
-		.imglist_left {
-			width: 50%;
-			position: relative;
-	
-			image {
-				position: absolute;
-				top: 0;
-				left: 0;
-				width: 100%;
-				height: 280rpx;
-			}
-		}
-	
-		.imglist_right {
-			margin-left: 40rpx;
-			padding: 10rpx 0;
-	
-			.icon_box {
-				margin-bottom: 12rpx;
-				font-size: 24rpx;
-	
-				.iconfont {
-					margin-right: 20rpx;
-					color: #56C877;
-					font-size: 32rpx;
-				}
-			}
-	
-			p:last-child {
-				margin-bottom: 0;
-			}
-	
-		}
-	}
+  .imglist_box {
+    display: flex;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 20rpx;
+    margin-bottom: 20rpx;
+    height: 155px;
+  }
+
+  .imglist_left {
+    width: 50%;
+    position: relative;
+
+    image {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 280rpx;
+    }
+  }
+
+  .imglist_right {
+    margin-left: 40rpx;
+    padding: 10rpx 0;
+
+    .icon_box {
+      margin-bottom: 12rpx;
+      font-size: 24rpx;
+
+      .iconfont {
+        margin-right: 20rpx;
+        color: #56c877;
+        font-size: 32rpx;
+      }
+    }
+
+    p:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
 .top {
-		position: fixed;
-		right: 30px;
-		bottom: 100px;
-		z-index: 100;
+  position: fixed;
+  right: 30px;
+  bottom: 100px;
+  z-index: 100;
 
-		image {
-			width: 100rpx;
-			height: 100rpx;
-		}
-	}
+  image {
+    width: 100rpx;
+    height: 100rpx;
+  }
+}
 </style>

pages/cb/thxydetail/photolist.vue

@@ -1,285 +1,310 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view class="" style="position: relative;top: 44px;">
-			<view style="position: fixed;z-index: 100;">
-				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" title="查看图片" rightIcon="camera"
-					@clickRight="clickRight"></uni-nav-bar>
-			</view>
-			<!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
-			<view class="selecttimes" @click="tiemshow=!tiemshow">
-				<view class="timesbox">
-					<image
-						:src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
-						mode=""></image>
-					<p>{{timetab(timestate)}}</p>
-					<p class="or">~</p>
-					<p>{{timetab(timeend)}}</p>
-					<u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
-				</view>
-				<u-calendar v-model="tiemshow" mode="range" @change="tiemchange"></u-calendar>
-			</view>
-			<view class="imglist">
-				<view class="imglist_box" v-for="(item,index) in imglists" :key="index">
-					<view class="imglist_left">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif" mode="">
-						</image>
-						<image :src="item.addr" mode="" @click="examine(index)"></image>
-					</view>
-					<view class="imglist_right">
-						<view class="">
-							{{item.time}}
-						</view>
-						<view class="">
-							害虫数量:{{item.pest_counts}}
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="top" v-if="isTop" @click="top">
-			<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/6209a98f0cb3b5086f2ca36152c9269.png'"
-				mode=""></image>
-		</view>
-	</view>
+  <view>
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view style="position: fixed; z-index: 100">
+        <uni-nav-bar
+          @clickLeft="clickLeft"
+          left-icon="back"
+          title="查看图片"
+          rightIcon="camera"
+          @clickRight="clickRight"
+        ></uni-nav-bar>
+      </view>
+      <!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
+      <view class="selecttimes" @click="tiemshow = !tiemshow">
+        <view class="timesbox">
+          <image
+            :src="
+              'http://www.hnyfwlw.com:8006/bigdata_app' +
+              '/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'
+            "
+            mode=""
+          ></image>
+          <p>{{ timetab(timestate) }}</p>
+          <p class="or">~</p>
+          <p>{{ timetab(timeend) }}</p>
+          <u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
+        </view>
+        <u-calendar
+          v-model="tiemshow"
+          mode="range"
+          @change="tiemchange"
+        ></u-calendar>
+      </view>
+      <view class="imglist">
+        <view
+          class="imglist_box"
+          v-for="(item, index) in imglists"
+          :key="index"
+        >
+          <view class="imglist_left">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif"
+              mode=""
+            >
+            </image>
+            <image :src="item.addr" mode="" @click="examine(index)"></image>
+          </view>
+          <view class="imglist_right">
+            <view class="">
+              {{ item.time }}
+            </view>
+            <view class=""> 害虫数量:{{ item.pest_counts }} </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="top" v-if="isTop" @click="top">
+      <image
+        :src="
+          'http://www.hnyfwlw.com:8006/bigdata_app' +
+          '/image/6209a98f0cb3b5086f2ca36152c9269.png'
+        "
+        mode=""
+      ></image>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				tiemshow:false,
-				timestate:"",
-				timeend:"",
-				isTop:false,
-				imglists:[],
-				device_id:"",
-				page:1,
-				d_id:""
-			}
-		},
-		methods: {
-			clickLeft(){
-				uni.navigateBack({
-					delta:1
-				})
-			},
-			clickRight(){
-				this.takephoto()
-			},
-			timetab(e) {
-				e = new Date(e * 1000)
-				var year = e.getFullYear()
-				var month = e.getMonth() + 1 < 10 ? "0" + (e.getMonth() + 1) : e.getMonth() + 1
-				var day = e.getDate() < 10 ? "0" + e.getDate() : e.getDate()
-				var time = year + "/" + month + "/" + day
-				return time
-			},
-			examine(index){
-				var imgarr = []
-				for (var i = 0; i < this.imglists.length; i++) {
-					imgarr.push(this.imglists[i].addr)
-				}
-				uni.previewImage({
-					urls: imgarr,
-					current: index
-				});
-			},
-			async getimglist(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
-					data: {
-						cmd: "xy_three",
-						device_id: this.device_id,
-						page: this.page,
-						page_number: "12",
-						time_begin: Math.floor(this.timestate),
-						time_end: Math.floor(this.timeend),
-					}
-				})
-				console.log(res)
-        this.imglists = [...this.imglists, ...res.data]
-        if(this.imglists.length == 0) {
-					uni.showToast({
-						title: '数据为空',
-						duration: 2000,
-						icon:'none'
-					});
-				}
-			},
-			top() {
-				uni.pageScrollTo({
-					scrollTop: 0,
-					duration: 500
-				})
-			},
-			tiemchange(e){
-				// console.log(e)
-				this.imglists = []
-				this.page = 1
-				console.log(e)
-				this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60
-				this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60
-				this.getimglist()
-			},
-			async takephoto() { //拍照
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
-					data: {
-						device_type_id: 8,
-						d_id: this.d_id,
-						cmd: "takephoto"
-					}
-				})
-				console.log(res)
-				if (res == true) {
-					uni.showToast({
-						title: '指令下发成功！',
-						duration: 2000
-					});
-					var that = this
-					setTimeout(() => {
-						that.getimglist()
-					}, 1000)
-				} else {
-					uni.showToast({
-						title: '指令下发失败！',
-						duration: 2000,
-						icon: "none"
-					});
-				}
-			
-			},
-		},
-		onLoad(option) {
-			this.d_id =  option.d_id
-			this.device_id = option.device_id
-			this.timeend = +new Date() / 1000
-			this.timestate = this.timeend - 60 * 60 * 24
-			this.getimglist()
-		},
-		onReachBottom() {
-			this.page++
-			this.getimglist()
-		},
-		onPageScroll(e) { //nvue暂不支持滚动监听，可用bindingx代替
-			if (e.scrollTop > 200) { //距离大于200时显示
-				this.isTop = true
-			} else { //距离小于200时隐藏
-				this.isTop = false
-			}
-		}
-	}
+export default {
+  data() {
+    return {
+      tiemshow: false,
+      timestate: '',
+      timeend: '',
+      isTop: false,
+      imglists: [],
+      device_id: '',
+      page: 1,
+      d_id: '',
+    };
+  },
+  methods: {
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    clickRight() {
+      this.takephoto();
+    },
+    timetab(e) {
+      e = new Date(e * 1000);
+      var year = e.getFullYear();
+      var month =
+        e.getMonth() + 1 < 10 ? '0' + (e.getMonth() + 1) : e.getMonth() + 1;
+      var day = e.getDate() < 10 ? '0' + e.getDate() : e.getDate();
+      var time = year + '/' + month + '/' + day;
+      return time;
+    },
+    examine(index) {
+      var imgarr = [];
+      for (var i = 0; i < this.imglists.length; i++) {
+        imgarr.push(this.imglists[i].addr);
+      }
+      uni.previewImage({
+        urls: imgarr,
+        current: index,
+      });
+    },
+    async getimglist() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
+        data: {
+          cmd: 'xy_three',
+          device_id: this.device_id,
+          page: this.page,
+          page_number: '12',
+          time_begin: Math.floor(this.timestate),
+          time_end: Math.floor(this.timeend),
+        },
+      });
+      console.log(res);
+      this.imglists = [...this.imglists, ...res.data];
+      if (this.imglists.length == 0) {
+        uni.showToast({
+          title: '数据为空',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+    top() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 500,
+      });
+    },
+    tiemchange(e) {
+      // console.log(e)
+      this.imglists = [];
+      this.page = 1;
+      console.log(e);
+      this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60;
+      this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60;
+      this.getimglist();
+    },
+    async takephoto() {
+      //拍照
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
+        data: {
+          device_type_id: 8,
+          d_id: this.d_id,
+          cmd: 'takephoto',
+        },
+      });
+      console.log(res);
+      if (res == true) {
+        uni.showToast({
+          title: '指令下发成功！',
+          duration: 2000,
+        });
+        var that = this;
+        setTimeout(() => {
+          that.getimglist();
+        }, 1000);
+      } else {
+        uni.showToast({
+          title: '指令下发失败！',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+  },
+  onLoad(option) {
+    this.d_id = option.d_id;
+    this.device_id = option.device_id;
+    this.timeend = +new Date() / 1000;
+    this.timestate = this.timeend - 60 * 60 * 24;
+    this.getimglist();
+  },
+  onReachBottom() {
+    this.page++;
+    this.getimglist();
+  },
+  onPageScroll(e) {
+    //nvue暂不支持滚动监听，可用bindingx代替
+    if (e.scrollTop > 200) {
+      //距离大于200时显示
+      this.isTop = true;
+    } else {
+      //距离小于200时隐藏
+      this.isTop = false;
+    }
+  },
+};
 </script>
 
 <style lang="scss">
-	.tishi {
-		position: absolute;
-		top: 104px;
-		width: 95%;
-		left: 2.5%;
-		text-align: center;
-		font-size: 40rpx;
-	}
+.tishi {
+  position: absolute;
+  top: 104px;
+  width: 95%;
+  left: 2.5%;
+  text-align: center;
+  font-size: 40rpx;
+}
 
-	.selecttimes {
-		width: 100%;
-		position: fixed;
-		top: 85px;
-		left: 0;
-		z-index: 100;
-		background-color: #fff;
-		padding-top: 30rpx;
+.selecttimes {
+  width: 100%;
+  position: fixed;
+  top: 85px;
+  left: 0;
+  z-index: 100;
+  background-color: #fff;
+  padding-top: 30rpx;
 
-		.timesbox {
-			display: flex;
-			width: 95%;
-			margin: 0 auto;
-			justify-content: space-around;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 10rpx 20rpx;
-			box-sizing: border-box;
+  .timesbox {
+    display: flex;
+    width: 95%;
+    margin: 0 auto;
+    justify-content: space-around;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 10rpx 20rpx;
+    box-sizing: border-box;
 
-			image {
-				width: 30rpx;
-				height: 30rpx;
-				margin-top: 6rpx;
-			}
+    image {
+      width: 30rpx;
+      height: 30rpx;
+      margin-top: 6rpx;
+    }
 
-			.icon {
-				color: #949494;
-				text-align: right;
-				margin-left: 30rpx;
+    .icon {
+      color: #949494;
+      text-align: right;
+      margin-left: 30rpx;
+    }
+  }
 
-			}
-		}
+  ::v-deep .u-calendar__action {
+    display: flex;
+    justify-content: space-around;
 
-		/deep/.u-calendar__action {
-			display: flex;
-			justify-content: space-around;
+    .u-calendar__action__text {
+      line-height: 25px;
+    }
+  }
+}
+.imglist {
+  position: absolute;
+  top: 100px;
+  width: 95%;
+  left: 2.5%;
 
-			.u-calendar__action__text {
-				line-height: 25px;
-			}
-		}
-	}
-	.imglist {
-		position: absolute;
-		top: 100px;
-		width: 95%;
-		left: 2.5%;
-	
-		.imglist_box {
-			display: flex;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 20rpx;
-			margin-bottom: 20rpx;
-			height: 140px;
-		}
-	
-		.imglist_left {
-			width: 50%;
-			position: relative;
-	
-			image {
-				position: absolute;
-				top: 0;
-				left: 0;
-				width: 100%;
-				height: 280rpx;
-			}
-		}
-	
-		.imglist_right {
-			margin-left: 40rpx;
-			padding: 10rpx 0;
-	
-			.icon_box {
-				margin-bottom: 12rpx;
-				font-size: 24rpx;
-	
-				.iconfont {
-					margin-right: 20rpx;
-					color: #56C877;
-					font-size: 32rpx;
-				}
-			}
-	
-			p:last-child {
-				margin-bottom: 0;
-			}
-	
-		}
-	}
+  .imglist_box {
+    display: flex;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 20rpx;
+    margin-bottom: 20rpx;
+    height: 140px;
+  }
+
+  .imglist_left {
+    width: 50%;
+    position: relative;
+
+    image {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 280rpx;
+    }
+  }
+
+  .imglist_right {
+    margin-left: 40rpx;
+    padding: 10rpx 0;
+
+    .icon_box {
+      margin-bottom: 12rpx;
+      font-size: 24rpx;
+
+      .iconfont {
+        margin-right: 20rpx;
+        color: #56c877;
+        font-size: 32rpx;
+      }
+    }
+
+    p:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
 .top {
-		position: fixed;
-		right: 30px;
-		bottom: 100px;
-		z-index: 100;
+  position: fixed;
+  right: 30px;
+  bottom: 100px;
+  z-index: 100;
 
-		image {
-			width: 100rpx;
-			height: 100rpx;
-		}
-	}
+  image {
+    width: 100rpx;
+    height: 100rpx;
+  }
+}
 </style>

pages/cb/thxydetail/thxydetail.vue

@@ -1,470 +1,546 @@
 <template>
-	<view>
-		<view :class="['info',equipInfo.is_online==1?'on':'off']">
-			<view class="" @click="copy(equipInfo)">
-				设备ID：{{equipInfo.imei||equipInfo.device_id}}
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png" mode="" class="tishi">
-				</image>
-			</view>
-			<view class="">
-				设备名称：{{equipInfo.device_name==""?"无":equipInfo.device_name}}
-			</view>
-			<view class="">
-				设备类型：性诱3.0
-			</view>
-			<view class="">
-				最新上报时间：{{equipInfo.uptime||equipInfo.uptime | timeFormat}}
-			</view>
-			<view class="">
-				设备地址：{{equipInfo.address}}
-			</view>
-			<view class="" @click="setdecoy">
-				诱芯名称：{{equipInfo.decoy}}
-				<u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
-			</view>
-			<view class="" @click="setdecoy">
-				诱芯到期时间：{{equipInfo.xy_expire}}
-				<u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
-			</view>
-		</view>
-		<u-popup v-model="yxShow" mode="center" width="600rpx">
-			<u-field label="害虫名称" label-width='240' required :error-message="xyErr" v-model="decoy" class="field"
-				:field-style="fieldstyle" placeholder="请填写害虫名称">
-			</u-field>
-			<u-field label="诱芯到期时间" label-width='240' required :error-message="xyErrtime" v-model="decoytime"
-				@click="settime" class="field" :field-style="fieldstyle" placeholder="请填写到期时间">
-			</u-field>
-			<view class="" style="text-align: center;color: #fa3534;">
-				{{tishitext}}
-			</view>
-			<view class="btn-box">
-				<u-button @click="yxSubmit" size="mini" type="success" class="box-item">确定</u-button>
-			</view>
-		</u-popup>
-		<u-calendar v-model="tiemshow" mode="date" :max-date="date" @change="tiemchange"></u-calendar>
-		<view class="caobox">
-			<view class="caobox_item" v-if="$QueryPermission(200)" @click="tophoto">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/1.png" mode="widthFix"></image>
-				<view class="">
-					查看图片
-				</view>
-			</view>
-			<view class="caobox_item" v-if="$QueryPermission(248)" @click="toset">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/4.png" mode="widthFix"></image>
-				<view class="">
-					设备控制
-				</view>
-			</view>
-			<view class="caobox_item" v-if="$QueryPermission(247)" @click="tosim">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/6.png" mode="widthFix"></image>
-				<view class="">
-					SIM卡
-				</view>
-			</view>
-			<view class="caobox_item" v-if="$QueryPermission(199)" @click="tohis">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/2.png" mode="widthFix"></image>
-				<view class="">
-					历史数据
-				</view>
-			</view>
-		</view>
-		<view class="realtime">
-			<view class="realtime_title">
-				<p>实时数据</p>
-			</view>
-			<view class="realtime_text">
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png" mode=""></image>
-					<view class="text">
-						<p>环境温度</p>
-						<p>{{at}}℃</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png" mode=""></image>
-					<view class="text">
-						<p>环境湿度</p>
-						<p>{{ah}}%</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/tianqi.png" mode=""></image>
-					<view class="text">
-						<p>天气</p>
-						<p>{{wea}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/xiayu.png" mode=""></image>
-					<view class="text">
-						<p>是否下雨</p>
-						<p>{{rain}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/fengxiang.png" mode=""></image>
-					<view class="text">
-						<p>风力风向</p>
-						<p>{{wind}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png" mode=""></image>
-					<view class="text">
-						<p>诱虫次数</p>
-						<p>{{wormnum}}</p>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+    <view :class="['info', equipInfo.is_online == 1 ? 'on' : 'off']">
+      <view class="" @click="copy(equipInfo)">
+        设备ID：{{ equipInfo.imei || equipInfo.device_id }}
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png"
+          mode=""
+          class="tishi"
+        >
+        </image>
+      </view>
+      <view class="">
+        设备名称：{{
+          equipInfo.device_name == '' ? '无' : equipInfo.device_name
+        }}
+      </view>
+      <view class=""> 设备类型：性诱3.0 </view>
+      <view class="">
+        最新上报时间：{{ equipInfo.uptime || equipInfo.uptime | timeFormat }}
+      </view>
+      <view class=""> 设备地址：{{ equipInfo.address }} </view>
+      <view class="" @click="setdecoy">
+        诱芯名称：{{ equipInfo.decoy }}
+        <u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
+      </view>
+      <view class="" @click="setdecoy">
+        诱芯到期时间：{{ equipInfo.xy_expire }}
+        <u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
+      </view>
+    </view>
+    <u-popup v-model="yxShow" mode="center" width="600rpx">
+      <u-field
+        label="害虫名称"
+        label-width="240"
+        required
+        :error-message="xyErr"
+        v-model="decoy"
+        class="field"
+        :field-style="fieldstyle"
+        placeholder="请填写害虫名称"
+      >
+      </u-field>
+      <u-field
+        label="诱芯到期时间"
+        label-width="240"
+        required
+        :error-message="xyErrtime"
+        v-model="decoytime"
+        @click="settime"
+        class="field"
+        :field-style="fieldstyle"
+        placeholder="请填写到期时间"
+      >
+      </u-field>
+      <view class="" style="text-align: center; color: #fa3534">
+        {{ tishitext }}
+      </view>
+      <view class="btn-box">
+        <u-button @click="yxSubmit" size="mini" type="success" class="box-item"
+          >确定</u-button
+        >
+      </view>
+    </u-popup>
+    <u-calendar
+      v-model="tiemshow"
+      mode="date"
+      :max-date="date"
+      @change="tiemchange"
+    ></u-calendar>
+    <view class="caobox">
+      <view class="caobox_item" v-if="$QueryPermission(200)" @click="tophoto">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/1.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> 查看图片 </view>
+      </view>
+      <view class="caobox_item" v-if="$QueryPermission(248)" @click="toset">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/4.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> 设备控制 </view>
+      </view>
+      <view class="caobox_item" v-if="$QueryPermission(247)" @click="tosim">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/6.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> SIM卡 </view>
+      </view>
+      <view class="caobox_item" v-if="$QueryPermission(199)" @click="tohis">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/2.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> 历史数据 </view>
+      </view>
+    </view>
+    <view class="realtime">
+      <view class="realtime_title">
+        <p>实时数据</p>
+      </view>
+      <view class="realtime_text">
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>环境温度</p>
+            <p>{{ at }}℃</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>环境湿度</p>
+            <p>{{ ah }}%</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/tianqi.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>天气</p>
+            <p>{{ wea }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/xiayu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>是否下雨</p>
+            <p>{{ rain }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/fengxiang.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>风力风向</p>
+            <p>{{ wind }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>诱虫次数</p>
+            <p>{{ wormnum }}</p>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				baseimei: "",
-				equipInfo: {},
-				trapnum: 1,
-				at: "",
-				ah: "",
-				wind: "",
-				wea: "",
-				rain: "",
-				wormnum: "",
-				decoy: "",
-				xyErr: "",
-				xyErrtime: "",
-				decoytime: "",
-				yxShow: false,
-				tiemshow: false,
-				date: "",
-				fieldstyle: { //输入框样式
-					border: "2rpx solid #f6f6f6",
-					"border-radius": "24px",
-					"padding-left": "20rpx",
-					"background-color": "#f6f6f6"
-				},
-				tishitext:""
-			}
-		},
-		methods: {
-			tosim() {
-				uni.navigateTo({
-					url: "/pages/prevention/sim?d_id=" + this.equipInfo.d_id + "&device_id=" + this.equipInfo.imei +
-						"&device_type=" + this.equipInfo.type + "&disable=" + this.equipInfo.disable
-				})
-			},
-			tophoto() {
-				uni.navigateTo({
-					url: "./photolist?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id
-				})
-			},
-			toset() {
-				uni.navigateTo({
-					url: "./thxyset?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id +
-						"&dtype=" + this.equipInfo.dtype +
-						"&device_name=" + this.equipInfo.device_name
-				})
-			},
-			tohis() {
-				uni.navigateTo({
-					url: "./thxyhisdata?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id
-				})
-			},
-			copy(item) {
-				console.log(item)
-				uni.setClipboardData({
-					data: item.imei || item.device_id,
-					success: function() {
-						console.log('success');
-					}
-				});
-			},
-			async getbaseinfo() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_list',
-					data: {
-						device_id: this.baseimei,
-						device_type_id: "8",
-						page: "1",
-						page_size: "10",
-					}
-				})
-				console.log(res.data[0])
-				this.equipInfo = res.data[0]
-				this.getatah()
-				this.getwind()
-				this.getweather()
-				this.getworm()
-			},
-			async getatah() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_at_ah',
-					data: {
-						device_type_id: 8,
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
-						end_time: Math.floor(+new Date() / 1000),
-					}
-				})
-				console.log(res)
-				if (res.length) {
-					this.at = res[0].at
-					this.ah = res[0].ah
-				} else {
-					this.at = "暂无"
-					this.ah = "暂无"
-				}
-			},
-			async getwind() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_history_data',
-					data: {
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
-						end_time: Math.floor(+new Date() / 1000),
-						device_id: this.equipInfo.imei,
-						page: 1,
-					}
-				})
-				// console.log(res.data[0].d_h_t)
-				if (res.data[0]) {
-					var fs = res.data[0].d_h_t.wind_sped;
-					let fx = res.data[0].d_h_t.wind_drec;
-					// if (fx > 337.5 || fx < 22.5) {
-					if (
-						(fx < 360 && fx > 337.5) ||
-						(fx < 22.5 && fx > 0) ||
-						fx == 0 ||
-						fx == 360
-					) {
-						fx = "北";
-					} else if (fx > 22.5 && fx < 67.5) {
-						fx = "东北";
-					} else if (fx > 67.5 && fx < 112.5) {
-						fx = "东";
-					} else if (fx > 112.5 && fx < 157.5) {
-						fx = "东南";
-					} else if (fx > 157.5 && fx < 202.5) {
-						fx = "南";
-					} else if (fx > 202.5 && fx < 247.5) {
-						fx = "西南";
-					} else if (fx > 247.5 && fx < 292.5) {
-						fx = "西";
-					} else if (fx > 292.5 && fx < 337.5) {
-						fx = "西北";
-					} else if (fx == 666) {
-						fx = "无";
-					}
-					if (fs >= 66.6) {
-						fs = 0;
-					}
-					// this.monitordata[4].key = fx + "风" + fs + "级";
-					this.wind = fx + "风" + fs + "级";
-				} else {
-					this.wind = "暂无"
-				}
-			},
-			async getweather() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=device.device_manage.weathers',
-					data: {
-						lng: Number(this.equipInfo.lng),
-						lat: Number(this.equipInfo.lat),
-					}
-				})
-				console.log(res)
-				// this.
-				if (res[0]) {
-					this.wea = res[0].wea
-					this.rain = res[0].wea.indexOf("雨") == -1 ? "否" : "是"
-				} else {
-					this.wea = "暂无"
-					this.rain = "暂无"
-				}
-			},
-			async getworm() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.xycb_pest_chart',
-					data: {
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
-						end_time: Math.floor(+new Date() / 1000),
-						device_type_id: "8",
-					}
-				})
-				console.log(res)
-				if (res.pest_data.length) {
-					this.wormnum = res.pest_data[0].pest_num
-				} else {
-					this.wormnum = "暂无"
-				}
-			},
-			setdecoy() {
-				this.decoy = this.equipInfo.decoy
-				this.decoytime = this.equipInfo.xy_expire
-				this.yxShow = true
-			},
-			settime() {
-				console.log(12)
-				this.tiemshow = true
-			},
-			tiemchange(e) {
-				console.log(e)
-				this.decoytime = e.result
-			},
-			async yxSubmit() {
-				var time = Math.floor(+new Date(this.decoytime) / 1000)
-				console.log(time)
-				if (this.decoy == "") {
-					this.tishitext = "请填写诱芯名称"
-					return
-				} else if (isNaN(time)) {
-					this.tishitext = "请填写诱芯到期时间"
-					return
-				}
-				this.tishitext = ""
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.set_decopy',
-					data: {
-						decoy: this.decoy,
-						device_id: this.equipInfo.imei,
-						device_type_id: "8",
-						expire_time: time,
-					}
-				})
-				console.log(res)
-				if (res.status) {
-					uni.showToast({
-						title: "设置成功",
-						icon: "none"
-					})
-					this.yxShow = false
-					this.getbaseinfo()
-				}
-			}
-		},
-		onLoad(option) {
-			var times = new Date()
-			this.date = times.getFullYear() + 1 + "-" + Number(times.getMonth() + 1) + "-" + times.getDate()
-			this.baseimei = option.imei
-			// console.log(this.equipInfo)
-			this.getbaseinfo()
-		},
-	}
+export default {
+  data() {
+    return {
+      baseimei: '',
+      equipInfo: {},
+      trapnum: 1,
+      at: '',
+      ah: '',
+      wind: '',
+      wea: '',
+      rain: '',
+      wormnum: '',
+      decoy: '',
+      xyErr: '',
+      xyErrtime: '',
+      decoytime: '',
+      yxShow: false,
+      tiemshow: false,
+      date: '',
+      fieldstyle: {
+        //输入框样式
+        border: '2rpx solid #f6f6f6',
+        'border-radius': '24px',
+        'padding-left': '20rpx',
+        'background-color': '#f6f6f6',
+      },
+      tishitext: '',
+    };
+  },
+  methods: {
+    tosim() {
+      uni.navigateTo({
+        url:
+          '/pages/prevention/sim?d_id=' +
+          this.equipInfo.d_id +
+          '&device_id=' +
+          this.equipInfo.imei +
+          '&device_type=' +
+          this.equipInfo.type +
+          '&disable=' +
+          this.equipInfo.disable,
+      });
+    },
+    tophoto() {
+      uni.navigateTo({
+        url:
+          './photolist?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id,
+      });
+    },
+    toset() {
+      uni.navigateTo({
+        url:
+          './thxyset?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id +
+          '&dtype=' +
+          this.equipInfo.dtype +
+          '&device_name=' +
+          this.equipInfo.device_name,
+      });
+    },
+    tohis() {
+      uni.navigateTo({
+        url:
+          './thxyhisdata?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id,
+      });
+    },
+    copy(item) {
+      console.log(item);
+      uni.setClipboardData({
+        data: item.imei || item.device_id,
+        success: function () {
+          console.log('success');
+        },
+      });
+    },
+    async getbaseinfo() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_list',
+        data: {
+          device_id: this.baseimei,
+          device_type_id: '8',
+          page: '1',
+          page_size: '10',
+        },
+      });
+      console.log(res.data[0]);
+      this.equipInfo = res.data[0];
+      this.getatah();
+      this.getwind();
+      this.getweather();
+      this.getworm();
+    },
+    async getatah() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_at_ah',
+        data: {
+          device_type_id: 8,
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
+          end_time: Math.floor(+new Date() / 1000),
+        },
+      });
+      console.log(res);
+      if (res.length) {
+        this.at = res[0].at;
+        this.ah = res[0].ah;
+      } else {
+        this.at = '暂无';
+        this.ah = '暂无';
+      }
+    },
+    async getwind() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.xy_three_history_data',
+        data: {
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
+          end_time: Math.floor(+new Date() / 1000),
+          device_id: this.equipInfo.imei,
+          page: 1,
+        },
+      });
+      // console.log(res.data[0].d_h_t)
+      if (res.data[0]) {
+        var fs = res.data[0].d_h_t.wind_sped;
+        let fx = res.data[0].d_h_t.wind_drec;
+        // if (fx > 337.5 || fx < 22.5) {
+        if (
+          (fx < 360 && fx > 337.5) ||
+          (fx < 22.5 && fx > 0) ||
+          fx == 0 ||
+          fx == 360
+        ) {
+          fx = '北';
+        } else if (fx > 22.5 && fx < 67.5) {
+          fx = '东北';
+        } else if (fx > 67.5 && fx < 112.5) {
+          fx = '东';
+        } else if (fx > 112.5 && fx < 157.5) {
+          fx = '东南';
+        } else if (fx > 157.5 && fx < 202.5) {
+          fx = '南';
+        } else if (fx > 202.5 && fx < 247.5) {
+          fx = '西南';
+        } else if (fx > 247.5 && fx < 292.5) {
+          fx = '西';
+        } else if (fx > 292.5 && fx < 337.5) {
+          fx = '西北';
+        } else if (fx == 666) {
+          fx = '无';
+        }
+        if (fs >= 66.6) {
+          fs = 0;
+        }
+        // this.monitordata[4].key = fx + "风" + fs + "级";
+        this.wind = fx + '风' + fs + '级';
+      } else {
+        this.wind = '暂无';
+      }
+    },
+    async getweather() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=device.device_manage.weathers',
+        data: {
+          lng: Number(this.equipInfo.lng),
+          lat: Number(this.equipInfo.lat),
+        },
+      });
+      console.log(res);
+      // this.
+      if (res[0]) {
+        this.wea = res[0].wea;
+        this.rain = res[0].wea.indexOf('雨') == -1 ? '否' : '是';
+      } else {
+        this.wea = '暂无';
+        this.rain = '暂无';
+      }
+    },
+    async getworm() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.xycb_pest_chart',
+        data: {
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
+          end_time: Math.floor(+new Date() / 1000),
+          device_type_id: '8',
+        },
+      });
+      console.log(res);
+      if (res.pest_data.length) {
+        this.wormnum = res.pest_data[0].pest_num;
+      } else {
+        this.wormnum = '暂无';
+      }
+    },
+    setdecoy() {
+      this.decoy = this.equipInfo.decoy;
+      this.decoytime = this.equipInfo.xy_expire;
+      this.yxShow = true;
+    },
+    settime() {
+      console.log(12);
+      this.tiemshow = true;
+    },
+    tiemchange(e) {
+      console.log(e);
+      this.decoytime = e.result;
+    },
+    async yxSubmit() {
+      var time = Math.floor(+new Date(this.decoytime) / 1000);
+      console.log(time);
+      if (this.decoy == '') {
+        this.tishitext = '请填写诱芯名称';
+        return;
+      } else if (isNaN(time)) {
+        this.tishitext = '请填写诱芯到期时间';
+        return;
+      }
+      this.tishitext = '';
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.set_decopy',
+        data: {
+          decoy: this.decoy,
+          device_id: this.equipInfo.imei,
+          device_type_id: '8',
+          expire_time: time,
+        },
+      });
+      console.log(res);
+      if (res.status) {
+        uni.showToast({
+          title: '设置成功',
+          icon: 'none',
+        });
+        this.yxShow = false;
+        this.getbaseinfo();
+      }
+    },
+  },
+  onLoad(option) {
+    var times = new Date();
+    this.date =
+      times.getFullYear() +
+      1 +
+      '-' +
+      Number(times.getMonth() + 1) +
+      '-' +
+      times.getDate();
+    this.baseimei = option.imei;
+    // console.log(this.equipInfo)
+    this.getbaseinfo();
+  },
+};
 </script>
 
-<style lang='less'>
-	page {
-		padding: 20rpx;
-		box-sizing: border-box;
+<style lang="less">
+page {
+  padding: 20rpx;
+  box-sizing: border-box;
 
-		.info {
-			padding: 20rpx 40rpx;
-			color: #fff;
-			line-height: 50rpx;
-			font-size: 26rpx;
-			background-size: 100% auto;
-			background-repeat: no-repeat;
-			background-color: #0DC6B6;
-			background-position: top left;
-			box-sizing: border-box;
-			width: 100%;
+  .info {
+    padding: 20rpx 40rpx;
+    color: #fff;
+    line-height: 50rpx;
+    font-size: 26rpx;
+    background-size: 100% auto;
+    background-repeat: no-repeat;
+    background-color: #0dc6b6;
+    background-position: top left;
+    box-sizing: border-box;
+    width: 100%;
 
-			.tishi {
-				width: 28rpx;
-				height: 28rpx;
-				margin: 0rpx 0 0 20rpx;
-			}
-		}
+    .tishi {
+      width: 28rpx;
+      height: 28rpx;
+      margin: 0rpx 0 0 20rpx;
+    }
+  }
 
-		.on {
-			background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png')
-		}
+  .on {
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png');
+  }
 
-		.off {
-			background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png')
-		}
+  .off {
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png');
+  }
 
-		.caobox {
-			display: flex;
-			flex-wrap: wrap;
-			text-align: center;
-			font-size: 28rpx;
-			color: #666;
-			line-height: 50rpx;
+  .caobox {
+    display: flex;
+    flex-wrap: wrap;
+    text-align: center;
+    font-size: 28rpx;
+    color: #666;
+    line-height: 50rpx;
 
-			image {
-				width: 52rpx;
-			}
+    image {
+      width: 52rpx;
+    }
 
-			.caobox_item {
-				padding: 20rpx 0;
-				box-sizing: border-box;
-				flex-basis: 25%;
-			}
-		}
+    .caobox_item {
+      padding: 20rpx 0;
+      box-sizing: border-box;
+      flex-basis: 25%;
+    }
+  }
 
-		.realtime {
-			width: 95%;
-			margin: 0rpx auto;
+  .realtime {
+    width: 95%;
+    margin: 0rpx auto;
 
-			.realtime_title {
-				font-size: 32rpx;
-				display: flex;
-				justify-content: space-between;
-				font-weight: 700;
+    .realtime_title {
+      font-size: 32rpx;
+      display: flex;
+      justify-content: space-between;
+      font-weight: 700;
 
-				.span {
-					color: #6e6c76;
-					font-size: 24rpx;
-					display: flex;
-					justify-content: space-between;
-					margin-top: 12rpx;
-				}
-			}
+      .span {
+        color: #6e6c76;
+        font-size: 24rpx;
+        display: flex;
+        justify-content: space-between;
+        margin-top: 12rpx;
+      }
+    }
 
-			.realtime_text {
-				margin-top: 20rpx;
-				display: flex;
-				justify-content: space-between;
-				flex-wrap: wrap;
+    .realtime_text {
+      margin-top: 20rpx;
+      display: flex;
+      justify-content: space-between;
+      flex-wrap: wrap;
 
-				.realtime_item {
-					width: 48%;
-					height: 100rpx;
-					display: flex;
-					box-shadow: 0 0 10rpx #bcb9ca;
-					margin-top: 20rpx;
-					padding: 20rpx 0;
+      .realtime_item {
+        width: 48%;
+        height: 100rpx;
+        display: flex;
+        box-shadow: 0 0 10rpx #bcb9ca;
+        margin-top: 20rpx;
+        padding: 20rpx 0;
 
-					image {
-						width: 60rpx;
-						height: 60rpx;
-						margin: 20rpx 20rpx 20rpx 40rpx;
-					}
+        image {
+          width: 60rpx;
+          height: 60rpx;
+          margin: 20rpx 20rpx 20rpx 40rpx;
+        }
 
-					.text {
-						padding: 10rpx 0 10rpx 30rpx;
-					}
-				}
-			}
-		}
-	}
+        .text {
+          padding: 10rpx 0 10rpx 30rpx;
+        }
+      }
+    }
+  }
+}
 
-	.btn-box {
-		text-align: center;
-		padding: 20rpx 30rpx;
-	}
+.btn-box {
+  text-align: center;
+  padding: 20rpx 30rpx;
+}
 
-	/deep/.u-calendar__action {
-		display: flex;
-		justify-content: space-around;
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
 
-		.u-calendar__action__text {
-			line-height: 25px;
-		}
-	}
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
 </style>

pages/cb/xctdetail/photolist.vue

@@ -1,278 +1,303 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view class="" style="position: relative;top: 44px;">
-			<view style="position: fixed;z-index: 100;">
-				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" title="查看图片" rightIcon="camera"
-					@clickRight="clickRight"></uni-nav-bar>
-			</view>
-			<!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
-			<view class="selecttimes" @click="tiemshow=!tiemshow">
-				<view class="timesbox">
-					<image
-						:src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
-						mode=""></image>
-					<p>{{timetab(timestate)}}</p>
-					<p class="or">~</p>
-					<p>{{timetab(timeend)}}</p>
-					<u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
-				</view>
-				<u-calendar v-model="tiemshow" mode="range" @change="tiemchange"></u-calendar>
-			</view>
-			<view class="imglist">
-				<view class="imglist_box" v-for="(item,index) in imglists" :key="index">
-					<view class="imglist_left">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif" mode="">
-						</image>
-						<image :src="item.addr" mode="" @click="examine(index)"></image>
-					</view>
-					<view class="imglist_right">
-						<view class="">
-							{{item.time}}
-						</view>
-						<view class="">
-							害虫数量:{{item.pest_counts}}
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="top" v-if="isTop" @click="top">
-			<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/6209a98f0cb3b5086f2ca36152c9269.png'"
-				mode=""></image>
-		</view>
-	</view>
+  <view>
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view style="position: fixed; z-index: 100">
+        <uni-nav-bar
+          @clickLeft="clickLeft"
+          left-icon="back"
+          title="查看图片"
+          rightIcon="camera"
+          @clickRight="clickRight"
+        ></uni-nav-bar>
+      </view>
+      <!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
+      <view class="selecttimes" @click="tiemshow = !tiemshow">
+        <view class="timesbox">
+          <image
+            :src="
+              'http://www.hnyfwlw.com:8006/bigdata_app' +
+              '/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'
+            "
+            mode=""
+          ></image>
+          <p>{{ timetab(timestate) }}</p>
+          <p class="or">~</p>
+          <p>{{ timetab(timeend) }}</p>
+          <u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
+        </view>
+        <u-calendar
+          v-model="tiemshow"
+          mode="range"
+          @change="tiemchange"
+        ></u-calendar>
+      </view>
+      <view class="imglist">
+        <view
+          class="imglist_box"
+          v-for="(item, index) in imglists"
+          :key="index"
+        >
+          <view class="imglist_left">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif"
+              mode=""
+            >
+            </image>
+            <image :src="item.addr" mode="" @click="examine(index)"></image>
+          </view>
+          <view class="imglist_right">
+            <view class="">
+              {{ item.time }}
+            </view>
+            <view class=""> 害虫数量:{{ item.pest_counts }} </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="top" v-if="isTop" @click="top">
+      <image
+        :src="
+          'http://www.hnyfwlw.com:8006/bigdata_app' +
+          '/image/6209a98f0cb3b5086f2ca36152c9269.png'
+        "
+        mode=""
+      ></image>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				tiemshow:false,
-				timestate:"",
-				timeend:"",
-				isTop:false,
-				imglists:[],
-				device_id:"",
-				page:1,
-				d_id:""
-			}
-		},
-		methods: {
-			clickLeft(){
-				uni.navigateBack({
-					delta:1
-				})
-			},
-			clickRight(){
-				this.takephoto()
-			},
-			timetab(e) {
-				e = new Date(e * 1000)
-				var year = e.getFullYear()
-				var month = e.getMonth() + 1 < 10 ? "0" + (e.getMonth() + 1) : e.getMonth() + 1
-				var day = e.getDate() < 10 ? "0" + e.getDate() : e.getDate()
-				var time = year + "/" + month + "/" + day
-				return time
-			},
-			examine(index){
-				var imgarr = []
-				for (var i = 0; i < this.imglists.length; i++) {
-					imgarr.push(this.imglists[i].addr)
-				}
-				uni.previewImage({
-					urls: imgarr,
-					current: index
-				});
-			},
-			async getimglist(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
-					data: {
-						cmd: "xct",
-						device_id: this.device_id,
-						page: this.page,
-						page_number: "12",
-						time_begin: Math.floor(this.timestate),
-						time_end: Math.floor(this.timeend),
-					}
-				})
-				console.log(res)
-				this.imglists = res.data
-			},
-			top() {
-				uni.pageScrollTo({
-					scrollTop: 0,
-					duration: 500
-				})
-			},
-			tiemchange(e){
-				// console.log(e)
-				this.imglists = []
-				this.page = 1
-				console.log(e)
-				this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60
-				this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60
-				this.getimglist()
-			},
-			async takephoto() { //拍照
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
-					data: {
-						device_type_id: 12,
-						d_id: this.d_id,
-						cmd: "takephoto"
-					}
-				})
-				console.log(res)
-				if (res == true) {
-					uni.showToast({
-						title: '指令下发成功！',
-						duration: 2000
-					});
-					var that = this
-					setTimeout(() => {
-						that.getimglist()
-					}, 1000)
-				} else {
-					uni.showToast({
-						title: '指令下发失败！',
-						duration: 2000,
-						icon: "none"
-					});
-				}
-			
-			},
-		},
-		onLoad(option) {
-			this.d_id =  option.d_id
-			this.device_id = option.device_id
-			this.timeend = +new Date() / 1000
-			this.timestate = this.timeend - 60 * 60 * 24
-			this.getimglist()
-		},
-		onReachBottom() {
-			this.page++
-			this.getimglist()
-		},
-		onPageScroll(e) { //nvue暂不支持滚动监听，可用bindingx代替
-			if (e.scrollTop > 200) { //距离大于200时显示
-				this.isTop = true
-			} else { //距离小于200时隐藏
-				this.isTop = false
-			}
-		}
-	}
+export default {
+  data() {
+    return {
+      tiemshow: false,
+      timestate: '',
+      timeend: '',
+      isTop: false,
+      imglists: [],
+      device_id: '',
+      page: 1,
+      d_id: '',
+    };
+  },
+  methods: {
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    clickRight() {
+      this.takephoto();
+    },
+    timetab(e) {
+      e = new Date(e * 1000);
+      var year = e.getFullYear();
+      var month =
+        e.getMonth() + 1 < 10 ? '0' + (e.getMonth() + 1) : e.getMonth() + 1;
+      var day = e.getDate() < 10 ? '0' + e.getDate() : e.getDate();
+      var time = year + '/' + month + '/' + day;
+      return time;
+    },
+    examine(index) {
+      var imgarr = [];
+      for (var i = 0; i < this.imglists.length; i++) {
+        imgarr.push(this.imglists[i].addr);
+      }
+      uni.previewImage({
+        urls: imgarr,
+        current: index,
+      });
+    },
+    async getimglist() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
+        data: {
+          cmd: 'xct',
+          device_id: this.device_id,
+          page: this.page,
+          page_number: '12',
+          time_begin: Math.floor(this.timestate),
+          time_end: Math.floor(this.timeend),
+        },
+      });
+      console.log(res);
+      this.imglists = res.data;
+    },
+    top() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 500,
+      });
+    },
+    tiemchange(e) {
+      // console.log(e)
+      this.imglists = [];
+      this.page = 1;
+      console.log(e);
+      this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60;
+      this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60;
+      this.getimglist();
+    },
+    async takephoto() {
+      //拍照
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
+        data: {
+          device_type_id: 12,
+          d_id: this.d_id,
+          cmd: 'takephoto',
+        },
+      });
+      console.log(res);
+      if (res == true) {
+        uni.showToast({
+          title: '指令下发成功！',
+          duration: 2000,
+        });
+        var that = this;
+        setTimeout(() => {
+          that.getimglist();
+        }, 1000);
+      } else {
+        uni.showToast({
+          title: '指令下发失败！',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+  },
+  onLoad(option) {
+    this.d_id = option.d_id;
+    this.device_id = option.device_id;
+    this.timeend = +new Date() / 1000;
+    this.timestate = this.timeend - 60 * 60 * 24;
+    this.getimglist();
+  },
+  onReachBottom() {
+    this.page++;
+    this.getimglist();
+  },
+  onPageScroll(e) {
+    //nvue暂不支持滚动监听，可用bindingx代替
+    if (e.scrollTop > 200) {
+      //距离大于200时显示
+      this.isTop = true;
+    } else {
+      //距离小于200时隐藏
+      this.isTop = false;
+    }
+  },
+};
 </script>
 
 <style lang="scss">
-	.tishi {
-		position: absolute;
-		top: 104px;
-		width: 95%;
-		left: 2.5%;
-		text-align: center;
-		font-size: 40rpx;
-	}
+.tishi {
+  position: absolute;
+  top: 104px;
+  width: 95%;
+  left: 2.5%;
+  text-align: center;
+  font-size: 40rpx;
+}
 
-	.selecttimes {
-		width: 100%;
-		position: fixed;
-		top: 85px;
-		left: 0;
-		z-index: 100;
-		background-color: #fff;
-		padding-top: 30rpx;
+.selecttimes {
+  width: 100%;
+  position: fixed;
+  top: 85px;
+  left: 0;
+  z-index: 100;
+  background-color: #fff;
+  padding-top: 30rpx;
 
-		.timesbox {
-			display: flex;
-			width: 95%;
-			margin: 0 auto;
-			justify-content: space-around;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 10rpx 20rpx;
-			box-sizing: border-box;
+  .timesbox {
+    display: flex;
+    width: 95%;
+    margin: 0 auto;
+    justify-content: space-around;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 10rpx 20rpx;
+    box-sizing: border-box;
 
-			image {
-				width: 30rpx;
-				height: 30rpx;
-				margin-top: 6rpx;
-			}
+    image {
+      width: 30rpx;
+      height: 30rpx;
+      margin-top: 6rpx;
+    }
 
-			.icon {
-				color: #949494;
-				text-align: right;
-				margin-left: 30rpx;
+    .icon {
+      color: #949494;
+      text-align: right;
+      margin-left: 30rpx;
+    }
+  }
 
-			}
-		}
+  ::v-deep .u-calendar__action {
+    display: flex;
+    justify-content: space-around;
 
-		/deep/.u-calendar__action {
-			display: flex;
-			justify-content: space-around;
+    .u-calendar__action__text {
+      line-height: 25px;
+    }
+  }
+}
+.imglist {
+  position: absolute;
+  top: 100px;
+  width: 95%;
+  left: 2.5%;
 
-			.u-calendar__action__text {
-				line-height: 25px;
-			}
-		}
-	}
-	.imglist {
-		position: absolute;
-		top: 100px;
-		width: 95%;
-		left: 2.5%;
-	
-		.imglist_box {
-			display: flex;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 20rpx;
-			margin-bottom: 20rpx;
-			height: 140px;
-		}
-	
-		.imglist_left {
-			width: 50%;
-			position: relative;
-	
-			image {
-				position: absolute;
-				top: 0;
-				left: 0;
-				width: 100%;
-				height: 280rpx;
-			}
-		}
-	
-		.imglist_right {
-			margin-left: 40rpx;
-			padding: 10rpx 0;
-	
-			.icon_box {
-				margin-bottom: 12rpx;
-				font-size: 24rpx;
-	
-				.iconfont {
-					margin-right: 20rpx;
-					color: #56C877;
-					font-size: 32rpx;
-				}
-			}
-	
-			p:last-child {
-				margin-bottom: 0;
-			}
-	
-		}
-	}
+  .imglist_box {
+    display: flex;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 20rpx;
+    margin-bottom: 20rpx;
+    height: 140px;
+  }
+
+  .imglist_left {
+    width: 50%;
+    position: relative;
+
+    image {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 280rpx;
+    }
+  }
+
+  .imglist_right {
+    margin-left: 40rpx;
+    padding: 10rpx 0;
+
+    .icon_box {
+      margin-bottom: 12rpx;
+      font-size: 24rpx;
+
+      .iconfont {
+        margin-right: 20rpx;
+        color: #56c877;
+        font-size: 32rpx;
+      }
+    }
+
+    p:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
 .top {
-		position: fixed;
-		right: 30px;
-		bottom: 100px;
-		z-index: 100;
+  position: fixed;
+  right: 30px;
+  bottom: 100px;
+  z-index: 100;
 
-		image {
-			width: 100rpx;
-			height: 100rpx;
-		}
-	}
+  image {
+    width: 100rpx;
+    height: 100rpx;
+  }
+}
 </style>

pages/cb/xy2.0/particulars.vue

@@ -1,77 +1,138 @@
 <template>
-	<view>
-		<view class="">
-			<view :class="['info',equipInfo.is_online==1?'on':'off']">
-				<p @click="copy(newState.device_id)">设备ID：{{newState.device_id}}<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png" mode="" class="tishi"></image></p>
-				<p>设备名称：{{newState.device_name==""?"无":newState.device_name}}</p>
-				<p>最新上报时间：{{newState.uptime | timeFormat}}</p>
-				<p>最新地址：{{newState.addr}}</p>
-				<p class="fillin" @click="addxy">添加诱芯：<input type="text" v-model="newState.decoy" disabled v-if="newState.decoy"/><u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon></p>
-				<p @click="glass_show=true">诱芯更换时间：<span style="margin:0 20rpx;">{{yxchangetime}}</span><u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon></p>
-				<p @click="glass_showtwo=true">诱芯到期时间：<span style="margin:0 20rpx;">{{yxendtime}}</span><u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon></p>
-				<u-calendar v-model="glass_show" mode="date" :max-date="date" @change="timeChange"></u-calendar>
-				<u-calendar v-model="glass_showtwo" mode="date" :max-date="date" @change="timeChangetwo"></u-calendar>
-			</view>
-			<view class="control">
-				<view class="control_item" @click="repairs">
-					<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/environment/7.png'" mode=""></image>
-					<p>一键报修</p>
-				</view>
-				<view class="control_item" @click="toggle" v-if="$QueryPermission(176)">
-					<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/cb/2.png'" mode=""></image>
-					<p>历史数据</p>
-				</view>
-			</view>
-			<view class="realtime">
-				<view class="realtime_title">
-					<p>实时数据</p>
-				</view>
-				<view class="realtime_text">
-					<view class="realtime_item">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png" mode=""></image>
-						<view class="text">
-							<p>环境温度</p>
-							<p>{{newState.at}}℃</p>
-						</view>
-					</view>
-					<view class="realtime_item">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png" mode=""></image>
-						<view class="text">
-							<p>环境湿度</p>
-							<p>{{newState.ah}}%</p>
-						</view>
-					</view>
-					<view class="realtime_item">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/tianqi.png" mode=""></image>
-						<view class="text">
-							<p>天气</p>
-							<p>{{newState.type}}</p>
-						</view>
-					</view>
-					<view class="realtime_item">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/xiayu.png" mode=""></image>
-						<view class="text">
-							<p>是否下雨</p>
-							<p>{{newState.rain}}</p>
-						</view>
-					</view>
-					<view class="realtime_item">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/fengxiang.png" mode=""></image>
-						<view class="text">
-							<p>风力风向</p>
-							<p>{{newState.wind}}</p>
-						</view>
-					</view>
-					<view class="realtime_item">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png" mode=""></image>
-						<view class="text">
-							<p>诱虫次数</p>
-							<p>{{trapnum}}</p>
-						</view>
-					</view>
-				</view>
-			</view>
-			<!-- <view class="sim" v-if="simTF && $QueryPermission(246)">
+  <view>
+    <view class="">
+      <view :class="['info', equipInfo.is_online == 1 ? 'on' : 'off']">
+        <p @click="copy(newState.device_id)">
+          设备ID：{{ newState.device_id
+          }}<image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png"
+            mode=""
+            class="tishi"
+          ></image>
+        </p>
+        <p>
+          设备名称：{{
+            newState.device_name == '' ? '无' : newState.device_name
+          }}
+        </p>
+        <p>最新上报时间：{{ newState.uptime | timeFormat }}</p>
+        <p>最新地址：{{ newState.addr }}</p>
+        <p class="fillin" @click="addxy">
+          添加诱芯：<input
+            type="text"
+            v-model="newState.decoy"
+            disabled
+            v-if="newState.decoy"
+          /><u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
+        </p>
+        <p @click="glass_show = true">
+          诱芯更换时间：<span style="margin: 0 20rpx">{{ yxchangetime }}</span
+          ><u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
+        </p>
+        <p @click="glass_showtwo = true">
+          诱芯到期时间：<span style="margin: 0 20rpx">{{ yxendtime }}</span
+          ><u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
+        </p>
+        <u-calendar
+          v-model="glass_show"
+          mode="date"
+          :max-date="date"
+          @change="timeChange"
+        ></u-calendar>
+        <u-calendar
+          v-model="glass_showtwo"
+          mode="date"
+          :max-date="date"
+          @change="timeChangetwo"
+        ></u-calendar>
+      </view>
+      <view class="control">
+        <view class="control_item" @click="repairs">
+          <image
+            :src="
+              'http://www.hnyfwlw.com:8006/bigdata_app' +
+              '/image/environment/7.png'
+            "
+            mode=""
+          ></image>
+          <p>一键报修</p>
+        </view>
+        <view class="control_item" @click="toggle" v-if="$QueryPermission(176)">
+          <image
+            :src="'http://www.hnyfwlw.com:8006/bigdata_app' + '/image/cb/2.png'"
+            mode=""
+          ></image>
+          <p>历史数据</p>
+        </view>
+      </view>
+      <view class="realtime">
+        <view class="realtime_title">
+          <p>实时数据</p>
+        </view>
+        <view class="realtime_text">
+          <view class="realtime_item">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png"
+              mode=""
+            ></image>
+            <view class="text">
+              <p>环境温度</p>
+              <p>{{ newState.at }}℃</p>
+            </view>
+          </view>
+          <view class="realtime_item">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png"
+              mode=""
+            ></image>
+            <view class="text">
+              <p>环境湿度</p>
+              <p>{{ newState.ah }}%</p>
+            </view>
+          </view>
+          <view class="realtime_item">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/tianqi.png"
+              mode=""
+            ></image>
+            <view class="text">
+              <p>天气</p>
+              <p>{{ newState.type }}</p>
+            </view>
+          </view>
+          <view class="realtime_item">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/xiayu.png"
+              mode=""
+            ></image>
+            <view class="text">
+              <p>是否下雨</p>
+              <p>{{ newState.rain }}</p>
+            </view>
+          </view>
+          <view class="realtime_item">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/fengxiang.png"
+              mode=""
+            ></image>
+            <view class="text">
+              <p>风力风向</p>
+              <p>{{ newState.wind }}</p>
+            </view>
+          </view>
+          <view class="realtime_item">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png"
+              mode=""
+            ></image>
+            <view class="text">
+              <p>诱虫次数</p>
+              <p>{{ trapnum }}</p>
+            </view>
+          </view>
+        </view>
+      </view>
+      <!-- <view class="sim" v-if="simTF && $QueryPermission(246)">
 				<p class="sim_title">sim卡详情</p>
 				<view class="sim_text">
 					<p class="p">ICCID：{{simdata.iccid}}</p>
@@ -100,361 +161,409 @@
 					<p class="p">到期时间：{{simdata.expiry_date | timeFormat}}</p>
 				</view>
 			</view> -->
-			<u-popup v-model="yxShow" mode="center" width="600rpx">
-				<u-field label="害虫名称" label-width='240' required :error-message="xyErr" v-model="decoy" class="field" :field-style="fieldstyle" placeholder="请填写害虫名称">
-				</u-field >
-				<view class="btn-box">
-					<u-button @click="yxSubmit" size="mini" type="success" class="box-item">确定</u-button>
-				</view>
-			</u-popup>
-		</view>
-	</view>
+      <u-popup v-model="yxShow" mode="center" width="600rpx">
+        <u-field
+          label="害虫名称"
+          label-width="240"
+          required
+          :error-message="xyErr"
+          v-model="decoy"
+          class="field"
+          :field-style="fieldstyle"
+          placeholder="请填写害虫名称"
+        >
+        </u-field>
+        <view class="btn-box">
+          <u-button
+            @click="yxSubmit"
+            size="mini"
+            type="success"
+            class="box-item"
+            >确定</u-button
+          >
+        </view>
+      </u-popup>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				equipInfo:[],
-				newState:{},
-				simdata:{},
-				simstate:['未知','测试期','沉默期','使用中','停机','停机保号','预销号','销号'],
-				usedBeliel:'',
-				residueBeliel:"",
-				simTF:false,
-				expiretext:"",
-				yxShow:false,
-				xyErr:"",
-				decoy:"",
-				yxchangetime:0,//更换诱芯时间
-				yxendtime:0,//诱芯到期时间
-				glass_show:false,//更换诱芯时间选择
-				glass_showtwo:false,//诱芯到期时间选择
-				date:"",//日历可选最大时间
-				fieldstyle:{//输入框样式
-					border:"2rpx solid #f6f6f6",
-					"border-radius":"24px",
-					"padding-left":"20rpx",
-					"background-color":"#f6f6f6"
-				},
-				trapnum:0
-			}
-		},
-		methods: {
-			async getState(d_id) {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_details',
-					data: {
-						d_id: d_id,
-					}
-				})
-				this.newState = res[0]
-				if(res[0].xy_expire_time==0){
-					this.yxendtime = "暂无"
-				}else{
-					var times = new Date(res[0].xy_expire_time*1000)
-					var month = times.getMonth()+1
-					month = month<10?"0"+month:month
-					var date = times.getDate()<10?"0"+times.getDate():times.getDate()
-					this.yxendtime = times.getFullYear() + "-" + month + "-" + date
-				}
-				if(res[0].xy_uptime==0){
-					this.yxendtime = "暂无"
-				}else{
-					var times = new Date(res[0].xy_uptime*1000)
-					var month = times.getMonth()+1
-					month = month<10?"0"+month:month
-					var date = times.getDate()<10?"0"+times.getDate():times.getDate()
-					this.yxchangetime = times.getFullYear() + "-" + month + "-" + date
+export default {
+  data() {
+    return {
+      equipInfo: [],
+      newState: {},
+      simdata: {},
+      simstate: [
+        '未知',
+        '测试期',
+        '沉默期',
+        '使用中',
+        '停机',
+        '停机保号',
+        '预销号',
+        '销号',
+      ],
+      usedBeliel: '',
+      residueBeliel: '',
+      simTF: false,
+      expiretext: '',
+      yxShow: false,
+      xyErr: '',
+      decoy: '',
+      yxchangetime: 0, //更换诱芯时间
+      yxendtime: 0, //诱芯到期时间
+      glass_show: false, //更换诱芯时间选择
+      glass_showtwo: false, //诱芯到期时间选择
+      date: '', //日历可选最大时间
+      fieldstyle: {
+        //输入框样式
+        border: '2rpx solid #f6f6f6',
+        'border-radius': '24px',
+        'padding-left': '20rpx',
+        'background-color': '#f6f6f6',
+      },
+      trapnum: 0,
+    };
+  },
+  methods: {
+    async getState(d_id) {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_details',
+        data: {
+          d_id: d_id,
+        },
+      });
+      this.newState = res[0];
+      if (res[0].xy_expire_time == 0) {
+        this.yxendtime = '暂无';
+      } else {
+        var times = new Date(res[0].xy_expire_time * 1000);
+        var month = times.getMonth() + 1;
+        month = month < 10 ? '0' + month : month;
+        var date =
+          times.getDate() < 10 ? '0' + times.getDate() : times.getDate();
+        this.yxendtime = times.getFullYear() + '-' + month + '-' + date;
+      }
+      if (res[0].xy_uptime == 0) {
+        this.yxendtime = '暂无';
+      } else {
+        var times = new Date(res[0].xy_uptime * 1000);
+        var month = times.getMonth() + 1;
+        month = month < 10 ? '0' + month : month;
+        var date =
+          times.getDate() < 10 ? '0' + times.getDate() : times.getDate();
+        this.yxchangetime = times.getFullYear() + '-' + month + '-' + date;
+      }
+      // this.Chistory(this.equipInfo.device_id)
+    },
+    async getSim(d_id) {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_sim',
+        data: {
+          d_id: d_id,
+        },
+      });
+      console.log(res);
+      if (res != null) {
+        this.simdata = res.data.card_list[0];
+        this.usedBeliel =
+          ((this.simdata.data_plan - this.simdata.data_balance) /
+            this.simdata.data_plan) *
+          100;
+        this.residueBeliel =
+          (this.simdata.data_balance / this.simdata.data_plan) * 100;
+        this.simTF = true;
+      } else {
+        this.simTF = false;
+      }
+    },
+    async getworm(data, info) {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_set_lure',
+        data: data,
+      });
+      console.log(res);
+      if (res.code == 200) {
+        uni.showToast({
+          title: '设置成功',
+          icon: 'none',
+        });
+        if (data.expire_time) {
+          this.yxendtime = info;
+        } else if (data.pest_name) {
+          this.newState.decoy = info;
+        } else if (data.addtime) {
+          this.yxchangetime = info;
         }
-				// this.Chistory(this.equipInfo.device_id)
-			},
-			async getSim(d_id) {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_sim',
-					data: {
-						d_id: d_id,
-					}
-				})
-				console.log(res)
-				if(res != null){
-					this.simdata = res.data.card_list[0]
-					this.usedBeliel = (this.simdata.data_plan-this.simdata.data_balance)/ this.simdata.data_plan *100
-					this.residueBeliel = this.simdata.data_balance/this.simdata.data_plan * 100
-					this.simTF = true
-				}else{
-					this.simTF = false
-				}
-			},
-			async getworm(data,info) {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_set_lure',
-					data: data
-				})
-				console.log(res)
-				if(res.code == 200){
-					uni.showToast({
-						title: "设置成功",
-						icon: "none"
-					})
-					if(data.expire_time){
-						this.yxendtime = info
-					}else if(data.pest_name){
-						this.newState.decoy = info
-					}else if(data.addtime){
-						this.yxchangetime = info
-					}
-				}
-			},
-			toggle(){
-				uni.navigateTo({
-					url:"./historydatas?device_id="+this.equipInfo.device_id + "&d_id=" + this.equipInfo.d_id+ "&device_code=" + this.equipInfo.device_code
-				})
-			},
-			addxy(){
-				this.yxShow =true
-				this.decoy = this.newState.decoy
-			},
-			yxSubmit(){
-				if(this.decoy == ""){
-					this.xyErr = "请填写害虫名称"
-				}else{
-					this.xyErr = ""
-					var obj = {
-						d_id: this.equipInfo.d_id,
-						pest_name:this.decoy
-					}
-					this.getworm(obj,this.decoy)
-					console.log(this.decoy)
-					this.yxShow =false
-				}
-			},
-			timeChange(e){
-				console.log(e)
-				var obj = {
-					d_id: this.equipInfo.d_id,
-					addtime:+new Date(e.result)/1000
-				}
-				this.getworm(obj,e.result)
-			},
-			timeChangetwo(e){
-				console.log(e)
-				var obj = {
-					d_id: this.equipInfo.d_id,
-					expire_time:+new Date(e.result)/1000
-				}
-				this.getworm(obj,e.result)
-			},
-			copy(item){
-				console.log(item)
-				uni.setClipboardData({
-				    data: item,
-				    success: function () {
-				        console.log('success');
-				    }
-				});
-			},
-			repairs(){
-				uni.navigateTo({
-					url: "../../afterSale/addafter?device_id="+ this.newState.device_id +"&device_type="+ 10
-				})
-			},
-			async Chistory(device_id) { //历史数据列表折线图
-				this.dataloadingtf = true
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_line_chart',
-					data: {
-						device_id: device_id,
-						// start_time: Math.floor(+new Date/1000 - 24*60*60),
-						// end_time: Math.floor(+new Date/1000),
-						status: "pest"
-					}
-				})
-				if(res.data[0]){
-					//***********************************************************
-					// if(this.newState.decoy=="草地贪夜蛾"){
-					// 	this.trapnum = 0
-					// }else{
-						this.trapnum = res.data[0].pest_num
-					// }	
-				}
-			}
-		},
-		onLoad(option) {
-      this.equipInfo = JSON.parse(option.info)
-      if (!this.equipInfo.device_id) {
-        this.equipInfo.device_id = this.equipInfo.imei
       }
-			console.log(this.equipInfo)
-      this.getState(this.equipInfo.d_id)
-      if (this.equipInfo.type != 21) {
-        // this.getSim(this.equipInfo.d_id)
+    },
+    toggle() {
+      uni.navigateTo({
+        url:
+          './historydatas?device_id=' +
+          this.equipInfo.device_id +
+          '&d_id=' +
+          this.equipInfo.d_id +
+          '&device_code=' +
+          this.equipInfo.device_code,
+      });
+    },
+    addxy() {
+      this.yxShow = true;
+      this.decoy = this.newState.decoy;
+    },
+    yxSubmit() {
+      if (this.decoy == '') {
+        this.xyErr = '请填写害虫名称';
+      } else {
+        this.xyErr = '';
+        var obj = {
+          d_id: this.equipInfo.d_id,
+          pest_name: this.decoy,
+        };
+        this.getworm(obj, this.decoy);
+        console.log(this.decoy);
+        this.yxShow = false;
+      }
+    },
+    timeChange(e) {
+      console.log(e);
+      var obj = {
+        d_id: this.equipInfo.d_id,
+        addtime: +new Date(e.result) / 1000,
+      };
+      this.getworm(obj, e.result);
+    },
+    timeChangetwo(e) {
+      console.log(e);
+      var obj = {
+        d_id: this.equipInfo.d_id,
+        expire_time: +new Date(e.result) / 1000,
+      };
+      this.getworm(obj, e.result);
+    },
+    copy(item) {
+      console.log(item);
+      uni.setClipboardData({
+        data: item,
+        success: function () {
+          console.log('success');
+        },
+      });
+    },
+    repairs() {
+      uni.navigateTo({
+        url:
+          '../../afterSale/addafter?device_id=' +
+          this.newState.device_id +
+          '&device_type=' +
+          10,
+      });
+    },
+    async Chistory(device_id) {
+      //历史数据列表折线图
+      this.dataloadingtf = true;
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_line_chart',
+        data: {
+          device_id: device_id,
+          // start_time: Math.floor(+new Date/1000 - 24*60*60),
+          // end_time: Math.floor(+new Date/1000),
+          status: 'pest',
+        },
+      });
+      if (res.data[0]) {
+        //***********************************************************
+        // if(this.newState.decoy=="草地贪夜蛾"){
+        // 	this.trapnum = 0
+        // }else{
+        this.trapnum = res.data[0].pest_num;
+        // }
       }
-			var times = new Date()
-			this.date = times.getFullYear()+1 + "-" + Number(times.getMonth()+1) + "-" + times.getDate()
-			console.log(this.date)
-			// uni.getStorage({ 待开发
-			// 	key:"jurisdiction",
-			// 	success:(res)=>{
-			// 		console.log(JSON.parse(res.data))
-			// 		let items = JSON.parse(res.data).filter((item)=>{
-			// 			return item.purview_name == "测报系统"
-			// 		})
-			// 		let items2 = items[0].children.filter((item)=>{
-			// 			return item.purview_name == "性诱2.0"
-			// 		})
-			// 		console.log(items2)
-			// 	},
-			// })	
-		}
-	}
+    },
+  },
+  onLoad(option) {
+    this.equipInfo = JSON.parse(option.info);
+    if (!this.equipInfo.device_id) {
+      this.equipInfo.device_id = this.equipInfo.imei;
+    }
+    console.log(this.equipInfo);
+    this.getState(this.equipInfo.d_id);
+    if (this.equipInfo.type != 21) {
+      // this.getSim(this.equipInfo.d_id)
+    }
+    var times = new Date();
+    this.date =
+      times.getFullYear() +
+      1 +
+      '-' +
+      Number(times.getMonth() + 1) +
+      '-' +
+      times.getDate();
+    console.log(this.date);
+    // uni.getStorage({ 待开发
+    // 	key:"jurisdiction",
+    // 	success:(res)=>{
+    // 		console.log(JSON.parse(res.data))
+    // 		let items = JSON.parse(res.data).filter((item)=>{
+    // 			return item.purview_name == "测报系统"
+    // 		})
+    // 		let items2 = items[0].children.filter((item)=>{
+    // 			return item.purview_name == "性诱2.0"
+    // 		})
+    // 		console.log(items2)
+    // 	},
+    // })
+  },
+};
 </script>
 
 <style lang="scss">
-	.info {
-		padding: 20rpx 40rpx;
-		color: #fff;
-		line-height: 50rpx;
-		font-size: 26rpx;
-		background-size: 100% auto;
-		background-repeat: no-repeat;
-		background-color: #0DC6B6;
-		background-position: top left;
-		box-sizing: border-box;
-		width: 95%;
-		margin: 0 auto;
-		p:first-child{
-			font-size: 32rpx;
-		}
-		.expiretishi{
-			font-size: 24rpx;
-			color: #FF0000;
-		}
-		.tishi{
-			width: 28rpx;
-			height: 28rpx;
-			margin: 0rpx 0 0 20rpx;
-		}
-		.fillin{
-			display: flex;
-			input{
-				width: 200rpx;
-				font-size: 24rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				text-indent: 1em;
-			}
-		}
-	}
+.info {
+  padding: 20rpx 40rpx;
+  color: #fff;
+  line-height: 50rpx;
+  font-size: 26rpx;
+  background-size: 100% auto;
+  background-repeat: no-repeat;
+  background-color: #0dc6b6;
+  background-position: top left;
+  box-sizing: border-box;
+  width: 95%;
+  margin: 0 auto;
+  p:first-child {
+    font-size: 32rpx;
+  }
+  .expiretishi {
+    font-size: 24rpx;
+    color: #ff0000;
+  }
+  .tishi {
+    width: 28rpx;
+    height: 28rpx;
+    margin: 0rpx 0 0 20rpx;
+  }
+  .fillin {
+    display: flex;
+    input {
+      width: 200rpx;
+      font-size: 24rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+      text-indent: 1em;
+    }
+  }
+}
 
-	.on {
-		background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png')
-	}
+.on {
+  background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png');
+}
 
-	.off {
-		background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png')
-	}
-	.control {
-		width: 90%;
-		display: flex;
-		text-align: center;
-		box-sizing: border-box;
-		margin: 30rpx auto;
-		.control_item {
-			width: 120rpx;
-			height: 120rpx;
-			margin-right: 40rpx;
-			image {
-				width: 70rpx;
-				height: 70rpx;
-			}
-	
-			p {
-				font-size: 24rpx;
-			}
-		}
-	}
-	
-	.realtime{
-		width: 95%;
-		margin: 0rpx auto;
-		.realtime_title{
-			font-size: 32rpx;
-			display: flex;
-			justify-content: space-between;
-			font-weight: 700;
-			.span{
-				color: #6e6c76;
-				font-size: 24rpx;
-				display: flex;
-				justify-content: space-between;
-				margin-top: 12rpx;
-			}
-		}
-		.realtime_text{
-			margin-top: 20rpx;
-			display: flex;
-			justify-content: space-between;
-			flex-wrap: wrap;
-			.realtime_item{
-				width: 48%;
-				height: 100rpx;
-				display: flex;
-				box-shadow: 0 0 10rpx #bcb9ca;
-				margin-top: 20rpx;
-				padding: 20rpx 0;
-				image{
-					width: 60rpx;
-					height: 60rpx;
-					margin: 20rpx 20rpx 20rpx 40rpx;
-				}
-				.text{
-					padding: 10rpx 0 10rpx 30rpx;
-				}
-			}
-		}
-	}
-	.sim{
-		width: 95%;
-		margin: 40rpx auto;
-		.sim_title{
-			font-size: 32rpx;
-			font-weight: 700;
-		}
-		.sim_text{
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 30rpx;
-			margin-top: 40rpx;
-			.p{
-				margin-top: 20rpx;
-			}
-			.sim_plan{
-				display: flex;
-				margin-top: 20rpx;
-				.sim_plan_text{
-					width: 60%;
-					height: 16rpx;
-					background-color: #cccccc;
-					border-radius:8rpx ;
-					margin: 10rpx 20rpx 0 0;
-					p{
-						height: 16rpx;
-						background-color: #0dc6b6;
-						border-radius:8rpx ;
-					}
-				}
-			}
-		}
-	}
-	.btn-box {
-		text-align: center;
-		padding: 20rpx 30rpx;
-	}
-	/deep/.u-calendar__action{
-		display: flex;
-		justify-content: space-around;
-		.u-calendar__action__text{
-			line-height: 25px;
-		}
-	}
+.off {
+  background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png');
+}
+.control {
+  width: 90%;
+  display: flex;
+  text-align: center;
+  box-sizing: border-box;
+  margin: 30rpx auto;
+  .control_item {
+    width: 120rpx;
+    height: 120rpx;
+    margin-right: 40rpx;
+    image {
+      width: 70rpx;
+      height: 70rpx;
+    }
+
+    p {
+      font-size: 24rpx;
+    }
+  }
+}
+
+.realtime {
+  width: 95%;
+  margin: 0rpx auto;
+  .realtime_title {
+    font-size: 32rpx;
+    display: flex;
+    justify-content: space-between;
+    font-weight: 700;
+    .span {
+      color: #6e6c76;
+      font-size: 24rpx;
+      display: flex;
+      justify-content: space-between;
+      margin-top: 12rpx;
+    }
+  }
+  .realtime_text {
+    margin-top: 20rpx;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    .realtime_item {
+      width: 48%;
+      height: 100rpx;
+      display: flex;
+      box-shadow: 0 0 10rpx #bcb9ca;
+      margin-top: 20rpx;
+      padding: 20rpx 0;
+      image {
+        width: 60rpx;
+        height: 60rpx;
+        margin: 20rpx 20rpx 20rpx 40rpx;
+      }
+      .text {
+        padding: 10rpx 0 10rpx 30rpx;
+      }
+    }
+  }
+}
+.sim {
+  width: 95%;
+  margin: 40rpx auto;
+  .sim_title {
+    font-size: 32rpx;
+    font-weight: 700;
+  }
+  .sim_text {
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 30rpx;
+    margin-top: 40rpx;
+    .p {
+      margin-top: 20rpx;
+    }
+    .sim_plan {
+      display: flex;
+      margin-top: 20rpx;
+      .sim_plan_text {
+        width: 60%;
+        height: 16rpx;
+        background-color: #cccccc;
+        border-radius: 8rpx;
+        margin: 10rpx 20rpx 0 0;
+        p {
+          height: 16rpx;
+          background-color: #0dc6b6;
+          border-radius: 8rpx;
+        }
+      }
+    }
+  }
+}
+.btn-box {
+  text-align: center;
+  padding: 20rpx 30rpx;
+}
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
 </style>

pages/cb/zjxydetail/photolist.vue

@@ -1,285 +1,310 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view class="" style="position: relative;top: 44px;">
-			<view style="position: fixed;z-index: 100;">
-				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" title="查看图片" rightIcon="camera"
-					@clickRight="clickRight"></uni-nav-bar>
-			</view>
-			<!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
-			<view class="selecttimes" @click="tiemshow=!tiemshow">
-				<view class="timesbox">
-					<image
-						:src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
-						mode=""></image>
-					<p>{{timetab(timestate)}}</p>
-					<p class="or">~</p>
-					<p>{{timetab(timeend)}}</p>
-					<u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
-				</view>
-				<u-calendar v-model="tiemshow" mode="range" @change="tiemchange"></u-calendar>
-			</view>
-			<view class="imglist">
-				<view class="imglist_box" v-for="(item,index) in imglists" :key="index">
-					<view class="imglist_left">
-						<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif" mode="">
-						</image>
-						<image :src="item.addr" mode="" @click="examine(index)"></image>
-					</view>
-					<view class="imglist_right">
-						<view class="">
-							{{item.time}}
-						</view>
-						<view class="">
-							害虫数量:{{item.pest_counts}}
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="top" v-if="isTop" @click="top">
-			<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/6209a98f0cb3b5086f2ca36152c9269.png'"
-				mode=""></image>
-		</view>
-	</view>
+  <view>
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view style="position: fixed; z-index: 100">
+        <uni-nav-bar
+          @clickLeft="clickLeft"
+          left-icon="back"
+          title="查看图片"
+          rightIcon="camera"
+          @clickRight="clickRight"
+        ></uni-nav-bar>
+      </view>
+      <!-- <p class="tishi" v-if="tishi">暂无数据</p> -->
+      <view class="selecttimes" @click="tiemshow = !tiemshow">
+        <view class="timesbox">
+          <image
+            :src="
+              'http://www.hnyfwlw.com:8006/bigdata_app' +
+              '/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'
+            "
+            mode=""
+          ></image>
+          <p>{{ timetab(timestate) }}</p>
+          <p class="or">~</p>
+          <p>{{ timetab(timeend) }}</p>
+          <u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
+        </view>
+        <u-calendar
+          v-model="tiemshow"
+          mode="range"
+          @change="tiemchange"
+        ></u-calendar>
+      </view>
+      <view class="imglist">
+        <view
+          class="imglist_box"
+          v-for="(item, index) in imglists"
+          :key="index"
+        >
+          <view class="imglist_left">
+            <image
+              src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/jiazai.ui.gif"
+              mode=""
+            >
+            </image>
+            <image :src="item.addr" mode="" @click="examine(index)"></image>
+          </view>
+          <view class="imglist_right">
+            <view class="">
+              {{ item.time }}
+            </view>
+            <view class=""> 害虫数量:{{ item.pest_counts }} </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="top" v-if="isTop" @click="top">
+      <image
+        :src="
+          'http://www.hnyfwlw.com:8006/bigdata_app' +
+          '/image/6209a98f0cb3b5086f2ca36152c9269.png'
+        "
+        mode=""
+      ></image>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				tiemshow:false,
-				timestate:"",
-				timeend:"",
-				isTop:false,
-				imglists:[],
-				device_id:"",
-				page:1,
-				d_id:""
-			}
-		},
-		methods: {
-			clickLeft(){
-				uni.navigateBack({
-					delta:1
-				})
-			},
-			clickRight(){
-				this.takephoto()
-			},
-			timetab(e) {
-				e = new Date(e * 1000)
-				var year = e.getFullYear()
-				var month = e.getMonth() + 1 < 10 ? "0" + (e.getMonth() + 1) : e.getMonth() + 1
-				var day = e.getDate() < 10 ? "0" + e.getDate() : e.getDate()
-				var time = year + "/" + month + "/" + day
-				return time
-			},
-			examine(index){
-				var imgarr = []
-				for (var i = 0; i < this.imglists.length; i++) {
-					imgarr.push(this.imglists[i].addr)
-				}
-				uni.previewImage({
-					urls: imgarr,
-					current: index
-				});
-			},
-			async getimglist(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
-					data: {
-						cmd: "zjxy",
-						device_id: this.device_id,
-						page: this.page,
-						page_number: "12",
-						time_begin: Math.floor(this.timestate),
-						time_end: Math.floor(this.timeend),
-					}
-				})
-				console.log(res)
-        this.imglists = [...this.imglists, ...res.data]
-        if(this.imglists.length == 0) {
-					uni.showToast({
-						title: '数据为空',
-						duration: 2000,
-						icon:'none'
-					});
-				}
-			},
-			top() {
-				uni.pageScrollTo({
-					scrollTop: 0,
-					duration: 500
-				})
-			},
-			tiemchange(e){
-				// console.log(e)
-				this.imglists = []
-				this.page = 1
-				console.log(e)
-				this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60
-				this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60
-				this.getimglist()
-			},
-			async takephoto() { //拍照
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
-					data: {
-						device_type_id: 8,
-						d_id: this.d_id,
-						cmd: "takephoto"
-					}
-				})
-				console.log(res)
-				if (res == true) {
-					uni.showToast({
-						title: '指令下发成功！',
-						duration: 2000
-					});
-					var that = this
-					setTimeout(() => {
-						that.getimglist()
-					}, 1000)
-				} else {
-					uni.showToast({
-						title: '指令下发失败！',
-						duration: 2000,
-						icon: "none"
-					});
-				}
-			
-			},
-		},
-		onLoad(option) {
-			this.d_id =  option.d_id
-			this.device_id = option.device_id
-			this.timeend = +new Date() / 1000
-			this.timestate = this.timeend - 60 * 60 * 24
-			this.getimglist()
-		},
-		onReachBottom() {
-			this.page++
-			this.getimglist()
-		},
-		onPageScroll(e) { //nvue暂不支持滚动监听，可用bindingx代替
-			if (e.scrollTop > 200) { //距离大于200时显示
-				this.isTop = true
-			} else { //距离小于200时隐藏
-				this.isTop = false
-			}
-		}
-	}
+export default {
+  data() {
+    return {
+      tiemshow: false,
+      timestate: '',
+      timeend: '',
+      isTop: false,
+      imglists: [],
+      device_id: '',
+      page: 1,
+      d_id: '',
+    };
+  },
+  methods: {
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    clickRight() {
+      this.takephoto();
+    },
+    timetab(e) {
+      e = new Date(e * 1000);
+      var year = e.getFullYear();
+      var month =
+        e.getMonth() + 1 < 10 ? '0' + (e.getMonth() + 1) : e.getMonth() + 1;
+      var day = e.getDate() < 10 ? '0' + e.getDate() : e.getDate();
+      var time = year + '/' + month + '/' + day;
+      return time;
+    },
+    examine(index) {
+      var imgarr = [];
+      for (var i = 0; i < this.imglists.length; i++) {
+        imgarr.push(this.imglists[i].addr);
+      }
+      uni.previewImage({
+        urls: imgarr,
+        current: index,
+      });
+    },
+    async getimglist() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.forecast_system.device_photo_list',
+        data: {
+          cmd: 'zjxy',
+          device_id: this.device_id,
+          page: this.page,
+          page_number: '12',
+          time_begin: Math.floor(this.timestate),
+          time_end: Math.floor(this.timeend),
+        },
+      });
+      console.log(res);
+      this.imglists = [...this.imglists, ...res.data];
+      if (this.imglists.length == 0) {
+        uni.showToast({
+          title: '数据为空',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+    top() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 500,
+      });
+    },
+    tiemchange(e) {
+      // console.log(e)
+      this.imglists = [];
+      this.page = 1;
+      console.log(e);
+      this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60;
+      this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60;
+      this.getimglist();
+    },
+    async takephoto() {
+      //拍照
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
+        data: {
+          device_type_id: 8,
+          d_id: this.d_id,
+          cmd: 'takephoto',
+        },
+      });
+      console.log(res);
+      if (res == true) {
+        uni.showToast({
+          title: '指令下发成功！',
+          duration: 2000,
+        });
+        var that = this;
+        setTimeout(() => {
+          that.getimglist();
+        }, 1000);
+      } else {
+        uni.showToast({
+          title: '指令下发失败！',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+  },
+  onLoad(option) {
+    this.d_id = option.d_id;
+    this.device_id = option.device_id;
+    this.timeend = +new Date() / 1000;
+    this.timestate = this.timeend - 60 * 60 * 24;
+    this.getimglist();
+  },
+  onReachBottom() {
+    this.page++;
+    this.getimglist();
+  },
+  onPageScroll(e) {
+    //nvue暂不支持滚动监听，可用bindingx代替
+    if (e.scrollTop > 200) {
+      //距离大于200时显示
+      this.isTop = true;
+    } else {
+      //距离小于200时隐藏
+      this.isTop = false;
+    }
+  },
+};
 </script>
 
 <style lang="scss">
-	.tishi {
-		position: absolute;
-		top: 104px;
-		width: 95%;
-		left: 2.5%;
-		text-align: center;
-		font-size: 40rpx;
-	}
+.tishi {
+  position: absolute;
+  top: 104px;
+  width: 95%;
+  left: 2.5%;
+  text-align: center;
+  font-size: 40rpx;
+}
 
-	.selecttimes {
-		width: 100%;
-		position: fixed;
-		top: 85px;
-		left: 0;
-		z-index: 100;
-		background-color: #fff;
-		padding-top: 30rpx;
+.selecttimes {
+  width: 100%;
+  position: fixed;
+  top: 85px;
+  left: 0;
+  z-index: 100;
+  background-color: #fff;
+  padding-top: 30rpx;
 
-		.timesbox {
-			display: flex;
-			width: 95%;
-			margin: 0 auto;
-			justify-content: space-around;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 10rpx 20rpx;
-			box-sizing: border-box;
+  .timesbox {
+    display: flex;
+    width: 95%;
+    margin: 0 auto;
+    justify-content: space-around;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 10rpx 20rpx;
+    box-sizing: border-box;
 
-			image {
-				width: 30rpx;
-				height: 30rpx;
-				margin-top: 6rpx;
-			}
+    image {
+      width: 30rpx;
+      height: 30rpx;
+      margin-top: 6rpx;
+    }
 
-			.icon {
-				color: #949494;
-				text-align: right;
-				margin-left: 30rpx;
+    .icon {
+      color: #949494;
+      text-align: right;
+      margin-left: 30rpx;
+    }
+  }
 
-			}
-		}
+  ::v-deep .u-calendar__action {
+    display: flex;
+    justify-content: space-around;
 
-		/deep/.u-calendar__action {
-			display: flex;
-			justify-content: space-around;
+    .u-calendar__action__text {
+      line-height: 25px;
+    }
+  }
+}
+.imglist {
+  position: absolute;
+  top: 100px;
+  width: 95%;
+  left: 2.5%;
 
-			.u-calendar__action__text {
-				line-height: 25px;
-			}
-		}
-	}
-	.imglist {
-		position: absolute;
-		top: 100px;
-		width: 95%;
-		left: 2.5%;
-	
-		.imglist_box {
-			display: flex;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 20rpx;
-			margin-bottom: 20rpx;
-			height: 140px;
-		}
-	
-		.imglist_left {
-			width: 50%;
-			position: relative;
-	
-			image {
-				position: absolute;
-				top: 0;
-				left: 0;
-				width: 100%;
-				height: 280rpx;
-			}
-		}
-	
-		.imglist_right {
-			margin-left: 40rpx;
-			padding: 10rpx 0;
-	
-			.icon_box {
-				margin-bottom: 12rpx;
-				font-size: 24rpx;
-	
-				.iconfont {
-					margin-right: 20rpx;
-					color: #56C877;
-					font-size: 32rpx;
-				}
-			}
-	
-			p:last-child {
-				margin-bottom: 0;
-			}
-	
-		}
-	}
+  .imglist_box {
+    display: flex;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 20rpx;
+    margin-bottom: 20rpx;
+    height: 140px;
+  }
+
+  .imglist_left {
+    width: 50%;
+    position: relative;
+
+    image {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 280rpx;
+    }
+  }
+
+  .imglist_right {
+    margin-left: 40rpx;
+    padding: 10rpx 0;
+
+    .icon_box {
+      margin-bottom: 12rpx;
+      font-size: 24rpx;
+
+      .iconfont {
+        margin-right: 20rpx;
+        color: #56c877;
+        font-size: 32rpx;
+      }
+    }
+
+    p:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
 .top {
-		position: fixed;
-		right: 30px;
-		bottom: 100px;
-		z-index: 100;
+  position: fixed;
+  right: 30px;
+  bottom: 100px;
+  z-index: 100;
 
-		image {
-			width: 100rpx;
-			height: 100rpx;
-		}
-	}
+  image {
+    width: 100rpx;
+    height: 100rpx;
+  }
+}
 </style>

pages/cb/zjxydetail/thxydetail.vue

@@ -1,55 +1,82 @@
 <template>
-	<view>
-		<view :class="['info',equipInfo.is_online==1?'on':'off']">
-			<view class="" @click="copy(equipInfo)">
-				设备ID：{{equipInfo.imei||equipInfo.device_id}}
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png" mode="" class="tishi">
-				</image>
-			</view>
-			<view class="">
-				设备名称：{{equipInfo.device_name==""?"无":equipInfo.device_name}}
-			</view>
-			<view class="">
-				设备类型：性诱测报L
-			</view>
-			<view class="">
-				最新上报时间：{{equipInfo.uptime||equipInfo.uptime | timeFormat}}
-			</view>
-			<view class="">
-				设备地址：{{equipInfo.address}}
-			</view>
-			<view class="" @click="setdecoy">
-				诱芯名称：{{equipInfo.decoy}}
-				<u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
-			</view>
-			<view class="" @click="setdecoy">
-				诱芯到期时间：{{equipInfo.xy_expire}}
-				<u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
-			</view>
-		</view>
-		<u-popup v-model="yxShow" mode="center" width="600rpx">
-			<u-field label="害虫名称" label-width='240' required :error-message="xyErr" v-model="decoy" class="field"
-				:field-style="fieldstyle" placeholder="请填写害虫名称">
-			</u-field>
-			<u-field label="诱芯到期时间" label-width='240' required :error-message="xyErrtime" v-model="decoytime"
-				@click="settime" class="field" :field-style="fieldstyle" placeholder="请填写到期时间">
-			</u-field>
-			<view class="" style="text-align: center;color: #fa3534;">
-				{{tishitext}}
-			</view>
-			<view class="btn-box">
-				<u-button @click="yxSubmit" size="mini" type="success" class="box-item">确定</u-button>
-			</view>
-		</u-popup>
-		<u-calendar v-model="tiemshow" mode="date" :max-date="date" @change="tiemchange"></u-calendar>
-		<view class="caobox">
-			<view class="caobox_item" v-if="$QueryPermission(336)" @click="tophoto">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/1.png" mode="widthFix"></image>
-				<view class="">
-					查看图片
-				</view>
-			</view>
-			<!-- <view class="caobox_item" v-if="$QueryPermission(248)" @click="toset">
+  <view>
+    <view :class="['info', equipInfo.is_online == 1 ? 'on' : 'off']">
+      <view class="" @click="copy(equipInfo)">
+        设备ID：{{ equipInfo.imei || equipInfo.device_id }}
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/environment/fuzhi.png"
+          mode=""
+          class="tishi"
+        >
+        </image>
+      </view>
+      <view class="">
+        设备名称：{{
+          equipInfo.device_name == '' ? '无' : equipInfo.device_name
+        }}
+      </view>
+      <view class=""> 设备类型：性诱测报L </view>
+      <view class="">
+        最新上报时间：{{ equipInfo.uptime || equipInfo.uptime | timeFormat }}
+      </view>
+      <view class=""> 设备地址：{{ equipInfo.address }} </view>
+      <view class="" @click="setdecoy">
+        诱芯名称：{{ equipInfo.decoy }}
+        <u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
+      </view>
+      <view class="" @click="setdecoy">
+        诱芯到期时间：{{ equipInfo.xy_expire }}
+        <u-icon name="edit-pen" color="#f0ad4e" size="28"></u-icon>
+      </view>
+    </view>
+    <u-popup v-model="yxShow" mode="center" width="600rpx">
+      <u-field
+        label="害虫名称"
+        label-width="240"
+        required
+        :error-message="xyErr"
+        v-model="decoy"
+        class="field"
+        :field-style="fieldstyle"
+        placeholder="请填写害虫名称"
+      >
+      </u-field>
+      <u-field
+        label="诱芯到期时间"
+        label-width="240"
+        required
+        :error-message="xyErrtime"
+        v-model="decoytime"
+        @click="settime"
+        class="field"
+        :field-style="fieldstyle"
+        placeholder="请填写到期时间"
+      >
+      </u-field>
+      <view class="" style="text-align: center; color: #fa3534">
+        {{ tishitext }}
+      </view>
+      <view class="btn-box">
+        <u-button @click="yxSubmit" size="mini" type="success" class="box-item"
+          >确定</u-button
+        >
+      </view>
+    </u-popup>
+    <u-calendar
+      v-model="tiemshow"
+      mode="date"
+      :max-date="date"
+      @change="tiemchange"
+    ></u-calendar>
+    <view class="caobox">
+      <view class="caobox_item" v-if="$QueryPermission(336)" @click="tophoto">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/1.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> 查看图片 </view>
+      </view>
+      <!-- <view class="caobox_item" v-if="$QueryPermission(248)" @click="toset">
 				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/4.png" mode="widthFix"></image>
 				<view class="">
 					设备控制
@@ -61,410 +88,457 @@
 					SIM卡
 				</view>
 			</view> -->
-			<view class="caobox_item" v-if="$QueryPermission(335)" @click="tohis">
-				<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/2.png" mode="widthFix"></image>
-				<view class="">
-					历史数据
-				</view>
-			</view>
-		</view>
-		<view class="realtime">
-			<view class="realtime_title">
-				<p>实时数据</p>
-			</view>
-			<view class="realtime_text">
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png" mode=""></image>
-					<view class="text">
-						<p>环境温度</p>
-						<p>{{at}}℃</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png" mode=""></image>
-					<view class="text">
-						<p>环境湿度</p>
-						<p>{{ah}}%</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/tianqi.png" mode=""></image>
-					<view class="text">
-						<p>天气</p>
-						<p>{{wea}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/xiayu.png" mode=""></image>
-					<view class="text">
-						<p>是否下雨</p>
-						<p>{{rain}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/fengxiang.png" mode=""></image>
-					<view class="text">
-						<p>风力风向</p>
-						<p>{{wind}}</p>
-					</view>
-				</view>
-				<view class="realtime_item">
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png" mode=""></image>
-					<view class="text">
-						<p>诱虫次数</p>
-						<p>{{wormnum}}</p>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+      <view class="caobox_item" v-if="$QueryPermission(335)" @click="tohis">
+        <image
+          src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/2.png"
+          mode="widthFix"
+        ></image>
+        <view class=""> 历史数据 </view>
+      </view>
+    </view>
+    <view class="realtime">
+      <view class="realtime_title">
+        <p>实时数据</p>
+      </view>
+      <view class="realtime_text">
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/wendu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>环境温度</p>
+            <p>{{ at }}℃</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/shidu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>环境湿度</p>
+            <p>{{ ah }}%</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/tianqi.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>天气</p>
+            <p>{{ wea }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/xiayu.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>是否下雨</p>
+            <p>{{ rain }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/fengxiang.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>风力风向</p>
+            <p>{{ wind }}</p>
+          </view>
+        </view>
+        <view class="realtime_item">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/xy2.0/yujing.png"
+            mode=""
+          ></image>
+          <view class="text">
+            <p>诱虫次数</p>
+            <p>{{ wormnum }}</p>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				baseimei: "",
-				equipInfo: {},
-				trapnum: 1,
-				at: "",
-				ah: "",
-				wind: "",
-				wea: "",
-				rain: "",
-				wormnum: "",
-				decoy: "",
-				xyErr: "",
-				xyErrtime: "",
-				decoytime: "",
-				yxShow: false,
-				tiemshow: false,
-				date: "",
-				fieldstyle: { //输入框样式
-					border: "2rpx solid #f6f6f6",
-					"border-radius": "24px",
-					"padding-left": "20rpx",
-					"background-color": "#f6f6f6"
-				},
-				tishitext:""
-			}
-		},
-		methods: {
-			tosim() {
-				uni.navigateTo({
-					url: "../sim/sim?d_id=" + this.equipInfo.d_id + "&device_id=" + this.equipInfo.imei +
-						"&device_type=" + this.equipInfo.type + "&disable=" + this.equipInfo.disable
-				})
-			},
-			tophoto() {
-				uni.navigateTo({
-					url: "./photolist?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id
-				})
-			},
-			toset() {
-				uni.navigateTo({
-					url: "./thxyset?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id +
-						"&dtype=" + this.equipInfo.dtype +
-						"&device_name=" + this.equipInfo.device_name
-				})
-			},
-			tohis() {
-				uni.navigateTo({
-					url: "./thxyhisdata?device_id=" + this.equipInfo.imei + "&d_id=" + this.equipInfo.d_id
-				})
-			},
-			copy(item) {
-				console.log(item)
-				uni.setClipboardData({
-					data: item.imei || item.device_id,
-					success: function() {
-						console.log('success');
-					}
-				});
-			},
-			async getbaseinfo() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.zjxy_list',
-					data: {
-						device_id: this.baseimei,
-						device_type_id: "8",
-						page: "1",
-						page_size: "10",
-					}
-				})
-				console.log(res.data[0])
-				this.equipInfo = res.data[0]
-				this.getatah()
-				this.getwind()
-				this.getweather()
-				this.getworm()
-			},
-			async getatah() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.zjxy_at_ah',
-					data: {
-						device_type_id: 24,
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
-						end_time: Math.floor(+new Date() / 1000),
-					}
-				})
-				console.log(res)
-				if (res.length) {
-					this.at = res[0].at
-					this.ah = res[0].ah
-				} else {
-					this.at = "暂无"
-					this.ah = "暂无"
-				}
-			},
-			async getwind() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.zjxy_history_data',
-					data: {
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
-						end_time: Math.floor(+new Date() / 1000),
-						device_id: this.equipInfo.imei,
-						page: 1,
-					}
-				})
-				// console.log(res.data[0].d_h_t)
-				if (res.data[0]) {
-					var fs = res.data[0].d_h_t.windSpeed;
-					let fx = res.data[0].d_h_t.windDirection;
-					// if (fx > 337.5 || fx < 22.5) {
-					if (
-						(fx < 360 && fx > 337.5) ||
-						(fx < 22.5 && fx > 0) ||
-						fx == 0 ||
-						fx == 360
-					) {
-						fx = "北";
-					} else if (fx > 22.5 && fx < 67.5) {
-						fx = "东北";
-					} else if (fx > 67.5 && fx < 112.5) {
-						fx = "东";
-					} else if (fx > 112.5 && fx < 157.5) {
-						fx = "东南";
-					} else if (fx > 157.5 && fx < 202.5) {
-						fx = "南";
-					} else if (fx > 202.5 && fx < 247.5) {
-						fx = "西南";
-					} else if (fx > 247.5 && fx < 292.5) {
-						fx = "西";
-					} else if (fx > 292.5 && fx < 337.5) {
-						fx = "西北";
-					} else if (fx == 666) {
-						fx = "无";
-					}
-					if (fs >= 66.6) {
-						fs = 0;
-					}
-					// this.monitordata[4].key = fx + "风" + fs + "级";
-					this.wind = fx + "风" + fs + "级";
-				} else {
-					this.wind = "暂无"
-				}
-			},
-			async getweather() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=device.device_manage.weathers',
-					data: {
-						lng: Number(this.equipInfo.lng),
-						lat: Number(this.equipInfo.lat),
-					}
-				})
-				console.log(res)
-				// this.
-				if (res[0]) {
-					this.wea = res[0].wea
-					this.rain = res[0].wea.indexOf("雨") == -1 ? "否" : "是"
-				} else {
-					this.wea = "暂无"
-					this.rain = "暂无"
-				}
-			},
-			async getworm() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.zjxycb_pest_chart',
-					data: {
-						d_id: this.equipInfo.d_id,
-						start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
-						end_time: Math.floor(+new Date() / 1000),
-						device_type_id: "24",
-					}
-				})
-				console.log(res)
-				if (res.pest_data.length) {
-					this.wormnum = res.pest_data[0].pest_num
-				} else {
-					this.wormnum = "暂无"
-				}
-			},
-			setdecoy() {
-				this.decoy = this.equipInfo.decoy
-				this.decoytime = this.equipInfo.xy_expire
-				this.yxShow = true
-			},
-			settime() {
-				console.log(12)
-				this.tiemshow = true
-			},
-			tiemchange(e) {
-				console.log(e)
-				this.decoytime = e.result
-			},
-			async yxSubmit() {
-				var time = Math.floor(+new Date(this.decoytime) / 1000)
-				console.log(time)
-				if (this.decoy == "") {
-					this.tishitext = "请填写诱芯名称"
-					return
-				} else if (isNaN(time)) {
-					this.tishitext = "请填写诱芯到期时间"
-					return
-				}
-				this.tishitext = ""
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.set_decopy',
-					data: {
-						decoy: this.decoy,
-						device_id: this.equipInfo.imei,
-						device_type_id: "24",
-						expire_time: time,
-					}
-				})
-				console.log(res)
-				if (res.status) {
-					uni.showToast({
-						title: "设置成功",
-						icon: "none"
-					})
-					this.yxShow = false
-					this.getbaseinfo()
-				}
-			}
-		},
-		onLoad(option) {
-			var times = new Date()
-			this.date = times.getFullYear() + 1 + "-" + Number(times.getMonth() + 1) + "-" + times.getDate()
-			this.baseimei = option.imei
-			// console.log(this.equipInfo)
-			this.getbaseinfo()
-		},
-	}
+export default {
+  data() {
+    return {
+      baseimei: '',
+      equipInfo: {},
+      trapnum: 1,
+      at: '',
+      ah: '',
+      wind: '',
+      wea: '',
+      rain: '',
+      wormnum: '',
+      decoy: '',
+      xyErr: '',
+      xyErrtime: '',
+      decoytime: '',
+      yxShow: false,
+      tiemshow: false,
+      date: '',
+      fieldstyle: {
+        //输入框样式
+        border: '2rpx solid #f6f6f6',
+        'border-radius': '24px',
+        'padding-left': '20rpx',
+        'background-color': '#f6f6f6',
+      },
+      tishitext: '',
+    };
+  },
+  methods: {
+    tosim() {
+      uni.navigateTo({
+        url:
+          '../sim/sim?d_id=' +
+          this.equipInfo.d_id +
+          '&device_id=' +
+          this.equipInfo.imei +
+          '&device_type=' +
+          this.equipInfo.type +
+          '&disable=' +
+          this.equipInfo.disable,
+      });
+    },
+    tophoto() {
+      uni.navigateTo({
+        url:
+          './photolist?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id,
+      });
+    },
+    toset() {
+      uni.navigateTo({
+        url:
+          './thxyset?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id +
+          '&dtype=' +
+          this.equipInfo.dtype +
+          '&device_name=' +
+          this.equipInfo.device_name,
+      });
+    },
+    tohis() {
+      uni.navigateTo({
+        url:
+          './thxyhisdata?device_id=' +
+          this.equipInfo.imei +
+          '&d_id=' +
+          this.equipInfo.d_id,
+      });
+    },
+    copy(item) {
+      console.log(item);
+      uni.setClipboardData({
+        data: item.imei || item.device_id,
+        success: function () {
+          console.log('success');
+        },
+      });
+    },
+    async getbaseinfo() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.zjxy_list',
+        data: {
+          device_id: this.baseimei,
+          device_type_id: '8',
+          page: '1',
+          page_size: '10',
+        },
+      });
+      console.log(res.data[0]);
+      this.equipInfo = res.data[0];
+      this.getatah();
+      this.getwind();
+      this.getweather();
+      this.getworm();
+    },
+    async getatah() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.zjxy_at_ah',
+        data: {
+          device_type_id: 24,
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
+          end_time: Math.floor(+new Date() / 1000),
+        },
+      });
+      console.log(res);
+      if (res.length) {
+        this.at = res[0].at;
+        this.ah = res[0].ah;
+      } else {
+        this.at = '暂无';
+        this.ah = '暂无';
+      }
+    },
+    async getwind() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.zjxy_history_data',
+        data: {
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
+          end_time: Math.floor(+new Date() / 1000),
+          device_id: this.equipInfo.imei,
+          page: 1,
+        },
+      });
+      // console.log(res.data[0].d_h_t)
+      if (res.data[0]) {
+        var fs = res.data[0].d_h_t.windSpeed;
+        let fx = res.data[0].d_h_t.windDirection;
+        // if (fx > 337.5 || fx < 22.5) {
+        if (
+          (fx < 360 && fx > 337.5) ||
+          (fx < 22.5 && fx > 0) ||
+          fx == 0 ||
+          fx == 360
+        ) {
+          fx = '北';
+        } else if (fx > 22.5 && fx < 67.5) {
+          fx = '东北';
+        } else if (fx > 67.5 && fx < 112.5) {
+          fx = '东';
+        } else if (fx > 112.5 && fx < 157.5) {
+          fx = '东南';
+        } else if (fx > 157.5 && fx < 202.5) {
+          fx = '南';
+        } else if (fx > 202.5 && fx < 247.5) {
+          fx = '西南';
+        } else if (fx > 247.5 && fx < 292.5) {
+          fx = '西';
+        } else if (fx > 292.5 && fx < 337.5) {
+          fx = '西北';
+        } else if (fx == 666) {
+          fx = '无';
+        }
+        if (fs >= 66.6) {
+          fs = 0;
+        }
+        // this.monitordata[4].key = fx + "风" + fs + "级";
+        this.wind = fx + '风' + fs + '级';
+      } else {
+        this.wind = '暂无';
+      }
+    },
+    async getweather() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=device.device_manage.weathers',
+        data: {
+          lng: Number(this.equipInfo.lng),
+          lat: Number(this.equipInfo.lat),
+        },
+      });
+      console.log(res);
+      // this.
+      if (res[0]) {
+        this.wea = res[0].wea;
+        this.rain = res[0].wea.indexOf('雨') == -1 ? '否' : '是';
+      } else {
+        this.wea = '暂无';
+        this.rain = '暂无';
+      }
+    },
+    async getworm() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.zjxycb_pest_chart',
+        data: {
+          d_id: this.equipInfo.d_id,
+          start_time: Math.floor(+new Date() / 1000 - 30 * 24 * 60 * 60),
+          end_time: Math.floor(+new Date() / 1000),
+          device_type_id: '24',
+        },
+      });
+      console.log(res);
+      if (res.pest_data.length) {
+        this.wormnum = res.pest_data[0].pest_num;
+      } else {
+        this.wormnum = '暂无';
+      }
+    },
+    setdecoy() {
+      this.decoy = this.equipInfo.decoy;
+      this.decoytime = this.equipInfo.xy_expire;
+      this.yxShow = true;
+    },
+    settime() {
+      console.log(12);
+      this.tiemshow = true;
+    },
+    tiemchange(e) {
+      console.log(e);
+      this.decoytime = e.result;
+    },
+    async yxSubmit() {
+      var time = Math.floor(+new Date(this.decoytime) / 1000);
+      console.log(time);
+      if (this.decoy == '') {
+        this.tishitext = '请填写诱芯名称';
+        return;
+      } else if (isNaN(time)) {
+        this.tishitext = '请填写诱芯到期时间';
+        return;
+      }
+      this.tishitext = '';
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.set_decopy',
+        data: {
+          decoy: this.decoy,
+          device_id: this.equipInfo.imei,
+          device_type_id: '24',
+          expire_time: time,
+        },
+      });
+      console.log(res);
+      if (res.status) {
+        uni.showToast({
+          title: '设置成功',
+          icon: 'none',
+        });
+        this.yxShow = false;
+        this.getbaseinfo();
+      }
+    },
+  },
+  onLoad(option) {
+    var times = new Date();
+    this.date =
+      times.getFullYear() +
+      1 +
+      '-' +
+      Number(times.getMonth() + 1) +
+      '-' +
+      times.getDate();
+    this.baseimei = option.imei;
+    // console.log(this.equipInfo)
+    this.getbaseinfo();
+  },
+};
 </script>
 
-<style lang='less'>
-	page {
-		padding: 20rpx;
-		box-sizing: border-box;
+<style lang="less">
+page {
+  padding: 20rpx;
+  box-sizing: border-box;
 
-		.info {
-			padding: 20rpx 40rpx;
-			color: #fff;
-			line-height: 50rpx;
-			font-size: 26rpx;
-			background-size: 100% auto;
-			background-repeat: no-repeat;
-			background-color: #0DC6B6;
-			background-position: top left;
-			box-sizing: border-box;
-			width: 100%;
+  .info {
+    padding: 20rpx 40rpx;
+    color: #fff;
+    line-height: 50rpx;
+    font-size: 26rpx;
+    background-size: 100% auto;
+    background-repeat: no-repeat;
+    background-color: #0dc6b6;
+    background-position: top left;
+    box-sizing: border-box;
+    width: 100%;
 
-			.tishi {
-				width: 28rpx;
-				height: 28rpx;
-				margin: 0rpx 0 0 20rpx;
-			}
-		}
+    .tishi {
+      width: 28rpx;
+      height: 28rpx;
+      margin: 0rpx 0 0 20rpx;
+    }
+  }
 
-		.on {
-			background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png')
-		}
+  .on {
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/onBg.png');
+  }
 
-		.off {
-			background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png')
-		}
+  .off {
+    background-image: url('http://www.hnyfwlw.com:8006/bigdata_app/image/cb/offBg.png');
+  }
 
-		.caobox {
-			display: flex;
-			flex-wrap: wrap;
-			text-align: center;
-			font-size: 28rpx;
-			color: #666;
-			line-height: 50rpx;
+  .caobox {
+    display: flex;
+    flex-wrap: wrap;
+    text-align: center;
+    font-size: 28rpx;
+    color: #666;
+    line-height: 50rpx;
 
-			image {
-				width: 52rpx;
-			}
+    image {
+      width: 52rpx;
+    }
 
-			.caobox_item {
-				padding: 20rpx 0;
-				box-sizing: border-box;
-				flex-basis: 25%;
-			}
-		}
+    .caobox_item {
+      padding: 20rpx 0;
+      box-sizing: border-box;
+      flex-basis: 25%;
+    }
+  }
 
-		.realtime {
-			width: 95%;
-			margin: 0rpx auto;
+  .realtime {
+    width: 95%;
+    margin: 0rpx auto;
 
-			.realtime_title {
-				font-size: 32rpx;
-				display: flex;
-				justify-content: space-between;
-				font-weight: 700;
+    .realtime_title {
+      font-size: 32rpx;
+      display: flex;
+      justify-content: space-between;
+      font-weight: 700;
 
-				.span {
-					color: #6e6c76;
-					font-size: 24rpx;
-					display: flex;
-					justify-content: space-between;
-					margin-top: 12rpx;
-				}
-			}
+      .span {
+        color: #6e6c76;
+        font-size: 24rpx;
+        display: flex;
+        justify-content: space-between;
+        margin-top: 12rpx;
+      }
+    }
 
-			.realtime_text {
-				margin-top: 20rpx;
-				display: flex;
-				justify-content: space-between;
-				flex-wrap: wrap;
+    .realtime_text {
+      margin-top: 20rpx;
+      display: flex;
+      justify-content: space-between;
+      flex-wrap: wrap;
 
-				.realtime_item {
-					width: 48%;
-					height: 100rpx;
-					display: flex;
-					box-shadow: 0 0 10rpx #bcb9ca;
-					margin-top: 20rpx;
-					padding: 20rpx 0;
+      .realtime_item {
+        width: 48%;
+        height: 100rpx;
+        display: flex;
+        box-shadow: 0 0 10rpx #bcb9ca;
+        margin-top: 20rpx;
+        padding: 20rpx 0;
 
-					image {
-						width: 60rpx;
-						height: 60rpx;
-						margin: 20rpx 20rpx 20rpx 40rpx;
-					}
+        image {
+          width: 60rpx;
+          height: 60rpx;
+          margin: 20rpx 20rpx 20rpx 40rpx;
+        }
 
-					.text {
-						padding: 10rpx 0 10rpx 30rpx;
-					}
-				}
-			}
-		}
-	}
+        .text {
+          padding: 10rpx 0 10rpx 30rpx;
+        }
+      }
+    }
+  }
+}
 
-	.btn-box {
-		text-align: center;
-		padding: 20rpx 30rpx;
-	}
+.btn-box {
+  text-align: center;
+  padding: 20rpx 30rpx;
+}
 
-	/deep/.u-calendar__action {
-		display: flex;
-		justify-content: space-around;
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
 
-		.u-calendar__action__text {
-			line-height: 25px;
-		}
-	}
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
 </style>

pages/cbqxyj/addressbook.vue

@@ -1,186 +1,183 @@
 <template>
-	<view>
-		<view class="booxbox">
-			<view class="booxbox_item">
-				<view class="">
-					姓名
-				</view>
-				<view class="booxbox_item_input">
-					<u-input v-model="username" maxlength="15" />
-				</view>
-			</view>
-			<view class="booxbox_item">
-				<view class="">
-					手机号
-				</view>
-				<view class="booxbox_item_input">
-					<u-input v-model="userphone" maxlength="15" />
-				</view>
-			</view>
-			<view class="adduser" @click="add">
-				添加
-			</view>
-		</view>
-		<view class="booxlist">
-			<view class="booxlist_tiele">
-				通讯录
-			</view>
-			<view class="booxlist_item" v-for="item in userlist" :key="item.d_id">
-				<view class="booxlist_item_f">
-					{{item.liaisons}}
-				</view>
-				<view class="booxlist_item_t">
-					{{item.phone}}
-				</view>
-				<view class="booxlist_item_i">
-					<u-icon name="minus-circle" color="#FB4E4E" size="34" @click="del(item.d_id)"></u-icon>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+    <view class="booxbox">
+      <view class="booxbox_item">
+        <view class=""> 姓名 </view>
+        <view class="booxbox_item_input">
+          <u-input v-model="username" maxlength="15" />
+        </view>
+      </view>
+      <view class="booxbox_item">
+        <view class=""> 手机号 </view>
+        <view class="booxbox_item_input">
+          <u-input v-model="userphone" maxlength="15" />
+        </view>
+      </view>
+      <view class="adduser" @click="add"> 添加 </view>
+    </view>
+    <view class="booxlist">
+      <view class="booxlist_tiele"> 通讯录 </view>
+      <view class="booxlist_item" v-for="item in userlist" :key="item.d_id">
+        <view class="booxlist_item_f">
+          {{ item.liaisons }}
+        </view>
+        <view class="booxlist_item_t">
+          {{ item.phone }}
+        </view>
+        <view class="booxlist_item_i">
+          <u-icon
+            name="minus-circle"
+            color="#FB4E4E"
+            size="34"
+            @click="del(item.d_id)"
+          ></u-icon>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				username:"",
-				userphone:"",
-				userlist:[]
-			}
-		},
-		methods: {
-			async getuserlist(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=device.device_sms_alert.user_warning_liaisons_list',
-					data: {
-						page: "1",
-						page_size: "99999999"
-					}
-				})
-				console.log(res)
-				this.userlist = res.data
-			},
-			async add(){
-				if (this.username == ""){
-					uni.showToast({
-						title: "请填写姓名",
-						icon: "none"
-					})
-				}else if(this.userphone == ""){
-					uni.showToast({
-						title: "请填写手机号",
-						icon: "none"
-					})
-				}else if(!/^1(1|2|3|4|5|6|7|8|9)\d{9}$/.test(this.userphone)){
-					uni.showToast({
-						title: "请选择正确的手机号格式",
-						icon: "none"
-					})
-				}else{
-					const res = await this.$myRequest({
-						url: '/api/api_gateway?method=device.device_sms_alert.create_user_warning_liaisons',
-						data: {
-							phone: this.userphone,
-							user_name: this.username
-						}
-					})
-					if(res){
-						uni.showToast({
-							title: "创建成功",
-							icon: "none"
-						})
-						this.getuserlist()
-					}
-				}
-			},
-			async del(id){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=device.device_sms_alert.del_user_warning_liaisons',
-					data: {
-						d_id: id
-					}
-				})
-				if(res){
-					uni.showToast({
-						title: "删除成功",
-						icon: "none"
-					})
-					this.getuserlist()
-				}
-			}
-		},
-		onLoad(){
-			this.getuserlist()
-		}
-	}
+export default {
+  data() {
+    return {
+      username: '',
+      userphone: '',
+      userlist: [],
+    };
+  },
+  methods: {
+    async getuserlist() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=device.device_sms_alert.user_warning_liaisons_list',
+        data: {
+          page: '1',
+          page_size: '99999999',
+        },
+      });
+      console.log(res);
+      this.userlist = res.data;
+    },
+    async add() {
+      if (this.username == '') {
+        uni.showToast({
+          title: '请填写姓名',
+          icon: 'none',
+        });
+      } else if (this.userphone == '') {
+        uni.showToast({
+          title: '请填写手机号',
+          icon: 'none',
+        });
+      } else if (!/^1(1|2|3|4|5|6|7|8|9)\d{9}$/.test(this.userphone)) {
+        uni.showToast({
+          title: '请选择正确的手机号格式',
+          icon: 'none',
+        });
+      } else {
+        const res = await this.$myRequest({
+          url: '/api/api_gateway?method=device.device_sms_alert.create_user_warning_liaisons',
+          data: {
+            phone: this.userphone,
+            user_name: this.username,
+          },
+        });
+        if (res) {
+          uni.showToast({
+            title: '创建成功',
+            icon: 'none',
+          });
+          this.getuserlist();
+        }
+      }
+    },
+    async del(id) {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=device.device_sms_alert.del_user_warning_liaisons',
+        data: {
+          d_id: id,
+        },
+      });
+      if (res) {
+        uni.showToast({
+          title: '删除成功',
+          icon: 'none',
+        });
+        this.getuserlist();
+      }
+    },
+  },
+  onLoad() {
+    this.getuserlist();
+  },
+};
 </script>
 
 <style lang="less">
-	page {
-		background-color: #F6F6FB;
-	}
-	.booxbox{
-		width: 95%;
-		margin: 20rpx auto;
-		background-color: #fff;
-		padding: 20rpx;
-		box-sizing: border-box;
-		border-radius: 5px;
-		.booxbox_item{
-			display: flex;
-			line-height: 70rpx;
-			justify-content: space-between;
-			border-bottom: 1rpx solid #F2F2F2;
-			padding: 20rpx 0;
-			.booxbox_item_input{
-				width: 70%;
-				/deep/.uni-input-input{
-					text-align: right;
-				}
-			}
-		}
-		.adduser{
-			margin: 30rpx auto 20rpx;
-			width: 80%;
-			background-color: #14A478;
-			padding: 20rpx 0;
-			border-radius: 59px;
-			text-align: center;
-			color: #fff;
-		}
-	}
-	.booxlist{
-		width: 95%;
-		margin: 20rpx auto;
-		background-color: #fff;
-		padding: 20rpx;
-		box-sizing: border-box;
-		border-radius: 5px;
-		.booxlist_tiele{
-			border-left: 8rpx solid #14A478;
-			padding-left: 30rpx;
-			margin-bottom: 30rpx;
-		}
-		.booxlist_item{
-			display: flex;
-			border-top: 1rpx solid #F2F2F2;
-			padding: 30rpx 0;
-			.booxlist_item_f{
-				width: calc(100% - 320rpx);
-				text-align: left;
-				overflow: hidden;//溢出隐藏
-				white-space: nowrap;//禁止换行
-				text-overflow: ellipsis;//...
-			}
-			.booxlist_item_t{
-				width: 270rpx;
-				text-align: left;
-			}
-			.booxlist_item_i{
-				width: 50rpx;
-				text-align: center;
-			}
-		}
-	}
+page {
+  background-color: #f6f6fb;
+}
+.booxbox {
+  width: 95%;
+  margin: 20rpx auto;
+  background-color: #fff;
+  padding: 20rpx;
+  box-sizing: border-box;
+  border-radius: 5px;
+  .booxbox_item {
+    display: flex;
+    line-height: 70rpx;
+    justify-content: space-between;
+    border-bottom: 1rpx solid #f2f2f2;
+    padding: 20rpx 0;
+    .booxbox_item_input {
+      width: 70%;
+      ::v-deep .uni-input-input {
+        text-align: right;
+      }
+    }
+  }
+  .adduser {
+    margin: 30rpx auto 20rpx;
+    width: 80%;
+    background-color: #14a478;
+    padding: 20rpx 0;
+    border-radius: 59px;
+    text-align: center;
+    color: #fff;
+  }
+}
+.booxlist {
+  width: 95%;
+  margin: 20rpx auto;
+  background-color: #fff;
+  padding: 20rpx;
+  box-sizing: border-box;
+  border-radius: 5px;
+  .booxlist_tiele {
+    border-left: 8rpx solid #14a478;
+    padding-left: 30rpx;
+    margin-bottom: 30rpx;
+  }
+  .booxlist_item {
+    display: flex;
+    border-top: 1rpx solid #f2f2f2;
+    padding: 30rpx 0;
+    .booxlist_item_f {
+      width: calc(100% - 320rpx);
+      text-align: left;
+      overflow: hidden; //溢出隐藏
+      white-space: nowrap; //禁止换行
+      text-overflow: ellipsis; //...
+    }
+    .booxlist_item_t {
+      width: 270rpx;
+      text-align: left;
+    }
+    .booxlist_item_i {
+      width: 50rpx;
+      text-align: center;
+    }
+  }
+}
 </style>

pages/disease/mls/forecastResult.vue

@@ -1,179 +1,186 @@
 <template>
-	<view class="bigBox">
-		<u-card :show-head="false" margin="0rpx 20rpx" :show-foot="false">
-			<view class="cardBox" slot="body">
-				<view class="selecttimes" @click="tiemshow = !tiemshow">
-					<view class="timesbox">
-						<image
-							:src="'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
-							mode=""></image>
-						<p>{{ initTime ? '出苗期' : begintime }}</p>
-						<p class="or">~</p>
-						<p>{{ initTime ? '收获期' : end }}</p>
-						<u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
-					</view>
-					<u-calendar v-model="tiemshow" mode="range" @change="tiemchange"></u-calendar>
-				</view>
-				<view class="empty" v-if="initTime">
-					请先选择出苗期和收获期
-				</view>
-				<view class="empty" v-else-if="list.length == 0">
-						数据为空
-				</view>
-				<scroll-view scroll-top="0" scroll-x="true" class="scroll-X" v-else>
-					<table class="table">
-						<tr class="tr">
-							<th class="th" v-for="(value, key) in param" :key="'a' + key">
-								{{ value }}
-							</th>
-						</tr>
-						<tr class="tr" v-for="(items, indexs) in list" :key="'b' + indexs">
-							<td class="td" v-for="(value, key) in param">{{ items[key]}}</td>
-						</tr>
-					</table>
-				</scroll-view>
-			</view>
-			<view class="" slot="foot"><u-icon name="chat-fill" size="34" color="" label="30评论"></u-icon></view>
-		</u-card>
-	</view>
+  <view class="bigBox">
+    <u-card :show-head="false" margin="0rpx 20rpx" :show-foot="false">
+      <view class="cardBox" slot="body">
+        <view class="selecttimes" @click="tiemshow = !tiemshow">
+          <view class="timesbox">
+            <image
+              :src="'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
+              mode=""
+            ></image>
+            <p>{{ initTime ? '出苗期' : begintime }}</p>
+            <p class="or">~</p>
+            <p>{{ initTime ? '收获期' : end }}</p>
+            <u-icon
+              name="rili"
+              custom-prefix="custom-icon"
+              class="icon"
+            ></u-icon>
+          </view>
+          <u-calendar
+            v-model="tiemshow"
+            mode="range"
+            @change="tiemchange"
+          ></u-calendar>
+        </view>
+        <view class="empty" v-if="initTime"> 请先选择出苗期和收获期 </view>
+        <view class="empty" v-else-if="list.length == 0"> 数据为空 </view>
+        <scroll-view scroll-top="0" scroll-x="true" class="scroll-X" v-else>
+          <table class="table">
+            <tr class="tr">
+              <th class="th" v-for="(value, key) in param" :key="'a' + key">
+                {{ value }}
+              </th>
+            </tr>
+            <tr class="tr" v-for="(items, indexs) in list" :key="'b' + indexs">
+              <td class="td" v-for="(value, key) in param">{{ items[key] }}</td>
+            </tr>
+          </table>
+        </scroll-view>
+      </view>
+      <view class="" slot="foot"
+        ><u-icon name="chat-fill" size="34" color="" label="30评论"></u-icon
+      ></view>
+    </u-card>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				tiemshow: false,
-				initTime: true,
-				forecastId:'',
-				end:'',
-				begintime:'',
-				list: [],
-				param: {
-					ciDai: '代/次',
-					sTime: '本次侵染开始时间',
-					eTime: '本次侵染结束时间',
-					awsDeg: '本次侵染程度',
-					awsFen: '本次侵染的分值',
-					awsYao: '是否使用预报数据',
-				}
-			}
-		},
-		onLoad(option) {
-			this.forecastId = option.id;
-			this.end = parseInt(+new Date() / 1000);
-			this.begintime = parseInt(this.end - 24 * 60 * 60);
-		},
-		methods: {
-			async histprydatas() {
-				//表格历史数据
-				const res = await this.$myRequest({
-					url: "/api/api_gateway?method=wheat.potato.potato_time",
-					data: {
-						device_id: this.forecastId,
-						start:this.begintime,
-						end: this.end
-					},
-				});
-				console.log(res);
-				this.list = res.data.list;
-			},
-			tiemchange(e) {
-				console.log(e);
-				this.initTime = false;
-				//切换时间
-				// this.begintime = parseInt(+new Date(e.startDate) / 1000);
-				this.begintime = e.startDate;
-				this.end = e.endDate;
-				this.histprydatas();
-			}
-		}
-	}
+export default {
+  data() {
+    return {
+      tiemshow: false,
+      initTime: true,
+      forecastId: '',
+      end: '',
+      begintime: '',
+      list: [],
+      param: {
+        ciDai: '代/次',
+        sTime: '本次侵染开始时间',
+        eTime: '本次侵染结束时间',
+        awsDeg: '本次侵染程度',
+        awsFen: '本次侵染的分值',
+        awsYao: '是否使用预报数据',
+      },
+    };
+  },
+  onLoad(option) {
+    this.forecastId = option.id;
+    this.end = parseInt(+new Date() / 1000);
+    this.begintime = parseInt(this.end - 24 * 60 * 60);
+  },
+  methods: {
+    async histprydatas() {
+      //表格历史数据
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=wheat.potato.potato_time',
+        data: {
+          device_id: this.forecastId,
+          start: this.begintime,
+          end: this.end,
+        },
+      });
+      console.log(res);
+      this.list = res.data.list;
+    },
+    tiemchange(e) {
+      console.log(e);
+      this.initTime = false;
+      //切换时间
+      // this.begintime = parseInt(+new Date(e.startDate) / 1000);
+      this.begintime = e.startDate;
+      this.end = e.endDate;
+      this.histprydatas();
+    },
+  },
+};
 </script>
 
 <style scoped lang="less">
-	.bigBox {
-		width: 100vw;
-		height: calc(100vh - 80rpx);
-		background: #eee;
-		box-sizing: border-box;
-		padding-top: 20rpx;
-		overflow: hidden;
+.bigBox {
+  width: 100vw;
+  height: calc(100vh - 80rpx);
+  background: #eee;
+  box-sizing: border-box;
+  padding-top: 20rpx;
+  overflow: hidden;
 
-		.cardBox {
-			height: 75vh;
-			overflow-y: auto;
-			padding-top: 20rpx;
-			.empty{
-				display: flex;
-				justify-content: center;
-				align-items: center;
-				height: calc(100% - 60rpx);
-			}
-			.selecttimes {
-				width: 90%;
-				box-shadow: 0 0 10rpx #bcb9ca;
-				padding: 10rpx 20rpx;
-				box-sizing: border-box;
-				margin: 0 auto;
-				font-size: 28rpx;
-			
-				.timesbox {
-					display: flex;
-					justify-content: space-around;
-			
-					image {
-						width: 30rpx;
-						height: 30rpx;
-						margin-top: 6rpx;
-					}
-			
-					.icon {
-						color: #949494;
-						text-align: right;
-						margin-left: 30rpx;
-					}
-				}
-			
-				/deep/.u-calendar__action {
-					display: flex;
-					justify-content: space-around;
-			
-					.u-calendar__action__text {
-						line-height: 25px;
-					}
-				}
-			}
-			
-			.scroll-X {
-				width: 100%;
-				margin: 20rpx auto;
-				height: calc(100% - 120rpx);
-				overflow-y: auto;
-				.tr {
-					display: flex;
-					overflow: hidden;
+  .cardBox {
+    height: 75vh;
+    overflow-y: auto;
+    padding-top: 20rpx;
+    .empty {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: calc(100% - 60rpx);
+    }
+    .selecttimes {
+      width: 90%;
+      box-shadow: 0 0 10rpx #bcb9ca;
+      padding: 10rpx 20rpx;
+      box-sizing: border-box;
+      margin: 0 auto;
+      font-size: 28rpx;
 
-					.th,
-					.td {
-						display: inline-block;
-						padding: 5rpx;
-						width: 300rpx;
-						text-align: center;
-						height: 52rpx;
-						line-height: 52rpx;
-						border: 2rpx solid #f1f1f1;
-					}
-				}
+      .timesbox {
+        display: flex;
+        justify-content: space-around;
 
-				.tr:nth-child(2n-1) {
-					background-color: #f5fff8;
-				}
+        image {
+          width: 30rpx;
+          height: 30rpx;
+          margin-top: 6rpx;
+        }
 
-				.tr:first-child {
-					background-color: #57c878;
-					color: #fff;
-				}
-			}
-		}
-	}
-</style>
+        .icon {
+          color: #949494;
+          text-align: right;
+          margin-left: 30rpx;
+        }
+      }
+
+      ::v-deep .u-calendar__action {
+        display: flex;
+        justify-content: space-around;
+
+        .u-calendar__action__text {
+          line-height: 25px;
+        }
+      }
+    }
+
+    .scroll-X {
+      width: 100%;
+      margin: 20rpx auto;
+      height: calc(100% - 120rpx);
+      overflow-y: auto;
+      .tr {
+        display: flex;
+        overflow: hidden;
+
+        .th,
+        .td {
+          display: inline-block;
+          padding: 5rpx;
+          width: 300rpx;
+          text-align: center;
+          height: 52rpx;
+          line-height: 52rpx;
+          border: 2rpx solid #f1f1f1;
+        }
+      }
+
+      .tr:nth-child(2n-1) {
+        background-color: #f5fff8;
+      }
+
+      .tr:first-child {
+        background-color: #57c878;
+        color: #fff;
+      }
+    }
+  }
+}
+</style>

pages/environment/gshistory.vue

@@ -1,477 +1,515 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view class="" style="position: relative; top: 44px">
-			<view style="
+  <view>
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view
+        style="
           position: fixed;
           z-index: 10000000;
           width: 100%;
           background-color: #000000;
-        ">
-				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" left-text="返回" title="历史数据"></uni-nav-bar>
-			</view>
-		</view>
-		<view class="his_box">
-			<view class="selecttimes" @click="tiemshow = !tiemshow">
-				<view class="timesbox">
-					<image
-						:src="'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
-						mode=""></image>
-					<p>{{ timetab(begintime) }}</p>
-					<p class="or">~</p>
-					<p>{{ timetab(end) }}</p>
-					<u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
-				</view>
-				<u-calendar v-model="tiemshow" mode="range" @change="tiemchange"></u-calendar>
-			</view>
-			<view class="shuju_one">
-				<view class="canvastishi" v-if="!canvastishiTF && !dataloadingtf">
-					暂无数据
-				</view>
-				<view class="canvastishi" v-if="dataloadingtf">
-					<p class="dataloading">加载中</p>
-				</view>
-				<canvas v-show="!tiemshow" canvas-id="canvasColumnA" id="canvasColumnA" class="charts"
-					@touchstart="touchLineA($event)" @touchmove="moveLineA($event)" @touchend="touchEndLineA($event)"
-					disable-scroll="true" :style="{
+        "
+      >
+        <uni-nav-bar
+          @clickLeft="clickLeft"
+          left-icon="back"
+          left-text="返回"
+          title="历史数据"
+        ></uni-nav-bar>
+      </view>
+    </view>
+    <view class="his_box">
+      <view class="selecttimes" @click="tiemshow = !tiemshow">
+        <view class="timesbox">
+          <image
+            :src="'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
+            mode=""
+          ></image>
+          <p>{{ timetab(begintime) }}</p>
+          <p class="or">~</p>
+          <p>{{ timetab(end) }}</p>
+          <u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
+        </view>
+        <u-calendar
+          v-model="tiemshow"
+          mode="range"
+          @change="tiemchange"
+        ></u-calendar>
+      </view>
+      <view class="shuju_one">
+        <view class="canvastishi" v-if="!canvastishiTF && !dataloadingtf">
+          暂无数据
+        </view>
+        <view class="canvastishi" v-if="dataloadingtf">
+          <p class="dataloading">加载中</p>
+        </view>
+        <canvas
+          v-show="!tiemshow"
+          canvas-id="canvasColumnA"
+          id="canvasColumnA"
+          class="charts"
+          @touchstart="touchLineA($event)"
+          @touchmove="moveLineA($event)"
+          @touchend="touchEndLineA($event)"
+          disable-scroll="true"
+          :style="{
             width: cWidth * pixelRatio + 'px',
             height: cHeight * pixelRatio + 'px',
             transform: 'scale(' + 1 / pixelRatio + ')',
             'margin-left': (-cWidth * (pixelRatio - 1)) / 2 + 'px',
             'margin-top': (-cHeight * (pixelRatio - 1)) / 2 + 'px',
-          }"></canvas>
-			</view>
-			<view class="condition">
-				<scroll-view scroll-top="0" scroll-x="true" class="scroll-X">
-					<table class="table">
-						<tr class="tr">
-							<th class="th" v-for="(item, index) in thdata" :key="'a' + index">
-								{{ item }}
-							</th>
-						</tr>
-						<tr class="tr" v-for="(items, indexs) in historylistdata" :key="'b' + indexs" v-if="!forbidden">
-							<td class="td">{{ items.uptime | timeFormat() }}</td>
-							<!-- <td class="td">{{ items.ats }}</td>
+          }"
+        ></canvas>
+      </view>
+      <view class="condition">
+        <scroll-view scroll-top="0" scroll-x="true" class="scroll-X">
+          <table class="table">
+            <tr class="tr">
+              <th class="th" v-for="(item, index) in thdata" :key="'a' + index">
+                {{ item }}
+              </th>
+            </tr>
+            <tr
+              class="tr"
+              v-for="(items, indexs) in historylistdata"
+              :key="'b' + indexs"
+              v-if="!forbidden"
+            >
+              <td class="td">{{ items.uptime | timeFormat() }}</td>
+              <!-- <td class="td">{{ items.ats }}</td>
               <td class="td">{{ items.at }}</td> -->
-							<td class="td" v-for="(item, index) in items.temp" :key="'c' + index">
-								{{ item }}
-							</td>
-							<td class="td" v-for="(item, index) in items.swc" :key="'d' + index">
-								{{ item }}
-							</td>
-							<td class="td" v-for="(item, index) in items.ecs" :key="'e' + index">
-								{{ item }}
-							</td>
-							<!-- <td class="td">{{ items.atm }}</td> -->
-						</tr>
-						<tr class="tr" v-if="forbidden">
-							<td class="td" v-for="item in 13">暂无数据</td>
-						</tr>
-					</table>
-				</scroll-view>
-				<view class="pagenumber">
-					<button @click="prev">上一页</button>
-					<view class="pagenumber_page"> 第 {{ page }} 页 </view>
-					<view class="pagenumber_page"> 共 {{ pagesum }} 页 </view>
-					<button @click="next">下一页</button>
-				</view>
-			</view>
-		</view>
-	</view>
+              <td
+                class="td"
+                v-for="(item, index) in items.temp"
+                :key="'c' + index"
+              >
+                {{ item }}
+              </td>
+              <td
+                class="td"
+                v-for="(item, index) in items.swc"
+                :key="'d' + index"
+              >
+                {{ item }}
+              </td>
+              <td
+                class="td"
+                v-for="(item, index) in items.ecs"
+                :key="'e' + index"
+              >
+                {{ item }}
+              </td>
+              <!-- <td class="td">{{ items.atm }}</td> -->
+            </tr>
+            <tr class="tr" v-if="forbidden">
+              <td class="td" v-for="item in 13">暂无数据</td>
+            </tr>
+          </table>
+        </scroll-view>
+        <view class="pagenumber">
+          <button @click="prev">上一页</button>
+          <view class="pagenumber_page"> 第 {{ page }} 页 </view>
+          <view class="pagenumber_page"> 共 {{ pagesum }} 页 </view>
+          <button @click="next">下一页</button>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	import uCharts from "../../components/js_sdk/u-charts/u-charts/u-charts.js";
-	var canvaColumnA = null;
-	export default {
-		data() {
-			return {
-				tiemshow: false, //时间筛选弹框
-				begintime: "", //开始时间
-				end: "", //结束时间
-				dataloadingtf: true,
-				canvastishiTF: false,
-				device_id: "", //设备ID
-				thdata: [
-					"上传时间",
-					// "空气湿度(%RH)",
-					// "空气温度(℃)",
-					"10cm土壤温度(%RH)",
-					"20cm土壤温度(%RH)",
-					"30cm土壤温度(%RH)",
-					"10cm土壤湿度(%RH)",
-					"20cm土壤湿度(%RH)",
-					"30cm土壤湿度(%RH)",
-					// "大气压强(Pa)",
-				], //表格抬头
-				forbidden: false,
-				historylistdata: [], //历史数据
-				pagesum: 1,
-				page: 1,
-				cWidth: "",
-				cHeight: "",
-				pixelRatio: 1,
-			};
-		},
-		methods: {
-			tiemchange(e) {
-				//切换时间
-				this.begintime = parseInt(+new Date(e.startDate) / 1000);
-				this.end = parseInt(+new Date(e.endDate) / 1000);
-				this.histprydatas();
-			},
-			timetab(e) {
-				//时间转换
-				e = new Date(e * 1000);
-				var year = e.getFullYear();
-				var month =
-					e.getMonth() + 1 < 10 ? "0" + (e.getMonth() + 1) : e.getMonth() + 1;
-				var day = e.getDate() < 10 ? "0" + e.getDate() : e.getDate();
-				var time = year + "/" + month + "/" + day;
-				return time;
-			},
-			async histprydatas() {
-				//历史数据
-				this.dataloadingtf = true;
-				const res = await this.$myRequest({
-					url: "/api/api_gateway?method=weather.weather.nd_data",
-					data: {
-						device_id: this.device_id,
-						page: this.page,
-						begin: this.begintime,
-						end: this.end,
-					},
-				});
-				this.dataloadingtf = false;
-				console.log(res.nums);
-				this.pagesum = Math.ceil(res.nums / 10) || 1;
-				this.historylistdata = res.dat_list;
-				for (var i = 0; i < this.historylistdata.length; i++) {
-					this.historylistdata[i].temp = this.historylistdata[i].temp.split(",");
-					this.historylistdata[i].swc = this.historylistdata[i].swc.split(",");
-					this.historylistdata[i].ecs = this.historylistdata[i].ecs.split(",");
-				}
-				var arr1 = [];
-				var arr2 = [];
-				var xtitle = [];
-				var obj = [{
-						name: "空气温度",
-						data: [],
-						color: "#00E29D",
-					},
-					{
-						name: "空气湿度",
-						data: [],
-						color: "#6CBBFF",
-					},
-				];
-				var arr3 = [];
-				var k = 0;
-				for (var i = 0; i < res.dat_char.length; i++) {
-					var times = new Date(res.dat_char[i].uptime * 1000);
-					xtitle.unshift(
-						times.getMonth() +
-						1 +
-						"/" +
-						times.getDate() +
-						"-" +
-						times.getHours() +
-						":" +
-						times.getMinutes()
-					);
-					arr1.unshift(res.dat_char[i].at == "" ? "0" : res.dat_char[i].at); //空气温度
-					arr2.unshift(res.dat_char[i].ats == "" ? "0" : res.dat_char[i].ats); //空气湿度
-					res.dat_char[i].temp = res.dat_char[i].temp.split(",");
-					res.dat_char[i].swc = res.dat_char[i].swc.split(",");
-					res.dat_char[i].ecs = res.dat_char[i].ecs.split(",");
-					for (var j = 0; j < res.dat_char[i].temp.length; j++) {
-						arr3.unshift(
-							res.dat_char[i].temp[j] == "" ? "0" : res.dat_char[i].temp[j]
-						); //10cm土壤温度
-					}
-					this.thdata.length = 1;
-					res.depth.split(',').forEach((dep, index) => {
-						this.thdata.push(`${dep}cm土壤温度(℃)`)
-						res.dat_char[i].temp.forEach((items, indexs) => {
-							var tempdata = [];
-							var tempdatas = [];
-							var ecsarr = [];
-							tempdata.push(Number(items));
-							tempdatas.push(Number(res.dat_char[i].swc[indexs]));
-							if((res.dat_char[i]).ecs[indexs]) {
-								ecsarr.push(Number(res.dat_char[i].ecs[indexs]));
-							}
-							var temparrs = {
-								name: dep + "cm土壤温度(℃)",
-								data: tempdata,
-							};
-							var temparr = {
-								name: dep + "cm土壤湿度(%RH)",
-								data: tempdatas,
-							};
-							var ecsparr = {
-								name: dep + "cm电导率(ms/cm)",
-								data: ecsarr,
-							};
-							obj.push(temparr);
-							obj.push(temparrs);
-							if(ecsarr.length > 0) {
-								obj.push(ecsparr);
-							}
-						});
-					})
-					res.depth.split(',').forEach((dep, index) => {
-						this.thdata.push(`${dep}cm土壤湿度(%RH)`)
-					})
-					res.depth.split(',').forEach((dep, index) => {
-						this.thdata.push(`${dep}cm电导率(ms/cm)`)
-					})
-				}
-				obj[0].data = arr1;
-				obj[1].data = arr2;
-				var listArr = [];
-				obj.forEach(function(el, index) {
-					for (var i = 0; i < listArr.length; i++) {
-						// 对比相同的字段key，相同放入对应的数组中
-						if (listArr[i].name == el.name && el.data !== undefined) {
-							listArr[i].data.unshift(el.data[0]);
-							return;
-						}
-					}
-					// 第一次对比没有参照，放入参照
-					listArr.push({
-						name: el.name,
-						data: el.data,
-					});
-				});
-				console.log(listArr);
-				if (listArr.length == 0) {
-					this.canvastishiTF = false;
-				} else {
-					this.canvastishiTF = true;
-				}
-				this.showColumn("canvasColumnA", xtitle, listArr);
-				// console.log(this.historylistdata)
-			},
-			prev() {
-				//上一页
-				if (this.page > 1) {
-					this.page--;
-					this.histprydatas();
-				}
-			},
-			next() {
-				//下一页
-				if (this.page < this.pagesum) {
-					this.page++;
-					this.histprydatas();
-				}
-			},
-			clickLeft() {
-				uni.navigateBack({
-					delta: 1,
-				});
-			},
-			showColumn(id, xtitle, xinfo) {
-				var _self = this;
-				const ctx = uni.createCanvasContext(id, this);
-				canvaColumnA = new uCharts({
-					context: ctx,
-					type: "line",
-					legend: {
-						position: "top",
-					},
-					fontSize: 11,
-					background: "#FFFFFF",
-					pixelRatio: 1,
-					animation: true,
-					dataLabel: false,
-					categories: xtitle,
-					series: xinfo,
-					enableScroll: true, //开启图表拖拽功能
-					xAxis: {
-						disableGrid: true,
-						type: "grid",
-						gridType: "dash",
-						itemCount: 4, //x轴单屏显示数据的数量，默认为5个
-						scrollShow: true, //新增是否显示滚动条，默认false
-						// scrollAlign: 'left', //滚动条初始位置
-						scrollBackgroundColor: "#F7F7FF", //默认为 #EFEBEF
-						scrollColor: "#DEE7F7", //默认为 #A6A6A6
-					},
-					yAxis: {},
-					width: _self.cWidth * 1,
-					height: _self.cHeight * 1,
-					extra: {
-						line: {
-							type: "curve",
-						},
-					},
-				});
-			},
-			touchLineA(e) {
-				console.log(e);
-				canvaColumnA.scrollStart(e);
-			},
-			moveLineA(e) {
-				canvaColumnA.scroll(e);
-			},
-			touchEndLineA(e) {
-				canvaColumnA.scrollEnd(e);
-				//下面是toolTip事件，如果滚动后不需要显示，可不填写
-				canvaColumnA.showToolTip(e, {
-					format: function(item, category) {
-						return category + " " + item.name + ":" + item.data;
-					},
-				});
-			},
-		},
-		onLoad(option) {
-			this.cWidth = uni.upx2px(650);
-			this.cHeight = uni.upx2px(500);
-			this.device_id = option.id;
-			this.end = parseInt(+new Date() / 1000);
-			this.begintime = parseInt(this.end - 24 * 60 * 60);
-			this.histprydatas();
-		},
-	};
+import uCharts from '../../components/js_sdk/u-charts/u-charts/u-charts.js';
+var canvaColumnA = null;
+export default {
+  data() {
+    return {
+      tiemshow: false, //时间筛选弹框
+      begintime: '', //开始时间
+      end: '', //结束时间
+      dataloadingtf: true,
+      canvastishiTF: false,
+      device_id: '', //设备ID
+      thdata: [
+        '上传时间',
+        // "空气湿度(%RH)",
+        // "空气温度(℃)",
+        '10cm土壤温度(%RH)',
+        '20cm土壤温度(%RH)',
+        '30cm土壤温度(%RH)',
+        '10cm土壤湿度(%RH)',
+        '20cm土壤湿度(%RH)',
+        '30cm土壤湿度(%RH)',
+        // "大气压强(Pa)",
+      ], //表格抬头
+      forbidden: false,
+      historylistdata: [], //历史数据
+      pagesum: 1,
+      page: 1,
+      cWidth: '',
+      cHeight: '',
+      pixelRatio: 1,
+    };
+  },
+  methods: {
+    tiemchange(e) {
+      //切换时间
+      this.begintime = parseInt(+new Date(e.startDate) / 1000);
+      this.end = parseInt(+new Date(e.endDate) / 1000);
+      this.histprydatas();
+    },
+    timetab(e) {
+      //时间转换
+      e = new Date(e * 1000);
+      var year = e.getFullYear();
+      var month =
+        e.getMonth() + 1 < 10 ? '0' + (e.getMonth() + 1) : e.getMonth() + 1;
+      var day = e.getDate() < 10 ? '0' + e.getDate() : e.getDate();
+      var time = year + '/' + month + '/' + day;
+      return time;
+    },
+    async histprydatas() {
+      //历史数据
+      this.dataloadingtf = true;
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=weather.weather.nd_data',
+        data: {
+          device_id: this.device_id,
+          page: this.page,
+          begin: this.begintime,
+          end: this.end,
+        },
+      });
+      this.dataloadingtf = false;
+      console.log(res.nums);
+      this.pagesum = Math.ceil(res.nums / 10) || 1;
+      this.historylistdata = res.dat_list;
+      for (var i = 0; i < this.historylistdata.length; i++) {
+        this.historylistdata[i].temp = this.historylistdata[i].temp.split(',');
+        this.historylistdata[i].swc = this.historylistdata[i].swc.split(',');
+        this.historylistdata[i].ecs = this.historylistdata[i].ecs.split(',');
+      }
+      var arr1 = [];
+      var arr2 = [];
+      var xtitle = [];
+      var obj = [
+        {
+          name: '空气温度',
+          data: [],
+          color: '#00E29D',
+        },
+        {
+          name: '空气湿度',
+          data: [],
+          color: '#6CBBFF',
+        },
+      ];
+      var arr3 = [];
+      var k = 0;
+      for (var i = 0; i < res.dat_char.length; i++) {
+        var times = new Date(res.dat_char[i].uptime * 1000);
+        xtitle.unshift(
+          times.getMonth() +
+            1 +
+            '/' +
+            times.getDate() +
+            '-' +
+            times.getHours() +
+            ':' +
+            times.getMinutes()
+        );
+        arr1.unshift(res.dat_char[i].at == '' ? '0' : res.dat_char[i].at); //空气温度
+        arr2.unshift(res.dat_char[i].ats == '' ? '0' : res.dat_char[i].ats); //空气湿度
+        res.dat_char[i].temp = res.dat_char[i].temp.split(',');
+        res.dat_char[i].swc = res.dat_char[i].swc.split(',');
+        res.dat_char[i].ecs = res.dat_char[i].ecs.split(',');
+        for (var j = 0; j < res.dat_char[i].temp.length; j++) {
+          arr3.unshift(
+            res.dat_char[i].temp[j] == '' ? '0' : res.dat_char[i].temp[j]
+          ); //10cm土壤温度
+        }
+        this.thdata.length = 1;
+        res.depth.split(',').forEach((dep, index) => {
+          this.thdata.push(`${dep}cm土壤温度(℃)`);
+          res.dat_char[i].temp.forEach((items, indexs) => {
+            var tempdata = [];
+            var tempdatas = [];
+            var ecsarr = [];
+            tempdata.push(Number(items));
+            tempdatas.push(Number(res.dat_char[i].swc[indexs]));
+            if (res.dat_char[i].ecs[indexs]) {
+              ecsarr.push(Number(res.dat_char[i].ecs[indexs]));
+            }
+            var temparrs = {
+              name: dep + 'cm土壤温度(℃)',
+              data: tempdata,
+            };
+            var temparr = {
+              name: dep + 'cm土壤湿度(%RH)',
+              data: tempdatas,
+            };
+            var ecsparr = {
+              name: dep + 'cm电导率(ms/cm)',
+              data: ecsarr,
+            };
+            obj.push(temparr);
+            obj.push(temparrs);
+            if (ecsarr.length > 0) {
+              obj.push(ecsparr);
+            }
+          });
+        });
+        res.depth.split(',').forEach((dep, index) => {
+          this.thdata.push(`${dep}cm土壤湿度(%RH)`);
+        });
+        res.depth.split(',').forEach((dep, index) => {
+          this.thdata.push(`${dep}cm电导率(ms/cm)`);
+        });
+      }
+      obj[0].data = arr1;
+      obj[1].data = arr2;
+      var listArr = [];
+      obj.forEach(function (el, index) {
+        for (var i = 0; i < listArr.length; i++) {
+          // 对比相同的字段key，相同放入对应的数组中
+          if (listArr[i].name == el.name && el.data !== undefined) {
+            listArr[i].data.unshift(el.data[0]);
+            return;
+          }
+        }
+        // 第一次对比没有参照，放入参照
+        listArr.push({
+          name: el.name,
+          data: el.data,
+        });
+      });
+      console.log(listArr);
+      if (listArr.length == 0) {
+        this.canvastishiTF = false;
+      } else {
+        this.canvastishiTF = true;
+      }
+      this.showColumn('canvasColumnA', xtitle, listArr);
+      // console.log(this.historylistdata)
+    },
+    prev() {
+      //上一页
+      if (this.page > 1) {
+        this.page--;
+        this.histprydatas();
+      }
+    },
+    next() {
+      //下一页
+      if (this.page < this.pagesum) {
+        this.page++;
+        this.histprydatas();
+      }
+    },
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    showColumn(id, xtitle, xinfo) {
+      var _self = this;
+      const ctx = uni.createCanvasContext(id, this);
+      canvaColumnA = new uCharts({
+        context: ctx,
+        type: 'line',
+        legend: {
+          position: 'top',
+        },
+        fontSize: 11,
+        background: '#FFFFFF',
+        pixelRatio: 1,
+        animation: true,
+        dataLabel: false,
+        categories: xtitle,
+        series: xinfo,
+        enableScroll: true, //开启图表拖拽功能
+        xAxis: {
+          disableGrid: true,
+          type: 'grid',
+          gridType: 'dash',
+          itemCount: 4, //x轴单屏显示数据的数量，默认为5个
+          scrollShow: true, //新增是否显示滚动条，默认false
+          // scrollAlign: 'left', //滚动条初始位置
+          scrollBackgroundColor: '#F7F7FF', //默认为 #EFEBEF
+          scrollColor: '#DEE7F7', //默认为 #A6A6A6
+        },
+        yAxis: {},
+        width: _self.cWidth * 1,
+        height: _self.cHeight * 1,
+        extra: {
+          line: {
+            type: 'curve',
+          },
+        },
+      });
+    },
+    touchLineA(e) {
+      console.log(e);
+      canvaColumnA.scrollStart(e);
+    },
+    moveLineA(e) {
+      canvaColumnA.scroll(e);
+    },
+    touchEndLineA(e) {
+      canvaColumnA.scrollEnd(e);
+      //下面是toolTip事件，如果滚动后不需要显示，可不填写
+      canvaColumnA.showToolTip(e, {
+        format: function (item, category) {
+          return category + ' ' + item.name + ':' + item.data;
+        },
+      });
+    },
+  },
+  onLoad(option) {
+    this.cWidth = uni.upx2px(650);
+    this.cHeight = uni.upx2px(500);
+    this.device_id = option.id;
+    this.end = parseInt(+new Date() / 1000);
+    this.begintime = parseInt(this.end - 24 * 60 * 60);
+    this.histprydatas();
+  },
+};
 </script>
 
 <style lang="scss">
-	.his_box {
-		width: 100%;
-		top: 200rpx;
-		position: relative;
-	}
+.his_box {
+  width: 100%;
+  top: 200rpx;
+  position: relative;
+}
 
-	.selecttimes {
-		width: 90%;
-		box-shadow: 0 0 10rpx #bcb9ca;
-		padding: 10rpx 20rpx;
-		box-sizing: border-box;
-		margin: 0 auto;
-		font-size: 28rpx;
+.selecttimes {
+  width: 90%;
+  box-shadow: 0 0 10rpx #bcb9ca;
+  padding: 10rpx 20rpx;
+  box-sizing: border-box;
+  margin: 0 auto;
+  font-size: 28rpx;
 
-		.timesbox {
-			display: flex;
-			justify-content: space-around;
+  .timesbox {
+    display: flex;
+    justify-content: space-around;
 
-			image {
-				width: 30rpx;
-				height: 30rpx;
-				margin-top: 6rpx;
-			}
+    image {
+      width: 30rpx;
+      height: 30rpx;
+      margin-top: 6rpx;
+    }
 
-			.icon {
-				color: #949494;
-				text-align: right;
-				margin-left: 30rpx;
-			}
-		}
+    .icon {
+      color: #949494;
+      text-align: right;
+      margin-left: 30rpx;
+    }
+  }
 
-		/deep/.u-calendar__action {
-			display: flex;
-			justify-content: space-around;
+  ::v-deep .u-calendar__action {
+    display: flex;
+    justify-content: space-around;
 
-			.u-calendar__action__text {
-				line-height: 25px;
-			}
-		}
-	}
+    .u-calendar__action__text {
+      line-height: 25px;
+    }
+  }
+}
 
-	.shuju_one {
-		width: 90%;
-		margin: 20px auto;
-		box-shadow: 0 0 10rpx #bcb9ca;
-		padding-top: 20rpx;
-		height: 550rpx;
+.shuju_one {
+  width: 90%;
+  margin: 20px auto;
+  box-shadow: 0 0 10rpx #bcb9ca;
+  padding-top: 20rpx;
+  height: 550rpx;
 
-		.canvastishi {
-			font-size: 32rpx;
-			position: absolute;
-			top: 50%;
-			left: 50%;
-			margin-left: -64rpx;
-			margin-top: -21rpx;
+  .canvastishi {
+    font-size: 32rpx;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin-left: -64rpx;
+    margin-top: -21rpx;
 
-			.dataloading:after {
-				overflow: hidden;
-				display: inline-block;
-				vertical-align: bottom;
-				animation: ellipsis 2s infinite;
-				content: "\2026";
-			}
+    .dataloading:after {
+      overflow: hidden;
+      display: inline-block;
+      vertical-align: bottom;
+      animation: ellipsis 2s infinite;
+      content: '\2026';
+    }
 
-			@keyframes ellipsis {
-				from {
-					width: 2px;
-				}
+    @keyframes ellipsis {
+      from {
+        width: 2px;
+      }
 
-				to {
-					width: 15px;
-				}
-			}
-		}
-	}
+      to {
+        width: 15px;
+      }
+    }
+  }
+}
 
-	.condition {
-		display: flex;
-		flex-wrap: wrap;
-		width: 90%;
-		box-shadow: 0 0 10rpx #bcb9ca;
-		margin: 0 auto 30rpx;
+.condition {
+  display: flex;
+  flex-wrap: wrap;
+  width: 90%;
+  box-shadow: 0 0 10rpx #bcb9ca;
+  margin: 0 auto 30rpx;
 
-		.scroll-X {
-			width: 95%;
-			margin: 20rpx auto;
+  .scroll-X {
+    width: 95%;
+    margin: 20rpx auto;
 
-			.tr {
-				display: flex;
-				overflow: hidden;
+    .tr {
+      display: flex;
+      overflow: hidden;
 
-				.th,
-				.td {
-					display: inline-block;
-					padding: 5rpx;
-					width: 300rpx;
-					text-align: center;
-					height: 52rpx;
-					line-height: 52rpx;
-					border: 2rpx solid #f1f1f1;
-				}
-			}
+      .th,
+      .td {
+        display: inline-block;
+        padding: 5rpx;
+        width: 300rpx;
+        text-align: center;
+        height: 52rpx;
+        line-height: 52rpx;
+        border: 2rpx solid #f1f1f1;
+      }
+    }
 
-			.tr:nth-child(2n-1) {
-				background-color: #f5fff8;
-			}
+    .tr:nth-child(2n-1) {
+      background-color: #f5fff8;
+    }
 
-			.tr:first-child {
-				background-color: #57c878;
-				color: #fff;
-			}
-		}
+    .tr:first-child {
+      background-color: #57c878;
+      color: #fff;
+    }
+  }
 
-		.pagenumber {
-			display: flex;
-			margin: 20rpx auto;
+  .pagenumber {
+    display: flex;
+    margin: 20rpx auto;
 
-			button {
-				width: 150rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-				background-color: #57c878;
-				color: #ffffff;
-			}
+    button {
+      width: 150rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+      font-size: 26rpx;
+      text-align: center;
+      background-color: #57c878;
+      color: #ffffff;
+    }
 
-			.pagenumber_page {
-				width: 100rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-				font-size: 26rpx;
-				text-align: center;
-			}
-		}
-	}
-</style>
+    .pagenumber_page {
+      width: 100rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+      font-size: 26rpx;
+      text-align: center;
+    }
+  }
+}
+</style>

pages/equipList/index.vue

@@ -8,8 +8,14 @@
     <view class="textbox">
       <view class="inputs">
         <!-- <u-input v-model="imports" type="text" :border="true" /> -->
-        <u-search placeholder="请输入设备ID" v-model="imports" placeholder-color="#909696" :show-action="false"
-          search-icon-color="#909696" @input="searchinput">
+        <u-search
+          placeholder="请输入设备ID"
+          v-model="imports"
+          placeholder-color="#909696"
+          :show-action="false"
+          search-icon-color="#909696"
+          @input="searchinput"
+        >
         </u-search>
         <!-- <input type="text" value="" placeholder="请输入设备ID或设备名称" v-model="imports" @input="searchinput"
 					class="inputbox" :clearable="false" />
@@ -17,41 +23,77 @@
       </view>
       <view class="listbox">
         <view class="listbox_left">
-          <view :class="currents == index
-            ? 'listbox_left_item_act listbox_left_item'
-            : 'listbox_left_item'
-            " v-for="(item, index) in list" :key="index" @click="change(index)">
+          <view
+            :class="
+              currents == index
+                ? 'listbox_left_item_act listbox_left_item'
+                : 'listbox_left_item'
+            "
+            v-for="(item, index) in list"
+            :key="index"
+            @click="change(index)"
+          >
             {{ item.name }}
           </view>
         </view>
         <!-- <view class="list" @scroll='showOut' ref="sollo" id="list"> -->
-        <scroll-view :scroll-top="0" :scroll-y="true" class="list scroll-Y" @scrolltoupper="upper" @scrolltolower="lower"
-          @scroll="scroll">
-          <view class="list_item" v-for="(item, index) in eqlistdata" :key="index" @click="historys(item)">
+        <scroll-view
+          :scroll-top="0"
+          :scroll-y="true"
+          class="list scroll-Y"
+          @scrolltoupper="upper"
+          @scrolltolower="lower"
+          @scroll="scroll"
+        >
+          <view
+            class="list_item"
+            v-for="(item, index) in eqlistdata"
+            :key="index"
+            @click="historys(item)"
+          >
             <view class="list_item_top">
               <p class="p1">
-                <image :src="'http://www.hnyfwlw.com:8006/bigdata_app/image/fourMoodBase/' +
-                  type_id +
-                  '.png'
-                  " mode=""></image>
-                <view>{{ item.device_name == "" ? "--" : item.device_name }}</view>
+                <image
+                  :src="
+                    'http://www.hnyfwlw.com:8006/bigdata_app/image/fourMoodBase/' +
+                    type_id +
+                    '.png'
+                  "
+                  mode=""
+                ></image>
+                <view>{{
+                  item.device_name == '' ? '--' : item.device_name
+                }}</view>
               </p>
-              <p v-if="![11, 19, 20].includes(type_id)" :class="[item.is_online ? 'p2' : 'p_out']">
-                {{ item.is_online ? "在线" : "离线" }}
+              <p
+                v-if="![11, 19, 20].includes(type_id)"
+                :class="[item.is_online ? 'p2' : 'p_out']"
+              >
+                {{ item.is_online ? '在线' : '离线' }}
               </p>
             </view>
             <view class="list_item_text">
               <p>设备ID：{{ item.only_for_show || item.device_id }}</p>
               <p>
-                适配用户：{{ item.real_name == "" ? "无" : item.real_name }}
+                适配用户：{{ item.real_name == '' ? '无' : item.real_name }}
               </p>
-              <p>最新上报时间：{{ (item.uptime) | timeFormat() }}</p>
-              <p v-if="item.addtime === 0">添加设备时间：- -</p>
-              <p v-else>添加设备时间：{{ item.addtime | timeFormat() }}</p>
+              <p v-if="type_id == 40">最新上报时间：{{ item.uptime }}</p>
+              <p v-else>最新上报时间：{{ item.uptime | timeFormat() }}</p>
+              <p v-if="type_id == 40">添加设备时间：{{ item.addtime }}</p>
+              <span v-else>
+                <p v-if="item.addtime === 0">添加设备时间：- -</p>
+                <p v-else>添加设备时间：{{ item.addtime | timeFormat() }}</p>
+              </span>
               <p>设备已运行：{{ item.days }}天</p>
             </view>
-            <view class="list_item_btn" v-if="$QueryPermission(108) && ![13, 17, 18, 11, 19, 20, 14, 22, 25].includes(type_id)"
-              @click.stop="modification(item)">
+            <view
+              class="list_item_btn"
+              v-if="
+                $QueryPermission(108) &&
+                ![13, 17, 18, 11, 19, 20, 14, 22, 25].includes(type_id)
+              "
+              @click.stop="modification(item)"
+            >
               信息修改
             </view>
           </view>
@@ -68,18 +110,26 @@
 			</view>
 		</view> -->
     <view class="loading" v-if="loadingtf">
-      <image src="../../static/images/ajax-loader.gif" mode="" class="img"></image>
+      <image
+        src="../../static/images/ajax-loader.gif"
+        mode=""
+        class="img"
+      ></image>
     </view>
     <view class="top" v-if="isTop" @click="top">
-      <image :src="'http://www.hnyfwlw.com:8006/bigdata_app' +
-        '/image/6209a98f0cb3b5086f2ca36152c9269.png'
-        " mode=""></image>
+      <image
+        :src="
+          'http://www.hnyfwlw.com:8006/bigdata_app' +
+          '/image/6209a98f0cb3b5086f2ca36152c9269.png'
+        "
+        mode=""
+      ></image>
     </view>
   </view>
 </template>
 
 <script>
-import { Debounce, Throttle } from "../../util/anitthro.js";
+import { Debounce, Throttle } from '../../util/anitthro.js';
 export default {
   data() {
     return {
@@ -90,27 +140,55 @@ export default {
       size: 10,
       eqlistdata: [],
       isTop: false,
-	  device_model: 0,
+      device_model: 0,
       infoalter: false, // 权限设置,
       type_id: 0, //设备类型,
       imgpath: [],
       loadingtf: false,
       width: 0, //顶部搜索栏宽度
-      imports: "", //搜索设备ID
+      imports: '', //搜索设备ID
     };
   },
   methods: {
+    async getDeviceList(tf) {
+      const res = await this.$myRequest({
+        url: '/api/v2/iot/mobile/device/sf/zsrf/list/',
+        method: 'post',
+        data: {
+          pageSize: this.size,
+          pageNum: this.page,
+        },
+      });
+      this.loadingtf = false;
+      const eqlistdata = res || [];
+      eqlistdata.forEach((item) => {
+        const newtime = +new Date() / 1000;
+        const days = (newtime - item.addtime) / 60 / 60 / 24;
+        item.days = Math.round(days);
+        item.device_id = item.devCode;
+        item.uptime = item.devUpdateddate;
+        item.addtime = item.devCreateddate;
+        item.device_name = item.devName;
+        item.real_name = item.realName;
+        item.is_online = item.devStatus == 1 ? true : false;
+      });
+      this.eqlistdata = eqlistdata;
+    },
     async eqlist(tf) {
       //设备列表
       this.loadingtf = true;
+      if (this.type_id == 40) {
+        this.getDeviceList(tf);
+        return;
+      }
       const res = await this.$myRequest({
-        url: "/api/api_gateway?method=forecast.worm_lamp.lamp_list",
+        url: '/api/api_gateway?method=forecast.worm_lamp.lamp_list',
         data: {
           device_type_id: this.type_id,
           page: this.page,
           page_size: this.size,
           device_id: this.imports,
-		  device_model: this.device_model
+          device_model: this.device_model,
         },
       });
       this.loadingtf = false;
@@ -119,19 +197,18 @@ export default {
       } else {
         var newtime = +new Date() / 1000;
       }
-	  res.data.forEach(item => {
-		  let { uptime, addtime } = item;
-		  item.uptime = addtime;
-		  item.addtime = uptime;
-		  var days = (newtime - item.addtime) / 60 / 60 / 24;
-		  item.days = Math.round(days);
-	  })
+      res.data.forEach((item) => {
+        let { uptime, addtime } = item;
+        item.uptime = addtime;
+        item.addtime = uptime;
+        var days = (newtime - item.addtime) / 60 / 60 / 24;
+        item.days = Math.round(days);
+      });
       if (tf) {
         this.eqlistdata = this.eqlistdata.concat(res.data);
       } else {
         this.eqlistdata = res.data;
       }
-      console.log(this.eqlistdata);
       // for (var i = 0; i < this.eqlistdata.length; i++) {
       //   var days = (newtime - this.eqlistdata[i].addtime) / 60 / 60 / 24;
       //   this.eqlistdata[i].days = Math.round(days);
@@ -141,7 +218,7 @@ export default {
       //设备列表
       this.loadingtf = true;
       const res = await this.$myRequest({
-        url: "/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_list",
+        url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_list',
         data: {
           device_type_id: this.type_id,
           page: this.page,
@@ -160,13 +237,12 @@ export default {
         var days = (newtime - this.eqlistdata[i].addtime) / 60 / 60 / 24;
         this.eqlistdata[i].days = Math.round(days);
       }
-      console.log(res);
     },
     //camera.camera_manage.list_camera
     async camera() {
       //监控
       const res = await this.$myRequest({
-        url: "/api/api_gateway?method=camera.camera_manage.list_camera",
+        url: '/api/api_gateway?method=camera.camera_manage.list_camera',
         data: {
           page_size: 1,
         },
@@ -177,27 +253,25 @@ export default {
     async usertype() {
       //设备列表
       const res = await this.$myRequest({
-        url: "/api/api_gateway?method=home.homes.user_device_type",
+        url: '/api/api_gateway?method=home.homes.user_device_type',
       });
       console.log(res);
       for (var i = 0; i < res.length; i++) {
-        if (
-          res[i].type_name == "温室大棚"
-        ) {
+        if (res[i].type_name == '温室大棚') {
           continue;
         }
         var obj = {
           name: res[i].type_name,
           id: res[i].id,
-		  device_model: res[i].device_model,
-		  pur_id:res[i].pur_id
+          device_model: res[i].device_model,
+          pur_id: res[i].pur_id,
         };
         this.list.push(obj);
       }
-      console.log("设备列表11111111111111", this.list);
+      console.log('设备列表11111111111111', this.list);
       if (res.length) {
         this.type_id = this.list[0].id;
-		this.device_model = this.list[0].device_model;
+        this.device_model = this.list[0].device_model;
         if (this.list[0].id == 10) {
           this.xyeqlist();
         } else {
@@ -208,29 +282,29 @@ export default {
     change(index) {
       console.log(index);
       //头部导航栏的点击
-      this.imports = "";
+      this.imports = '';
       this.current = index;
       this.currents = index;
       this.page = 1;
       this.eqlistdata = [];
       this.type_id = this.list[index].id;
-	  this.device_model = this.list[index].device_model;
+      this.device_model = this.list[index].device_model;
       console.log(this.type_id);
       if (this.list[index].id == 10) {
         this.xyeqlist();
       } else {
         this.eqlist();
       }
-	  
     },
     clickRight() {
       //搜索
-      this.width = "90%";
+      this.width = '90%';
     },
     modification(item) {
+      console.log(item, 'itemimteitmetie');
       uni.navigateTo({
         url:
-          "./modification?data=" + JSON.stringify(item) + "&id=" + this.type_id,
+          './modification?data=' + JSON.stringify(item) + '&id=' + this.type_id,
       });
     },
     top() {
@@ -240,36 +314,36 @@ export default {
       });
     },
     historys(itemOld) {
-    	let item = JSON.parse(JSON.stringify(itemOld))
-    	console.log("item", item,this.type_id);
-		item.pur_id = this.list[this.current].pur_id
+      let item = JSON.parse(JSON.stringify(itemOld));
+      console.log('item', item, this.type_id);
+      item.pur_id = this.list[this.current].pur_id;
       switch (this.type_id) {
-		// 水肥新设备
-		case 22:
-		var obj = {};
-		obj.d_id = item.d_id;
-		obj.device_id = item.imei;
-		obj.is_online = item.is_online;
-		obj.lat = item.lat;
-		obj.lng = item.lng;
-		obj.equip_name = item.device_name;
-		obj.uptime = item.uptime;
-		uni.navigateTo({
-		  url: "../waterandfernew/details?shebei=" + JSON.stringify(obj),
-		});
-		break
+        // 水肥新设备
+        case 22:
+          var obj = {};
+          obj.d_id = item.d_id;
+          obj.device_id = item.imei;
+          obj.is_online = item.is_online;
+          obj.lat = item.lat;
+          obj.lng = item.lng;
+          obj.equip_name = item.device_name;
+          obj.uptime = item.uptime;
+          uni.navigateTo({
+            url: '../waterandfernew/details?shebei=' + JSON.stringify(obj),
+          });
+          break;
         // 病虫害可视监测
         case 14:
-		item.addtime = item.uptime;
+          item.addtime = item.uptime;
           uni.navigateTo({
-            url: "../cb/sy/detail?detail=" + JSON.stringify(item),
+            url: '../cb/sy/detail?detail=' + JSON.stringify(item),
           });
-          break
+          break;
         case 2:
-		item.addtime = item.uptime;
+          item.addtime = item.uptime;
           uni.navigateTo({
             url:
-              "../prevention/equipmentdetails?shebei=" + JSON.stringify(item),
+              '../prevention/equipmentdetails?shebei=' + JSON.stringify(item),
           });
           break;
         case 5:
@@ -283,80 +357,81 @@ export default {
           obj.equip_name = item.device_name;
           obj.uptime = item.uptime;
           uni.navigateTo({
-            url: "../environment/equipment?shebei=" + JSON.stringify(obj),
+            url: '../environment/equipment?shebei=' + JSON.stringify(obj),
           });
           break;
         case 6:
           uni.navigateTo({
             url:
-              "/pages/webview?device_id=" +
+              '/pages/webview?device_id=' +
               item.imei +
-              "&accessToken=" +
+              '&accessToken=' +
               this.accessToken,
           });
           break;
         case 3:
-		item.addtime = item.uptime;
+          item.addtime = item.uptime;
           item.type = this.type_id;
           uni.navigateTo({
-            url: "../cb/equip-detail/equip-detail?info=" + JSON.stringify(item),
+            url: '../cb/equip-detail/equip-detail?info=' + JSON.stringify(item),
+          });
+          break;
+        case 28:
+          item.addtime = item.uptime;
+          item.type = this.type_id;
+          uni.navigateTo({
+            url: '../cb/smallPest/smallPest?info=' + JSON.stringify(item),
           });
           break;
-		case 28:
-		item.addtime = item.uptime;
-		item.type = this.type_id;
-		uni.navigateTo({
-			url: "../cb/smallPest/smallPest?info=" + JSON.stringify(item),
-		});
-	  break; 
         case 4:
-		item.addtime = item.uptime;
+          item.addtime = item.uptime;
+          item.type = this.type_id;
+          uni.navigateTo({
+            url: '../cb/equip-detail/equip-detail?info=' + JSON.stringify(item),
+          });
+          break;
+        case 32:
+        case 33:
+        case 34:
+        case 35:
+          item.addtime = item.uptime;
           item.type = this.type_id;
           uni.navigateTo({
-            url: "../cb/equip-detail/equip-detail?info=" + JSON.stringify(item),
-          }); 
+            url:
+              '../cb/equip-detail/equip-detail-new?info=' +
+              JSON.stringify(item),
+          });
           break;
-		case 32:
-		case 33:
-		case 34:
-		case 35:
-		
-		item.addtime = item.uptime;
-		  item.type = this.type_id;
-		  uni.navigateTo({
-		    url: "../cb/equip-detail/equip-detail-new?info=" + JSON.stringify(item),
-		  }); 
-		  break;  
         case 7:
-		item.addtime = item.uptime;
+          item.addtime = item.uptime;
           item.type = this.type_id;
           uni.navigateTo({
-            url: "../cb/equip-detail/equip-detail?info=" + JSON.stringify(item),
+            url: '../cb/equip-detail/equip-detail?info=' + JSON.stringify(item),
           });
           break;
         case 8:
           // item.type = this.type_id;
           uni.navigateTo({
-            url: "../cb/thxydetail/thxydetail?imei=" + item.imei
+            url: '../cb/thxydetail/thxydetail?imei=' + item.imei,
+          });
+          break;
+        case 29:
+          // item.type = this.type_id;
+          uni.navigateTo({
+            url: `../cb/nlNewXy/nlNewXy?imei=${item.imei}&showId=${item.only_for_show}`,
+          });
+          break;
+        case 24:
+          // item.type = this.type_id;
+          uni.navigateTo({
+            url: '../cb/zjxydetail/thxydetail?imei=' + item.imei,
           });
           break;
-		  case 29:
-		    // item.type = this.type_id;
-		    uni.navigateTo({
-		      url: `../cb/nlNewXy/nlNewXy?imei=${item.imei}&showId=${item.only_for_show}`
-		    });
-		    break;
-		  case 24:
-		    // item.type = this.type_id;
-		    uni.navigateTo({
-		      url: "../cb/zjxydetail/thxydetail?imei=" + item.imei
-		    });
-		    break;
         case 12:
           console.log(item);
-		  item.addtime = item.uptime;
+          item.addtime = item.uptime;
           uni.navigateTo({
-            url: "../cb/xctdetail/xctdetail?info=" + JSON.stringify(item),
+            url: '../cb/xctdetail/xctdetail?info=' + JSON.stringify(item),
           });
           break;
         case 13:
@@ -370,7 +445,7 @@ export default {
           obj.equip_name = item.device_name;
           obj.uptime = item.uptime;
           uni.navigateTo({
-            url: "../waterandfer/datails?shebei=" + JSON.stringify(obj),
+            url: '../waterandfer/datails?shebei=' + JSON.stringify(obj),
           });
           break;
         case 15:
@@ -384,7 +459,7 @@ export default {
           obj.equip_name = item.device_name;
           obj.uptime = item.uptime;
           uni.navigateTo({
-            url: "../environment/gsequipment?shebei=" + JSON.stringify(obj),
+            url: '../environment/gsequipment?shebei=' + JSON.stringify(obj),
           });
           break;
         case 17:
@@ -394,7 +469,7 @@ export default {
           obj.device_id = item.imei;
           obj.is_online = item.is_online;
           uni.navigateTo({
-            url: "../cb/shuifeiL/shuifeiL?detail=" + JSON.stringify(obj),
+            url: '../cb/shuifeiL/shuifeiL?detail=' + JSON.stringify(obj),
           });
           break;
         case 11:
@@ -409,7 +484,7 @@ export default {
           obj.location = item.address;
           obj.type = 11;
           uni.navigateTo({
-            url: "../disease/cmb?shebei=" + JSON.stringify(obj),
+            url: '../disease/cmb?shebei=' + JSON.stringify(obj),
           });
           break;
         case 19:
@@ -424,7 +499,7 @@ export default {
           obj.location = item.address;
           obj.type = 19;
           uni.navigateTo({
-            url: "../disease/cmb?shebei=" + JSON.stringify(obj),
+            url: '../disease/cmb?shebei=' + JSON.stringify(obj),
           });
           break;
         case 20:
@@ -439,7 +514,7 @@ export default {
           obj.location = item.address;
           obj.type = 20;
           uni.navigateTo({
-            url: "../disease/cmb?shebei=" + JSON.stringify(obj),
+            url: '../disease/cmb?shebei=' + JSON.stringify(obj),
           });
           break;
         case 21:
@@ -454,50 +529,56 @@ export default {
           obj.location = item.address;
           obj.type = 21;
           uni.navigateTo({
-            url: "../disease/cmb?shebei=" + JSON.stringify(obj),
+            url: '../disease/cmb?shebei=' + JSON.stringify(obj),
+          });
+          break;
+        case 26:
+          var obj = {};
+          obj.d_id = item.d_id;
+          obj.device_id = item.imei;
+          obj.is_online = item.is_online;
+          obj.lat = item.lat;
+          obj.lng = item.lng;
+          obj.equip_name = item.device_name;
+          obj.uptime = item.uptime;
+          obj.location = item.address;
+          obj.type = 26;
+          uni.navigateTo({
+            url: '../disease/cmb?shebei=' + JSON.stringify(obj),
+          });
+          break;
+        case 27:
+          var obj = {};
+          obj.d_id = item.d_id;
+          obj.device_id = item.imei;
+          obj.is_online = item.is_online;
+          obj.lat = item.lat;
+          obj.lng = item.lng;
+          obj.equip_name = item.device_name;
+          obj.uptime = item.uptime;
+          obj.location = item.address;
+          obj.type = 26;
+          uni.navigateTo({
+            url: '../disease/mls/mls?shebei=' + JSON.stringify(obj),
+          });
+          break;
+        case 25:
+          item.addtime = item.uptime;
+          uni.navigateTo({
+            url: '../cb/xylps/detail?detail=' + JSON.stringify(item),
+          });
+          break;
+        case 40:
+          item.addtime = item.uptime;
+          uni.navigateTo({
+            url: `../cb/shuifeizs/detail?devBid=${item.devBid}`,
           });
           break;
-		  case 26:
-		    var obj = {};
-		    obj.d_id = item.d_id;
-		    obj.device_id = item.imei;
-		    obj.is_online = item.is_online;
-		    obj.lat = item.lat;
-		    obj.lng = item.lng;
-		    obj.equip_name = item.device_name;
-		    obj.uptime = item.uptime;
-		    obj.location = item.address;
-		    obj.type = 26;
-		    uni.navigateTo({
-		      url: "../disease/cmb?shebei=" + JSON.stringify(obj),
-		    });
-		    break;
-			case 27:
-			  var obj = {};
-			  obj.d_id = item.d_id;
-			  obj.device_id = item.imei;
-			  obj.is_online = item.is_online;
-			  obj.lat = item.lat;
-			  obj.lng = item.lng;
-			  obj.equip_name = item.device_name;
-			  obj.uptime = item.uptime;
-			  obj.location = item.address;
-			  obj.type = 26;
-			  uni.navigateTo({
-			    url: "../disease/mls/mls?shebei=" + JSON.stringify(obj),
-			  });
-			  break;
-		  case 25:
-			item.addtime = item.uptime;
-		    uni.navigateTo({
-		      url:  "../cb/xylps/detail?detail=" + JSON.stringify(item),
-		    });
-		    break;
         default:
-			item.addtime = item.uptime;
+          item.addtime = item.uptime;
           item.type = this.type_id;
           uni.navigateTo({
-            url: "../cb/xy2.0/particulars?info=" + JSON.stringify(item),
+            url: '../cb/xy2.0/particulars?info=' + JSON.stringify(item),
           });
           break;
       }
@@ -526,9 +607,8 @@ export default {
     scrollTop(e) {
       console.log(e);
     },
-    upper() { },
+    upper() {},
     lower() {
-      
       this.page++;
       if (this.type_id == 10) {
         this.xyeqlist(true);
@@ -536,7 +616,7 @@ export default {
         this.eqlist(true);
       }
     },
-    scroll() { },
+    scroll() {},
   },
   onLoad() {
     // this.list = [];
@@ -547,16 +627,16 @@ export default {
     // this.usertype();
     // this.width = 0;
   },
-  onTabItemTap (e) {
-	  // console.log(e);
-	this.eqlistdata = [];
-  	this.list = [];
-  	this.camera();
-  	this.current = 0;
-  	this.currents = 0;
-  	this.page = 1;
-  	this.usertype();
-  	this.width = 0;
+  onTabItemTap(e) {
+    // console.log(e);
+    this.eqlistdata = [];
+    this.list = [];
+    this.camera();
+    this.current = 0;
+    this.currents = 0;
+    this.page = 1;
+    this.usertype();
+    this.width = 0;
   },
   onReachBottom() {
     this.page++;
@@ -583,7 +663,7 @@ page {
   background-color: #00b075;
 }
 
-/deep/.uni-icons {
+::v-deep .uni-icons {
   font-size: 40rpx !important;
 }
 
@@ -600,13 +680,13 @@ page {
 }
 
 .inputs {
-	width: 95%;
-	margin: 0 auto;
-  /deep/.u-content {
+  width: 95%;
+  margin: 0 auto;
+  ::v-deep .u-content {
     background-color: #fff !important;
   }
 
-  /deep/.uni-input-wrapper {
+  ::v-deep .uni-input-wrapper {
     background-color: #fff !important;
   }
 }
@@ -734,7 +814,7 @@ page {
         font-size: 24rpx;
         color: #636363;
         margin-top: 10rpx;
-		word-break: break-all;
+        word-break: break-all;
       }
 
       p:first-child {

pages/equipList/modification.vue

@@ -1,244 +1,283 @@
 <template>
-	<view>
-		<view class="">
-			<view class="mod">
-				<view class="mod_name">
-					<p><span style="color: #ff0000;" v-if="quanxian.namealter">*</span>设备名称</p>
-					<input type="text" v-model="moddata.device_name" :class="quanxian.namealter?'namebg':''" :disabled="!quanxian.namealter"/>
-				</view>
-				<view class="mod_id">
-					<p>设备ID</p>
-					<input type="text" :value="moddata.imei || moddata.device_id" disabled />
-				</view>
-				<view class="mod_user">
-					<p>适配用户</p>
-					<input type="text" :value="moddata.real_name==''?'无':moddata.real_name" disabled />
-				</view>
-				<view class="mod_city" @click="amendcity" v-if="$QueryPermission(109)">
-					<p><span style="color: #ff0000;" v-if="quanxian.cityalter">*</span>设备位置</p>
-					<view style="display: flex;">
-						<input type="text" :value="city" disabled style="width: 400rpx;" />
-						<u-icon name="arrow-right"></u-icon>
-					</view>
-				</view>
-				<view class="mod_time">
-					<p>设备添加时间</p>
-					<input type="text" :value="moddata.addtime|timeFormat()" disabled />
-				</view>
-				<p style="width: 90%;margin: 0 auto;text-align: right;color: #06B535;"><span style="color: #ff0000;">*</span>为可修改</p>
-				<view class="sub" v-if="quanxian.infoalter" @click="btn">
-					提 交
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+    <view class="">
+      <view class="mod">
+        <view class="mod_name">
+          <p>
+            <span style="color: #ff0000" v-if="quanxian.namealter">*</span
+            >设备名称
+          </p>
+          <input
+            type="text"
+            v-model="moddata.device_name"
+            :class="quanxian.namealter ? 'namebg' : ''"
+            :disabled="!quanxian.namealter"
+          />
+        </view>
+        <view class="mod_id">
+          <p>设备ID</p>
+          <input
+            type="text"
+            :value="moddata.imei || moddata.device_id"
+            disabled
+          />
+        </view>
+        <view class="mod_user">
+          <p>适配用户</p>
+          <input
+            type="text"
+            :value="moddata.real_name == '' ? '无' : moddata.real_name"
+            disabled
+          />
+        </view>
+        <view class="mod_city" @click="amendcity" v-if="$QueryPermission(109)">
+          <p>
+            <span style="color: #ff0000" v-if="quanxian.cityalter">*</span
+            >设备位置
+          </p>
+          <view style="display: flex">
+            <input type="text" :value="city" disabled style="width: 400rpx" />
+            <u-icon name="arrow-right"></u-icon>
+          </view>
+        </view>
+        <view class="mod_time">
+          <p>设备添加时间</p>
+          <input
+            type="text"
+            :value="moddata.addtime | timeFormat()"
+            disabled
+            v-if="moddata.addtime"
+          />
+        </view>
+        <p
+          style="width: 90%; margin: 0 auto; text-align: right; color: #06b535"
+        >
+          <span style="color: #ff0000">*</span>为可修改
+        </p>
+        <view class="sub" v-if="quanxian.infoalter" @click="btn"> 提 交 </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				moddata: [],
-				city: "",
-				selectcityTF: false,
-				quanxian:{
-					namealter:false,
-					cityalter:false,
-					infoalter:false
-				}
-			}
-		},
-		methods: {
-			async eqlistcity(lat, lng) { //修改设备定位
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.revise_device_lnglat',
-					data: {
-						device_id: this.moddata.imei,
-						lat: lat,
-						lng: lng
-					}
-				})
-				console.log(res)
-				if (res==false) {
-					uni.showToast({
-						title: "修改地址失败",
-						icon: "none"
-					})
-				}else{
-					uni.showToast({
-						title: "修改地址成功",
-						icon: "none"
-					})
-				}
-			},
-			async eqlistname() { //修改设备名称
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.revise_device',
-					data: {
-						device_id: this.moddata.imei,
-						device_name: this.moddata.device_name,
-					}
-				})
-				console.log(res)
-				if (res==false) {
-					uni.showToast({
-						title: "修改名称失败",
-						icon: "none"
-					})
-				}else{
-					uni.showToast({
-						title: "修改名称成功",
-						icon: "none"
-					})
-					uni.removeStorage({
-						key: "location"
-					})
-					this.clickLeft()
-				}
-			},
-			async eqlistuser(id, imei) { //获取设备信息
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.lamp_list',
-					data: {
-						device_type_id: id,
-						device_id: imei,
-					}
-				})
-				this.moddata = res.data[0]
-				console.log(res)
-				this.selectaddress(this.moddata.lng, this.moddata.lat)
-			},
-			async xyeqlistuser(imei) { //获取设备信息
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_list',
-					data: {
-						device_id: imei,
-					}
-				})
-				console.log(res)
-				this.moddata = res.data[0]
-				this.selectaddress(this.moddata.lng, this.moddata.lat)
-			},
-			btn() {
-				this.eqlistcity(this.moddata.lat, this.moddata.lng)
-				this.eqlistname()
-			},
-			clickLeft() {
-				uni.navigateBack({
-					delta:1
-				})
-			},
-			amendcity() { //修改设备地址
-				if(this.quanxian.cityalter){
-					this.selectcityTF = true
-					uni.navigateTo({
-						url: "../fourBase/city"
-					})
-				}else{
-					uni.showToast({
-						title: "您暂无权限进行此操作，如有需要，请联系管理员",
-						icon: "none"
-					})
-				}
-			},
-			selectaddress(lng, lat) { //获取分布位置
-				uni.request({
-					type: "GET",
-					url: "https://restapi.amap.com/v3/geocode/regeo?output=JSON&location=" + lng + "," + lat +
-						"&key=78ce288400f4fc6d9458989875c833c2&radius=1000&extensions=all",
-					dataType: "json",
-					complete: ress => {
-						// console.log(ress)
-						if (ress.data.regeocode.formatted_address.length == 0) {
-							this.city = "--"
-						} else {
-							this.city = ress.data.regeocode.formatted_address
-						}
-					}
-				});
-			},
-		},
-		onLoad(option) {
-			console.log(option)
-			if(option.id==10){
-				this.xyeqlistuser(JSON.parse(option.data).device_id)
-			}else{
-				this.eqlistuser(option.id, JSON.parse(option.data).imei)
-			}
-			uni.getStorage({
-				key:"jurisdiction",
-				success:(res)=>{
-					console.log(JSON.parse(res.data))
-					let items = JSON.parse(res.data).filter((item)=>{
-						return item.purview_name == "设备管理"
-					})
-					let items2 = items[0].children.filter((item)=>{
-						return item.purview_name == "设备列表"
-					})
-					this.quanxian.namealter = items2[0].children.some((item)=>{
-						return item.purview_name == "修改名称"
-					})
-					this.quanxian.cityalter = items2[0].children.some((item)=>{
-						return item.purview_name == "添加位置"
-					})
-					this.quanxian.infoalter = items2[0].children.some((item)=>{
-						return item.purview_name == "修改名称" || item.purview_name == "添加位置"
-					})
-				},
-			})
-		},
-		onShow(){
-			uni.getStorage({
-				key: "location",
-				success: (res) => {
-					this.moddata.lat = res.data[1]
-					this.moddata.lng = res.data[0]
-					this.selectaddress(this.moddata.lng, this.moddata.lat)
-				}
-			})
-		}
-	}
+export default {
+  data() {
+    return {
+      moddata: [],
+      city: '',
+      selectcityTF: false,
+      quanxian: {
+        namealter: false,
+        cityalter: false,
+        infoalter: false,
+      },
+    };
+  },
+  methods: {
+    async eqlistcity(lat, lng) {
+      //修改设备定位
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.revise_device_lnglat',
+        data: {
+          device_id: this.moddata.imei,
+          lat: lat,
+          lng: lng,
+        },
+      });
+      console.log(res);
+      if (res == false) {
+        uni.showToast({
+          title: '修改地址失败',
+          icon: 'none',
+        });
+      } else {
+        uni.showToast({
+          title: '修改地址成功',
+          icon: 'none',
+        });
+      }
+    },
+    async eqlistname() {
+      //修改设备名称
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.revise_device',
+        data: {
+          device_id: this.moddata.imei,
+          device_name: this.moddata.device_name,
+        },
+      });
+      console.log(res);
+      if (res == false) {
+        uni.showToast({
+          title: '修改名称失败',
+          icon: 'none',
+        });
+      } else {
+        uni.showToast({
+          title: '修改名称成功',
+          icon: 'none',
+        });
+        uni.removeStorage({
+          key: 'location',
+        });
+        this.clickLeft();
+      }
+    },
+    async eqlistuser(id, imei) {
+      //获取设备信息
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.lamp_list',
+        data: {
+          device_type_id: id,
+          device_id: imei,
+        },
+      });
+      this.moddata = res.data[0];
+      console.log(res);
+      this.selectaddress(this.moddata.lng, this.moddata.lat);
+    },
+    async xyeqlistuser(imei) {
+      //获取设备信息
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_list',
+        data: {
+          device_id: imei,
+        },
+      });
+      console.log(res);
+      this.moddata = res.data[0];
+      this.selectaddress(this.moddata.lng, this.moddata.lat);
+    },
+    btn() {
+      this.eqlistcity(this.moddata.lat, this.moddata.lng);
+      this.eqlistname();
+    },
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    amendcity() {
+      //修改设备地址
+      if (this.quanxian.cityalter) {
+        this.selectcityTF = true;
+        uni.navigateTo({
+          url: '../fourBase/city',
+        });
+      } else {
+        uni.showToast({
+          title: '您暂无权限进行此操作，如有需要，请联系管理员',
+          icon: 'none',
+        });
+      }
+    },
+    selectaddress(lng, lat) {
+      //获取分布位置
+      uni.request({
+        type: 'GET',
+        url:
+          'https://restapi.amap.com/v3/geocode/regeo?output=JSON&location=' +
+          lng +
+          ',' +
+          lat +
+          '&key=78ce288400f4fc6d9458989875c833c2&radius=1000&extensions=all',
+        dataType: 'json',
+        complete: (ress) => {
+          // console.log(ress)
+          if (ress.data.regeocode.formatted_address.length == 0) {
+            this.city = '--';
+          } else {
+            this.city = ress.data.regeocode.formatted_address;
+          }
+        },
+      });
+    },
+  },
+  onLoad(option) {
+    if (option.id == 10) {
+      this.xyeqlistuser(JSON.parse(option.data).device_id);
+    } else if (option.id == 40) {
+      this.eqlistuser(option.id, JSON.parse(option.data).devCode);
+    } else {
+      this.eqlistuser(option.id, JSON.parse(option.data).imei);
+    }
+    uni.getStorage({
+      key: 'jurisdiction',
+      success: (res) => {
+        console.log(JSON.parse(res.data));
+        let items = JSON.parse(res.data).filter((item) => {
+          return item.purview_name == '设备管理';
+        });
+        let items2 = items[0].children.filter((item) => {
+          return item.purview_name == '设备列表';
+        });
+        this.quanxian.namealter = items2[0].children.some((item) => {
+          return item.purview_name == '修改名称';
+        });
+        this.quanxian.cityalter = items2[0].children.some((item) => {
+          return item.purview_name == '添加位置';
+        });
+        this.quanxian.infoalter = items2[0].children.some((item) => {
+          return (
+            item.purview_name == '修改名称' || item.purview_name == '添加位置'
+          );
+        });
+      },
+    });
+  },
+  onShow() {
+    uni.getStorage({
+      key: 'location',
+      success: (res) => {
+        this.moddata.lat = res.data[1];
+        this.moddata.lng = res.data[0];
+        this.selectaddress(this.moddata.lng, this.moddata.lat);
+      },
+    });
+  },
+};
 </script>
 
 <style lang="scss">
-	page{
-		background-color: #FAFAFA;
-	}
-	.mod {
-		width: 100%;
-		padding-top: 30rpx;
-		.mod_name,
-		.mod_id,
-		.mod_user,
-		.mod_time,
-		.mod_city {
-			width: 90%;
-			margin: 0 auto 30rpx;
-			display: flex;
-			justify-content: space-between;
-			background-color: #FFFFFF;
-			padding: 20rpx 10rpx;
-			color: #57C77A;
-			line-height: 50rpx;
-			.namebg{
-				background-color: #FAFAFA;
-			}
-			input {
-				text-align: right;
-				font-size: 28rpx;
-				padding: 10rpx;
-			}
-		}
-	}
+page {
+  background-color: #fafafa;
+}
+.mod {
+  width: 100%;
+  padding-top: 30rpx;
+  .mod_name,
+  .mod_id,
+  .mod_user,
+  .mod_time,
+  .mod_city {
+    width: 90%;
+    margin: 0 auto 30rpx;
+    display: flex;
+    justify-content: space-between;
+    background-color: #ffffff;
+    padding: 20rpx 10rpx;
+    color: #57c77a;
+    line-height: 50rpx;
+    .namebg {
+      background-color: #fafafa;
+    }
+    input {
+      text-align: right;
+      font-size: 28rpx;
+      padding: 10rpx;
+    }
+  }
+}
 
-	.sub {
-		width: 90%;
-		margin: 30rpx auto;
-		text-align: center;
-		height: 70rpx;
-		line-height: 70rpx;
-		background-color: #57C77A;
-		border-radius: 35rpx;
-		color: #FFFFFF;
-	}
+.sub {
+  width: 90%;
+  margin: 30rpx auto;
+  text-align: center;
+  height: 70rpx;
+  line-height: 70rpx;
+  background-color: #57c77a;
+  border-radius: 35rpx;
+  color: #ffffff;
+}
 </style>

pages/equipMange/index/index.vue

@@ -1,271 +1,309 @@
 <template>
-	<view class="">
-		<view class="status_bar"></view>
-		<view class="" style="position: relative;top: 44px;">
-			<view style="position: fixed;z-index: 100;">
-				<!-- <uni-nav-bar left-icon="back" left-text="返回" right-icon="plus" title="用户管理" @clickRight="clickRight" @clickLeft="clickLeft"></uni-nav-bar> -->
-				<uni-nav-bar left-icon="back" left-text="返回"  title="用户管理" @clickLeft="clickLeft"></uni-nav-bar>
-			</view>
-			<view class="uinput-box">
-				<view class="uinputs">
-					<u-input v-model="argument.username" :type="type" :border="border" placeholder="请输入用户名称" input-align="center"
-					 :clearable="border" :custom-style="uinputstyle" @input="searchinput" />
-					<u-icon name="search" class="search" size="30" @click="search"></u-icon>
-				</view>
-			</view>
-			<view class="userlists">
-				<view class="userlist-li" v-for="(item,index) in userlists" :kex="index">
-					<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/fourMoodBase/touxiang.png'" mode=""></image>
-					<p class="userlist-li-city">{{item.username}}</p>
-					<p class="userlist-li-eamil">{{item.mobile}}</p>
-					<view class="loginbox">
-						<p class="loginp" @click="userloginbtn(item)">一键登录</p>
-						<!-- <p class="logininfo" @click="userOperation(item)">查看详情</p> -->
-					</view>
-				</view>
-			</view>
-		</view> 
-		<view class="top" v-if="isTop" @click="top">
-			<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/6209a98f0cb3b5086f2ca36152c9269.png'" mode=""></image>
-		</view>
-	</view>
+  <view class="">
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view style="position: fixed; z-index: 100">
+        <!-- <uni-nav-bar left-icon="back" left-text="返回" right-icon="plus" title="用户管理" @clickRight="clickRight" @clickLeft="clickLeft"></uni-nav-bar> -->
+        <uni-nav-bar
+          left-icon="back"
+          left-text="返回"
+          title="用户管理"
+          @clickLeft="clickLeft"
+        ></uni-nav-bar>
+      </view>
+      <view class="uinput-box">
+        <view class="uinputs">
+          <u-input
+            v-model="argument.username"
+            :type="type"
+            :border="border"
+            placeholder="请输入用户名称"
+            input-align="center"
+            :clearable="border"
+            :custom-style="uinputstyle"
+            @input="searchinput"
+          />
+          <u-icon
+            name="search"
+            class="search"
+            size="30"
+            @click="search"
+          ></u-icon>
+        </view>
+      </view>
+      <view class="userlists">
+        <view
+          class="userlist-li"
+          v-for="(item, index) in userlists"
+          :kex="index"
+        >
+          <image
+            :src="
+              'http://www.hnyfwlw.com:8006/bigdata_app' +
+              '/image/fourMoodBase/touxiang.png'
+            "
+            mode=""
+          ></image>
+          <p class="userlist-li-city">{{ item.username }}</p>
+          <p class="userlist-li-eamil">{{ item.mobile }}</p>
+          <view class="loginbox">
+            <p class="loginp" @click="userloginbtn(item)">一键登录</p>
+            <!-- <p class="logininfo" @click="userOperation(item)">查看详情</p> -->
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="top" v-if="isTop" @click="top">
+      <image
+        :src="
+          'http://www.hnyfwlw.com:8006/bigdata_app' +
+          '/image/6209a98f0cb3b5086f2ca36152c9269.png'
+        "
+        mode=""
+      ></image>
+    </view>
+  </view>
 </template>
 
 <script>
-	import {
-		Debounce,
-		Throttle
-	} from "../../../util/anitthro.js"
-	export default {
-		data() {
-			return {
-				value: '',
-				type: 'text',
-				border: false,
-				uinputstyle: {
-					"margin": "16rpx 0",
-					'background': "#f3f3f3",
-					"border-radius": "25px"
-				},
-				userlists: [],
-				argument: {
-					page: 1,
-					page_size: 10,
-					username: ''
-				},
-				isTop:false,
-				addtf:false
-			}
-		},
-		methods: {
-			async getState(argument) {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=user.login.users_info',
-					data: {
-						page: argument.page,
-						page_size: argument.page_size,
-						username: argument.username
-					}
-				})
-				this.userlists = this.userlists.concat(res.data)
-				console.log(this.userlists)
-			},
-			async userlogin(uid) {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=user.login.auto_login',
-					data: {
-						uid
-					}
-				})
-				let session_key = res.session_key
-				uni.setStorage({
-					key: 'session_key',
-					data: session_key,
-					success: () => {
-						uni.switchTab({
-							url: "../../index/index"
-						})
-						uni.showToast({
-							title: "登录成功！",
-							icon: "none"
-						})
-					}
-				})
-			},
-			clickRight() { //跳转增加用户页面
-				if(this.addtf){
-					uni.navigateTo({
-						url: './addusers',
-					})
-				}else{
-					uni.showToast({
-						title: "您暂无权限进行此操作，如有需要，请联系管理员",
-						icon: "none"
-					})
-				}
-			},
-			clickLeft(){
-				uni.switchTab({
-					url:"../../index/index"
-				})
-			},
-			userOperation(item) { //跳转用户信息页面
-				item = JSON.stringify(item)
-				uni.navigateTo({
-					url: './useroperation?item=' + item,
-				})
-			},
-			userloginbtn(item){//一键登录
-				this.userlogin(item.uid)
-			},
-			search() { //搜索用户
-				this.userlists = []
-				this.getState(this.argument)
-			},
-			searchinput() {
-				this.argument.page=1
-				Debounce(() => {
-					this.userlists = []
-					this.getState(this.argument)
-				}, 1000)()
-			},
-			top() {
-				uni.pageScrollTo({
-					scrollTop: 0,
-					duration: 500
-				})
-			}
-		}, //user.login.users_info
-		onLoad() {
-			this.getState(this.argument)
-			uni.getStorage({
-				key:"jurisdiction",
-				success:(res)=>{
-					console.log(JSON.parse(res.data))
-					let items = JSON.parse(res.data).filter((item)=>{
-						return item.pur_id == 28//"系统管理"
-					})
-					let items2 = items[0].children.filter((item)=>{
-						return item.pur_id == 29//"用户管理"
-					})
-					var arr = items2[0].children
-					console.log(arr)
-					for(var i =0;i<arr.length;i++){
-						switch (arr[i].pur_id){
-							case 116://"添加用户"
-								this.addtf = true
-								break
-						}
-					}
-				},
-			})
-		},
-		onReachBottom() {
-			this.argument.page++
-			this.getState(this.argument)
-		},
-		onPullDownRefresh() {
-			this.getState(this.argument)
-			setTimeout(function() {
-				uni.stopPullDownRefresh(); //停止下拉刷新动画
-			}, 1000);
-		},
-		onBackPress(options) {
-			if (options.from === 'navigateBack') {
-				return false;
-			}
-			this.clickLeft();
-			return true;
-		},
-		onPageScroll(e) { //nvue暂不支持滚动监听，可用bindingx代替
-			if (e.scrollTop > 200) { //距离大于200时显示
-				this.isTop = true
-			} else { //距离小于200时隐藏
-				this.isTop = false
-			}
-		},
-	}
+import { Debounce, Throttle } from '../../../util/anitthro.js';
+export default {
+  data() {
+    return {
+      value: '',
+      type: 'text',
+      border: false,
+      uinputstyle: {
+        margin: '16rpx 0',
+        background: '#f3f3f3',
+        'border-radius': '25px',
+      },
+      userlists: [],
+      argument: {
+        page: 1,
+        page_size: 10,
+        username: '',
+      },
+      isTop: false,
+      addtf: false,
+    };
+  },
+  methods: {
+    async getState(argument) {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=user.login.users_info',
+        data: {
+          page: argument.page,
+          page_size: argument.page_size,
+          username: argument.username,
+        },
+      });
+      this.userlists = this.userlists.concat(res.data);
+      console.log(this.userlists);
+    },
+    async userlogin(uid) {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=user.login.auto_login',
+        data: {
+          uid,
+        },
+      });
+      let session_key = res.session_key;
+      uni.setStorage({
+        key: 'session_key',
+        data: session_key,
+        success: () => {
+          uni.switchTab({
+            url: '../../index/index',
+          });
+          uni.showToast({
+            title: '登录成功！',
+            icon: 'none',
+          });
+        },
+      });
+    },
+    clickRight() {
+      //跳转增加用户页面
+      if (this.addtf) {
+        uni.navigateTo({
+          url: './addusers',
+        });
+      } else {
+        uni.showToast({
+          title: '您暂无权限进行此操作，如有需要，请联系管理员',
+          icon: 'none',
+        });
+      }
+    },
+    clickLeft() {
+      uni.switchTab({
+        url: '../../index/index',
+      });
+    },
+    userOperation(item) {
+      //跳转用户信息页面
+      item = JSON.stringify(item);
+      uni.navigateTo({
+        url: './useroperation?item=' + item,
+      });
+    },
+    userloginbtn(item) {
+      //一键登录
+      this.userlogin(item.uid);
+    },
+    search() {
+      //搜索用户
+      this.userlists = [];
+      this.getState(this.argument);
+    },
+    searchinput() {
+      this.argument.page = 1;
+      Debounce(() => {
+        this.userlists = [];
+        this.getState(this.argument);
+      }, 1000)();
+    },
+    top() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 500,
+      });
+    },
+  }, //user.login.users_info
+  onLoad() {
+    this.getState(this.argument);
+    uni.getStorage({
+      key: 'jurisdiction',
+      success: (res) => {
+        console.log(JSON.parse(res.data));
+        let items = JSON.parse(res.data).filter((item) => {
+          return item.pur_id == 28; //"系统管理"
+        });
+        let items2 = items[0].children.filter((item) => {
+          return item.pur_id == 29; //"用户管理"
+        });
+        var arr = items2[0].children;
+        console.log(arr);
+        for (var i = 0; i < arr.length; i++) {
+          switch (arr[i].pur_id) {
+            case 116: //"添加用户"
+              this.addtf = true;
+              break;
+          }
+        }
+      },
+    });
+  },
+  onReachBottom() {
+    this.argument.page++;
+    this.getState(this.argument);
+  },
+  onPullDownRefresh() {
+    this.getState(this.argument);
+    setTimeout(function () {
+      uni.stopPullDownRefresh(); //停止下拉刷新动画
+    }, 1000);
+  },
+  onBackPress(options) {
+    if (options.from === 'navigateBack') {
+      return false;
+    }
+    this.clickLeft();
+    return true;
+  },
+  onPageScroll(e) {
+    //nvue暂不支持滚动监听，可用bindingx代替
+    if (e.scrollTop > 200) {
+      //距离大于200时显示
+      this.isTop = true;
+    } else {
+      //距离小于200时隐藏
+      this.isTop = false;
+    }
+  },
+};
 </script>
 1
 <style lang="scss">
-	/deep/.uni-icons{
-			font-size: 40rpx !important;
-		}
-	.uinput-box {
-		position: fixed;
-		top: 88px;
-		z-index: 100;
-		background-color: white;
-		width: 100%;
-		display: flex;
-		justify-content: center;
-		align-items: center;
+::v-deep .uni-icons {
+  font-size: 40rpx !important;
+}
+.uinput-box {
+  position: fixed;
+  top: 88px;
+  z-index: 100;
+  background-color: white;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 
-		.uinputs {
-			width: 95%;
-			position: relative;
+  .uinputs {
+    width: 95%;
+    position: relative;
 
-			.search {
-				position: absolute;
-				top: 40rpx;
-				left: 200rpx;
-			}
-		}
-	}
+    .search {
+      position: absolute;
+      top: 40rpx;
+      left: 200rpx;
+    }
+  }
+}
 
-	.userlists {
-		width: 100%;
-		position: relative;
-		top: 180rpx;
+.userlists {
+  width: 100%;
+  position: relative;
+  top: 180rpx;
 
-		.userlist-li {
-			width: 46%;
-			height: 300rpx;
-			margin: 20rpx 0 0 20rpx;
-			float: left;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			text-align: center;
-			.userlist-li-city{
-				overflow: hidden;//溢出隐藏
-				white-space: nowrap;//禁止换行
-				text-overflow: ellipsis;//...
-			}
-			image {
-				width: 80rpx;
-				height: 80rpx;
-				margin: 40rpx 0 20rpx;
-			}
-			.loginbox{
-				display: flex;
-			}
-			.loginp {
-				width: 130rpx;
-				padding: 6rpx;
-				font-size: 25rpx;
-				background-color: #18B566;
-				color: #FFF;
-				margin: 20rpx auto;
-				border-radius: 31rpx;
-			}
-			.logininfo{
-				width: 130rpx;
-				padding: 6rpx;
-				font-size: 25rpx;
-				background-color: #fbb309;
-				color: #FFF;
-				margin: 20rpx auto;
-				border-radius: 31rpx;
-			}
-		}
-	}
-	.top {
-		position: fixed;
-		right: 30px;
-		bottom: 100px;
-		z-index: 100;
-		image{
-			width: 100rpx;
-			height: 100rpx;
-		}
-	}
+  .userlist-li {
+    width: 46%;
+    height: 300rpx;
+    margin: 20rpx 0 0 20rpx;
+    float: left;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    text-align: center;
+    .userlist-li-city {
+      overflow: hidden; //溢出隐藏
+      white-space: nowrap; //禁止换行
+      text-overflow: ellipsis; //...
+    }
+    image {
+      width: 80rpx;
+      height: 80rpx;
+      margin: 40rpx 0 20rpx;
+    }
+    .loginbox {
+      display: flex;
+    }
+    .loginp {
+      width: 130rpx;
+      padding: 6rpx;
+      font-size: 25rpx;
+      background-color: #18b566;
+      color: #fff;
+      margin: 20rpx auto;
+      border-radius: 31rpx;
+    }
+    .logininfo {
+      width: 130rpx;
+      padding: 6rpx;
+      font-size: 25rpx;
+      background-color: #fbb309;
+      color: #fff;
+      margin: 20rpx auto;
+      border-radius: 31rpx;
+    }
+  }
+}
+.top {
+  position: fixed;
+  right: 30px;
+  bottom: 100px;
+  z-index: 100;
+  image {
+    width: 100rpx;
+    height: 100rpx;
+  }
+}
 </style>

pages/expertDiagnosis/particulars.vue

@@ -1,349 +1,397 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view style="position: fixed;top: 44px;background-color: #fff;z-index: 99;">
-			<uni-nav-bar @clickLeft="clickLeft" left-icon="back" left-text="返回" title="详情"></uni-nav-bar>
-		</view>
-		<view style="position: relative;top: 90px;">
-			<view class="partitlteimg">
-				<!-- <image :src="list" mode="" class="" @click="examine(list)"></image> -->
-				<u-swiper :list="list" height='428' @click="examine(list)"></u-swiper>
-			</view>
-			<view class="quiz">
-				<view class="quiz_username">
-					<image
-						:src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/expertDiagnosis/6940a11a251770f1b0d8b7b10ebdf9b.png'"
-						mode="" v-if="Number(quizdata.heat)==1"></image>
-					<span>{{quizdata.title}}</span>
-				</view>
-				<view class="quiz_usertime">
-					<view style="display: flex;align-items: center;">
-						<image :src="quizdata.image?quizdata.image:'http://www.hnyfwlw.com:8006/bigdata_app/image/fourMoodBase/touxiang.png'"
-							mode=""></image>
-						<span>{{quizdata.username}}</span>
-					</view>
-					<view>
-						<span>{{quizdata.adtime|timeFormat()}}</span>
-					</view>
-				</view>
-				<view class="quiz_usercontert" v-html="quizdata.content"></view>
-			</view>
-			<view class="comment">
-				<p class="comment_title">评论</p>
-				<scroll-view class="scroll-view_H" :scroll-y="true" @scrolltolower="scroll" scroll-top="0">
-					<view class="comment_unit" v-for="(item,index) in commentdata" :key="index">
-						<view class="comment_unit_user">
-							<view class="username">
-								<image :src="item.image" mode=""></image>
-								<span style="font-size: 26rpx;color:#C1C1C1;">{{item.username}}</span>
-								<p v-if="Number(item.user_type) == 1">专家</p>
-							</view>
-							<view>
-								<span style="font-size: 26rpx;color:#C1C1C1;">{{item.uptime|timeFormat()}}</span>
-							</view>
-						</view>
-						<view class="comment_unit_con">
-							<p v-html="item.content"></p>
-						</view>
-					</view>
-				</scroll-view>
-			</view>
-		</view>
-		<view class="issue_box" :style="{position: 'fixed',bottom: height+'px'}">
-			<view class="issue">
-				<input type="text" v-model="issuedata" @focus="focus" :auto-blur="true" :adjust-position='false'
-					@blur="blur" @confirm="confirm" />
-				<p @click="issue">发布</p>
-			</view>
-		</view>
-	</view>
+  <view>
+    <view class="status_bar"></view>
+    <view
+      style="position: fixed; top: 44px; background-color: #fff; z-index: 99"
+    >
+      <uni-nav-bar
+        @clickLeft="clickLeft"
+        left-icon="back"
+        left-text="返回"
+        title="详情"
+      ></uni-nav-bar>
+    </view>
+    <view style="position: relative; top: 90px">
+      <view class="partitlteimg">
+        <!-- <image :src="list" mode="" class="" @click="examine(list)"></image> -->
+        <u-swiper :list="list" height="428" @click="examine(list)"></u-swiper>
+      </view>
+      <view class="quiz">
+        <view class="quiz_username">
+          <image
+            :src="
+              'http://www.hnyfwlw.com:8006/bigdata_app' +
+              '/image/expertDiagnosis/6940a11a251770f1b0d8b7b10ebdf9b.png'
+            "
+            mode=""
+            v-if="Number(quizdata.heat) == 1"
+          ></image>
+          <span>{{ quizdata.title }}</span>
+        </view>
+        <view class="quiz_usertime">
+          <view style="display: flex; align-items: center">
+            <image
+              :src="
+                quizdata.image
+                  ? quizdata.image
+                  : 'http://www.hnyfwlw.com:8006/bigdata_app/image/fourMoodBase/touxiang.png'
+              "
+              mode=""
+            ></image>
+            <span>{{ quizdata.username }}</span>
+          </view>
+          <view>
+            <span>{{ quizdata.adtime | timeFormat() }}</span>
+          </view>
+        </view>
+        <view class="quiz_usercontert" v-html="quizdata.content"></view>
+      </view>
+      <view class="comment">
+        <p class="comment_title">评论</p>
+        <scroll-view
+          class="scroll-view_H"
+          :scroll-y="true"
+          @scrolltolower="scroll"
+          scroll-top="0"
+        >
+          <view
+            class="comment_unit"
+            v-for="(item, index) in commentdata"
+            :key="index"
+          >
+            <view class="comment_unit_user">
+              <view class="username">
+                <image :src="item.image" mode=""></image>
+                <span style="font-size: 26rpx; color: #c1c1c1">{{
+                  item.username
+                }}</span>
+                <p v-if="Number(item.user_type) == 1">专家</p>
+              </view>
+              <view>
+                <span style="font-size: 26rpx; color: #c1c1c1">{{
+                  item.uptime | timeFormat()
+                }}</span>
+              </view>
+            </view>
+            <view class="comment_unit_con">
+              <p v-html="item.content"></p>
+            </view>
+          </view>
+        </scroll-view>
+      </view>
+    </view>
+    <view
+      class="issue_box"
+      :style="{ position: 'fixed', bottom: height + 'px' }"
+    >
+      <view class="issue">
+        <input
+          type="text"
+          v-model="issuedata"
+          @focus="focus"
+          :auto-blur="true"
+          :adjust-position="false"
+          @blur="blur"
+          @confirm="confirm"
+        />
+        <p @click="issue">发布</p>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				list: [],
-				quizdata: {},
-				commentdata: [],
-				issuedata: '',
-				defaultimg: '/images/expertDiagnosis/img01.png',
-				height: 0,
-				page: 1,
-			}
-		},
-		methods: { //
-			async getParticulars(datas) { //获取评论列表
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=pest.pests.pests_answers_list',
-					data: {
-						lower: datas,
-						page: this.page,
-						page_size: 10
-					}
-				})
-				this.commentdata = this.commentdata.concat(res.data)
-				console.log(res.data)
-			},
-			async getDiscuss(data) { //发布评论
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=pest.pests.pests_new_idea',
-					data: {
-						lower: data.lower,
-						content: data.content,
-					}
-				})
-				if (res.code == 200) {
-					this.commentdata = []
-					this.page = 1
-					this.getParticulars(this.quizdata.lower)
-				}
-				console.log(res)
-			},
-			clickLeft() {
-				uni.navigateTo({
-					url: "./exchangeShare"
-				})
-			},
-			issue() { //发布评论
-				let obj = {}
-				obj.lower = this.quizdata.lower
-				obj.content = this.issuedata
-				if (this.issuedata != '') {
-					this.getDiscuss(obj)
-					this.issuedata = ''
-				}
-			},
-			focus(e) {
-				this.height = e.detail.height
-			},
-			blur() {
-				this.height = 0
-			},
-			confirm() {
-				this.issue()
-			},
-			scroll(e) {
-				this.page++
-				this.getParticulars(this.quizdata.lower)
-			},
-			examine(list) {
-				console.log(list)
-				var imgarr = []
-				for(var i=0;i<list.length;i++){
-					imgarr.unshift(list[0].image)
-				}
-				console.log(imgarr)
-				uni.previewImage({
-					urls: imgarr
-				});
-			},
-			async getInvitation(id) { //获取点击的帖子详细内容
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=pest.pests.pests_answers_list',
-					data: {
-						d_id: id,
-						page: this.page,
-						page_size: 10
-					}
-				})
-				console.log(res)
-				this.quizdata = res.data[0]
-				console.log(this.quizdata)
-				var index2 = this.quizdata.content.indexOf('http')
-				this.recursion(index2)
-				if(!(index2+1)){
-					var obj = {
-						image: this.quizdata.img_urls
-					}
-					this.list.push(obj)
-				}
-				// if (this.quizdata.image == '' || this.quizdata.image == null) {
-				// 	this.list = 'http://www.hnyfwlw.com:8006/projectimg' + this.defaultimg
-				// } else {
-				// 	this.list = this.quizdata.image
-				// }
-				this.getParticulars(this.quizdata.lower)
-			},
-			recursion(index) {
-				if (index + 1) {
-					var src = this.quizdata.content.slice(index, this.quizdata.content.indexOf('"', index))
-					var length = src.length
-					var obj = {
-						image: src
-					}
-					this.list.push(obj)
-					console.log(src)
-					var index3 = this.quizdata.content.indexOf('http', index + length)
-					console.log(index3)
-					this.recursion(index3)
-				}
-			}
-		},
-		onLoad(option) {
-			console.log(option.items)
-			this.getInvitation(option.items)
-		}
-	}
+export default {
+  data() {
+    return {
+      list: [],
+      quizdata: {},
+      commentdata: [],
+      issuedata: '',
+      defaultimg: '/images/expertDiagnosis/img01.png',
+      height: 0,
+      page: 1,
+    };
+  },
+  methods: {
+    //
+    async getParticulars(datas) {
+      //获取评论列表
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=pest.pests.pests_answers_list',
+        data: {
+          lower: datas,
+          page: this.page,
+          page_size: 10,
+        },
+      });
+      this.commentdata = this.commentdata.concat(res.data);
+      console.log(res.data);
+    },
+    async getDiscuss(data) {
+      //发布评论
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=pest.pests.pests_new_idea',
+        data: {
+          lower: data.lower,
+          content: data.content,
+        },
+      });
+      if (res.code == 200) {
+        this.commentdata = [];
+        this.page = 1;
+        this.getParticulars(this.quizdata.lower);
+      }
+      console.log(res);
+    },
+    clickLeft() {
+      uni.navigateTo({
+        url: './exchangeShare',
+      });
+    },
+    issue() {
+      //发布评论
+      let obj = {};
+      obj.lower = this.quizdata.lower;
+      obj.content = this.issuedata;
+      if (this.issuedata != '') {
+        this.getDiscuss(obj);
+        this.issuedata = '';
+      }
+    },
+    focus(e) {
+      this.height = e.detail.height;
+    },
+    blur() {
+      this.height = 0;
+    },
+    confirm() {
+      this.issue();
+    },
+    scroll(e) {
+      this.page++;
+      this.getParticulars(this.quizdata.lower);
+    },
+    examine(list) {
+      console.log(list);
+      var imgarr = [];
+      for (var i = 0; i < list.length; i++) {
+        imgarr.unshift(list[0].image);
+      }
+      console.log(imgarr);
+      uni.previewImage({
+        urls: imgarr,
+      });
+    },
+    async getInvitation(id) {
+      //获取点击的帖子详细内容
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=pest.pests.pests_answers_list',
+        data: {
+          d_id: id,
+          page: this.page,
+          page_size: 10,
+        },
+      });
+      console.log(res);
+      this.quizdata = res.data[0];
+      console.log(this.quizdata);
+      var index2 = this.quizdata.content.indexOf('http');
+      this.recursion(index2);
+      if (!(index2 + 1)) {
+        var obj = {
+          image: this.quizdata.img_urls,
+        };
+        this.list.push(obj);
+      }
+      // if (this.quizdata.image == '' || this.quizdata.image == null) {
+      // 	this.list = 'http://www.hnyfwlw.com:8006/projectimg' + this.defaultimg
+      // } else {
+      // 	this.list = this.quizdata.image
+      // }
+      this.getParticulars(this.quizdata.lower);
+    },
+    recursion(index) {
+      if (index + 1) {
+        var src = this.quizdata.content.slice(
+          index,
+          this.quizdata.content.indexOf('"', index)
+        );
+        var length = src.length;
+        var obj = {
+          image: src,
+        };
+        this.list.push(obj);
+        console.log(src);
+        var index3 = this.quizdata.content.indexOf('http', index + length);
+        console.log(index3);
+        this.recursion(index3);
+      }
+    },
+  },
+  onLoad(option) {
+    console.log(option.items);
+    this.getInvitation(option.items);
+  },
+};
 </script>
 <style lang="scss">
-	// .u-swiper-wrap {
-	// 	width: 95%;
-	// 	margin: 20rpx auto;
-	// }
-	.partitlteimg {
-		width: 95%;
-		margin: 0 auto 20rpx;
-		height: 428rpx;
-		image {
-			max-width: 100%;
-			max-height: 100%;
-		}
-	}
+// .u-swiper-wrap {
+// 	width: 95%;
+// 	margin: 20rpx auto;
+// }
+.partitlteimg {
+  width: 95%;
+  margin: 0 auto 20rpx;
+  height: 428rpx;
+  image {
+    max-width: 100%;
+    max-height: 100%;
+  }
+}
 
-	.quiz {
-		width: 95%;
-		margin: 20rpx auto;
-		border-bottom: 4rpx dashed #E8E8E8;
-		.quiz_title{
-			width: 100%;
-			font-size: 36rpx;
-			font-weight: 700;
-			text-align: center;
-		}
-		.quiz_username {
-			width: 100%;
+.quiz {
+  width: 95%;
+  margin: 20rpx auto;
+  border-bottom: 4rpx dashed #e8e8e8;
+  .quiz_title {
+    width: 100%;
+    font-size: 36rpx;
+    font-weight: 700;
+    text-align: center;
+  }
+  .quiz_username {
+    width: 100%;
 
-			image {
-				width: 40rpx;
-				height: 40rpx;
-				vertical-align: middle;
-				margin-right: 20rpx;
-			}
+    image {
+      width: 40rpx;
+      height: 40rpx;
+      vertical-align: middle;
+      margin-right: 20rpx;
+    }
 
-			span {
-				font-weight: 700;
-				font-size: 32rpx;
-			}
-		}
+    span {
+      font-weight: 700;
+      font-size: 32rpx;
+    }
+  }
 
-		.quiz_usertime {
-			width: 100%;
-			margin-top: 15rpx;
-			display: flex;
-			justify-content: space-between;
+  .quiz_usertime {
+    width: 100%;
+    margin-top: 15rpx;
+    display: flex;
+    justify-content: space-between;
 
-			image {
-				width: 50rpx;
-				height: 50rpx;
-				margin-right: 20rpx;
-				border-radius: 50%;
-			}
+    image {
+      width: 50rpx;
+      height: 50rpx;
+      margin-right: 20rpx;
+      border-radius: 50%;
+    }
 
-			span {
-				font-size: 24rpx;
-				color: #C1C1C1;
-				font-weight: 700;
-			}
-		}
+    span {
+      font-size: 24rpx;
+      color: #c1c1c1;
+      font-weight: 700;
+    }
+  }
 
-		.quiz_usercontert {
-			padding: 20rpx;
-			margin-bottom: 20rpx;
-			/deep/img{
-				width: 0 !important;
-				height: 0 !important;
-			}
-		}
-	}
+  .quiz_usercontert {
+    padding: 20rpx;
+    margin-bottom: 20rpx;
+    ::v-deep img {
+      width: 0 !important;
+      height: 0 !important;
+    }
+  }
+}
 
-	.comment {
-		width: 95%;
-		margin: 20rpx auto 0;
+.comment {
+  width: 95%;
+  margin: 20rpx auto 0;
 
-		.comment_title {
-			font-weight: 700;
-			font-size: 32rpx;
-		}
+  .comment_title {
+    font-weight: 700;
+    font-size: 32rpx;
+  }
 
-		.scroll-view_H {
-			height: 600rpx;
-			padding-bottom: 100rpx;
-		}
+  .scroll-view_H {
+    height: 600rpx;
+    padding-bottom: 100rpx;
+  }
 
-		.comment_unit {
-			.comment_unit_user {
-				display: flex;
-				justify-content: space-between;
-				margin-top: 20rpx;
+  .comment_unit {
+    .comment_unit_user {
+      display: flex;
+      justify-content: space-between;
+      margin-top: 20rpx;
 
-				.username {
-					display: flex;
-					align-items: center;
+      .username {
+        display: flex;
+        align-items: center;
 
-					image {
-						width: 50rpx;
-						height: 50rpx;
-						margin-right: 20rpx;
-						border-radius: 50%;
-					}
+        image {
+          width: 50rpx;
+          height: 50rpx;
+          margin-right: 20rpx;
+          border-radius: 50%;
+        }
 
-					p {
-						width: 60rpx;
-						height: 30rpx;
-						color: white;
-						background-color: #5CA348;
-						font-size: 24rpx;
-						text-align: center;
-						line-height: 30rpx;
-						padding: 0 10rpx;
-						margin-left: 20rpx;
-						border-radius: 8rpx;
-					}
-				}
-			}
+        p {
+          width: 60rpx;
+          height: 30rpx;
+          color: white;
+          background-color: #5ca348;
+          font-size: 24rpx;
+          text-align: center;
+          line-height: 30rpx;
+          padding: 0 10rpx;
+          margin-left: 20rpx;
+          border-radius: 8rpx;
+        }
+      }
+    }
 
-			.comment_unit_con {
-				padding-left: 60rpx;
+    .comment_unit_con {
+      padding-left: 60rpx;
 
-				/deep/p {
-					margin-top: 20rpx;
+      ::v-deep p {
+        margin-top: 20rpx;
 
-					img {
-						margin-top: 20rpx;
-						display: block;
-						width: 180rpx !important;
-						height: 180rpx !important;
-					}
-				}
+        img {
+          margin-top: 20rpx;
+          display: block;
+          width: 180rpx !important;
+          height: 180rpx !important;
+        }
+      }
+    }
+  }
+}
 
-			}
-		}
-	}
+.issue_box {
+  width: 100%;
+  background-color: #ffffff;
+}
 
-	.issue_box {
-		width: 100%;
-		background-color: #FFFFFF;
-	}
+.issue {
+  width: 95%;
+  margin: 0 auto;
+  display: flex;
+  padding-bottom: 20rpx;
 
-	.issue {
-		width: 95%;
-		margin: 0 auto;
-		display: flex;
-		padding-bottom: 20rpx;
+  input {
+    width: 90%;
+    background-color: #f3f3f3;
+    height: 60rpx;
+    text-indent: 1em;
+  }
 
-		input {
-			width: 90%;
-			background-color: #F3F3F3;
-			height: 60rpx;
-			text-indent: 1em;
-		}
-
-		p {
-			width: 10%;
-			text-align: right;
-			line-height: 60rpx;
-			color: #7a7a7a;
-		}
-	}
+  p {
+    width: 10%;
+    text-align: right;
+    line-height: 60rpx;
+    color: #7a7a7a;
+  }
+}
 </style>

pages/irrigate/irrmap.vue

@@ -1,61 +1,66 @@
 <template>
-	<view>
-		<view class="mapbox">
-			<map class="map" :markers="covers" :latitude="latitude" :longitude="longitude"></map>
-		</view>
-	</view>
+  <view>
+    <view class="mapbox">
+      <map
+        class="map"
+        :markers="covers"
+        :latitude="latitude"
+        :longitude="longitude"
+      ></map>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				latitude: "",
-				longitude: "",
-				covers: []
-			}
-		},
-		onLoad(option) {
-			console.log(option)
-			// var 
-			var res = option.lnglat.split(",")
-			var obj = {}
-			obj.latitude = Number(res[1])
-			this.latitude = Number(res[1])
-			obj.longitude = Number(res[0])
-			this.longitude = Number(res[0])
-			obj.title = option.basename
-			obj.id = 1
-			obj.callout = { //自定义标记点上方的气泡窗口 点击有效  
-				content: option.basename, //文本
-				color: '#ffffff', //文字颜色
-				fontSize: 14, //文本大小
-				borderRadius: 2, //边框圆角
-				bgColor: '#00c16f', //背景颜色
-				display: 'ALWAYS', //常显
-			}
-			obj.iconPath = "../../static/images/distribution/f2df86753bf7c9e311a59f632f5c545.png"
-			this.covers.push(obj)
-			console.log(this.covers)
-		},
-		methods: {
-
-		}
-	}
+export default {
+  data() {
+    return {
+      latitude: '',
+      longitude: '',
+      covers: [],
+    };
+  },
+  onLoad(option) {
+    console.log(option);
+    // var
+    var res = option.lnglat.split(',');
+    var obj = {};
+    obj.latitude = Number(res[1]);
+    this.latitude = Number(res[1]);
+    obj.longitude = Number(res[0]);
+    this.longitude = Number(res[0]);
+    obj.title = option.basename;
+    obj.id = 1;
+    obj.callout = {
+      //自定义标记点上方的气泡窗口 点击有效
+      content: option.basename, //文本
+      color: '#ffffff', //文字颜色
+      fontSize: 14, //文本大小
+      borderRadius: 2, //边框圆角
+      bgColor: '#00c16f', //背景颜色
+      display: 'ALWAYS', //常显
+    };
+    obj.iconPath =
+      '../../static/images/distribution/f2df86753bf7c9e311a59f632f5c545.png';
+    this.covers.push(obj);
+    console.log(this.covers);
+  },
+  methods: {},
+};
 </script>
 
 <style lang="scss">
-	.mapbox {
-		width: 100%;
-		height: 100vh;
+.mapbox {
+  width: 100%;
+  height: 100vh;
 
-		.map {
-			width: 100%;
-			height: 100%;
+  .map {
+    width: 100%;
+    height: 100%;
 
-			/deep/.csssprite {
-				display: none;
-			}
-		}
-	}
+    ::v-deep .csssprite {
+      display: none;
+    }
+  }
+}
 </style>

pages/monitor/imagelist.vue

@@ -1,375 +1,401 @@
 <template>
-	<view>
-		<!-- <view class="status_bar"></view> -->
-		<view class="" style="position: relative;top: 44px;">
-			<!-- <view style="position: fixed;z-index: 100;">
+  <view>
+    <!-- <view class="status_bar"></view> -->
+    <view class="" style="position: relative; top: 44px">
+      <!-- <view style="position: fixed;z-index: 100;">
 				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" title="查看图片"></uni-nav-bar>
 			</view> -->
-			<p class="tishi" v-if="tishi">暂无数据</p>
-			<view class="selecttimes" @click="tiemshow=!tiemshow">
-				<view class="timesbox">
-					<image
-						:src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'"
-						mode=""></image>
-					<p>{{timetab(timestate)}}</p>
-					<p class="or">~</p>
-					<p>{{timetab(timeend)}}</p>
-					<u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
-				</view>
-				<u-calendar v-model="tiemshow" mode="range" @change="tiemchange"></u-calendar>
-			</view>
-			<view class="imglist">
-				<view class="imglist_box" v-for="(item,index) in imglists" :key="index">
-					<view class="imglist_left">
-						<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/cb/jiazai.ui.gif'" mode="">
-						</image>
-						<image :src="item.addr" mode="" @click="examine(index)"></image>
-					</view>
-					<view class="imglist_right">
-						<view class="icon_box" @click="delimg(item.photo_id)">
-							<p class="iconfont icon-shanchu">删除</p>
-						</view>
-						<p style="color: #06B535;">{{item.addtime|timeFormat()}}</p>
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="top" v-if="isTop" @click="top">
-			<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/6209a98f0cb3b5086f2ca36152c9269.png'"
-				mode=""></image>
-		</view>
-	</view>
+      <p class="tishi" v-if="tishi">暂无数据</p>
+      <view class="selecttimes" @click="tiemshow = !tiemshow">
+        <view class="timesbox">
+          <image
+            :src="
+              'http://www.hnyfwlw.com:8006/bigdata_app' +
+              '/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png'
+            "
+            mode=""
+          ></image>
+          <p>{{ timetab(timestate) }}</p>
+          <p class="or">~</p>
+          <p>{{ timetab(timeend) }}</p>
+          <u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
+        </view>
+        <u-calendar
+          v-model="tiemshow"
+          mode="range"
+          @change="tiemchange"
+        ></u-calendar>
+      </view>
+      <view class="imglist">
+        <view
+          class="imglist_box"
+          v-for="(item, index) in imglists"
+          :key="index"
+        >
+          <view class="imglist_left">
+            <image
+              :src="
+                'http://www.hnyfwlw.com:8006/bigdata_app' +
+                '/image/cb/jiazai.ui.gif'
+              "
+              mode=""
+            >
+            </image>
+            <image :src="item.addr" mode="" @click="examine(index)"></image>
+          </view>
+          <view class="imglist_right">
+            <view class="icon_box" @click="delimg(item.photo_id)">
+              <p class="iconfont icon-shanchu">删除</p>
+            </view>
+            <p style="color: #06b535">{{ item.addtime | timeFormat() }}</p>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="top" v-if="isTop" @click="top">
+      <image
+        :src="
+          'http://www.hnyfwlw.com:8006/bigdata_app' +
+          '/image/6209a98f0cb3b5086f2ca36152c9269.png'
+        "
+        mode=""
+      ></image>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				page: 1,
-				imglists: [],
-				tishi: true,
-				d_id: '',
-				timeend: '', //当前时间 也是搜索的结束时间
-				timestate: '',
-				timeshow: false,
-				params: {
-					year: true,
-					month: true,
-					day: true,
-					hour: true,
-					minute: true,
-					second: false
-				},
-				flag: 1,
-				self: true,
-				isTop: false,
-				resultdata: {},
-				titletext: ["24小时", "近一个月", "近半年", "近一年"],
-				titleidnex: 0,
-				tiemshow: false, //时间选择器
-				disable: "",
-				device_type: "",
-				myuid:""
-			}
-		},
-		methods: {
-			//forecast.forecast_system.equip_photofo
-			async imglistdata(time_begin, time_end) { //获取图片列表
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=camera.camera_manage.camera_photo',
-					data: {
-						device_id: this.device_id,
-						page: this.page,
-						page_size: 8,
-						start_time: time_begin, //开始时间
-						end_time: time_end, //结束时间
-					}
-				})
-				this.imglists = this.imglists.concat(res.data)
-				console.log(this.imglists)
-				if (this.imglists.length == 0) {
-					this.tishi = true
-				} else {
-					this.tishi = false
-				}
-			},
-			//forecast.forecast_system.equip_photo_del
-			async del(id) { //删除图片
-				var arr = id;
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=camera.camera_manage.del_camera_photo',
-					data: {
-						// device_id: this.device_id,
-						photo_id_list: JSON.stringify(arr)
-					}
-				})
-				if (res) {
-					uni.showToast({
-						title: '删除成功！',
-						duration: 2000
-					});
-					this.page = 1
-					this.imglists = []
-					if(this.timestate != '') {
-						this.timestate = parseInt(this.timestate)
-					}
-					if(this.timeend != '') {
-						this.timeend = parseInt(this.timeend)
-					}
-					this.imglistdata(this.timestate, this.timeend)
-				} else {
-					uni.showToast({
-						title: '删除失败！',
-						duration: 2000,
-						icon: "none"
-					});
-				}
-			},
-			//forecast.forecast_system.equip_photo_species  pest_list
-			//forecast.forecast_system.equip_photo_species统计
+export default {
+  data() {
+    return {
+      page: 1,
+      imglists: [],
+      tishi: true,
+      d_id: '',
+      timeend: '', //当前时间 也是搜索的结束时间
+      timestate: '',
+      timeshow: false,
+      params: {
+        year: true,
+        month: true,
+        day: true,
+        hour: true,
+        minute: true,
+        second: false,
+      },
+      flag: 1,
+      self: true,
+      isTop: false,
+      resultdata: {},
+      titletext: ['24小时', '近一个月', '近半年', '近一年'],
+      titleidnex: 0,
+      tiemshow: false, //时间选择器
+      disable: '',
+      device_type: '',
+      myuid: '',
+    };
+  },
+  methods: {
+    //forecast.forecast_system.equip_photofo
+    async imglistdata(time_begin, time_end) {
+      //获取图片列表
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=camera.camera_manage.camera_photo',
+        data: {
+          device_id: this.device_id,
+          page: this.page,
+          page_size: 8,
+          start_time: time_begin, //开始时间
+          end_time: time_end, //结束时间
+        },
+      });
+      this.imglists = this.imglists.concat(res.data);
+      console.log(this.imglists);
+      if (this.imglists.length == 0) {
+        this.tishi = true;
+      } else {
+        this.tishi = false;
+      }
+    },
+    //forecast.forecast_system.equip_photo_del
+    async del(id) {
+      //删除图片
+      var arr = id;
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=camera.camera_manage.del_camera_photo',
+        data: {
+          // device_id: this.device_id,
+          photo_id_list: JSON.stringify(arr),
+        },
+      });
+      if (res) {
+        uni.showToast({
+          title: '删除成功！',
+          duration: 2000,
+        });
+        this.page = 1;
+        this.imglists = [];
+        if (this.timestate != '') {
+          this.timestate = parseInt(this.timestate);
+        }
+        if (this.timeend != '') {
+          this.timeend = parseInt(this.timeend);
+        }
+        this.imglistdata(this.timestate, this.timeend);
+      } else {
+        uni.showToast({
+          title: '删除失败！',
+          duration: 2000,
+          icon: 'none',
+        });
+      }
+    },
+    //forecast.forecast_system.equip_photo_species  pest_list
+    //forecast.forecast_system.equip_photo_species统计
 
-			//forecast.send_control.admin_device_control 拍照 
-			clickLeft() {
-				uni.navigateBack({
-					delta: 1
-				})
-			},
-			delimg(id) { //删除图片
-				uni.showModal({
-					title: '提示',
-					content: '是否删除此图片？',
-					success: (res) => {
-						if (res.confirm) {
-							this.del(id)
-							console.log('用户点击确定');
-						} else if (res.cancel) {
-							console.log('用户点击取消');
-						}
-					}
-				});
-			},
-			top() {
-				uni.pageScrollTo({
-					scrollTop: 0,
-					duration: 500
-				})
-			},
-			tiemchange(e) {
-				this.imglists = []
-				this.page = 1
-				console.log(e)
-				this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60
-				this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60
-				this.imglistdata(parseInt(this.timestate), parseInt(this.timeend))
-			},
-			timetab(e) {
-				if(!e) return '请选择'
-				e = new Date(e * 1000)
-				var year = e.getFullYear()
-				var month = e.getMonth() + 1 < 10 ? "0" + (e.getMonth() + 1) : e.getMonth() + 1
-				var day = e.getDate() < 10 ? "0" + e.getDate() : e.getDate()
-				var time = year + "/" + month + "/" + day
-				return time
-			},
-		},
-		onLoad(option) {
-			uni.getStorage({
-				key:"myuid",
-				success:(res)=> {
-					this.myuid = res.data
-					console.log(this.myuid)
-				}
-			})
-			// this.timeend = +new Date() / 1000
-			// this.timestate = this.timeend - 60 * 60 * 24
-			console.log(option)
-			this.device_id = option.id
-			console.log(this.timestate)
-			this.imglistdata('', '')
-		},
-		onShow() {
-
-		},
-		onReachBottom() {
-			this.page++
-			console.log(this.timestate)
-			if(this.timestate != '') {
-				this.timestate = parseInt(this.timestate)
-			}
-			if(this.timeend != '') {
-				this.timeend = parseInt(this.timeend)
-			}
-			this.imglistdata(this.timestate, this.timeend)
-		},
-		onPageScroll(e) { //nvue暂不支持滚动监听，可用bindingx代替
-			if (e.scrollTop > 200) { //距离大于200时显示
-				this.isTop = true
-			} else { //距离小于200时隐藏
-				this.isTop = false
-			}
-		}
-	}
+    //forecast.send_control.admin_device_control 拍照
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    delimg(id) {
+      //删除图片
+      uni.showModal({
+        title: '提示',
+        content: '是否删除此图片？',
+        success: (res) => {
+          if (res.confirm) {
+            this.del(id);
+            console.log('用户点击确定');
+          } else if (res.cancel) {
+            console.log('用户点击取消');
+          }
+        },
+      });
+    },
+    top() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 500,
+      });
+    },
+    tiemchange(e) {
+      this.imglists = [];
+      this.page = 1;
+      console.log(e);
+      this.timestate = +new Date(e.startDate) / 1000 - 8 * 60 * 60;
+      this.timeend = +new Date(e.endDate) / 1000 + 16 * 60 * 60;
+      this.imglistdata(parseInt(this.timestate), parseInt(this.timeend));
+    },
+    timetab(e) {
+      if (!e) return '请选择';
+      e = new Date(e * 1000);
+      var year = e.getFullYear();
+      var month =
+        e.getMonth() + 1 < 10 ? '0' + (e.getMonth() + 1) : e.getMonth() + 1;
+      var day = e.getDate() < 10 ? '0' + e.getDate() : e.getDate();
+      var time = year + '/' + month + '/' + day;
+      return time;
+    },
+  },
+  onLoad(option) {
+    uni.getStorage({
+      key: 'myuid',
+      success: (res) => {
+        this.myuid = res.data;
+        console.log(this.myuid);
+      },
+    });
+    // this.timeend = +new Date() / 1000
+    // this.timestate = this.timeend - 60 * 60 * 24
+    console.log(option);
+    this.device_id = option.id;
+    console.log(this.timestate);
+    this.imglistdata('', '');
+  },
+  onShow() {},
+  onReachBottom() {
+    this.page++;
+    console.log(this.timestate);
+    if (this.timestate != '') {
+      this.timestate = parseInt(this.timestate);
+    }
+    if (this.timeend != '') {
+      this.timeend = parseInt(this.timeend);
+    }
+    this.imglistdata(this.timestate, this.timeend);
+  },
+  onPageScroll(e) {
+    //nvue暂不支持滚动监听，可用bindingx代替
+    if (e.scrollTop > 200) {
+      //距离大于200时显示
+      this.isTop = true;
+    } else {
+      //距离小于200时隐藏
+      this.isTop = false;
+    }
+  },
+};
 </script>
 
 <style lang="scss">
-	.tishi {
-		position: absolute;
-		top: 40px;
-		width: 95%;
-		left: 2.5%;
-		text-align: center;
-		font-size: 40rpx;
-	}
-
-	.selecttimes {
-		width: 100%;
-		position: fixed;
-		top: 0;
-		left: 0;
-		z-index: 100;
-		background-color: #fff;
-		padding-top: 30rpx;
-
-		.timesbox {
-			display: flex;
-			width: 95%;
-			margin: 0 auto;
-			justify-content: space-around;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 10rpx 20rpx;
-			box-sizing: border-box;
+.tishi {
+  position: absolute;
+  top: 40px;
+  width: 95%;
+  left: 2.5%;
+  text-align: center;
+  font-size: 40rpx;
+}
 
-			image {
-				width: 30rpx;
-				height: 30rpx;
-				margin-top: 6rpx;
-			}
+.selecttimes {
+  width: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 100;
+  background-color: #fff;
+  padding-top: 30rpx;
 
-			.icon {
-				color: #949494;
-				text-align: right;
-				margin-left: 30rpx;
+  .timesbox {
+    display: flex;
+    width: 95%;
+    margin: 0 auto;
+    justify-content: space-around;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 10rpx 20rpx;
+    box-sizing: border-box;
 
-			}
-		}
+    image {
+      width: 30rpx;
+      height: 30rpx;
+      margin-top: 6rpx;
+    }
 
-		/deep/.u-calendar__action {
-			display: flex;
-			justify-content: space-around;
+    .icon {
+      color: #949494;
+      text-align: right;
+      margin-left: 30rpx;
+    }
+  }
 
-			.u-calendar__action__text {
-				line-height: 25px;
-			}
-		}
-	}
+  ::v-deep .u-calendar__action {
+    display: flex;
+    justify-content: space-around;
 
-	.timeshow {
-		width: 96%;
-		height: 50rpx;
-		background-color: #FFFFFF;
-		position: fixed;
-		top: 10px;
-		left: 2.5%;
-		display: flex;
-		z-index: 100;
-		padding-top: 10px;
+    .u-calendar__action__text {
+      line-height: 25px;
+    }
+  }
+}
 
-		.shuju_one_title {
-			width: 70%;
-			margin: 0 auto;
-			display: flex;
+.timeshow {
+  width: 96%;
+  height: 50rpx;
+  background-color: #ffffff;
+  position: fixed;
+  top: 10px;
+  left: 2.5%;
+  display: flex;
+  z-index: 100;
+  padding-top: 10px;
 
-			.tltle_text {
-				width: 25%;
-				border: 2rpx solid #B2B2B2;
-				color: #B2B2B2;
-				text-align: center;
-				font-size: 24rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-			}
+  .shuju_one_title {
+    width: 70%;
+    margin: 0 auto;
+    display: flex;
 
-			.title_text_color {
-				width: 25%;
-				border: 2rpx solid #28AE4F;
-				color: #28AE4F;
-				text-align: center;
-				font-size: 24rpx;
-				height: 50rpx;
-				line-height: 50rpx;
-			}
-		}
+    .tltle_text {
+      width: 25%;
+      border: 2rpx solid #b2b2b2;
+      color: #b2b2b2;
+      text-align: center;
+      font-size: 24rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+    }
 
-		.timeshow_tate,
-		.timeshow_end {
-			height: 50rpx;
-			width: 45%;
-			line-height: 50rpx;
-			text-align: center;
-			margin-right: 10rpx;
-			background-color: #56C877;
-			color: #FFFFFF;
-		}
-	}
+    .title_text_color {
+      width: 25%;
+      border: 2rpx solid #28ae4f;
+      color: #28ae4f;
+      text-align: center;
+      font-size: 24rpx;
+      height: 50rpx;
+      line-height: 50rpx;
+    }
+  }
 
-	.imglist {
-		position: absolute;
-		top: 0;
-		width: 95%;
-		left: 2.5%;
+  .timeshow_tate,
+  .timeshow_end {
+    height: 50rpx;
+    width: 45%;
+    line-height: 50rpx;
+    text-align: center;
+    margin-right: 10rpx;
+    background-color: #56c877;
+    color: #ffffff;
+  }
+}
 
-		.imglist_box {
-			display: flex;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 20rpx;
-			margin-bottom: 20rpx;
-			height: 140px;
-		}
+.imglist {
+  position: absolute;
+  top: 0;
+  width: 95%;
+  left: 2.5%;
 
-		.imglist_left {
-			width: 50%;
-			position: relative;
+  .imglist_box {
+    display: flex;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 20rpx;
+    margin-bottom: 20rpx;
+    height: 140px;
+  }
 
-			image {
-				position: absolute;
-				top: 0;
-				left: 0;
-				width: 100%;
-				height: 280rpx;
-			}
-		}
+  .imglist_left {
+    width: 50%;
+    position: relative;
 
-		.imglist_right {
-			margin-left: 40rpx;
-			padding: 10rpx 0;
+    image {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 280rpx;
+    }
+  }
 
-			.icon_box {
-				margin-bottom: 12rpx;
-				font-size: 24rpx;
+  .imglist_right {
+    margin-left: 40rpx;
+    padding: 10rpx 0;
 
-				.iconfont {
-					margin-right: 20rpx;
-					color: #56C877;
-					font-size: 32rpx;
-				}
-			}
+    .icon_box {
+      margin-bottom: 12rpx;
+      font-size: 24rpx;
 
-			p:last-child {
-				margin-bottom: 0;
-			}
+      .iconfont {
+        margin-right: 20rpx;
+        color: #56c877;
+        font-size: 32rpx;
+      }
+    }
 
-		}
-	}
+    p:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
 
-	.top {
-		position: fixed;
-		right: 30px;
-		bottom: 100px;
-		z-index: 100;
+.top {
+  position: fixed;
+  right: 30px;
+  bottom: 100px;
+  z-index: 100;
 
-		image {
-			width: 100rpx;
-			height: 100rpx;
-		}
-	}
+  image {
+    width: 100rpx;
+    height: 100rpx;
+  }
+}
 </style>

pages/prevention/control.vue

@@ -1,441 +1,492 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view class="" style="position: relative;top: 44px;">
-			<view style="position: fixed;z-index: 100;width: 100%;">
-				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" left-text="返回" title="设备控制"></uni-nav-bar>
-			</view>
-			<view class="control">
-				<view class="control_restart" v-if="myuser_type">
-					<p class="title_p">管理员操作</p>
-					<view class="control_restart_but">
-						<button @click="restart">重启</button>
-						<button @click="upgrade">升级</button>
-					</view>
-				</view>
-				<view class="control_off">
-					<p class="title_p">设备开关</p>
-					<view class="control_off_off">
-						<p>{{condatas.ds == 1? "开机":"关机"}}</p>
-						<u-switch v-model="checked1" size="30" style="margin-top: 14rpx;" active-color="#58C876" @change="checkedTF"></u-switch>
-					</view>
-				</view>
-				<view class="control_mo">
-					<p class="title_p">定时模式</p>
-					<view class="control_off_off" @click="show1 = !show1">
-						<p>{{Number(condatas.ts) == 1 ? "时控":"光控"}}</p>
-						<u-icon name="arrow-down-fill" size="12" color="#7F8082"></u-icon>
-					</view>
-					<u-action-sheet :list="options1" v-model="show1" @click="actionSheetCallback"></u-action-sheet>
-				</view>
-				<view class="control_time" v-if="condatas.ts == 0">
-					<p class="title_p">定时时长(h)</p>
-					<view class="control_off_off" @click="show2 = !show2">
-						<p>{{condatas.tt==0?'常亮':condatas.tt}}</p>
-						<u-icon name="arrow-down-fill" size="12" color="#7F8082"></u-icon>
-					</view>
-				</view>
-				<view class="control_time" v-else>
-					<p class="title_p">开始结束时间</p>
-					<view class="control_off_off" @click="show3 = !show3">
-						<p>开始时间：{{condatas.st?condatas.st:"00"}}:00</p>
-						<u-picker v-model="show3" mode="time" :params="params" @confirm="confirmFun"></u-picker>
-						<u-icon name="arrow-down-fill" size="12" color="#7F8082"></u-icon>
-					</view>
-					<view class="control_off_off" @click="show4 = !show4">
-						<p>结束时间：{{condatas.et?condatas.et:"00"}}:00</p>
-						<u-picker v-model="show4" mode="time" :params="params" @confirm="confirmFun2"></u-picker>
-						<u-icon name="arrow-down-fill" size="12" color="#7F8082"></u-icon>
-					</view>
-				</view>
-				<view class="control_interval">
-					<p class="title_p">数据间隔(min)</p>
-					<view class="slider">
-						<view class="" style="width: 100%;padding-top: 18rpx;">
-							<slider  v-model="condatas.dat_f" min="0" max="120" step="1" show-value block-size="18" activeColor="#57C878" @changing="changing"></slider>
-						</view>
-					</view>
-				</view>
-				<view class="control_timing">
-					<p class="title_p">清虫间隔(min)</p>
-					<view class="slider">
-						<view class="" style="width: 100%;padding-top: 18rpx;">
-							<slider  v-model="condatas.clt_t" min="0" max="120" step="1" show-value block-size="18" activeColor="#57C878" @changing="changing2"></slider>
-						</view>
-					</view>
-					<view class="qingchong" v-if="allqingchong">
-						<view class="qingchongbox" @click="suzumusi">
-							清 虫
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="ensure">
-			<view class="ensure_btn" @click="ensure">
-				确 定
-			</view>
-		</view>
-		<u-popup v-model="show2" mode="bottom" length="30%" class="pop-up">
-			<scroll-view scroll-y="true" class="sheet">
-				<view class="sheet-text" v-for="(item,index) in options2" :key="index">
-					<p @click="typesofroles(index)">{{item.text}}</p>
-				</view>
-			</scroll-view>
-			<button @click="show2 = false">取消</button>
-		</u-popup>
-	</view>
+  <view>
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view style="position: fixed; z-index: 100; width: 100%">
+        <uni-nav-bar
+          @clickLeft="clickLeft"
+          left-icon="back"
+          left-text="返回"
+          title="设备控制"
+        ></uni-nav-bar>
+      </view>
+      <view class="control">
+        <view class="control_restart" v-if="myuser_type">
+          <p class="title_p">管理员操作</p>
+          <view class="control_restart_but">
+            <button @click="restart">重启</button>
+            <button @click="upgrade">升级</button>
+          </view>
+        </view>
+        <view class="control_off">
+          <p class="title_p">设备开关</p>
+          <view class="control_off_off">
+            <p>{{ condatas.ds == 1 ? '开机' : '关机' }}</p>
+            <u-switch
+              v-model="checked1"
+              size="30"
+              style="margin-top: 14rpx"
+              active-color="#58C876"
+              @change="checkedTF"
+            ></u-switch>
+          </view>
+        </view>
+        <view class="control_mo">
+          <p class="title_p">定时模式</p>
+          <view class="control_off_off" @click="show1 = !show1">
+            <p>{{ Number(condatas.ts) == 1 ? '时控' : '光控' }}</p>
+            <u-icon name="arrow-down-fill" size="12" color="#7F8082"></u-icon>
+          </view>
+          <u-action-sheet
+            :list="options1"
+            v-model="show1"
+            @click="actionSheetCallback"
+          ></u-action-sheet>
+        </view>
+        <view class="control_time" v-if="condatas.ts == 0">
+          <p class="title_p">定时时长(h)</p>
+          <view class="control_off_off" @click="show2 = !show2">
+            <p>{{ condatas.tt == 0 ? '常亮' : condatas.tt }}</p>
+            <u-icon name="arrow-down-fill" size="12" color="#7F8082"></u-icon>
+          </view>
+        </view>
+        <view class="control_time" v-else>
+          <p class="title_p">开始结束时间</p>
+          <view class="control_off_off" @click="show3 = !show3">
+            <p>开始时间：{{ condatas.st ? condatas.st : '00' }}:00</p>
+            <u-picker
+              v-model="show3"
+              mode="time"
+              :params="params"
+              @confirm="confirmFun"
+            ></u-picker>
+            <u-icon name="arrow-down-fill" size="12" color="#7F8082"></u-icon>
+          </view>
+          <view class="control_off_off" @click="show4 = !show4">
+            <p>结束时间：{{ condatas.et ? condatas.et : '00' }}:00</p>
+            <u-picker
+              v-model="show4"
+              mode="time"
+              :params="params"
+              @confirm="confirmFun2"
+            ></u-picker>
+            <u-icon name="arrow-down-fill" size="12" color="#7F8082"></u-icon>
+          </view>
+        </view>
+        <view class="control_interval">
+          <p class="title_p">数据间隔(min)</p>
+          <view class="slider">
+            <view class="" style="width: 100%; padding-top: 18rpx">
+              <slider
+                v-model="condatas.dat_f"
+                min="0"
+                max="120"
+                step="1"
+                show-value
+                block-size="18"
+                activeColor="#57C878"
+                @changing="changing"
+              ></slider>
+            </view>
+          </view>
+        </view>
+        <view class="control_timing">
+          <p class="title_p">清虫间隔(min)</p>
+          <view class="slider">
+            <view class="" style="width: 100%; padding-top: 18rpx">
+              <slider
+                v-model="condatas.clt_t"
+                min="0"
+                max="120"
+                step="1"
+                show-value
+                block-size="18"
+                activeColor="#57C878"
+                @changing="changing2"
+              ></slider>
+            </view>
+          </view>
+          <view class="qingchong" v-if="allqingchong">
+            <view class="qingchongbox" @click="suzumusi"> 清 虫 </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="ensure">
+      <view class="ensure_btn" @click="ensure"> 确 定 </view>
+    </view>
+    <u-popup v-model="show2" mode="bottom" length="30%" class="pop-up">
+      <scroll-view scroll-y="true" class="sheet">
+        <view class="sheet-text" v-for="(item, index) in options2" :key="index">
+          <p @click="typesofroles(index)">{{ item.text }}</p>
+        </view>
+      </scroll-view>
+      <button @click="show2 = false">取消</button>
+    </u-popup>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				myuid:"",
-				condatas: {
-					dat_f:"",
-				},
-				checked1: false,
-				show1: false,
-				show2: false,
-				show3: false,
-				show4: false,
-				options1: [{
-						text: '光控'
-					},
-					{
-						text: '时控'
-					}
-				],
-				options2: [{
-						text: '常亮'
-					},
-					{
-						text: '1'
-					},
-					{
-						text: '2'
-					},
-					{
-						text: '3'
-					},
-					{
-						text: '4'
-					},
-					{
-						text: '5'
-					},
-					{
-						text: '6'
-					},
-					{
-						text: '7'
-					},
-					{
-						text: '8'
-					},
-					{
-						text: '00'
-					}
-				],
-				params: {
-					year: false,
-					month: false,
-					day: false,
-					hour: true,
-					minute: false,
-					second: false
-				},
-				myuser_type:false,
-				d_id:"",
-				allqingchong:false
-			}
-		},
-		methods: { //forecast.send_control.device_control_info
-			async controldata(data) { //设备列表
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.device_control_info',
-					data: {
-						d_id: data,
-						cmd: 'paramconf'
-					}
-				})
-				console.log(res)
-				this.condatas = res
-				if (this.condatas.ds == 1) {
-					this.checked1 = true
-				} else {
-					this.checked1 = false
-				}
-			},
-			//forecast.send_control.admin_device_control
-			async reorup(data) { //设备列表
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
-					data: {
-						d_id: data.d_id,
-						device_type_id: 2,
-						cmd: data.cmd
-					}
-				})
-				if (res == true) {
-					uni.showToast({
-						title: '指令下发成功!'
-					});
-				} else {
-					uni.showToast({
-						title: '指令下发失败!'
-					});
-				}
-			},
-			//forecast.send_control.device_control
-			async controlby(data) { //设备列表
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.device_control',
-					data: {
-						d_id: this.d_id,
-						device_type_id: 2,
-						config: data
-					}
-				})
-			},
-			clickLeft() {
-				uni.navigateBack({
-					delta: 1
-				})
-			},
-			typesofroles(index) {
-				this.condatas.tt = index
-				this.show2 = false
-			},
-			actionSheetCallback(index) {
-				this.condatas.ts = index
-			},
-			checkedTF(e) { //设备开关
-				if (e == true) {
-					this.condatas.ds = 1
-				} else {
-					this.condatas.ds = 0
-				}
-			},
-			confirmFun(e) { //开始时间
-				this.condatas.st = Number(e.hour)
-			},
-			confirmFun2(e) { //结束时间
-				this.condatas.et = Number(e.hour)
-			},
-			restart() { //重启
-					let obj = {
-						d_id: this.d_id,
-						cmd: 'reboot'
-					}
-					this.reorup(obj)
-			},
-			upgrade() { //升级
-					let obj = {
-						d_id: this.d_id,
-						cmd: 'update'
-					}
-					this.reorup(obj)
-			},
-			ensure() {
-				// var obj = this.condatas
-				console.log(this.condatas)
-				var obj = {}
-				for(var key in this.condatas){
-					if(key == "dat_f"){
-						obj["dattim"] = this.condatas[key]
-					}else if(key == "clt_t"){
-						obj["clt"] = this.condatas[key]
-					}else{
-						obj[key] = this.condatas[key]
-					}
-				}
-				let str = JSON.stringify(obj)
-				this.controlby(str)
-				this.clickLeft()
-			},
-			async getworm() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.clear_insects_permission',
-					data: {}
-				})
-				console.log(res)
-				this.allqingchong = res[0] == 1 ? true : false;
-			},
-			async suzumusi(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.device_control',
-					data: {
-						config: '{"cmd":"ctr_clear"}',
-						d_id: this.d_id,
-						device_type_id: "2",
-						req: "ctr_clear",
-					}
-				})
-				// console.log(res)
-				if (res == true) {
-					uni.showToast({
-						title: '指令下发成功!'
-					});
-				} else {
-					uni.showToast({
-						title: '指令下发失败!'
-					});
-				}
-			},
-			changing(e){
-				// console.log(e.detail.value)
-				this.condatas.dat_f = e.detail.value
-			},
-			changing2(e){
-				// console.log(e.detail.value)
-				this.condatas.clt_t = e.detail.value
-			},
-		},
-		onLoad(option) {
-			this.$forceUpdate()
-			this.getworm()
-			this.controldata(option.id)
-			this.d_id = option.id
-			uni.getStorage({
-				key: "myuid",
-				success: (res) => {
-					this.myuid = res.data
-				}
-			})
-			uni.getStorage({
-				key: "myuser_type",
-				success: (res) => {
-					if (Number(res.data) == 1) {
-						this.myuser_type = true
-					}
-				}
-			})
-		}
-	}
+export default {
+  data() {
+    return {
+      myuid: '',
+      condatas: {
+        dat_f: '',
+      },
+      checked1: false,
+      show1: false,
+      show2: false,
+      show3: false,
+      show4: false,
+      options1: [
+        {
+          text: '光控',
+        },
+        {
+          text: '时控',
+        },
+      ],
+      options2: [
+        {
+          text: '常亮',
+        },
+        {
+          text: '1',
+        },
+        {
+          text: '2',
+        },
+        {
+          text: '3',
+        },
+        {
+          text: '4',
+        },
+        {
+          text: '5',
+        },
+        {
+          text: '6',
+        },
+        {
+          text: '7',
+        },
+        {
+          text: '8',
+        },
+        {
+          text: '00',
+        },
+      ],
+      params: {
+        year: false,
+        month: false,
+        day: false,
+        hour: true,
+        minute: false,
+        second: false,
+      },
+      myuser_type: false,
+      d_id: '',
+      allqingchong: false,
+    };
+  },
+  methods: {
+    //forecast.send_control.device_control_info
+    async controldata(data) {
+      //设备列表
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.device_control_info',
+        data: {
+          d_id: data,
+          cmd: 'paramconf',
+        },
+      });
+      console.log(res);
+      this.condatas = res;
+      if (this.condatas.ds == 1) {
+        this.checked1 = true;
+      } else {
+        this.checked1 = false;
+      }
+    },
+    //forecast.send_control.admin_device_control
+    async reorup(data) {
+      //设备列表
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.admin_device_control',
+        data: {
+          d_id: data.d_id,
+          device_type_id: 2,
+          cmd: data.cmd,
+        },
+      });
+      if (res == true) {
+        uni.showToast({
+          title: '指令下发成功!',
+        });
+      } else {
+        uni.showToast({
+          title: '指令下发失败!',
+        });
+      }
+    },
+    //forecast.send_control.device_control
+    async controlby(data) {
+      //设备列表
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.device_control',
+        data: {
+          d_id: this.d_id,
+          device_type_id: 2,
+          config: data,
+        },
+      });
+    },
+    clickLeft() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    typesofroles(index) {
+      this.condatas.tt = index;
+      this.show2 = false;
+    },
+    actionSheetCallback(index) {
+      this.condatas.ts = index;
+    },
+    checkedTF(e) {
+      //设备开关
+      if (e == true) {
+        this.condatas.ds = 1;
+      } else {
+        this.condatas.ds = 0;
+      }
+    },
+    confirmFun(e) {
+      //开始时间
+      this.condatas.st = Number(e.hour);
+    },
+    confirmFun2(e) {
+      //结束时间
+      this.condatas.et = Number(e.hour);
+    },
+    restart() {
+      //重启
+      let obj = {
+        d_id: this.d_id,
+        cmd: 'reboot',
+      };
+      this.reorup(obj);
+    },
+    upgrade() {
+      //升级
+      let obj = {
+        d_id: this.d_id,
+        cmd: 'update',
+      };
+      this.reorup(obj);
+    },
+    ensure() {
+      // var obj = this.condatas
+      console.log(this.condatas);
+      var obj = {};
+      for (var key in this.condatas) {
+        if (key == 'dat_f') {
+          obj['dattim'] = this.condatas[key];
+        } else if (key == 'clt_t') {
+          obj['clt'] = this.condatas[key];
+        } else {
+          obj[key] = this.condatas[key];
+        }
+      }
+      let str = JSON.stringify(obj);
+      this.controlby(str);
+      this.clickLeft();
+    },
+    async getworm() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.clear_insects_permission',
+        data: {},
+      });
+      console.log(res);
+      this.allqingchong = res[0] == 1 ? true : false;
+    },
+    async suzumusi() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.device_control',
+        data: {
+          config: '{"cmd":"ctr_clear"}',
+          d_id: this.d_id,
+          device_type_id: '2',
+          req: 'ctr_clear',
+        },
+      });
+      // console.log(res)
+      if (res == true) {
+        uni.showToast({
+          title: '指令下发成功!',
+        });
+      } else {
+        uni.showToast({
+          title: '指令下发失败!',
+        });
+      }
+    },
+    changing(e) {
+      // console.log(e.detail.value)
+      this.condatas.dat_f = e.detail.value;
+    },
+    changing2(e) {
+      // console.log(e.detail.value)
+      this.condatas.clt_t = e.detail.value;
+    },
+  },
+  onLoad(option) {
+    this.$forceUpdate();
+    this.getworm();
+    this.controldata(option.id);
+    this.d_id = option.id;
+    uni.getStorage({
+      key: 'myuid',
+      success: (res) => {
+        this.myuid = res.data;
+      },
+    });
+    uni.getStorage({
+      key: 'myuser_type',
+      success: (res) => {
+        if (Number(res.data) == 1) {
+          this.myuser_type = true;
+        }
+      },
+    });
+  },
+};
 </script>
 
 <style lang="scss">
-	.control {
-		position: absolute;
-		top: 50px;
-		width: 90%;
-		left: 5%;
+.control {
+  position: absolute;
+  top: 50px;
+  width: 90%;
+  left: 5%;
 
-		.title_p {
-			padding-left: 20rpx;
-			border-left: 6rpx solid #28AE4F;
-			height: 40rpx;
-			margin-bottom: 20rpx;
-		}
+  .title_p {
+    padding-left: 20rpx;
+    border-left: 6rpx solid #28ae4f;
+    height: 40rpx;
+    margin-bottom: 20rpx;
+  }
 
-		.control_off_off {
-			display: flex;
-			justify-content: space-between;
-			margin-left: 24rpx;
-			padding: 0 30rpx;
-			background-color: #F7F8FA;
-			height: 60rpx;
-			line-height: 60rpx;
-			margin-bottom: 20rpx;
-		}
+  .control_off_off {
+    display: flex;
+    justify-content: space-between;
+    margin-left: 24rpx;
+    padding: 0 30rpx;
+    background-color: #f7f8fa;
+    height: 60rpx;
+    line-height: 60rpx;
+    margin-bottom: 20rpx;
+  }
 
-		.slider {
-			display: flex;
-			padding: 0 30rpx 0 0;
-			margin-left: 24rpx;
-			margin-bottom: 20rpx;
-			/deep/uni-slider{
-				margin: 0 !important;
-			}
-		}
+  .slider {
+    display: flex;
+    padding: 0 30rpx 0 0;
+    margin-left: 24rpx;
+    margin-bottom: 20rpx;
+    ::v-deep uni-slider {
+      margin: 0 !important;
+    }
+  }
 
-		.control_restart {
-			margin-bottom: 20rpx;
+  .control_restart {
+    margin-bottom: 20rpx;
 
-			.title_p {
-				border-left: 6rpx solid #D17978;
-			}
+    .title_p {
+      border-left: 6rpx solid #d17978;
+    }
 
-			.control_restart_but {
-				display: flex;
-				justify-content: flex-start;
-				margin-left: 24rpx;
+    .control_restart_but {
+      display: flex;
+      justify-content: flex-start;
+      margin-left: 24rpx;
 
-				button {
-					width: 110rpx;
-					height: 50rpx;
-					line-height: 50rpx;
-					font-size: 26rpx;
-					margin: 0 20rpx 0 0;
-					color: #FFFFFF;
-					background-color: #D17978;
-				}
-			}
-		}
+      button {
+        width: 110rpx;
+        height: 50rpx;
+        line-height: 50rpx;
+        font-size: 26rpx;
+        margin: 0 20rpx 0 0;
+        color: #ffffff;
+        background-color: #d17978;
+      }
+    }
+  }
 
-		.control_off {}
-	}
+  .control_off {
+  }
+}
 
-	.pop-up {
-		.sheet {
-			background-color: white;
-			height: 400rpx;
-			overflow: hidden;
+.pop-up {
+  .sheet {
+    background-color: white;
+    height: 400rpx;
+    overflow: hidden;
 
-			.sheet-text {
-				height: 80rpx;
-				border-bottom: 2rpx solid #F7F8FA;
+    .sheet-text {
+      height: 80rpx;
+      border-bottom: 2rpx solid #f7f8fa;
 
-				p {
-					text-align: center;
-					height: 80rpx;
-					line-height: 80rpx;
-					color: black;
-					font-size: 16px;
-				}
-			}
-		}
+      p {
+        text-align: center;
+        height: 80rpx;
+        line-height: 80rpx;
+        color: black;
+        font-size: 16px;
+      }
+    }
+  }
 
-		button {
-			color: black;
-			position: absolute;
-			bottom: 0;
-			width: 100%;
-			font-size: 16px;
-			height: 80rpx;
-		}
-	}
+  button {
+    color: black;
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    font-size: 16px;
+    height: 80rpx;
+  }
+}
 
-	.ensure {
-		width: 100%;
-		position: absolute;
-		bottom: 100rpx;
+.ensure {
+  width: 100%;
+  position: absolute;
+  bottom: 100rpx;
 
-		.ensure_btn {
-			width: 90%;
-			margin: 0 auto;
-			height: 60rpx;
-			line-height: 60rpx;
-			text-align: center;
-			background-color: #28AE4F;
-			color: #FFFFFF;
-			border-radius: 30rpx;
-		}
-	}
-	.qingchong{
-		width: 90%;
-		margin: 10px auto;
-		text-align: right;
-		display: flex;
-		justify-content: flex-end;
-		.qingchongbox{
-			padding: 2px 8px 3px 8px;
-			background-color: #28AE4F;
-			color: #fff;
-			border-radius: 5px;
-			// line-height: 27px;
-		}
-	}
+  .ensure_btn {
+    width: 90%;
+    margin: 0 auto;
+    height: 60rpx;
+    line-height: 60rpx;
+    text-align: center;
+    background-color: #28ae4f;
+    color: #ffffff;
+    border-radius: 30rpx;
+  }
+}
+.qingchong {
+  width: 90%;
+  margin: 10px auto;
+  text-align: right;
+  display: flex;
+  justify-content: flex-end;
+  .qingchongbox {
+    padding: 2px 8px 3px 8px;
+    background-color: #28ae4f;
+    color: #fff;
+    border-radius: 5px;
+    // line-height: 27px;
+  }
+}
 </style>

pages/prevention/index.vue

@@ -1,405 +1,478 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view class="" style="position: relative;top: 44px;">
-			<view style="position: fixed;z-index: 100;">
-				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" left-text="返回" title="防治系统" right-icon="search"
-					@clickRight="clickRight" size="16"></uni-nav-bar>
-				<view class="inputs" :style="{'width':width+'rpx'}">
-					<input type="text" value="" placeholder="请输入设备ID或设备名称" v-model="imports" @input="searchinp"
-						class="inputbox" :clearable="false" />
-					<u-icon name="search" size="40" class="icon" @click="search"></u-icon>
-				</view>
-			</view>
-			<image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/prevention/1.png'" mode="" class="image">
-			</image>
-			<view class="loading" v-if="loadingtf">
-				<image src="../../static/images/ajax-loader.gif" mode="" class="img"></image>
-			</view>
-			<view class="prevents">
-				<view class="prevents_item" v-for="item,index in eqlistdata" :key="index" @click="eqdetails(item)">
-					<image
-						:src="item.is_online==1?'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/6.png':'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/7.png'"
-						mode="" class="prevents_item_img"></image>
-					<view class="prevents_item_top">
-						<p>设备名称：{{item.device_name==""?"无":item.device_name}}</p>
-						<p :class="item.is_online==1?'green':'red'" v-text="item.is_online==1?'在线':'离线'"></p>
-					</view>
-					<view class="prevents_item_bot">
-						<p>设备 ID：{{item.imei}}</p>
-						<p>最新上报时间：{{item.addtime|timeFormat()}}</p>
-						<view class="" style="display: flex;justify-content: space-between;"
-							v-if="showLastTime">
-							<p>设备到期情况：<span
-									:class="'prevents_item_bot_sapn'+item.device_expire">{{item.device_expiretext}}</span>
-							</p>
-							<p style="color: #3C84FE;" v-if="item.device_expire!=0" @click.stop="examine(item)">查看详情</p>
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		<u-modal v-model="show" :title="title" :showConfirmButton="false"
-			:title-style="{'text-align':'left','padding-left':'10px','font-weight':700}" :mask-close-able="true">
-			<view class="slot-content">
-				<rich-text :nodes="content"></rich-text>
-			</view>
-		</u-modal>
-		<view class="top">
-			<view class="backtop" @click="top" v-if="isTop">
-				<image src="../../static/images/1.png" mode="" class="img0"></image>
-			</view>
-			<view class="more">
-				<view class="box" @click="allwormdel" v-show="allqingchong && filtrateTF">
-					<p>清虫</p>
-				</view>
-				<view class="box" @click="online" v-show="filtrateTF">
-					<p>在线</p>
-				</view>
-				<view class="box" @click="offline" v-show="filtrateTF">
-					<p>离线</p>
-				</view>
-				<view class="box" @click="complete" v-show="filtrateTF">
-					<p>全部</p>
-				</view>
-				<view @click="filtrate">
-					<image src="../../static/images/b0bcdb0e3fe8690520f743aa8303bf2.png" mode="" class="img1"></image>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view style="position: fixed; z-index: 100">
+        <uni-nav-bar
+          @clickLeft="clickLeft"
+          left-icon="back"
+          left-text="返回"
+          title="防治系统"
+          right-icon="search"
+          @clickRight="clickRight"
+          size="16"
+        ></uni-nav-bar>
+        <view class="inputs" :style="{ width: width + 'rpx' }">
+          <input
+            type="text"
+            value=""
+            placeholder="请输入设备ID或设备名称"
+            v-model="imports"
+            @input="searchinp"
+            class="inputbox"
+            :clearable="false"
+          />
+          <u-icon name="search" size="40" class="icon" @click="search"></u-icon>
+        </view>
+      </view>
+      <image
+        :src="
+          'http://www.hnyfwlw.com:8006/bigdata_app' + '/image/prevention/1.png'
+        "
+        mode=""
+        class="image"
+      >
+      </image>
+      <view class="loading" v-if="loadingtf">
+        <image
+          src="../../static/images/ajax-loader.gif"
+          mode=""
+          class="img"
+        ></image>
+      </view>
+      <view class="prevents">
+        <view
+          class="prevents_item"
+          v-for="(item, index) in eqlistdata"
+          :key="index"
+          @click="eqdetails(item)"
+        >
+          <image
+            :src="
+              item.is_online == 1
+                ? 'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/6.png'
+                : 'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/7.png'
+            "
+            mode=""
+            class="prevents_item_img"
+          ></image>
+          <view class="prevents_item_top">
+            <p>
+              设备名称：{{ item.device_name == '' ? '无' : item.device_name }}
+            </p>
+            <p
+              :class="item.is_online == 1 ? 'green' : 'red'"
+              v-text="item.is_online == 1 ? '在线' : '离线'"
+            ></p>
+          </view>
+          <view class="prevents_item_bot">
+            <p>设备 ID：{{ item.imei }}</p>
+            <p>最新上报时间：{{ item.addtime | timeFormat() }}</p>
+            <view
+              class=""
+              style="display: flex; justify-content: space-between"
+              v-if="showLastTime"
+            >
+              <p>
+                设备到期情况：<span
+                  :class="'prevents_item_bot_sapn' + item.device_expire"
+                  >{{ item.device_expiretext }}</span
+                >
+              </p>
+              <p
+                style="color: #3c84fe"
+                v-if="item.device_expire != 0"
+                @click.stop="examine(item)"
+              >
+                查看详情
+              </p>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <u-modal
+      v-model="show"
+      :title="title"
+      :showConfirmButton="false"
+      :title-style="{
+        'text-align': 'left',
+        'padding-left': '10px',
+        'font-weight': 700,
+      }"
+      :mask-close-able="true"
+    >
+      <view class="slot-content">
+        <rich-text :nodes="content"></rich-text>
+      </view>
+    </u-modal>
+    <view class="top">
+      <view class="backtop" @click="top" v-if="isTop">
+        <image src="../../static/images/1.png" mode="" class="img0"></image>
+      </view>
+      <view class="more">
+        <view
+          class="box"
+          @click="allwormdel"
+          v-show="allqingchong && filtrateTF"
+        >
+          <p>清虫</p>
+        </view>
+        <view class="box" @click="online" v-show="filtrateTF">
+          <p>在线</p>
+        </view>
+        <view class="box" @click="offline" v-show="filtrateTF">
+          <p>离线</p>
+        </view>
+        <view class="box" @click="complete" v-show="filtrateTF">
+          <p>全部</p>
+        </view>
+        <view @click="filtrate">
+          <image
+            src="../../static/images/b0bcdb0e3fe8690520f743aa8303bf2.png"
+            mode=""
+            class="img1"
+          ></image>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	import {
-		Debounce
-	} from "../../util/anitthro.js"
-	export default {
-		data() {
-			return {
-				page: 1,
-				size: 10,
-				eqlistdata: [],
-				isTop: false,
-				filtrateTF: false,
-				device_status: "",
-				width: 0,
-				imports: "", //搜索内容
-				loadingtf: false, //loading
-				show: false,
-				title: "",
-				content: "",
-				allqingchong: false,
-				showLastTime: false,
-			}
-		},
-		methods: {
-			testId(id, list) {
-				for (var i = 0; i < list.length; i++) {
-					if (list[i].children) {
-						var data = list[i].children
-						for (var j = 0; j < data.length; j++) {
-							if (data[j].children) {
-								var item = data[j].children
-								for (var k = 0; k < item.length; k++) {
-									if (item[k].pur_id == id) {
-										return true
-									}
-								}
-							}
-
-						}
-					}
-				};
-			},
-			async eqlist() { //设备列表
-				this.loadingtf = true
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.worm_lamp.lamp_list',
-					data: {
-						device_type_id: 2,
-						page: this.page,
-						page_size: "10",
-						device_status: this.device_status,
-						device_id: this.imports
-					}
-				})
-				this.loadingtf = false
-				this.eqlistdata = this.eqlistdata.concat(res.data)
-				for (var i = 0; i < this.eqlistdata.length; i++) {
-					if (this.eqlistdata[i].device_expire == 0) {
-						this.eqlistdata[i]['device_expiretext'] = "未到期"
-					} else if (this.eqlistdata[i].device_expire == 1) {
-						this.eqlistdata[i]['device_expiretext'] = "已到期"
-					} else if (this.eqlistdata[i].device_expire == 2) {
-						this.eqlistdata[i]['device_expiretext'] = "即将到期"
-					}
-				}
-				console.log(this.eqlistdata)
-			},
-			clickLeft() {
-				uni.switchTab({
-					url: "../index/index"
-				})
-			},
-			clickRight() {
-				// uni.navigateTo({
-				// 	url: "./search"
-				// })
-				this.width = 600
-			},
-			eqdetails(data) {
-				uni.navigateTo({
-					url: "./equipmentdetails?shebei=" + JSON.stringify(data)
-				})
-			},
-			filtrate() {
-				this.filtrateTF = !this.filtrateTF
-			},
-			top() {
-				uni.pageScrollTo({
-					scrollTop: 0,
-					duration: 500
-				})
-			},
-			online() {
-				this.eqlistdata = []
-				this.page = 1
-				this.device_status = 1
-				this.eqlist()
-				this.filtrateTF = !this.filtrateTF
-			},
-			offline() {
-				this.eqlistdata = []
-				this.page = 1
-				this.device_status = 0
-				this.eqlist()
-				this.filtrateTF = !this.filtrateTF
-			},
-			complete() {
-				this.eqlistdata = []
-				this.page = 1
-				this.device_status = ""
-				this.eqlist()
-				this.filtrateTF = !this.filtrateTF
-			},
-			search() { //搜索按钮搜索
-				// this.eqlistdata = []
-				this.searchinp()
-			},
-			searchinp() { //自动搜索
-				Debounce(() => {
-					this.page = 1
-					this.eqlistdata = []
-					this.eqlist()
-				}, 1000)()
-			},
-			examine(e) {
-				// console.log(this)
-				this.show = true
-				this.title = e.device_expiretext
-				this.content =
-					`<p style="padding-left:10px;margin:10px 0;font-size:14px;">到期时间  ${this.timezhuan(e.device_expire_time)}
-				</p><p style="font-size:14px;text-align:right;color:#3C84FE;margin-bottom:10px;padding-right:10px">注：请前往PC端进行充值</p>`
-			},
-			timezhuan(time) {
-				function fun(a) {
-					return String(a).length == 1 ? '0' + a : a
-				}
-				let date = new Date(time * 1000)
-				let y = date.getFullYear()
-				let m = date.getMonth() + 1
-				let d = date.getDate()
-				let h = date.getHours()
-				let min = date.getMinutes()
-				let sec = date.getSeconds()
-				return `${y}-${fun(m)}-${fun(d)} ${fun(h)}:${fun(min)}:${fun(sec)}`
-			},
-			async getworm() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.clear_insects_permission',
-					data: {}
-				})
-				console.log(res)
-				this.allqingchong = res[1] == 1 ? true : false;
-			},
-			async allwormdel() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=forecast.send_control.clear_insects',
-					data: {}
-				})
-				console.log(res)
-				uni.showToast({
-					title: res ? "指令下发成功" : "指令下发失败",
-					icon: "none"
-				})
-			}
-		},
-		onLoad() {
-			this.getworm()
-			this.eqlist()
-			uni.getStorage({
-				key: "jurisdiction",
-				success: (res) => {
-					this.showLastTime = this.testId(325, JSON.parse(res.data));
-				}
-			})
-		},
-		onReachBottom() {
-			this.page++
-			this.eqlist()
-		},
-		onPageScroll(e) { //nvue暂不支持滚动监听，可用bindingx代替
-			if (e.scrollTop > 200) { //距离大于200时显示
-				this.isTop = true
-			} else { //距离小于200时隐藏
-				this.isTop = false
-			}
-		}
-	}
+import { Debounce } from '../../util/anitthro.js';
+export default {
+  data() {
+    return {
+      page: 1,
+      size: 10,
+      eqlistdata: [],
+      isTop: false,
+      filtrateTF: false,
+      device_status: '',
+      width: 0,
+      imports: '', //搜索内容
+      loadingtf: false, //loading
+      show: false,
+      title: '',
+      content: '',
+      allqingchong: false,
+      showLastTime: false,
+    };
+  },
+  methods: {
+    testId(id, list) {
+      for (var i = 0; i < list.length; i++) {
+        if (list[i].children) {
+          var data = list[i].children;
+          for (var j = 0; j < data.length; j++) {
+            if (data[j].children) {
+              var item = data[j].children;
+              for (var k = 0; k < item.length; k++) {
+                if (item[k].pur_id == id) {
+                  return true;
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    async eqlist() {
+      //设备列表
+      this.loadingtf = true;
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.worm_lamp.lamp_list',
+        data: {
+          device_type_id: 2,
+          page: this.page,
+          page_size: '10',
+          device_status: this.device_status,
+          device_id: this.imports,
+        },
+      });
+      this.loadingtf = false;
+      this.eqlistdata = this.eqlistdata.concat(res.data);
+      for (var i = 0; i < this.eqlistdata.length; i++) {
+        if (this.eqlistdata[i].device_expire == 0) {
+          this.eqlistdata[i]['device_expiretext'] = '未到期';
+        } else if (this.eqlistdata[i].device_expire == 1) {
+          this.eqlistdata[i]['device_expiretext'] = '已到期';
+        } else if (this.eqlistdata[i].device_expire == 2) {
+          this.eqlistdata[i]['device_expiretext'] = '即将到期';
+        }
+      }
+      console.log(this.eqlistdata);
+    },
+    clickLeft() {
+      uni.switchTab({
+        url: '../index/index',
+      });
+    },
+    clickRight() {
+      // uni.navigateTo({
+      // 	url: "./search"
+      // })
+      this.width = 600;
+    },
+    eqdetails(data) {
+      uni.navigateTo({
+        url: './equipmentdetails?shebei=' + JSON.stringify(data),
+      });
+    },
+    filtrate() {
+      this.filtrateTF = !this.filtrateTF;
+    },
+    top() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 500,
+      });
+    },
+    online() {
+      this.eqlistdata = [];
+      this.page = 1;
+      this.device_status = 1;
+      this.eqlist();
+      this.filtrateTF = !this.filtrateTF;
+    },
+    offline() {
+      this.eqlistdata = [];
+      this.page = 1;
+      this.device_status = 0;
+      this.eqlist();
+      this.filtrateTF = !this.filtrateTF;
+    },
+    complete() {
+      this.eqlistdata = [];
+      this.page = 1;
+      this.device_status = '';
+      this.eqlist();
+      this.filtrateTF = !this.filtrateTF;
+    },
+    search() {
+      //搜索按钮搜索
+      // this.eqlistdata = []
+      this.searchinp();
+    },
+    searchinp() {
+      //自动搜索
+      Debounce(() => {
+        this.page = 1;
+        this.eqlistdata = [];
+        this.eqlist();
+      }, 1000)();
+    },
+    examine(e) {
+      // console.log(this)
+      this.show = true;
+      this.title = e.device_expiretext;
+      this.content = `<p style="padding-left:10px;margin:10px 0;font-size:14px;">到期时间  ${this.timezhuan(
+        e.device_expire_time
+      )}
+				</p><p style="font-size:14px;text-align:right;color:#3C84FE;margin-bottom:10px;padding-right:10px">注：请前往PC端进行充值</p>`;
+    },
+    timezhuan(time) {
+      function fun(a) {
+        return String(a).length == 1 ? '0' + a : a;
+      }
+      let date = new Date(time * 1000);
+      let y = date.getFullYear();
+      let m = date.getMonth() + 1;
+      let d = date.getDate();
+      let h = date.getHours();
+      let min = date.getMinutes();
+      let sec = date.getSeconds();
+      return `${y}-${fun(m)}-${fun(d)} ${fun(h)}:${fun(min)}:${fun(sec)}`;
+    },
+    async getworm() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.clear_insects_permission',
+        data: {},
+      });
+      console.log(res);
+      this.allqingchong = res[1] == 1 ? true : false;
+    },
+    async allwormdel() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=forecast.send_control.clear_insects',
+        data: {},
+      });
+      console.log(res);
+      uni.showToast({
+        title: res ? '指令下发成功' : '指令下发失败',
+        icon: 'none',
+      });
+    },
+  },
+  onLoad() {
+    this.getworm();
+    this.eqlist();
+    uni.getStorage({
+      key: 'jurisdiction',
+      success: (res) => {
+        this.showLastTime = this.testId(325, JSON.parse(res.data));
+      },
+    });
+  },
+  onReachBottom() {
+    this.page++;
+    this.eqlist();
+  },
+  onPageScroll(e) {
+    //nvue暂不支持滚动监听，可用bindingx代替
+    if (e.scrollTop > 200) {
+      //距离大于200时显示
+      this.isTop = true;
+    } else {
+      //距离小于200时隐藏
+      this.isTop = false;
+    }
+  },
+};
 </script>
 
 <style lang="scss">
-	.inputs {
-		height: 54rpx;
-		background-color: #E4E4E4;
-		border-radius: 27rpx;
-		position: absolute;
-		right: 20rpx;
-		top: 24rpx;
-		transition: width 0.5s;
-		overflow: hidden;
-		padding-top: 8rpx;
-		box-sizing: border-box;
+.inputs {
+  height: 54rpx;
+  background-color: #e4e4e4;
+  border-radius: 27rpx;
+  position: absolute;
+  right: 20rpx;
+  top: 24rpx;
+  transition: width 0.5s;
+  overflow: hidden;
+  padding-top: 8rpx;
+  box-sizing: border-box;
 
-		.inputbox {
-			width: 85%;
-			text-indent: 1rem;
-			font-size: 26rpx;
-		}
+  .inputbox {
+    width: 85%;
+    text-indent: 1rem;
+    font-size: 26rpx;
+  }
 
-		.icon {
-			position: absolute;
-			top: 8rpx;
-			right: 26rpx;
-		}
-	}
+  .icon {
+    position: absolute;
+    top: 8rpx;
+    right: 26rpx;
+  }
+}
 
-	/deep/.uni-icons {
-		font-size: 40rpx !important;
-	}
+::v-deep .uni-icons {
+  font-size: 40rpx !important;
+}
 
-	.image {
-		position: fixed;
-		top: 88px;
-		width: 100%;
-		height: 160rpx;
-		z-index: 555;
-	}
+.image {
+  position: fixed;
+  top: 88px;
+  width: 100%;
+  height: 160rpx;
+  z-index: 555;
+}
 
-	.loading {
-		position: fixed;
-		top: 440px;
-		width: 95%;
-		left: 2.5%;
-		text-align: center;
+.loading {
+  position: fixed;
+  top: 440px;
+  width: 95%;
+  left: 2.5%;
+  text-align: center;
 
-		.img {
-			width: 300rpx;
-			height: 40rpx;
-		}
-	}
+  .img {
+    width: 300rpx;
+    height: 40rpx;
+  }
+}
 
-	.prevents {
-		width: 100%;
-		position: absolute;
-		top: 140px;
+.prevents {
+  width: 100%;
+  position: absolute;
+  top: 140px;
 
-		.prevents_item {
-			width: 95%;
-			margin: 0 auto 30rpx;
-			border-radius: 10rpx;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 20rpx 40rpx 20rpx 80rpx;
-			position: relative;
-			box-sizing: border-box;
+  .prevents_item {
+    width: 95%;
+    margin: 0 auto 30rpx;
+    border-radius: 10rpx;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 20rpx 40rpx 20rpx 80rpx;
+    position: relative;
+    box-sizing: border-box;
 
-			.prevents_item_img {
-				width: 30rpx;
-				height: 50rpx;
-				position: absolute;
-				top: -4rpx;
-				left: 30rpx;
-			}
+    .prevents_item_img {
+      width: 30rpx;
+      height: 50rpx;
+      position: absolute;
+      top: -4rpx;
+      left: 30rpx;
+    }
 
-			.prevents_item_top {
-				display: flex;
-				justify-content: space-between;
-				height: 60rpx;
-				border-bottom: 2rpx solid #F4F4F4;
-				line-height: 60rpx;
-				font-size: 26rpx;
+    .prevents_item_top {
+      display: flex;
+      justify-content: space-between;
+      height: 60rpx;
+      border-bottom: 2rpx solid #f4f4f4;
+      line-height: 60rpx;
+      font-size: 26rpx;
 
-				.red {
-					color: #FF4747;
-				}
+      .red {
+        color: #ff4747;
+      }
 
-				.green {
-					color: #00B075;
-				}
-			}
+      .green {
+        color: #00b075;
+      }
+    }
 
-			.prevents_item_bot {
-				margin-top: 20rpx;
-				font-size: 26rpx;
-				color: #BDBDBD;
+    .prevents_item_bot {
+      margin-top: 20rpx;
+      font-size: 26rpx;
+      color: #bdbdbd;
 
-				.prevents_item_bot_sapn0 {
-					color: #00B075;
-				}
+      .prevents_item_bot_sapn0 {
+        color: #00b075;
+      }
 
-				.prevents_item_bot_sapn1 {
-					color: #FF4747;
-				}
+      .prevents_item_bot_sapn1 {
+        color: #ff4747;
+      }
 
-				.prevents_item_bot_sapn2 {
-					color: #FFAB00;
-				}
-			}
-		}
-	}
+      .prevents_item_bot_sapn2 {
+        color: #ffab00;
+      }
+    }
+  }
+}
 
-	.top {
-		position: fixed;
-		right: 10px;
-		bottom: 40px;
-		z-index: 100;
+.top {
+  position: fixed;
+  right: 10px;
+  bottom: 40px;
+  z-index: 100;
 
-		image {
-			width: 100rpx;
-			height: 100rpx;
-		}
+  image {
+    width: 100rpx;
+    height: 100rpx;
+  }
 
-		.backtop {
-			display: flex;
-			justify-content: flex-end;
-			margin-bottom: 10rpx;
-		}
+  .backtop {
+    display: flex;
+    justify-content: flex-end;
+    margin-bottom: 10rpx;
+  }
 
-		.more {
-			display: flex;
-		}
+  .more {
+    display: flex;
+  }
 
-		.box {
-			width: 80rpx;
-			height: 80rpx;
-			background-color: rgba(161, 161, 161, 0.45);
-			border-radius: 50%;
-			text-align: center;
-			line-height: 80rpx;
-			box-sizing: border-box;
-			margin: 14rpx 10rpx 0 0;
-			color: #fff;
-		}
-	}
-</style>
+  .box {
+    width: 80rpx;
+    height: 80rpx;
+    background-color: rgba(161, 161, 161, 0.45);
+    border-radius: 50%;
+    text-align: center;
+    line-height: 80rpx;
+    box-sizing: border-box;
+    margin: 14rpx 10rpx 0 0;
+    color: #fff;
+  }
+}
+</style>

pages/waterandfer/index.vue

@@ -1,54 +1,110 @@
 <template>
-	<view>
-		<view class="status_bar"></view>
-		<view class="" style="position: relative;top: 44px;">
-			<view style="position: fixed;z-index: 100;">
-				<uni-nav-bar @clickLeft="clickLeft" left-icon="back" left-text="返回" title="水肥一体化" right-icon="search"
-					@clickRight="clickRight" size="16"></uni-nav-bar>
-				<view class="inputs" :style="{'width':width+'rpx'}">
-					<input type="text" value="" placeholder="请输入设备ID或设备名称" v-model="imports" @input="searchinp"
-						class="inputbox" :clearable="false" />
-					<u-icon name="search" size="40" class="icon" @click="search"></u-icon>
-				</view>
-			</view>
-			<image :src="'http://www.hnyfwlw.com:8006/bigdata_app/image/waterandfer/1.png'" mode="" class="image">
-			</image>
-			<view class="loading" v-if="loadingtf">
-				<image src="../../static/images/ajax-loader.gif" mode="" class="img"></image>
-			</view>
-			<view class="prevents">
-				<view class="prevents_item" v-for="item,index in eqlistdata" :key="index" @click="eqdetails(item)">
-					<!-- <image
+  <view>
+    <view class="status_bar"></view>
+    <view class="" style="position: relative; top: 44px">
+      <view style="position: fixed; z-index: 100">
+        <uni-nav-bar
+          @clickLeft="clickLeft"
+          left-icon="back"
+          left-text="返回"
+          title="水肥一体化"
+          right-icon="search"
+          @clickRight="clickRight"
+          size="16"
+        ></uni-nav-bar>
+        <view class="inputs" :style="{ width: width + 'rpx' }">
+          <input
+            type="text"
+            value=""
+            placeholder="请输入设备ID或设备名称"
+            v-model="imports"
+            @input="searchinp"
+            class="inputbox"
+            :clearable="false"
+          />
+          <u-icon name="search" size="40" class="icon" @click="search"></u-icon>
+        </view>
+      </view>
+      <image
+        :src="'http://www.hnyfwlw.com:8006/bigdata_app/image/waterandfer/1.png'"
+        mode=""
+        class="image"
+      >
+      </image>
+      <view class="loading" v-if="loadingtf">
+        <image
+          src="../../static/images/ajax-loader.gif"
+          mode=""
+          class="img"
+        ></image>
+      </view>
+      <view class="prevents">
+        <view
+          class="prevents_item"
+          v-for="(item, index) in eqlistdata"
+          :key="index"
+          @click="eqdetails(item)"
+        >
+          <!-- <image
 						:src="item.is_online==1?'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/6.png':'http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/7.png'"
 						mode="" class="prevents_item_img"></image> 在线离线区分-->
-					<image src="http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/6.png" mode="" class="prevents_item_img"></image>
-					<view class="prevents_item_top">
-						<p>设备名称：{{item.device_name==""?"无":item.device_name}}</p>
-						<!-- <p :class="item.is_online==1?'green':'red'" v-text="item.is_online==1?'在线':'离线'"></p> -->
-					</view>
-					<view class="prevents_item_bot">
-						<p>设备 ID：{{item.device_id}}</p>
-						<p>最新上报时间：{{item.uptime|timeFormat()}}</p>
-						<view class="" style="display: flex;justify-content: space-between;" v-if="$QueryPermission(325)">
-							<p>设备到期情况：<span
-									:class="'prevents_item_bot_sapn'+item.device_expire">{{item.device_expiretext}}</span>
-							</p>
-							<p style="color: #3C84FE;" v-if="item.device_expire!=0" @click.stop="examine(item)">查看详情</p>
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		<u-modal v-model="show" :title="title" :showConfirmButton="false" :title-style="{'text-align':'left','padding-left':'10px','font-weight':700}" :mask-close-able="true">
-			<view class="slot-content">
-				<rich-text :nodes="content"></rich-text>
-			</view>
-		</u-modal>
-		<view class="top">
-			<view class="backtop" @click="top" v-if="isTop">
-				<image src="../../static/images/1.png" mode="" class="img0"></image>
-			</view>
-			<!-- <view class="more">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/6.png"
+            mode=""
+            class="prevents_item_img"
+          ></image>
+          <view class="prevents_item_top">
+            <p>
+              设备名称：{{ item.device_name == '' ? '无' : item.device_name }}
+            </p>
+            <!-- <p :class="item.is_online==1?'green':'red'" v-text="item.is_online==1?'在线':'离线'"></p> -->
+          </view>
+          <view class="prevents_item_bot">
+            <p>设备 ID：{{ item.device_id }}</p>
+            <p>最新上报时间：{{ item.uptime | timeFormat() }}</p>
+            <view
+              class=""
+              style="display: flex; justify-content: space-between"
+              v-if="$QueryPermission(325)"
+            >
+              <p>
+                设备到期情况：<span
+                  :class="'prevents_item_bot_sapn' + item.device_expire"
+                  >{{ item.device_expiretext }}</span
+                >
+              </p>
+              <p
+                style="color: #3c84fe"
+                v-if="item.device_expire != 0"
+                @click.stop="examine(item)"
+              >
+                查看详情
+              </p>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <u-modal
+      v-model="show"
+      :title="title"
+      :showConfirmButton="false"
+      :title-style="{
+        'text-align': 'left',
+        'padding-left': '10px',
+        'font-weight': 700,
+      }"
+      :mask-close-able="true"
+    >
+      <view class="slot-content">
+        <rich-text :nodes="content"></rich-text>
+      </view>
+    </u-modal>
+    <view class="top">
+      <view class="backtop" @click="top" v-if="isTop">
+        <image src="../../static/images/1.png" mode="" class="img0"></image>
+      </view>
+      <!-- <view class="more">
 				<view class="box" @click="online" v-show="filtrateTF">
 					<p>在线</p>
 				</view>
@@ -62,283 +118,289 @@
 					<image src="../../static/images/b0bcdb0e3fe8690520f743aa8303bf2.png" mode="" class="img1"></image>
 				</view>
 			</view> -->
-		</view>
-	</view>
+    </view>
+  </view>
 </template>
 
 <script>
-	import {
-		Debounce
-	} from "../../util/anitthro.js"
-	export default {
-		data() {
-			return {
-				page: 1,
-				size: 10,
-				eqlistdata: [],
-				isTop: false,
-				filtrateTF: false,
-				device_status: "",
-				width: 0,
-				imports: "", //搜索内容
-				loadingtf: false, //loading
-				show: false,
-				title: "",
-				content: ""
-			}
-		},
-		methods: {
-			async eqlist() { //设备列表
-				this.loadingtf = true
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=weather.weather.sf_page',
-					data: {
-						page: this.page,
-						page_size: "10",
-						device_id: this.imports,
-					}
-				})
-				this.loadingtf = false
-				this.eqlistdata = this.eqlistdata.concat(res.ids)
-				console.log(this.eqlistdata)
-			},
-			clickLeft() {
-				uni.switchTab({
-					url: "../index/index"
-				})
-			},
-			clickRight() {
-				// uni.navigateTo({
-				// 	url: "./search"
-				// })
-				this.width = 600
-				this.page = 1
-			},
-			eqdetails(data) {
-				uni.navigateTo({
-					url: "./datails?shebei=" + JSON.stringify(data)
-				})
-			},
-			filtrate() {
-				this.filtrateTF = !this.filtrateTF
-			},
-			top() {
-				uni.pageScrollTo({
-					scrollTop: 0,
-					duration: 500
-				})
-			},
-			online() {
-				this.eqlistdata = []
-				this.page = 1
-				this.device_status = 1
-				this.eqlist()
-				this.filtrateTF = !this.filtrateTF
-			},
-			offline() {
-				this.eqlistdata = []
-				this.page = 1
-				this.device_status = 0
-				this.eqlist()
-				this.filtrateTF = !this.filtrateTF
-			},
-			complete() {
-				this.eqlistdata = []
-				this.page = 1
-				this.device_status = ""
-				this.eqlist()
-				this.filtrateTF = !this.filtrateTF
-			},
-			search() { //搜索按钮搜索
-				// this.eqlistdata = []
-				this.searchinp()
-			},
-			searchinp() { //自动搜索
-				Debounce(() => {
-					this.page = 1
-					this.eqlistdata = []
-					this.eqlist()
-				}, 1000)()
-			},
-			examine(e) {
-				// console.log(this)
-				this.show = true
-				this.title = e.device_expiretext
-				this.content = `<p style="padding-left:10px;margin:10px 0;font-size:14px;">到期时间  ${this.timezhuan(e.device_expire_time)}
-				</p><p style="font-size:14px;text-align:right;color:#3C84FE;margin-bottom:10px;padding-right:10px">注：请前往PC端进行充值</p>`
-			},
-			timezhuan(time) {
-				function fun(a) {
-					return String(a).length == 1 ? '0' + a : a
-				}
-				let date = new Date(time * 1000)
-				let y = date.getFullYear()
-				let m = date.getMonth() + 1
-				let d = date.getDate()
-				let h = date.getHours()
-				let min = date.getMinutes()
-				let sec = date.getSeconds()
-				return `${y}-${fun(m)}-${fun(d)} ${fun(h)}:${fun(min)}:${fun(sec)}`
-			},
-		},
-		onLoad() {
-			this.eqlist()
-		},
-		onReachBottom() {
-			this.page++
-			this.eqlist()
-		},
-		onPageScroll(e) { //nvue暂不支持滚动监听，可用bindingx代替
-			if (e.scrollTop > 200) { //距离大于200时显示
-				this.isTop = true
-			} else { //距离小于200时隐藏
-				this.isTop = false
-			}
-		}
-	}
+import { Debounce } from '../../util/anitthro.js';
+export default {
+  data() {
+    return {
+      page: 1,
+      size: 10,
+      eqlistdata: [],
+      isTop: false,
+      filtrateTF: false,
+      device_status: '',
+      width: 0,
+      imports: '', //搜索内容
+      loadingtf: false, //loading
+      show: false,
+      title: '',
+      content: '',
+    };
+  },
+  methods: {
+    async eqlist() {
+      //设备列表
+      this.loadingtf = true;
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=weather.weather.sf_page',
+        data: {
+          page: this.page,
+          page_size: '10',
+          device_id: this.imports,
+        },
+      });
+      this.loadingtf = false;
+      this.eqlistdata = this.eqlistdata.concat(res.ids);
+      console.log(this.eqlistdata);
+    },
+    clickLeft() {
+      uni.switchTab({
+        url: '../index/index',
+      });
+    },
+    clickRight() {
+      // uni.navigateTo({
+      // 	url: "./search"
+      // })
+      this.width = 600;
+      this.page = 1;
+    },
+    eqdetails(data) {
+      uni.navigateTo({
+        url: './datails?shebei=' + JSON.stringify(data),
+      });
+    },
+    filtrate() {
+      this.filtrateTF = !this.filtrateTF;
+    },
+    top() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 500,
+      });
+    },
+    online() {
+      this.eqlistdata = [];
+      this.page = 1;
+      this.device_status = 1;
+      this.eqlist();
+      this.filtrateTF = !this.filtrateTF;
+    },
+    offline() {
+      this.eqlistdata = [];
+      this.page = 1;
+      this.device_status = 0;
+      this.eqlist();
+      this.filtrateTF = !this.filtrateTF;
+    },
+    complete() {
+      this.eqlistdata = [];
+      this.page = 1;
+      this.device_status = '';
+      this.eqlist();
+      this.filtrateTF = !this.filtrateTF;
+    },
+    search() {
+      //搜索按钮搜索
+      // this.eqlistdata = []
+      this.searchinp();
+    },
+    searchinp() {
+      //自动搜索
+      Debounce(() => {
+        this.page = 1;
+        this.eqlistdata = [];
+        this.eqlist();
+      }, 1000)();
+    },
+    examine(e) {
+      // console.log(this)
+      this.show = true;
+      this.title = e.device_expiretext;
+      this.content = `<p style="padding-left:10px;margin:10px 0;font-size:14px;">到期时间  ${this.timezhuan(
+        e.device_expire_time
+      )}
+				</p><p style="font-size:14px;text-align:right;color:#3C84FE;margin-bottom:10px;padding-right:10px">注：请前往PC端进行充值</p>`;
+    },
+    timezhuan(time) {
+      function fun(a) {
+        return String(a).length == 1 ? '0' + a : a;
+      }
+      let date = new Date(time * 1000);
+      let y = date.getFullYear();
+      let m = date.getMonth() + 1;
+      let d = date.getDate();
+      let h = date.getHours();
+      let min = date.getMinutes();
+      let sec = date.getSeconds();
+      return `${y}-${fun(m)}-${fun(d)} ${fun(h)}:${fun(min)}:${fun(sec)}`;
+    },
+  },
+  onLoad() {
+    this.eqlist();
+  },
+  onReachBottom() {
+    this.page++;
+    this.eqlist();
+  },
+  onPageScroll(e) {
+    //nvue暂不支持滚动监听，可用bindingx代替
+    if (e.scrollTop > 200) {
+      //距离大于200时显示
+      this.isTop = true;
+    } else {
+      //距离小于200时隐藏
+      this.isTop = false;
+    }
+  },
+};
 </script>
 
 <style lang="scss">
-	.inputs {
-		height: 54rpx;
-		background-color: #E4E4E4;
-		border-radius: 27rpx;
-		position: absolute;
-		right: 20rpx;
-		top: 24rpx;
-		transition: width 0.5s;
-		overflow: hidden;
-		padding-top: 8rpx;
-		box-sizing: border-box;
+.inputs {
+  height: 54rpx;
+  background-color: #e4e4e4;
+  border-radius: 27rpx;
+  position: absolute;
+  right: 20rpx;
+  top: 24rpx;
+  transition: width 0.5s;
+  overflow: hidden;
+  padding-top: 8rpx;
+  box-sizing: border-box;
 
-		.inputbox {
-			width: 85%;
-			text-indent: 1rem;
-			font-size: 26rpx;
-		}
+  .inputbox {
+    width: 85%;
+    text-indent: 1rem;
+    font-size: 26rpx;
+  }
 
-		.icon {
-			position: absolute;
-			top: 8rpx;
-			right: 26rpx;
-		}
-	}
+  .icon {
+    position: absolute;
+    top: 8rpx;
+    right: 26rpx;
+  }
+}
 
-	/deep/.uni-icons {
-		font-size: 40rpx !important;
-	}
+::v-deep .uni-icons {
+  font-size: 40rpx !important;
+}
 
-	.image {
-		position: fixed;
-		top: 88px;
-		width: 100%;
-		height: 160rpx;
-		z-index: 555;
-	}
+.image {
+  position: fixed;
+  top: 88px;
+  width: 100%;
+  height: 160rpx;
+  z-index: 555;
+}
 
-	.loading {
-		position: fixed;
-		top: 440px;
-		width: 95%;
-		left: 2.5%;
-		text-align: center;
+.loading {
+  position: fixed;
+  top: 440px;
+  width: 95%;
+  left: 2.5%;
+  text-align: center;
 
-		.img {
-			width: 300rpx;
-			height: 40rpx;
-		}
-	}
+  .img {
+    width: 300rpx;
+    height: 40rpx;
+  }
+}
 
-	.prevents {
-		width: 100%;
-		position: absolute;
-		top: 140px;
+.prevents {
+  width: 100%;
+  position: absolute;
+  top: 140px;
 
-		.prevents_item {
-			width: 95%;
-			margin: 0 auto 30rpx;
-			border-radius: 10rpx;
-			box-shadow: 0 0 10rpx #bcb9ca;
-			padding: 20rpx 40rpx 20rpx 80rpx;
-			position: relative;
-			box-sizing: border-box;
+  .prevents_item {
+    width: 95%;
+    margin: 0 auto 30rpx;
+    border-radius: 10rpx;
+    box-shadow: 0 0 10rpx #bcb9ca;
+    padding: 20rpx 40rpx 20rpx 80rpx;
+    position: relative;
+    box-sizing: border-box;
 
-			.prevents_item_img {
-				width: 30rpx;
-				height: 50rpx;
-				position: absolute;
-				top: -4rpx;
-				left: 30rpx;
-			}
+    .prevents_item_img {
+      width: 30rpx;
+      height: 50rpx;
+      position: absolute;
+      top: -4rpx;
+      left: 30rpx;
+    }
 
-			.prevents_item_top {
-				display: flex;
-				justify-content: space-between;
-				height: 60rpx;
-				border-bottom: 2rpx solid #F4F4F4;
-				line-height: 60rpx;
-				font-size: 26rpx;
+    .prevents_item_top {
+      display: flex;
+      justify-content: space-between;
+      height: 60rpx;
+      border-bottom: 2rpx solid #f4f4f4;
+      line-height: 60rpx;
+      font-size: 26rpx;
 
-				.red {
-					color: #FF4747;
-				}
+      .red {
+        color: #ff4747;
+      }
 
-				.green {
-					color: #00B075;
-				}
-			}
+      .green {
+        color: #00b075;
+      }
+    }
 
-			.prevents_item_bot {
-				margin-top: 20rpx;
-				font-size: 26rpx;
-				color: #BDBDBD;
+    .prevents_item_bot {
+      margin-top: 20rpx;
+      font-size: 26rpx;
+      color: #bdbdbd;
 
-				.prevents_item_bot_sapn0 {
-					color: #00B075;
-				}
+      .prevents_item_bot_sapn0 {
+        color: #00b075;
+      }
 
-				.prevents_item_bot_sapn1 {
-					color: #FF4747;
-				}
+      .prevents_item_bot_sapn1 {
+        color: #ff4747;
+      }
 
-				.prevents_item_bot_sapn2 {
-					color: #FFAB00;
-				}
-			}
-		}
-	}
+      .prevents_item_bot_sapn2 {
+        color: #ffab00;
+      }
+    }
+  }
+}
 
-	.top {
-		position: fixed;
-		right: 10px;
-		bottom: 40px;
-		z-index: 100;
+.top {
+  position: fixed;
+  right: 10px;
+  bottom: 40px;
+  z-index: 100;
 
-		image {
-			width: 100rpx;
-			height: 100rpx;
-		}
+  image {
+    width: 100rpx;
+    height: 100rpx;
+  }
 
-		.backtop {
-			display: flex;
-			justify-content: flex-end;
-			margin-bottom: 10rpx;
-		}
+  .backtop {
+    display: flex;
+    justify-content: flex-end;
+    margin-bottom: 10rpx;
+  }
 
-		.more {
-			display: flex;
-		}
+  .more {
+    display: flex;
+  }
 
-		.box {
-			width: 80rpx;
-			height: 80rpx;
-			background-color: rgba(161, 161, 161, 0.45);
-			border-radius: 50%;
-			text-align: center;
-			line-height: 80rpx;
-			box-sizing: border-box;
-			margin: 14rpx 10rpx 0 0;
-			color: #fff;
-		}
-	}
+  .box {
+    width: 80rpx;
+    height: 80rpx;
+    background-color: rgba(161, 161, 161, 0.45);
+    border-radius: 50%;
+    text-align: center;
+    line-height: 80rpx;
+    box-sizing: border-box;
+    margin: 14rpx 10rpx 0 0;
+    color: #fff;
+  }
+}
 </style>

pages/waterandfer/waterhis.vue

@@ -1,188 +1,191 @@
 <template>
-	<view>
-		<view class="selecttimesbox">
-			<view class="selecttimes" @click="tiemshow=!tiemshow">
-				<view class="timesbox">
-					<image
-						src="http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png"
-						mode=""></image>
-					<p>{{timetab(oldtime)}}</p>
-					<p class="or">~</p>
-					<p>{{timetab(newtime)}}</p>
-					<u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
-				</view>
-				<u-calendar v-model="tiemshow" mode="range" @change="tiemchange"></u-calendar>
-			</view>
-		</view>
-		
-		<view class="historicaldata">
-			<view class="historicaldatanone" v-if="hisdatalist.length==0">
-				暂无数据
-			</view>
-			<view class="historicaldata_item" v-for="item,index in hisdatalist" :key="index">
-				<view class="item">
-					<view class="">
-						操作内容
-					</view>
-					<view class="">
-						{{item.relayState}}
-					</view>
-				</view>
-				<view class="item">
-					<view class="">
-						操作时间
-					</view>
-					<view class="">
-						{{item.uptime}}
-					</view>
-				</view>
-				<view class="item">
-					<view class="">
-						操作账号
-					</view>
-					<view class="">
-						{{item.user}}
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+    <view class="selecttimesbox">
+      <view class="selecttimes" @click="tiemshow = !tiemshow">
+        <view class="timesbox">
+          <image
+            src="http://www.hnyfwlw.com:8006/bigdata_app/image/prevention/1acfe2751c01d3786cdc49b83d7e505.png"
+            mode=""
+          ></image>
+          <p>{{ timetab(oldtime) }}</p>
+          <p class="or">~</p>
+          <p>{{ timetab(newtime) }}</p>
+          <u-icon name="rili" custom-prefix="custom-icon" class="icon"></u-icon>
+        </view>
+        <u-calendar
+          v-model="tiemshow"
+          mode="range"
+          @change="tiemchange"
+        ></u-calendar>
+      </view>
+    </view>
+
+    <view class="historicaldata">
+      <view class="historicaldatanone" v-if="hisdatalist.length == 0">
+        暂无数据
+      </view>
+      <view
+        class="historicaldata_item"
+        v-for="(item, index) in hisdatalist"
+        :key="index"
+      >
+        <view class="item">
+          <view class=""> 操作内容 </view>
+          <view class="">
+            {{ item.relayState }}
+          </view>
+        </view>
+        <view class="item">
+          <view class=""> 操作时间 </view>
+          <view class="">
+            {{ item.uptime }}
+          </view>
+        </view>
+        <view class="item">
+          <view class=""> 操作账号 </view>
+          <view class="">
+            {{ item.user }}
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				oldtime:"",
-				newtime:"",
-				tiemshow:false,
-				page:1,
-				device_id:"",
-				hisdatalist:[]
-			}
-		},
-		onLoad(option) {
-			this.newtime = +new Date()/1000
-			this.oldtime = (+new Date() - 24*60*60*1000)/1000
-			this.device_id = option.device_id
-			this.sf_control()
-		},
-		onReachBottom() {
-			// console.log("触底")
-			this.page++
-			this.sf_control()
-		},
-		methods: {
-			timetab(e) {
-				e = new Date(e * 1000)
-				var year = e.getFullYear()
-				var month = e.getMonth() + 1 < 10 ? "0" + (e.getMonth() + 1) : e.getMonth() + 1
-				var day = e.getDate() < 10 ? "0" + e.getDate() : e.getDate()
-				var time = year + "/" + month + "/" + day
-				return time
-			},
-			tiemchange(e){
-				console.log(e)
-				this.oldtime = +new Date(e.startDate) / 1000
-				this.newtime = +new Date(e.endDate) / 1000 + 16 * 60 * 60
-				this.page = 1
-				this.hisdatalist = []
-				this.sf_control()
-			},
-			async sf_control(){
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=weather.weather.sf_control_data',
-					data: {
-						begin: Math.floor(this.oldtime),
-						device_id: this.device_id,
-						end: Math.floor(this.newtime),
-						page: this.page,
-					}
-        })
-        this.hisdatalist = res.dat;
-				// console.log(res.dat)
-				// 	for(var i=0;i<res.dat.length;i++){
-				// 		var name = res.dat[i].relayName.split("/")[Number(res.dat[i].relayNum)]
-				// 		var state = res.dat[i].relayState == 1?"开启":"关闭"
-				// 		var obj = {
-				// 			txt:state + name,
-				// 			uptime:res.dat[i].uptime,
-				// 			user:res.dat[i].user
-				// 		}
-				// 		this.hisdatalist.push(obj)
-				// 	}
-			}
-		}
-	}
+export default {
+  data() {
+    return {
+      oldtime: '',
+      newtime: '',
+      tiemshow: false,
+      page: 1,
+      device_id: '',
+      hisdatalist: [],
+    };
+  },
+  onLoad(option) {
+    this.newtime = +new Date() / 1000;
+    this.oldtime = (+new Date() - 24 * 60 * 60 * 1000) / 1000;
+    this.device_id = option.device_id;
+    this.sf_control();
+  },
+  onReachBottom() {
+    // console.log("触底")
+    this.page++;
+    this.sf_control();
+  },
+  methods: {
+    timetab(e) {
+      e = new Date(e * 1000);
+      var year = e.getFullYear();
+      var month =
+        e.getMonth() + 1 < 10 ? '0' + (e.getMonth() + 1) : e.getMonth() + 1;
+      var day = e.getDate() < 10 ? '0' + e.getDate() : e.getDate();
+      var time = year + '/' + month + '/' + day;
+      return time;
+    },
+    tiemchange(e) {
+      console.log(e);
+      this.oldtime = +new Date(e.startDate) / 1000;
+      this.newtime = +new Date(e.endDate) / 1000 + 16 * 60 * 60;
+      this.page = 1;
+      this.hisdatalist = [];
+      this.sf_control();
+    },
+    async sf_control() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=weather.weather.sf_control_data',
+        data: {
+          begin: Math.floor(this.oldtime),
+          device_id: this.device_id,
+          end: Math.floor(this.newtime),
+          page: this.page,
+        },
+      });
+      this.hisdatalist = res.dat;
+      // console.log(res.dat)
+      // 	for(var i=0;i<res.dat.length;i++){
+      // 		var name = res.dat[i].relayName.split("/")[Number(res.dat[i].relayNum)]
+      // 		var state = res.dat[i].relayState == 1?"开启":"关闭"
+      // 		var obj = {
+      // 			txt:state + name,
+      // 			uptime:res.dat[i].uptime,
+      // 			user:res.dat[i].user
+      // 		}
+      // 		this.hisdatalist.push(obj)
+      // 	}
+    },
+  },
+};
 </script>
 
 <style lang="scss">
-	page {
-		background: $uni-bg-color-grey;
-	}
-	.selecttimesbox{
-		position: fixed;
-		width: 100%;
-		padding: 30rpx 0;
-		background-color: #fff;
-		z-index: 99;
-	}
-	.selecttimes {
-		width: 90%;
-		box-shadow: 0 0 10rpx #bcb9ca;
-		padding: 10rpx 20rpx;
-		margin: 0 auto;
-		box-sizing: border-box;
-	
-		.timesbox {
-			display: flex;
-			justify-content: space-around;
-	
-			image {
-				width: 30rpx;
-				height: 30rpx;
-				margin-top: 6rpx;
-			}
-	
-			.icon {
-				color: #949494;
-				text-align: right;
-				margin-left: 30rpx;
-	
-			}
-		}
-	}
-	.historicaldata{
-		position: absolute;
-		top: 130rpx;
-		width: 100%;
-		.historicaldatanone{
-			font-size: 32rpx;
-			width: 100%;
-			padding: 20rpx 0;
-			text-align: center;
-		}
-		.historicaldata_item{
-			width: 100%;
-			margin: 20rpx auto;
-			background-color: #fff;
-			.item{
-				width: 90%;
-				margin: 0rpx auto;
-				border-bottom: 1px solid #F6F6F6 ;
-				font-size: 32rpx;
-				display: flex;
-				justify-content: space-between;
-				padding: 20rpx 0;
-			}
-		}
-	}
-	/deep/.u-calendar__action {
-		display: flex;
-		justify-content: space-around;
-	
-		.u-calendar__action__text {
-			line-height: 25px;
-		}
-	}
+page {
+  background: $uni-bg-color-grey;
+}
+.selecttimesbox {
+  position: fixed;
+  width: 100%;
+  padding: 30rpx 0;
+  background-color: #fff;
+  z-index: 99;
+}
+.selecttimes {
+  width: 90%;
+  box-shadow: 0 0 10rpx #bcb9ca;
+  padding: 10rpx 20rpx;
+  margin: 0 auto;
+  box-sizing: border-box;
+
+  .timesbox {
+    display: flex;
+    justify-content: space-around;
+
+    image {
+      width: 30rpx;
+      height: 30rpx;
+      margin-top: 6rpx;
+    }
+
+    .icon {
+      color: #949494;
+      text-align: right;
+      margin-left: 30rpx;
+    }
+  }
+}
+.historicaldata {
+  position: absolute;
+  top: 130rpx;
+  width: 100%;
+  .historicaldatanone {
+    font-size: 32rpx;
+    width: 100%;
+    padding: 20rpx 0;
+    text-align: center;
+  }
+  .historicaldata_item {
+    width: 100%;
+    margin: 20rpx auto;
+    background-color: #fff;
+    .item {
+      width: 90%;
+      margin: 0rpx auto;
+      border-bottom: 1px solid #f6f6f6;
+      font-size: 32rpx;
+      display: flex;
+      justify-content: space-between;
+      padding: 20rpx 0;
+    }
+  }
+}
+::v-deep .u-calendar__action {
+  display: flex;
+  justify-content: space-around;
+
+  .u-calendar__action__text {
+    line-height: 25px;
+  }
+}
 </style>

pages/waterandfernew/details第一版vue

@@ -711,7 +711,7 @@
 		height: 100vh;
 	}
 
-	/deep/ .u-flex {
+	::v-deep  .u-flex {
 		display: flex;
 		justify-content: center;
 	}

static/css/loading.scss

@@ -1,8 +1,8 @@
-/deep/ .el-loading-parent--relative {
+::v-deep .el-loading-parent--relative {
   position: relative !important;
 }
 
-/deep/ .el-loading-mask {
+::v-deep .el-loading-mask {
   position: absolute;
   z-index: 2000;
   background-color: rgba(0, 0, 0, 0.8);
@@ -73,4 +73,4 @@
       stroke-dashoffset: -120px;
     }
   }
-}
+}

util/api.js

@@ -1,90 +1,104 @@
 // const BASE_URL='http://8.136.98.49:8002'
 // let BASE_URL = 'http://192.168.1.112:8002'
 export const myRequest = (options) => {
-	let BASE_URL = uni.getStorageSync('http')
-	console.log(BASE_URL,'my request',process.env.NODE_ENV)
-	if (BASE_URL == '') {
-		// BASE_URL = 'http://114.55.0.7:8002'//测试
-		// BASE_URL = process.env.NODE_ENV === 'development' ? "http://192.168.2.118:8003" : "http://8.136.98.49:8002"
-		// BASE_URL = process.env.NODE_ENV === 'development' ? "http://114.55.0.7:8002" : "http://8.136.98.49:8002"
-		BASE_URL = process.env.NODE_ENV === 'development' ? "http://8.136.98.49:8002" : "http://8.136.98.49:8002"
-		// BASE_URL = 'http://192.168.1.77:8002'
-	}
-	// BASE_URL = 'http://192.168.1.52:8003'
-	// console.log(BASE_URL)
-	var session_key = ""
-	session_key = uni.getStorageSync('session_key')
-	let url = ""
-	let data = options.data || {}
+  let BASE_URL = uni.getStorageSync('http');
+  console.log(BASE_URL, 'my request', process.env.NODE_ENV);
+  if (BASE_URL == '') {
+    // BASE_URL = 'http://114.55.0.7:8002'//测试
+    // BASE_URL = process.env.NODE_ENV === 'development' ? "http://192.168.2.118:8003" : "http://8.136.98.49:8002"
+    // BASE_URL = process.env.NODE_ENV === 'development' ? "http://114.55.0.7:8002" : "http://8.136.98.49:8002"
+    // BASE_URL = process.env.NODE_ENV === 'development' ? "http://8.136.98.49:8002" : "http://8.136.98.49:8002"
+    // BASE_URL = 'http://192.168.1.77:8002'
+    BASE_URL = 'http://192.168.1.107:8000';
+  }
+  // BASE_URL = 'http://192.168.1.52:8003'
+  // console.log(BASE_URL)
+  var session_key = '';
+  session_key = uni.getStorageSync('session_key');
+  let url = '';
+  let data = options.data || {};
+  let sfType = options.sfType || '';
+  if (options.url.split('=')[1]) {
+    url = options.url.split('=')[1];
+  } else {
+    url = options.url.split('api/')[1];
+  }
+  // console.log(url)
+  if (
+    url != 'user.login.login_user' &&
+    url != 'pest.pests.insect_discern' &&
+    url != 'pest.pests.plant_discern' &&
+    url != 'pest.pests.pests_contrast' &&
+    url != 'pest.pests.pests_expert_img' &&
+    url != 'pest.pests.pests_img' &&
+    url != 'recognizationSys' &&
+    url != 'base.bases.base_photo' &&
+    url != 'pest.warning_record.rolemanage_img' &&
+    url != 'home.homes.personal_photo' &&
+    url != 'ascend.ascend_manage.product_info' &&
+    url != 'ascend.ascend_manage.quality_info' &&
+    url != 'ascend.ascend_manage.grow_info' &&
+    url != 'ascend.ascend_manage.all_ascend' &&
+    url != 'after_sale.after_sale_manage.device_check' &&
+    url != 'after_sale.after_sale_manage.aftersale_apply'
+  ) {
+    data.token = session_key;
+  }
 
-	if (options.url.split('=')[1]) {
-		url = options.url.split('=')[1]
-	} else {
-		url = options.url.split('api/')[1]
-	}
-	// console.log(url)
-	if (url != 'user.login.login_user' &&
-		url != 'pest.pests.insect_discern' &&
-		url != 'pest.pests.plant_discern' &&
-		url != 'pest.pests.pests_contrast' &&
-		url != 'pest.pests.pests_expert_img' &&
-		url != 'pest.pests.pests_img' &&
-		url != 'recognizationSys' &&
-		url != 'base.bases.base_photo' &&
-		url != 'pest.warning_record.rolemanage_img' &&
-		url != 'home.homes.personal_photo' &&
-		url != 'ascend.ascend_manage.product_info' &&
-		url != 'ascend.ascend_manage.quality_info' &&
-		url != 'ascend.ascend_manage.grow_info' &&
-		url != 'ascend.ascend_manage.all_ascend' &&
-		url != 'after_sale.after_sale_manage.device_check' &&
-		url != 'after_sale.after_sale_manage.aftersale_apply') {
-		data.token = session_key
-	}
-
-	return new Promise((resolve, reject) => {
-		uni.request({
-			url: BASE_URL + options.url,
-			method: options.method || 'POST',
-			header: {
-				"Content-Type": "application/x-www-form-urlencoded",
-			},
-			data: data,
-			success: (res) => {
-				if(res.data.errorCode == 403) {
-					uni.removeStorageSync('session_key');
-					uni.showToast({
-						title: '登录已过期，请重新登录！',
-						icon: "none"
-					})
-					if(uni.getStorageSync('isLink')) {
-						return false
-					} else {
-						uni.setStorageSync('isLink', true);
-						return uni.navigateTo({
-							url: '/pages/login/login'
-						});
-					}
-				}
-				if (res.data.message) {
-					if (res.data.message == "识别无结果" ||res.data.message == "该设备未绑定SIM") {
-						resolve(res.data.data)
-					} else {
-						return uni.showToast({
-							title: res.data.message,
-							icon: "none"
-						})
-					}
-				}
-				resolve(res.data.data)
-			},
-			fail: (err) => {
-				uni.showToast({
-					title: '请求接口失败',
-					icon: 'none'
-				})
-				reject(err)
-			}
-		})
-	})
-}
+  return new Promise((resolve, reject) => {
+    uni.request({
+      url: BASE_URL + options.url,
+      method: options.method || 'POST',
+      header: options.header || {
+        'Content-Type': 'application/x-www-form-urlencoded',
+      },
+      data: data,
+      success: (res) => {
+        if (res.data.errorCode == 403) {
+          uni.removeStorageSync('session_key');
+          uni.showToast({
+            title: '登录已过期，请重新登录！',
+            icon: 'none',
+          });
+          if (uni.getStorageSync('isLink')) {
+            return false;
+          } else {
+            uni.setStorageSync('isLink', true);
+            return uni.navigateTo({
+              url: '/pages/login/login',
+            });
+          }
+        }
+        if (res.data.message) {
+          if (
+            res.data.message == '识别无结果' ||
+            res.data.message == '该设备未绑定SIM'
+          ) {
+            resolve(res.data.data);
+          } else {
+            return uni.showToast({
+              title: res.data.message,
+              icon: 'none',
+            });
+          }
+        }
+        if (sfType) {
+          resolve(res.data);
+          return;
+        }
+        if (res.data.data) {
+          resolve(res.data.data);
+        } else {
+          resolve(res.data);
+        }
+      },
+      fail: (err) => {
+        uni.showToast({
+          title: '请求接口失败',
+          icon: 'none',
+        });
+        reject(err);
+      },
+    });
+  });
+};

util/helpers.js

@@ -0,0 +1,3 @@
+export function subtractDate(num, type = 'year', format = 'YYYY-MM-DD', date) {
+  // return dayjs(date).subtract(num, type).format(format);
+}