Parcourir la source

fix:温室大棚

allen il y a 3 mois
Parent
commit
ff5cf36eb4

+ 12 - 3
components/customCard/customCard.vue

@@ -7,6 +7,9 @@
           <slot name="backText"></slot>
         </view>
       </view>
+      <view class="cu-bar-right">
+        <slot name="right"></slot>
+      </view>
     </view>
   </view>
 </template>
@@ -34,13 +37,14 @@ export default {
 }
 
 .custom-card-header {
-  padding: 0 23upx;
+  padding: 0 20rpx;
   height: 90rpx;
   color: #333333;
-  font-size: 27upx;
+  font-size: 28rpx;
   font-weight: 600;
   font-family: 'PingFang SC';
-  line-height: 44upx;
+  line-height: 44rpx;
+  position: relative;
   .custom-card-action {
     display: flex;
     align-items: center;
@@ -53,5 +57,10 @@ export default {
       font-size: 34rpx;
     }
   }
+  .cu-bar-right {
+    position: absolute;
+    right: 20rpx;
+    top: 20rpx;
+  }
 }
 </style>

+ 9 - 0
pages.json

@@ -808,6 +808,15 @@
         "enablePullDownRefresh": false
       }
     },
+
+    {
+      "path": "pages/cb/wenshizs/detail",
+      "style": {
+        "navigationBarTitleText": "温室大棚系统",
+        "enablePullDownRefresh": false,
+        "navigationStyle": "custom"
+      }
+    },
     {
       "path": "pages/cb/shuifeizs/detail",
       "style": {

BIN
pages/cb/wenshizs/assets/air-humidity.png


BIN
pages/cb/wenshizs/assets/air-temperature.png


BIN
pages/cb/wenshizs/assets/co2.png


BIN
pages/cb/wenshizs/assets/error.png


BIN
pages/cb/wenshizs/assets/illumination.png


Fichier diff supprimé car celui-ci est trop grand
+ 3 - 0
pages/cb/wenshizs/assets/location.svg


BIN
pages/cb/wenshizs/assets/ph.png


BIN
pages/cb/wenshizs/assets/soil-humidity.png


BIN
pages/cb/wenshizs/assets/soil-temperature.png


BIN
pages/cb/wenshizs/assets/success.png


+ 170 - 0
pages/cb/wenshizs/components/DeviceCard.vue

@@ -0,0 +1,170 @@
+<template>
+  <view class="device-card" @click="handleClick">
+    <view class="device-card__status">
+      <image
+        class="img"
+        :src="dataSource.devStatus == '1' ? successImg : errorImg"
+      />
+      <view
+        class="status-text"
+        :class="{ offline: dataSource.devStatus != '1' }"
+        >{{ dataSource.devStatusName || '' }}</view
+      >
+    </view>
+    <view class="device-card__header">
+      <view class="device-card__title u-line-1">
+        <view class="name">{{ dataSource.devName || '' }}</view>
+        <view class="tips">{{ dataSource.devCode || '' }}</view>
+      </view>
+    </view>
+    <view class="device-card__body">
+      <view class="device-card__row">
+        <view class="device-card__label">上报时间</view>
+        <view class="device-card__value">{{ dataSource.devUpdateddate }}</view>
+      </view>
+      <view class="device-card__row">
+        <view class="device-card__label">设备位置</view>
+        <view class="device-card__value">{{
+          `${dataSource.devProvincealign || dataSource.devProvince || ''}  ${
+            dataSource.devCityalign || dataSource.devCity || ''
+          } ${dataSource.devDistrictalign || dataSource.devDistrict || ''}`
+        }}</view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import successImg from '../assets/success.png';
+import errorImg from '../assets/error.png';
+
+export default {
+  name: 'DeviceCard',
+  props: {
+    dataSource: {
+      type: Object,
+      default() {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      successImg,
+      errorImg,
+    };
+  },
+  methods: {
+    handleClick() {},
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.device-card {
+  background: linear-gradient(180deg, #8ae4c93d 0%, #14a47800 25.54%), #fff;
+  position: relative;
+  padding: 28rpx;
+  border-radius: 16rpx;
+  background-color: #fff;
+  margin-bottom: 32rpx;
+  margin: 0 auto;
+  &__status {
+    position: absolute;
+    right: 0;
+    top: 0;
+    width: 150rpx;
+    height: 56rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    .img {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      right: 0;
+      top: 0;
+      overflow: hidden;
+    }
+
+    .status-text {
+      font-size: 28rpx;
+      color: #14a478;
+
+      &.online {
+        color: #14a478;
+      }
+
+      &.offline {
+        color: #ff3546;
+      }
+    }
+  }
+
+  &__header {
+    margin-bottom: 18rpx;
+  }
+
+  &__title {
+    align-items: center;
+    line-height: 48rpx;
+    display: flex !important;
+    .name {
+      width: 140rpx;
+      font-size: 32rpx;
+      color: #042118;
+      margin-right: 32rpx;
+      // 超出隐藏
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      text-align: left;
+      font-family: 'Source Han Sans CN VF';
+      font-weight: 700;
+    }
+
+    .tips {
+      width: 410rpx;
+      font-size: 32rpx;
+      color: #687a74;
+      // 超出隐藏
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      text-align: left;
+    }
+  }
+
+  &__body {
+    padding: 16rpx 0;
+    background-color: #fff;
+    border-radius: 12rpx;
+  }
+
+  &__row {
+    display: flex;
+    align-items: center;
+    margin-bottom: 16rpx;
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+
+  &__label {
+    width: 140rpx;
+    color: #9ba6a3;
+    text-align: left;
+    margin-right: 32rpx;
+  }
+
+  &__value {
+    width: 470rpx;
+    text-align: left;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
+</style>

+ 101 - 0
pages/cb/wenshizs/components/OperationCard.vue

@@ -0,0 +1,101 @@
+<template>
+  <view class="operation">
+    <view class="operation__header">{{ dourceData.name }}</view>
+    <view class="operation__body">
+      <view class="operation__body-content">
+        <view class="operation__body-content--title">展开</view>
+        <view class="operation__body-content--desc">
+          <u-switch
+            v-model="runStatus"
+            active-color="#14A478"
+            inactive-color="#C3CAD8"
+            size="36"
+          ></u-switch>
+        </view>
+      </view>
+      <view class="operation__body-content">
+        <view class="operation__body-content--title">收拢</view>
+        <view class="operation__body-content--desc">
+          <u-switch
+            v-model="closeStatus"
+            active-color="#14A478"
+            inactive-color="#C3CAD8"
+            size="36"
+          ></u-switch>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+export default {
+  name: 'OperationCard',
+  props: {
+    dourceData: {
+      type: Object,
+      default: () => {},
+    },
+  },
+  computed: {
+    runStatus: {
+      get() {
+        // 展开
+        console.log(333, '333');
+        return this.dourceData.down_status == '1';
+      },
+      set(val) {
+        this.$emit('run-status', this.dourceData);
+      },
+    },
+    closeStatus: {
+      get() {
+        // 收拢
+        return this.dourceData.up_status == '1';
+      },
+      set(val) {
+        this.$emit('close-status', this.dourceData);
+      },
+    },
+  },
+  data() {
+    return {
+      checked: true,
+      checked1: false,
+    };
+  },
+  methods: {},
+};
+</script>
+<style scoped lang="scss">
+.operation {
+  justify-content: center;
+  border-radius: 4px;
+  background: #eff2fa;
+  margin-bottom: 32rpx;
+  &__header {
+    height: 64rpx;
+    line-height: 64rpx;
+    color: #333333;
+    font-family: 'Source Han Sans CN VF';
+    font-size: 28rpx;
+    font-weight: 500;
+    border-bottom: 2rpx solid #e4e7ed;
+    padding: 0 32rpx;
+  }
+  &__body {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    grid-gap: 24rpx;
+    padding: 30rpx;
+    &-content {
+      height: 72rpx;
+      background: #ffffff;
+      border-radius: 16rpx;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 16rpx;
+    }
+  }
+}
+</style>

+ 135 - 0
pages/cb/wenshizs/components/element.vue

@@ -0,0 +1,135 @@
+<template>
+  <view class="element">
+    <view class="element-header">
+      <view class="element-title">1号环控</view>
+      <view class="element-status">
+        2024-01-25 16:05:05
+        <u-icon name="reload" color="#14A478" style="margin-left: 20rpx" />
+      </view>
+    </view>
+    <view class="element-body">
+      <view class="element-row" v-for="(item, index) in list" :key="index">
+        <image :src="item.url" class="element-col-icon" />
+        <view class="element-col">
+          <view class="element-col-title"
+            >{{ item.content }}
+            <text class="unit">{{ item.unit }}</text>
+          </view>
+          <view class="element-col-content">{{ item.title }}</view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+import airhumidity from '../assets/air-humidity.png';
+import airtemperature from '../assets/air-temperature.png';
+import co2 from '../assets/co2.png';
+import illumination from '../assets/illumination.png';
+import ph from '../assets/ph.png';
+import soilhumidity from '../assets/soil-humidity.png';
+import soiltemperature from '../assets/soil-temperature.png';
+
+export default {
+  name: 'Element',
+  data() {
+    return {
+      list: [
+        {
+          url: airhumidity,
+          title: '空气温度',
+          unit: '℃',
+          content: '12',
+        },
+        {
+          url: airtemperature,
+          title: '空气湿度',
+          unit: '%',
+          content: '80',
+        },
+        {
+          url: soiltemperature,
+          title: '土壤温度',
+          unit: '℃',
+          content: '80',
+        },
+        {
+          url: soilhumidity,
+          title: '土壤湿度',
+          unit: '%',
+          content: '80',
+        },
+        {
+          url: co2,
+          title: '二氧化碳',
+          unit: 'ppm',
+          content: '80',
+        },
+        {
+          url: illumination,
+          title: '光照',
+          unit: 'LUX',
+          content: '80',
+        },
+        {
+          url: ph,
+          title: '土壤PH值',
+          unit: '',
+          content: '80',
+        },
+      ],
+    };
+  },
+};
+</script>
+<style lang="less" scoped>
+.element {
+  .element-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 20rpx;
+    color: #042118;
+    font-family: 'Source Han Sans CN VF';
+    font-size: 28rpx;
+    font-weight: 700;
+    .element-status {
+      color: #687a74;
+      text-align: center;
+      font-family: 'Source Han Sans CN VF';
+      font-size: 28rpx;
+      font-weight: 400;
+    }
+  }
+  .element-body {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    grid-gap: 20rpx;
+    padding: 20rpx;
+    .element-row {
+      display: flex;
+      margin-bottom: 20rpx;
+      .element-col-icon {
+        width: 100rpx;
+        height: 100rpx;
+        margin-right: 10rpx;
+      }
+      .element-col {
+        .element-col-title {
+          font-size: 28rpx;
+          color: #042118;
+          font-weight: 700;
+          .unit {
+            font-size: 24rpx;
+            color: #999;
+          }
+        }
+        .element-col-content {
+          font-size: 24rpx;
+          color: #666;
+        }
+      }
+    }
+  }
+}
+</style>

+ 185 - 0
pages/cb/wenshizs/detail.vue

@@ -0,0 +1,185 @@
+<template>
+  <view class="greenhouse-page">
+    <custom-card>
+      <block slot="backText">
+        <view class="greenhouse-top__title">
+          {{ dataSource.devName }}
+        </view> </block
+      ><view slot="right">
+        <view class="ntoNative" @tap="toNavigation">
+          <image :src="location" class="icon"></image>
+        </view>
+      </view>
+    </custom-card>
+    <view class="greenhouse-top">
+      <device-card :dataSource="dataSource" />
+    </view>
+    <view class="greenhouse-bottom">
+      <!-- <Element /> -->
+      <operation-card
+        @run-status="runStatusHandler"
+        @close-status="closeStatusHandler"
+        v-for="(item, index) in juanmoList"
+        :key="index"
+        :dourceData="item"
+      />
+    </view>
+  </view>
+</template>
+
+<script>
+import location from './assets/location.svg';
+import Element from './components/element.vue';
+import deviceCard from './components/DeviceCard.vue';
+import OperationCard from './components/OperationCard.vue';
+
+export default {
+  components: {
+    Element,
+    deviceCard,
+    OperationCard,
+  },
+  data() {
+    return {
+      location,
+      juanmoList: [],
+      dataSource: {
+        devStatus: '1',
+        devStatusName: '在线',
+        devName: '-',
+        devCode: '-',
+        devUpdateddate: '-',
+        devProvincealign: '-',
+      },
+    };
+  },
+  methods: {
+    init() {
+      this.getDpdevicedpkzgjuanmoList();
+      this.getDataSource();
+    },
+    async getDataSource() {
+      const res = await this.$myRequest({
+        url: '/api/v2/iot/mobile/device/dpkzg/info/',
+        method: 'post',
+        data: {
+          devBid: this.devBid,
+        },
+      });
+      console.log(res, 'resresress');
+      this.dataSource = res;
+    },
+    runStatusHandler(dourceData) {
+      if (dourceData.down_status === '0' && dourceData.up_status === '1') {
+        this.$set(dourceData, 'up_status', '0');
+      }
+      this.$set(
+        dourceData,
+        'down_status',
+        dourceData.down_status === '1' ? '0' : '1'
+      );
+    },
+    closeStatusHandler(dourceData) {
+      if (dourceData.up_status === '0' && dourceData.down_status === '1') {
+        this.$set(dourceData, 'down_status', '0');
+      }
+      this.$set(
+        dourceData,
+        'up_status',
+        dourceData.up_status === '1' ? '0' : '1'
+      );
+    },
+    toNavigation() {
+      const roundedLongitude =
+        this.deviceInfo.devLngalign || this.deviceInfo.devLng;
+      const roundedLatitude =
+        this.deviceInfo.devLatalign || this.deviceInfo.devLat;
+      if (!roundedLongitude) {
+        uni.showToast({
+          title: '当前设备无定位信息',
+          icon: 'none',
+          duration: 3000,
+        });
+        return;
+      }
+      if (
+        plus.runtime.isApplicationExist({
+          pname: 'com.autonavi.minimap',
+          action: 'iosamap://',
+        })
+      ) {
+        let url = `amapuri://route/plan?sourceApplication=yourAppName&dlat=${roundedLatitude}&dlon=${roundedLongitude}&dev=0&t=0&style=0&start=&auto=1&rtdType=1&coordinate=wgs84`;
+        plus.runtime.openURL(url);
+      } else if (
+        plus.runtime.isApplicationExist({
+          pname: 'com.baidu.BaiduMap',
+          action: 'baidumap://',
+        })
+      ) {
+        let url = `baidumap://map/direction?destination=${roundedLongitude},${roundedLatitude}&mode=navigation&output=html&coord_type=wgs84`;
+        plus.runtime.openURL(url);
+      } else {
+        uni.showToast({
+          title: '当前未安装 高德地图或百度地图 无法导航',
+          icon: 'none',
+          duration: 3000,
+        });
+      }
+    },
+    // 获取卷膜设备列表
+    async getDpdevicedpkzgjuanmoList(tf) {
+      const res = await this.$myRequest({
+        url: '/api/v2/iot/mobile/device/dpkzg/juanmo/list/',
+        method: 'post',
+        data: {
+          pageSize: this.size,
+          pageNum: this.page,
+          devBid: this.devBid,
+        },
+      });
+      this.juanmoList = res;
+    },
+  },
+  onLoad(query) {
+    this.devBid = query.devBid;
+    this.devBid && this.init();
+  },
+};
+</script>
+<style scoped lang="scss">
+uni-page-body {
+  position: relative;
+  height: 100%;
+}
+.icon {
+  width: 40rpx;
+  height: 40rpx;
+}
+.greenhouse-page {
+  background: linear-gradient(
+      180deg,
+      #ffffff00 0%,
+      #eff2fa 23.64%,
+      #eff2fa 100%
+    ),
+    linear-gradient(102deg, #bfeadd 6.77%, #b8f1e7 40.15%, #b9eef5 84.02%);
+  height: 100%;
+  width: 100%;
+  overflow-x: hidden;
+  overflow-y: scroll;
+  .greenhouse-top {
+    text-align: center;
+    margin: 0 auto;
+    margin-top: 18rpx;
+    padding: 0 30rpx;
+  }
+  .greenhouse-bottom {
+    width: calc(100% - 128rpx);
+    padding: 32rpx 32rpx 1rpx 32rpx;
+    background: #ffffff;
+    border-radius: 16rpx;
+    margin: 0 auto;
+    margin-top: 32rpx;
+  }
+}
+</style>

+ 42 - 2
pages/equipList/index.vue

@@ -77,9 +77,13 @@
               <p>
                 适配用户:{{ item.real_name == '' ? '无' : item.real_name }}
               </p>
-              <p v-if="type_id == 40">最新上报时间:{{ item.uptime }}</p>
+              <p v-if="type_id == 40 || type_id == 42">
+                最新上报时间:{{ item.uptime }}
+              </p>
               <p v-else>最新上报时间:{{ item.uptime | timeFormat() }}</p>
-              <p v-if="type_id == 40">添加设备时间:{{ item.addtime }}</p>
+              <p v-if="type_id == 40 || type_id == 42">
+                添加设备时间:{{ item.addtime }}
+              </p>
               <span v-else>
                 <p v-if="item.addtime === 0">添加设备时间:- -</p>
                 <p v-else>添加设备时间:{{ item.addtime | timeFormat() }}</p>
@@ -150,6 +154,32 @@ export default {
     };
   },
   methods: {
+    // 大棚
+    async getDpDeviceList(tf) {
+      const res = await this.$myRequest({
+        url: '/api/v2/iot/mobile/device/dpkzg/yf/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 getDeviceList(tf) {
       const res = await this.$myRequest({
         url: '/api/v2/iot/mobile/device/sf/zsrf/list/',
@@ -177,6 +207,10 @@ export default {
     async eqlist(tf) {
       //设备列表
       this.loadingtf = true;
+      if (this.type_id == 42) {
+        this.getDpDeviceList(tf);
+        return;
+      }
       if (this.type_id == 40) {
         this.getDeviceList(tf);
         return;
@@ -572,6 +606,12 @@ export default {
             url: `../cb/shuifeizs/detail?devBid=${item.devBid}&devName=${item.devName}&devStatus=${item.devStatus}`,
           });
           break;
+        case 42:
+          item.addtime = item.uptime;
+          uni.navigateTo({
+            url: `../cb/wenshizs/detail?devBid=${item.devBid}&devName=${item.device_name}&devStatus=${item.devStatus}`,
+          });
+          break;
         default:
           item.addtime = item.uptime;
           item.type = this.type_id;

+ 4 - 1
util/api.js

@@ -6,7 +6,10 @@ export const myRequest = (options) => {
   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://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';