|
|
@@ -0,0 +1,822 @@
|
|
|
+<template>
|
|
|
+ <view class="anabox">
|
|
|
+ <view class="timebox">
|
|
|
+ <view class="schedulebox">
|
|
|
+ <view class="schedule" @click="pickertfone=!pickertfone">
|
|
|
+ <p class="schedule_value">{{yservalue}}</p>
|
|
|
+ <!-- {{titletext[indexone]}} -->
|
|
|
+ <p class="schedule_icon">
|
|
|
+ <u-icon name="arrow-down"></u-icon>
|
|
|
+ </p>
|
|
|
+ </view>
|
|
|
+ <u-picker v-model="pickertfone" mode="selector" @confirm="confirmFun" :default-selector="[yserindex]"
|
|
|
+ :range="yearlist"></u-picker>
|
|
|
+ <view class="schedule" @click="pickertfworm=!pickertfworm">
|
|
|
+ <p class="schedule_value">{{wormvalue}}</p>
|
|
|
+ <!-- {{titletext[indexone]}} -->
|
|
|
+ <p class="schedule_icon">
|
|
|
+ <u-icon name="arrow-down"></u-icon>
|
|
|
+ </p>
|
|
|
+ </view>
|
|
|
+ <u-picker v-model="pickertfworm" mode="selector" @confirm="confirmFun2" :default-selector="[wormindex]"
|
|
|
+ :range="wormlist"></u-picker>
|
|
|
+ </view>
|
|
|
+ <view class="wormtime">
|
|
|
+ <view class="wormtime_item">
|
|
|
+ <image src="../../../static/images/cb/shijianqi.png" mode="" class="img"></image>
|
|
|
+ <p>始见期</p>
|
|
|
+ <p>{{timeobj.startTime}}</p>
|
|
|
+ </view>
|
|
|
+ <view class="wormtime_item">
|
|
|
+ <image src="../../../static/images/cb/gaofengqi.png" mode="" class="img"></image>
|
|
|
+ <p>高峰期</p>
|
|
|
+ <p>{{timeobj.highTime}}</p>
|
|
|
+ <p>数量:{{timeobj.highNum}}头</p>
|
|
|
+ </view>
|
|
|
+ <view class="wormtime_item">
|
|
|
+ <image src="../../../static/images/cb/zhongjianqi.png" mode="" class="img"></image>
|
|
|
+ <p>终见期</p>
|
|
|
+ <p>{{timeobj.endTime}}</p>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="selecttimes" @click="tiemshow=!tiemshow">
|
|
|
+ <view class="" style="line-height: 28px;">
|
|
|
+ 时间选择器
|
|
|
+ </view>
|
|
|
+ <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 class="tendency">
|
|
|
+ <canvas 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="tendency">
|
|
|
+ <canvas canvas-id="canvasRing" id="canvasRing" class="charts" @touchstart="touchRing"
|
|
|
+ :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="tendency_pro">
|
|
|
+ <view class="" v-for="(item,index) in progresslist">
|
|
|
+ <span>{{index+1}}、{{item.name}}</span>
|
|
|
+ <u-line-progress :active-color="colorlist[index%6]"
|
|
|
+ :percent="Number((item.data/pestsum*100).toFixed(2))" :show-percent="false"></u-line-progress>
|
|
|
+ <span>{{Number((item.data/pestsum*100).toFixed(2))}}%</span>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="tablebox">
|
|
|
+ <view class="top_text">
|
|
|
+ <view :class="topindex==index?'title_text_color':'tltle_text'" v-for="(item,index) in toptext"
|
|
|
+ :key="index" @click="changeindex(index)">
|
|
|
+ <span class="title_item">
|
|
|
+ {{item}}
|
|
|
+ </span>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <scroll-view scroll-top="0" scroll-x="true" class="scroll-X">
|
|
|
+ <table class="table" v-if="topindex==0">
|
|
|
+ <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 eqlistdata" :key="indexs">
|
|
|
+ <td class="td">{{items.deviceId}}</td>
|
|
|
+ <td class="td">{{items.deviceName}}</td>
|
|
|
+ <td class="td" @click="wormdetails(items.pest_dict)">{{items.pestName}}</td>
|
|
|
+ <td class="td">{{items.addtime|timeFormat()}}</td>
|
|
|
+ <td class="td">{{items.location}}</td>
|
|
|
+ <td class="td" @click="examine(items.indentify_photo)">查看</td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr" v-if="forbidden1">
|
|
|
+ <td class="td" v-for="item in 6">暂无数据</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ <table class="table2" v-else>
|
|
|
+ <tr class="tr">
|
|
|
+ <th class="th" v-for="(item,index) in thdata2" :key="'a'+index">{{item}}</th>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr" v-for="(items,indexs) in eqlistdata" :key="indexs">
|
|
|
+ <td class="td">{{items.pest_name}}</td>
|
|
|
+ <td class="td">{{items.pest_num}}</td>
|
|
|
+ <td class="td">{{items.addtime|timeFormat()}}</td>
|
|
|
+ </tr>
|
|
|
+ <tr class="tr" v-if="forbidden2">
|
|
|
+ <td class="td" v-for="item in 6">暂无数据</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </scroll-view>
|
|
|
+ <view class="pagenumber">
|
|
|
+ <button @click="prev" :disabled=" page == 1 ">上一页</button>
|
|
|
+ <view class="pagenumber_page">
|
|
|
+ 第{{page}}页
|
|
|
+ </view>
|
|
|
+ <view class="pagenumber_page">
|
|
|
+ 共 {{pagesum}} 页
|
|
|
+ </view>
|
|
|
+ <button @click="next" :disabled=" page == pagesum ">下一页</button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <u-modal v-model="show" :mask-close-able="true" title="24小时数据">
|
|
|
+ <view class="modalbox">
|
|
|
+ <p v-for="(item,key) in pest_dict">{{key}}--{{pest_dict[key]}}头</p>
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import uCharts from '../../../components/js_sdk/u-charts/u-charts/u-charts.js';
|
|
|
+ var canvaColumnA = null;
|
|
|
+ var canvasRing = null;
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ d_id: "",
|
|
|
+ oldtime: "",
|
|
|
+ newtime: "",
|
|
|
+ tiemshow: false,
|
|
|
+ cWidth: '350',
|
|
|
+ cHeight: '350',
|
|
|
+ pixelRatio: 1,
|
|
|
+ pickertfone: false,
|
|
|
+ yservalue: "",
|
|
|
+ yearlist: [],
|
|
|
+ yserindex: "",
|
|
|
+ pickertfworm: false,
|
|
|
+ wormvalue: "",
|
|
|
+ wormlist: [],
|
|
|
+ wormindex: "",
|
|
|
+ timeobj: {
|
|
|
+ endTime: "",
|
|
|
+ highNum: "",
|
|
|
+ highTime: "",
|
|
|
+ startTime: "",
|
|
|
+ },
|
|
|
+ progresslist: [],
|
|
|
+ reslist: {
|
|
|
+ char_data: {},
|
|
|
+ at_ah_info: []
|
|
|
+ },
|
|
|
+ pestsum: 0,
|
|
|
+ colorlist: ["rgb(24, 144, 255)", "rgb(47, 194, 91)", "rgb(250, 204, 20)", "rgb(240, 72, 100)",
|
|
|
+ "rgb(133, 67, 224)", "rgb(144, 237, 125)"
|
|
|
+ ],
|
|
|
+ page: 1,
|
|
|
+ pagesum: 1,
|
|
|
+ eqlistdata: [],
|
|
|
+ thdata: [
|
|
|
+ "设备ID", "设备名称", "害虫名称", "上报时间", "设备位置", "图像"
|
|
|
+ ],
|
|
|
+ thdata2: [
|
|
|
+ "害虫名称", "害虫数量", "上报时间"
|
|
|
+ ],
|
|
|
+ topindex: 0,
|
|
|
+ toptext: ["图像溯源", "虫害基础数据"],
|
|
|
+ forbidden1: false,
|
|
|
+ forbidden2: false,
|
|
|
+ show: false,
|
|
|
+ pest_dict: {}
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getyear() {
|
|
|
+ var Year = new Date().getFullYear();
|
|
|
+ var num = Year - 2019;
|
|
|
+ for (var i = 0; i < num + 1; i++) {
|
|
|
+ this.yearlist.push(2019 + i);
|
|
|
+ }
|
|
|
+ this.yservalue = this.yearlist[this.yearlist.length - 1];
|
|
|
+ this.yserindex = this.yearlist.length - 1
|
|
|
+ this.getwormtime()
|
|
|
+ },
|
|
|
+ async getwormtime() {
|
|
|
+ const res = await this.$myRequest({
|
|
|
+ url: '/api/api_gateway?method=forecast.worm_lamp.pest_raise_info',
|
|
|
+ data: {
|
|
|
+ d_ids: this.d_id,
|
|
|
+ identify_model: 'A',
|
|
|
+ year: this.yservalue,
|
|
|
+ device_type: 'xct'
|
|
|
+ }
|
|
|
+ })
|
|
|
+ console.log(res)
|
|
|
+ this.wormlist = res.pest_list
|
|
|
+ this.wormtimelist = res.pest_info
|
|
|
+ this.wormvalue = this.wormlist[0]
|
|
|
+ this.wormindex = 0
|
|
|
+ if (this.wormvalue) {
|
|
|
+ this.timeobj = this.wormtimelist[this.wormvalue]
|
|
|
+ }
|
|
|
+ console.log(this.timeobj)
|
|
|
+
|
|
|
+ },
|
|
|
+ confirmFun(e) {
|
|
|
+ console.log(e)
|
|
|
+ this.yserindex = e[0]
|
|
|
+ this.yservalue = this.yearlist[e[0]]
|
|
|
+ this.getwormtime()
|
|
|
+ },
|
|
|
+ confirmFun2(e) {
|
|
|
+ console.log(e)
|
|
|
+ this.wormindex = e[0]
|
|
|
+ this.wormvalue = this.wormlist[e[0]]
|
|
|
+ this.timeobj = this.wormtimelist[this.wormvalue]
|
|
|
+ this.setlineoption()
|
|
|
+ },
|
|
|
+ async getwormline() {
|
|
|
+ const res = await this.$myRequest({
|
|
|
+ url: '/api/api_gateway?method=forecast.worm_lamp.pest_statistics_char_new',
|
|
|
+ data: {
|
|
|
+ d_ids: this.d_id,
|
|
|
+ identify_model: 'A',
|
|
|
+ start_time: this.oldtime,
|
|
|
+ end_time: this.newtime,
|
|
|
+ device_type: 'xct'
|
|
|
+ }
|
|
|
+ })
|
|
|
+ // console.log(res)
|
|
|
+ this.reslist.char_data = res.char_data
|
|
|
+ this.reslist.at_ah_info = res.at_ah_info
|
|
|
+ var ringarr = []
|
|
|
+
|
|
|
+ if (this.checkObj(res.pest_total)) {
|
|
|
+ for (var key in res.pest_total) {
|
|
|
+ var nameobj = {
|
|
|
+ name: '',
|
|
|
+ data: "",
|
|
|
+ }
|
|
|
+ // console.log(key)
|
|
|
+ nameobj.name = key
|
|
|
+ nameobj.data = res.pest_total[key]
|
|
|
+ ringarr.push(nameobj)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.setlineoption()
|
|
|
+ // this.showRing(ringarr)
|
|
|
+ var num = 0
|
|
|
+ for (var i = 0; i < ringarr.length - 5; i++) {
|
|
|
+ console.log(ringarr[i].name)
|
|
|
+ num += ringarr[i].data
|
|
|
+ }
|
|
|
+ this.pestsum = 0
|
|
|
+ for (var i = 0; i < ringarr.length; i++) {
|
|
|
+ this.pestsum += ringarr[i].data
|
|
|
+ }
|
|
|
+ var sumobj = {
|
|
|
+ name: "其他",
|
|
|
+ data: num,
|
|
|
+ }
|
|
|
+ var ringarr2 = ringarr.slice(ringarr.length - 5)
|
|
|
+ ringarr2.unshift(sumobj)
|
|
|
+ // console.log(ringarr2)
|
|
|
+ this.showRing(ringarr2)
|
|
|
+ console.log(ringarr)
|
|
|
+ this.progresslist = ringarr
|
|
|
+ },
|
|
|
+ setlineoption() {
|
|
|
+ var res = this.reslist
|
|
|
+ var xtitle = []
|
|
|
+ var obj = []
|
|
|
+ if (res.at_ah_info.length != 0) {
|
|
|
+ var aharr = []
|
|
|
+ var atarr = []
|
|
|
+ for (var i = 0; i < res.at_ah_info.length; i++) {
|
|
|
+ var times = new Date(res.at_ah_info[i].addtime * 1000)
|
|
|
+ xtitle.push(times.getMonth() + 1 + "/" + times.getDate() + "-" + times.getHours() + ":" +
|
|
|
+ times.getSeconds())
|
|
|
+ atarr.push(res.at_ah_info[i].at == "" ? "0" : res.at_ah_info[i].at)
|
|
|
+ aharr.push(res.at_ah_info[i].ah == "" ? "0" : res.at_ah_info[i].ah)
|
|
|
+ }
|
|
|
+ var atobj = {
|
|
|
+ name: '温度',
|
|
|
+ data: atarr,
|
|
|
+ color: '#00E29D'
|
|
|
+ }
|
|
|
+ var ahobj = {
|
|
|
+ name: '湿度',
|
|
|
+ data: aharr,
|
|
|
+ color: '#6CBBFF'
|
|
|
+ }
|
|
|
+ obj.push(atobj)
|
|
|
+ obj.push(ahobj)
|
|
|
+ }
|
|
|
+ // console.log(this.wormvalue)
|
|
|
+ if (this.checkObj(res.char_data)) {
|
|
|
+ for (var key in res.char_data) {
|
|
|
+ if (this.wormvalue == key) {
|
|
|
+ var wormobj = {
|
|
|
+ name: key,
|
|
|
+ data: [],
|
|
|
+ }
|
|
|
+ for (var i = 0; i < res.char_data[key].length; i++) {
|
|
|
+ wormobj.data.push(res.char_data[key][i].ah == "" ? "0" : res.char_data[key][i].sum)
|
|
|
+ }
|
|
|
+ obj.push(wormobj)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ this.showColumn("canvasColumnA", xtitle, obj)
|
|
|
+ },
|
|
|
+ checkObj(obj) {
|
|
|
+ for (let i in obj) {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ },
|
|
|
+ tiemchange(e) {
|
|
|
+ console.log(e)
|
|
|
+ this.oldtime = +new Date(e.startDate) / 1000 - 8 * 60 * 60
|
|
|
+ this.newtime = +new Date(e.endDate) / 1000 + 16 * 60 * 60 - 1
|
|
|
+ // newtime: "",
|
|
|
+ console.log(this.oldtime, this.newtime)
|
|
|
+ this.page = 1
|
|
|
+ this.getwormline()
|
|
|
+ if (this.topindex == 0) {
|
|
|
+ this.gettabledata()
|
|
|
+ } else if (this.topindex == 1) {
|
|
|
+ this.gettabledata2()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ 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
|
|
|
+ },
|
|
|
+ showColumn(id, xtitle, xinfo) {
|
|
|
+ var _self = this
|
|
|
+ canvaColumnA = new uCharts({
|
|
|
+ canvasId: id,
|
|
|
+ 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: 5, //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
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ showRing(data) {
|
|
|
+ var _self = this
|
|
|
+ canvasRing = new uCharts({
|
|
|
+ canvasId: "canvasRing",
|
|
|
+ type: 'ring',
|
|
|
+ fontSize: 11,
|
|
|
+ legend: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ extra: {
|
|
|
+ pie: {
|
|
|
+ offsetAngle: -45,
|
|
|
+ ringWidth: 40 * _self.pixelRatio,
|
|
|
+ labelWidth: 15
|
|
|
+ }
|
|
|
+ },
|
|
|
+ background: '#FFFFFF',
|
|
|
+ pixelRatio: _self.pixelRatio,
|
|
|
+ series: data,
|
|
|
+ animation: true,
|
|
|
+ width: _self.cWidth * _self.pixelRatio,
|
|
|
+ height: _self.cHeight * _self.pixelRatio,
|
|
|
+ disablePieStroke: true,
|
|
|
+ dataLabel: true,
|
|
|
+ });
|
|
|
+ },
|
|
|
+ touchRing(e) {
|
|
|
+ canvasRing.showToolTip(e, {
|
|
|
+ format: function(item) {
|
|
|
+ return item.name + ':' + item.data
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ tap(e) {
|
|
|
+ canvasgroup[e.target.id].touchLegend(e);
|
|
|
+ canvasgroup[e.target.id].showToolTip(e);
|
|
|
+ },
|
|
|
+ async gettabledata() {
|
|
|
+ const res = await this.$myRequest({
|
|
|
+ url: '/api/api_gateway?method=forecast.worm_lamp.pest_image_source',
|
|
|
+ data: {
|
|
|
+ d_ids: this.d_id,
|
|
|
+ identify_model: 'A',
|
|
|
+ start_time: this.oldtime,
|
|
|
+ end_time: this.newtime,
|
|
|
+ page: this.page,
|
|
|
+ device_type: 'xct'
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.pagesum = Math.ceil(res.total_count / 10)
|
|
|
+ this.eqlistdata = res.pest_image_data
|
|
|
+ if (this.eqlistdata.length == 0) {
|
|
|
+ this.forbidden1 = true
|
|
|
+ } else {
|
|
|
+ this.forbidden1 = false
|
|
|
+ }
|
|
|
+ console.log(res)
|
|
|
+ },
|
|
|
+ async gettabledata2() {
|
|
|
+ const res = await this.$myRequest({
|
|
|
+ url: '/api/api_gateway?method=forecast.worm_lamp.pest_base_data',
|
|
|
+ data: {
|
|
|
+ d_ids: this.d_id,
|
|
|
+ identify_model: 'A',
|
|
|
+ start_time: this.oldtime,
|
|
|
+ end_time: this.newtime,
|
|
|
+ page: this.page
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.pagesum = Math.ceil(res.total_count / 10)
|
|
|
+ this.eqlistdata = res.pest_image_data
|
|
|
+ if (this.eqlistdata.length == 0) {
|
|
|
+ this.forbidden2 = true
|
|
|
+ } else {
|
|
|
+ this.forbidden2 = false
|
|
|
+ }
|
|
|
+ console.log(res)
|
|
|
+ },
|
|
|
+ changeindex(e) {
|
|
|
+ this.topindex = e
|
|
|
+ this.page = 1
|
|
|
+ if (e == 0) {
|
|
|
+ this.gettabledata()
|
|
|
+ } else if (e == 1) {
|
|
|
+ this.gettabledata2()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ prev() {
|
|
|
+ this.page--
|
|
|
+ if (this.topindex == 0) {
|
|
|
+ this.gettabledata()
|
|
|
+ } else if (this.topindex == 1) {
|
|
|
+ this.gettabledata2()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ next() {
|
|
|
+ this.page++
|
|
|
+ if (this.topindex == 0) {
|
|
|
+ this.gettabledata()
|
|
|
+ } else if (this.topindex == 1) {
|
|
|
+ this.gettabledata2()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ wormdetails(data) {
|
|
|
+ console.log(data)
|
|
|
+ this.show = true
|
|
|
+ this.pest_dict = data
|
|
|
+ },
|
|
|
+ examine(url) {
|
|
|
+ var imgarr = [url]
|
|
|
+ uni.previewImage({
|
|
|
+ urls: imgarr,
|
|
|
+ current: 0
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ this.d_id = option.d_id
|
|
|
+ var date = +new Date() / 1000
|
|
|
+ this.oldtime = Math.floor(date - 24 * 60 * 60)
|
|
|
+ this.newtime = Math.floor(date)
|
|
|
+ this.cWidth = uni.upx2px(650);
|
|
|
+ this.cHeight = uni.upx2px(500);
|
|
|
+ this.getyear()
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.getwormline()
|
|
|
+ if (this.topindex == 0) {
|
|
|
+ this.gettabledata()
|
|
|
+ } else if (this.topindex == 1) {
|
|
|
+ this.gettabledata2()
|
|
|
+ }
|
|
|
+ }, 500)
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ .anabox {
|
|
|
+ background-color: #f1f4ff;
|
|
|
+ padding-top: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .selecttimes {
|
|
|
+ // box-shadow: 0 0 10rpx #bcb9ca;
|
|
|
+ // padding: 10rpx 20rpx;
|
|
|
+ padding: 10px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin: 10px auto 0;
|
|
|
+ display: flex;
|
|
|
+ background-color: #fff;
|
|
|
+ width: 95%;
|
|
|
+ .timesbox {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ width: 60%;
|
|
|
+ margin-left: 10px;
|
|
|
+ border: 1px solid #CCCCCC;
|
|
|
+ padding: 5px;
|
|
|
+ font-size: 12px;
|
|
|
+ border-radius: 5px;
|
|
|
+ image {
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ margin-top: 6rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ color: #949494;
|
|
|
+ text-align: right;
|
|
|
+ margin-left: 30rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .wormtime {
|
|
|
+ width: 95%;
|
|
|
+ padding: 10px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin: 0 auto;
|
|
|
+ // margin-top: 10px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .wormtime_item {
|
|
|
+ width: 25%;
|
|
|
+ margin-top: 10px;
|
|
|
+ padding: 10px;
|
|
|
+ .img {
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
+ }
|
|
|
+
|
|
|
+ p:nth-child(2) {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 700;
|
|
|
+ }
|
|
|
+ p:nth-child(3) {
|
|
|
+ font-size: 12px;
|
|
|
+ margin-top: 5px;
|
|
|
+ }
|
|
|
+ p:last-child {
|
|
|
+ font-size: 12px;
|
|
|
+ margin-top: 5px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .wormtime_item:first-child {
|
|
|
+ background-color: #F9FAFE;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wormtime_item:nth-child(2) {
|
|
|
+ background-color: #FFFCF9;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wormtime_item:last-child {
|
|
|
+ background-color: #FCF8FF;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .schedulebox {
|
|
|
+ display: flex;
|
|
|
+ padding: 10px 10px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 95%;
|
|
|
+ // justify-content: space-around;
|
|
|
+ margin: 0px auto;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .schedule {
|
|
|
+ display: flex;
|
|
|
+ width: 240rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ // border: 2rpx solid #F0F0F0;
|
|
|
+ margin-right: 20rpx;
|
|
|
+ background-color: #F9FAFC;
|
|
|
+ border-radius: 25px;
|
|
|
+
|
|
|
+ .schedule_value {
|
|
|
+ width: 70%;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 50rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .schedule_icon {
|
|
|
+ width: 30%;
|
|
|
+ // background-color: #F2F2F2;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 50rpx;
|
|
|
+ /deep/.u-icon__icon{
|
|
|
+ color: rgba(0,0,0,0.3);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tendency {
|
|
|
+ width: 95%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ margin: 0 auto;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tendency_pro {
|
|
|
+ width: 95%;
|
|
|
+ padding: 0 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ height: 140px;
|
|
|
+ overflow-y: auto;
|
|
|
+ margin: 0 auto;
|
|
|
+ background-color: #fff;
|
|
|
+ span:first-child {
|
|
|
+ display: inline-block;
|
|
|
+ width: 100px;
|
|
|
+ overflow: hidden; //溢出隐藏
|
|
|
+ white-space: nowrap; //禁止换行
|
|
|
+ text-overflow: ellipsis; //...
|
|
|
+ }
|
|
|
+
|
|
|
+ .u-progress {
|
|
|
+ width: calc(100% - 150px);
|
|
|
+ }
|
|
|
+
|
|
|
+ span:last-child {
|
|
|
+ display: inline-block;
|
|
|
+ width: 30px;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tablebox {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ width: 95%;
|
|
|
+ margin: 10px auto 20px;
|
|
|
+ // box-shadow: 0 0 10rpx #bcb9ca;
|
|
|
+ background-color: #fff;
|
|
|
+ .top_text {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ .tltle_text {
|
|
|
+ width: 30%;
|
|
|
+ text-align: center;
|
|
|
+ // border: 2rpx solid #F0F0F0;
|
|
|
+ // text-align: center;
|
|
|
+ // background-color: #F0F0F0;
|
|
|
+ // color: #000;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title_text_color {
|
|
|
+ width: 30%;
|
|
|
+ text-align: center;
|
|
|
+ .title_item{
|
|
|
+ border-bottom: 2px solid #64CC82;
|
|
|
+ color: #64CC82;
|
|
|
+ }
|
|
|
+ // width: 50%;
|
|
|
+ // border: 2rpx solid #64CC82;
|
|
|
+ // background-color: #64CC82;
|
|
|
+ // color: #fff;
|
|
|
+ // text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .scroll-X {
|
|
|
+ width: 95%;
|
|
|
+ margin: 20rpx auto;
|
|
|
+
|
|
|
+ .table {
|
|
|
+ width: 1800rpx;
|
|
|
+
|
|
|
+ .td:nth-child(3),
|
|
|
+ .td:last-child {
|
|
|
+ color: #37aed8;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tr {
|
|
|
+ display: flex;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ .th,
|
|
|
+ .td {
|
|
|
+ display: inline-block;
|
|
|
+ padding: 5rpx;
|
|
|
+ text-align: center;
|
|
|
+ height: 52rpx;
|
|
|
+ line-height: 52rpx;
|
|
|
+ width: 320rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .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: #57c878;
|
|
|
+ color: #FFFFFF;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pagenumber_page {
|
|
|
+ width: 150rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ line-height: 50rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .modalbox {
|
|
|
+ width: 100%;
|
|
|
+ // display: flex;
|
|
|
+ // flex-wrap: wrap;
|
|
|
+ height: 120px;
|
|
|
+ padding-left: 30px;
|
|
|
+ margin-top: 10px;
|
|
|
+ overflow-y: auto;
|
|
|
+
|
|
|
+ p {
|
|
|
+ // width: 50%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/.u-calendar__action {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+
|
|
|
+ .u-calendar__action__text {
|
|
|
+ line-height: 25px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|