2021-08-09

src/components/areaZz.vue

@@ -462,9 +462,10 @@ export default {
       selectOption: [],
     }
   },
-  props: ['countyCode'],
+  props: ['countyCode', 'isDevice'],
   methods: {
     handleChange(value) {
+      console.log(value);
       this.$emit('getCityCode', value);
     },
     getFilter(list,target ) {
@@ -483,8 +484,15 @@ export default {
     }
   },
   mounted() {
-    this.selectedOptions = [this.countyCode];
-    this.selectOption = this.getFilter(this.options, this.countyCode);
+    if(this.isDevice) {
+      console.log(111);
+      this.selectedOptions.push(this.countyCode);
+      console.log(this.selectedOptions);
+      this.selectOption = this.options;
+    } else {
+       this.selectedOptions = [this.countyCode];
+       this.selectOption = this.getFilter(this.options, this.countyCode);
+    }
     // console.log(arr);
     console.log(this.selectedOptions);
   }

src/components/areaZzother.vue

@@ -0,0 +1,490 @@
+<template>
+  <div>
+    <el-cascader
+        size="mini"
+        :options="options"
+        v-model="selectedOptions"
+        ref="area"
+        @change="handleChange($event)">
+    </el-cascader>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "areaZz",
+  data() {
+    return {
+      selectedOptions: [],
+      options: [
+        {
+          value: '330000',
+          label: '浙江省',
+          children: [
+            {
+              value: '330100',
+              label: '杭州市',
+              children: [
+                {
+                  value: '330102',
+                  label: '上城区'
+                },
+                {
+                  value: '330105',
+                  label: '拱墅区'
+                },
+                {
+                  value: '330106',
+                  label: '西湖区'
+                },
+                {
+                  value: '330108',
+                  label: '滨江区'
+                },
+                {
+                  value: '330109',
+                  label: '萧山区'
+                },
+                {
+                  value: '330110',
+                  label: '余杭区'
+                },
+                {
+                  value: '330111',
+                  label: '富阳区'
+                },
+                {
+                  value: '330112',
+                  label: '临安区'
+                },
+                {
+                  value: '330113',
+                  label: '钱塘区'
+                },
+                {
+                  value: '330114',
+                  label: '临平区'
+                },
+                {
+                  value: '330122',
+                  label: '桐庐县'
+                },
+                {
+                  value: '330127',
+                  label: '淳安县'
+                },
+                {
+                  value: '330182',
+                  label: '建德市'
+                },
+              ]
+            },
+            {
+              value: '330200',
+              label: '宁波市',
+              children: [
+                {
+                  value: '330203',
+                  label: '海曙区'
+                },
+                {
+                  value: '330205',
+                  label: '江北区'
+                },
+                {
+                  value: '330206',
+                  label: '北仑区'
+                },
+                {
+                  value: '330211',
+                  label: '镇海区'
+                },
+                {
+                  value: '330212',
+                  label: '鄞州区'
+                },
+                {
+                  value: '330213',
+                  label: '奉化区'
+                },
+                {
+                  value: '330225',
+                  label: '象山区'
+                },
+                {
+                  value: '330226',
+                  label: '宁海县'
+                },
+                {
+                  value: '330281',
+                  label: '余姚市'
+                },
+                {
+                  value: '330282',
+                  label: '慈溪市'
+                },
+              ]
+            },
+            {
+              value: '330300',
+              label: '温州市',
+              children: [
+                {
+                  value: '330302',
+                  label: '鹿城区'
+                },
+                {
+                  value: '330303',
+                  label: '龙湾区'
+                },
+                {
+                  value: '330304',
+                  label: '瓯海区',
+                },
+                {
+                  value: '330305',
+                  label: '洞头区'
+                },
+                {
+                  value: '330324',
+                  label: '永嘉县'
+                },
+                {
+                  value: '330326',
+                  label: '平阳县'
+                },
+                {
+                  value: '330327',
+                  label: '苍南县'
+                },
+                {
+                  value: '330328',
+                  label: '文成县'
+                },
+                {
+                  value: '330329',
+                  label: '泰顺县'
+                },
+                {
+                  value: '330381',
+                  label: '瑞安市'
+                },
+                {
+                  value: '330382',
+                  label: '乐清市'
+                },
+                {
+                  value: '330383',
+                  label: '龙港市'
+                },
+              ]
+            },
+            {
+              value: '330400',
+              label: '嘉兴市',
+              children: [
+                {
+                  value: '330402',
+                  label: '南湖区',
+                },
+                {
+                  value: '330411',
+                  label: '秀洲区',
+                },
+                {
+                  value: '330421',
+                  label: '嘉善县',
+                },
+                {
+                  value: '330424',
+                  label: '海盐县',
+                },
+                {
+                  value: '330481',
+                  label: '海宁市',
+                },
+                {
+                  value: '330482',
+                  label: '平湖市',
+                },
+                {
+                  value: '330483',
+                  label: '桐乡市',
+                },
+              ]
+            },
+            {
+              value: '330500',
+              label: '湖州市',
+              children: [
+                {
+                  value: '330502',
+                  label: '吴兴区',
+                },
+                {
+                  value: '330503',
+                  label: '南浔区',
+                },
+                {
+                  value: '330521',
+                  label: '德清县',
+                },
+                {
+                  value: '330522',
+                  label: '长兴县',
+                },
+                {
+                  value: '330523',
+                  label: '安吉县',
+                },
+              ]
+            },
+            {
+              value: '330600',
+              label: '绍兴市',
+              children: [
+                {
+                  value: '330602',
+                  label: '越城区',
+                },
+                {
+                  value: '330603',
+                  label: '柯桥区',
+                },
+                {
+                  value: '330604',
+                  label: '上虞区',
+                },
+                {
+                  value: '330624',
+                  label: '新昌县',
+                },
+                {
+                  value: '330681',
+                  label: '诸暨市',
+                },
+                {
+                  value: '330683',
+                  label: '嵊州市',
+                },
+              ]
+            },
+            {
+              value: '330700',
+              label: '金华市',
+              children: [
+                {
+                  value: '330702',
+                  label: '婺城区'
+                },
+                {
+                  value: '330703',
+                  label: '金东区'
+                },
+                {
+                  value: '330723',
+                  label: '武义县'
+                },
+                {
+                  value: '330726',
+                  label: '浦江县'
+                },
+                {
+                  value: '330727',
+                  label: '婺城区'
+                },
+                {
+                  value: '330702',
+                  label: '磐安县'
+                },
+                {
+                  value: '330784',
+                  label: '永康市'
+                },
+                {
+                  value: '330781',
+                  label: '兰溪市'
+                },
+                {
+                  value: '330782',
+                  label: '义乌市'
+                },
+                {
+                  value: '330783',
+                  label: '东阳市'
+                },
+              ]
+            },
+            {
+              value: '330800',
+              label: '衢州市',
+              children: [
+                {
+                  value: '330802',
+                  label: '柯城区'
+                },
+                {
+                  value: '330803',
+                  label: '衢江区'
+                },
+                {
+                  value: '330822',
+                  label: '常山县'
+                },
+                {
+                  value: '330824',
+                  label: '开化县'
+                },
+                {
+                  value: '330825',
+                  label: '龙游县'
+                },
+                {
+                  value: '330881',
+                  label: '江山市'
+                },
+              ]
+            },
+            {
+              value: '330900',
+              label: '舟山市',
+              children: [
+                {
+                  value: '330902',
+                  label: '定海区'
+                },
+                {
+                  value: '330903',
+                  label: '普陀区'
+                },
+                {
+                  value: '330921',
+                  label: '岱山县'
+                },
+                {
+                  value: '330922',
+                  label: '嵊泗县'
+                },
+              ]
+            },
+            {
+              value: '331000',
+              label: '台州市',
+              children: [
+                {
+                  value: '331002',
+                  label: '椒江区'
+                },
+                {
+                  value: '331003',
+                  label: '黄岩区'
+                },
+                {
+                  value: '331004',
+                  label: '路桥区'
+                },
+                {
+                  value: '331022',
+                  label: '三门县'
+                },
+                {
+                  value: '331023',
+                  label: '天台县'
+                },
+                {
+                  value: '331024',
+                  label: '仙居县'
+                },
+                {
+                  value: '331081',
+                  label: '温岭市'
+                },
+                {
+                  value: '331082',
+                  label: '临海市'
+                },
+                {
+                  value: '331083',
+                  label: '玉环市'
+                },
+              ]
+            },
+            {
+              value: '331100',
+              label: '丽水市',
+              children: [
+                {
+                  value: '331102',
+                  label: '莲都区',
+                },
+                {
+                  value: '331121',
+                  label: '青田县',
+                },
+                {
+                  value: '331122',
+                  label: '缙云县',
+                },
+                {
+                  value: '331102',
+                  label: '莲都区',
+                },
+                {
+                  value: '331123',
+                  label: '遂昌县',
+                },
+                {
+                  value: '331124',
+                  label: '松阳县',
+                },
+                {
+                  value: '331125',
+                  label: '云和县',
+                },
+                {
+                  value: '331126',
+                  label: '庆元县',
+                },
+                {
+                  value: '331127',
+                  label: '景宁畲族自治县',
+                },
+                {
+                  value: '331181',
+                  label: '龙泉市',
+                },
+              ]
+            },
+          ]
+        }
+      ],
+      selectOption: null,
+    }
+  },
+  props: ['countyCode'],
+  methods: {
+    handleChange(value) {
+      console.log('countyArr:' + this.countyCode);
+      // console.log(value);
+      let arr = this.$refs['area'].getCheckedNodes()[0].pathLabels
+      // console.log(arr);
+      // this.$emit('getCityCode', value);
+      this.$emit('getCityCode', {
+        value: value,
+        label: arr
+      })
+    }
+  },
+  watch: {
+    'countyCode': {
+      handler (newValue) {
+        this.selectedOptions = newValue.split(',')
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/deviceAdmin/addOrUpdate.vue

@@ -28,17 +28,22 @@
       </el-row>
       <el-row :gutter="20">
         <el-col :span="12">
-          <el-form-item label="省市县名：" prop="countyName">
-            <area-zz 
-              :countyCode="330000" 
-              v-model="form.countyCode" 
+          <el-form-item label="省市县名：" prop="countyCode">
+            <areaZzother 
               @getCityCode="getCityCode"
-              style="width: 178px;"></area-zz>
+              style="width: 178px;"
+              :countyCode="form.countyCode">
+            </areaZzother>  
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="牧场名：" prop="farmCode">
-            <el-select v-model="form.farmCode" style="width: 178px;">
+            <el-select 
+              v-model="form.farmCode" 
+              style="width: 178px;"
+              ref="farm"
+              @focus="handleFocus('farm', 'countyCode')"
+              @blur="handleBlur">
               <el-option
                 v-for="item in farmSelectedList"
                 :key="item.farmCode"
@@ -122,7 +127,7 @@
 </template>
 <script>
 import {mapState} from 'vuex'
-import areaZz from '../../components/areaZz.vue'
+import areaZzother from '../../components/areaZzother.vue'
 export default {
   data() {
     return {
@@ -132,6 +137,7 @@ export default {
         registerTime: '',
         deviceCode: '',
         countyCode: '',
+        countyName: '',
         farmCode: '',
         stage: '',
         pigpenId: '',
@@ -225,13 +231,12 @@ export default {
     ...mapState(['baseUrl'])
   },
   components: {
-    areaZz
+    areaZzother
   },
   methods: {
     init (row) {
-      console.log(row);
       this.visible = true
-      this.form.registerTime = this.getDate(new Date())
+      this.form.registerTime = this.getDate(new Date()) // 默认注册时间
       this.$http({
         url: this.$http.adornUrl(`${this.baseUrl}/manager/basepigpen/listAll`),
         method: 'get'
@@ -244,14 +249,20 @@ export default {
         this.farmSelectedList = this.farmList
         this.pigpenList = data.page
         this.pigpenSelectedList = this.pigpenList
-        if (row.id) { // 如果没有参数传入，默认传入鼠标点击事件
+        if (row.id) { // 如果没有参数传入，会默认传入鼠标点击事件
           let pigpen = this.pigpenSelectedList.find(item => item.id === row.pigpenId)
           this.unitSelectedList = pigpen.children
-          for (const key in this.form) {
-            if (Object.hasOwnProperty.call(this.form, key)) {
-              this.form[key] = row[key]
-            }
-          }
+          this.form.id = row.id
+          this.form.registerTime = row.registerTime
+          this.form.deviceCode = row.deviceCode
+          this.form.countyCode = row.countyCode
+          this.form.countyName = row.countyName
+          this.form.farmCode = row.farmCode
+          this.form.stage = row.stage
+          this.form.pigpenId = row.pigpenId
+          this.form.unitId = row.unitId
+          this.form.serverIp = row.serverIp
+          this.form.port = row.port
         }
       }).catch(() => {})
     },
@@ -279,12 +290,17 @@ export default {
     },
     // 省市县
     getCityCode (val) {
-      let len = val.length
-      this.form.countyCode = val[len-1]
+      // let len = val.length
+      this.form.countyName = val.label.join('')
+      this.form.countyCode = val.value.join()
+      // this.form.countyCode = val[len-1]
     },
     // 选择框的选择顺序
     handleFocus (ref, formItem) {
+      console.log(ref)
+      console.log('现在的msgFlag是' + this.msgFlag);
       const msg = {
+        farm: '请先选择省市县',
         pigpen: '请先选择牧场',
         unit: '请先选择栋舍'
       }
@@ -300,7 +316,7 @@ export default {
     handleBlur () {
       setTimeout(() => {
         this.msgFlag = false
-      }, 50)
+      }, 100)
     },
     // 确定按钮
     onSubmit () {
@@ -313,6 +329,7 @@ export default {
               'id': this.form.id || undefined,
               'registerTime': this.form.registerTime + ' 00:00:00',
               'deviceCode': this.form.deviceCode,
+              'countyName': this.form.countyName,
               'countyCode': this.form.countyCode,
               'unitId': this.form.unitId,
               'farmCode': this.form.farmCode || undefined,
@@ -324,7 +341,6 @@ export default {
           }).then(({data}) => {
             if (data && data.code === 0) {
               this.$refs['form'].resetFields()
-              this.visible = false
               this.$emit('refreshData')
               this.$message({
                 message: '操作成功',
@@ -336,7 +352,6 @@ export default {
                 // }
               })
               // this.resetForm()
-              this.$refs.form.resetFields()
               this.visible = false
             } else {
               this.$message.error(data.msg)
@@ -375,7 +390,6 @@ export default {
           this.unitSelectedList.filter(item => {
             unitIds.push(item.id)
           })
-          console.log(unitIds);
           if (unitIds.indexOf(this.form.unitId) === -1) {
             this.form.unitId = ''
           }
@@ -384,17 +398,18 @@ export default {
     },
     'form.countyCode': {
       handler (newValue) {
-        console.log(newValue);
         // this.form.unitId = ''
-        if (newValue) {
+        if (newValue && (typeof newValue === 'string')) {
+          let arr = newValue.split(',')
+          let len = arr.length
+          let code = arr[len - 1]
           this.$http({
             url: this.$http.adornUrl(`${this.baseUrl}/management/basefarminfo/findByCityCode`),
             method: 'get',
             params: this.$http.adornParams({
-              'countyCode': newValue
+              'countyCode': code
             })
           }).then(({data}) => {
-            console.log(data);
             this.farmSelectedList = data.page
             let farmIds = []
             this.farmSelectedList.forEach(item => {

src/views/deviceAdmin/charts/hisAndLine.vue

@@ -6,12 +6,14 @@
 <script>
 import { mapState } from 'vuex'
 export default {
-  props: ['time'],
+  props: ['time', 'scope'],
   data() {
     return {
       dates: [],
       temps: [],
-      eartags: []
+      eartags: [],
+      chart: null,
+      deviceCode: ''
     }
   },
   computed: {
@@ -19,8 +21,7 @@ export default {
   },
   methods: {
     draw () {
-      const chart = this.$echarts.init(document.getElementById('two'))
-      chart.showLoading()
+      this.chart.showLoading()
       const option = {
         tooltip: {
           trigger: 'axis'
@@ -99,21 +100,21 @@ export default {
           }
         ]
       }
-      chart.setOption(option)
+      this.chart.setOption(option)
       setTimeout(() => {
-          chart.hideLoading();//隐藏等待条
+          this.chart.hideLoading();//隐藏等待条
       }, 1000);
     },
     init () {
-      let deviceCode = this.$route.params.deviceCode
-      // let deviceCode = 1
+      this.chart = this.$echarts.init(document.getElementById('two'))
+      this.deviceCode = this.$route.params.deviceCode
       this.$http({
-        url: this.$http.adornUrl(`${this.baseUrl}/manager/eartagdata/countByTime`),
+        url: this.$http.adornUrl(`${this.baseUrl}/manager/eartagdata/${this.scope === 1? 'countByDay': 'countByTime' }`),
         method: 'get',
         params: this.$http.adornParams({
-          'deviceCode': deviceCode,
-          'startTime': this.time? this.time[0]: undefined,
-          'endTime': this.time? this.time[1]: undefined
+          'deviceCode': this.deviceCode,
+          'startTime': this.time[0] || undefined,
+          'endTime': this.time[1] || undefined
         }, false)
       }).then(async({data}) => {
         if (data.code === 0) {
@@ -136,6 +137,13 @@ export default {
           this.init()
         }
       }
+    },
+    scope: {
+      handler (newValue) {
+        if (newValue) {
+          this.init()
+        }
+      }
     }
   }
 }

src/views/deviceAdmin/deviceAdmin.vue

@@ -120,9 +120,11 @@
           align="center">
         </el-table-column>
         <el-table-column
-          prop="countyCode"
           label="省市县编码"
           align="center">
+          <template slot-scope="scope">
+            <span>{{ getCountyCode(scope.row.countyCode) }}</span>
+          </template>
         </el-table-column>
         <el-table-column
           prop="farmName"
@@ -370,7 +372,6 @@ export default {
   methods: {
     // 初始化
     init () {
-      console.log(this.searchForm.registerTime);
       this.$http({
         url: this.$http.adornUrl(`${this.baseUrl}/manager/collectorregister/list`),
         method: 'get',
@@ -395,7 +396,6 @@ export default {
         this.boxList[1].value = res.data.data.normal
         this.boxList[2].value = res.data.data.abnormal
         this.boxList[3].value = res.data.data.logout
-        console.log(res);
         this.tableData = data.page.list
         this.totalPages = data.page.totalCount
         this.dataListLoading = false
@@ -403,6 +403,11 @@ export default {
         this.dataListLoading = false
       })
     },
+    getCountyCode (code) {
+      let arr = code.split(',')
+      let len = arr.length
+      return arr[len - 1]
+    },
     // 显示条数改变
     sizeChange (val) {
       this.pageSize = val
@@ -425,7 +430,6 @@ export default {
     },
     // 查看按钮
     handleCheck (row) {
-      console.log(row)
       // 组件间传值`/deviceInfo/${row.id}`
       this.$router.push({
         name: 'deviceInfo',

src/views/deviceAdmin/deviceInfo.vue

@@ -48,7 +48,7 @@
         <div class="title">
           <span>上传数据走势图</span>
           <div class="right">
-            <el-date-picker
+            <el-date-picker 
               v-model="timeSelected"
               type="datetimerange"
               range-separator="—"
@@ -57,8 +57,13 @@
               size="mini">
             </el-date-picker>
           </div>
+          <!-- 天 / 小时 转换 -->
+          <div class="right">
+            <span :class="{'scopeEle': true, 'ifScoped': scopeSelected === 1, 'borderLeft': true}" @click="scope(1)">日</span>
+            <span :class="{'scopeEle': true, 'ifScoped': scopeSelected === 2, 'borderRight': true}" @click="scope(2)">小时</span>
+          </div>
         </div>
-        <his-and-line :time="timeSelected"></his-and-line>
+        <his-and-line :time="timeSelected" :scope="scopeSelected"></his-and-line>
       </div>
     </div>
   </div>
@@ -154,7 +159,8 @@ export default {
           value: 9,
           label: '病死猪无害化'
         }
-      ]
+      ],
+      scopeSelected: 1, // 日 / 小时 选择，默认日
     }
   },
   computed: {
@@ -164,6 +170,7 @@ export default {
     hisAndLine
   },
   methods: {
+    // 初始化 -> 获取设备的信息
     init () {
       let id = this.$route.params.id
       console.log(id);
@@ -179,8 +186,13 @@ export default {
         }
       }).catch(() => {})
     },
+    // 关闭设备详情页面，回到设备管理
     closeInfo () {
       this.$router.push('/deviceAdmin')
+    },
+    scope (val) {
+      this.scopeSelected = val
+      console.log('设备详情里的scope：' + val);
     }
   },
   mounted() {
@@ -276,4 +288,29 @@ export default {
     margin-right: 20px;
     font-size: 12px;
   }
+
+  /** 年月日选择 */
+  .scopeEle {
+    display: inline-block;
+    border: 1px solid #ccc;
+    width: 75px;
+    text-align: center;
+    height: 26px;
+    line-height: 26px;
+    margin-left: -1px;
+    cursor: pointer;
+    background-color: #fff;
+  }
+  .borderLeft {
+    border-radius: 5px 0 0 5px;
+  }
+  .borderRight {
+    border-radius: 0 5px 5px 0 ;
+  }
+  /* 如果选中了 */
+  .ifScoped {
+    background-color: #1abc9c;
+    color: #fff;
+    border: 1px solid #1abc9c;
+  }
 </style>