初始化

packages/tutelage/AppEarlyWarning/AppEarlyWarning.vue

@@ -0,0 +1,66 @@
+<template>
+  <div class="doc-circulation ailist-wrapper">
+    <keep-alive :include="['List']">
+      <component ref="component" :is="component" @change="onChange" :params="params" :instance="instance" :dict="dict"></component>
+    </keep-alive>
+  </div>
+</template>
+
+<script>
+  import List from './components/List'
+  import Monitor from '../AppWristband/components/Monitor'
+
+  export default {
+    name: 'AppEarlyWarning',
+    label: '健康预警',
+
+    props: {
+      instance: Function,
+      dict: Object
+    },
+
+    data () {
+      return {
+        component: 'List',
+        params: {},
+        include: []
+      }
+    },
+
+    components: {
+      List,
+      Monitor
+    },
+
+    mounted () {
+    },
+
+    methods: {
+      onChange (data) {
+        if (data.type === 'Monitor') {
+          this.component = 'Monitor'
+          this.params = data.params
+        }
+
+        if (data.type === 'list') {
+          this.component = 'List'
+          this.params = data.params
+
+          this.$nextTick(() => {
+            if (data.isRefresh) {
+              this.$refs.component.getList()
+            }
+          })
+        }
+      }
+    }
+  }
+</script>
+
+<style lang="scss">
+  .doc-circulation {
+    height: 100%;
+    background: #F3F6F9;
+    overflow: auto;
+  }
+</style>

packages/tutelage/AppEarlyWarning/components/List.vue

@@ -0,0 +1,266 @@
+<template>
+  <ai-list class="early-warning">
+    <template slot="title">
+      <ai-title title="健康预警" isShowArea isShowBottomBorder v-model="search.areaId" :instance="instance" @change="search.current = 1, getList()">
+        <template #rightBtn>
+          <el-button type="primary" @click="getRules(), isShow = true">预警规则</el-button>
+        </template>
+      </ai-title>
+    </template>
+    <template slot="content">
+      <ai-search-bar class="search-bar">
+        <template #left>
+          <el-date-picker
+            v-model="search.createTimeRange"
+            type="daterange"
+            size="small"
+            @change="search.current = 1, getList()"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期">
+          </el-date-picker>
+          <ai-select
+            v-model="search.item"
+            @change="search.current = 1, getList()"
+            placeholder="预警类型"
+            :selectList="dict.getDict('intelligentGuardianshipItem3')">
+          </ai-select>
+        </template>
+        <template slot="right">
+          <el-input
+            v-model="search.name"
+            size="small"
+            @keyup.enter.native="search.current = 1, getList()"
+            placeholder="请输入成员姓名、设备号"
+            clearable
+            @clear="search.current = 1, search.name = '', getList()"
+            suffix-icon="iconfont iconSearch">
+          </el-input>
+        </template>
+      </ai-search-bar>
+      <ai-table
+        :tableData="tableData"
+        :col-configs="colConfigs"
+        :total="total"
+        v-loading="loading"
+        style="margin-top: 6px;"
+        :current.sync="search.current"
+        :size.sync="search.size"
+        @getList="getList">
+        <el-table-column slot="options" width="160px" fixed="right" label="操作" align="center">
+          <template slot-scope="{ row }">
+            <div class="table-options">
+              <el-button type="text" @click="$router.push({name: '监护地图', query: {id: row.deviceId, lat: row.lat, lng: row.lng}})">地图查看</el-button>
+              <el-button type="text" @click="toMonitor(row.deviceId)">监测数据</el-button>
+            </div>
+          </template>
+        </el-table-column>
+      </ai-table>
+      <ai-dialog
+        :visible.sync="isShow"
+        width="690px"
+        title="预警规则"
+        @close="currIndex = 0"
+        @onConfirm="onConfirm">
+        <el-radio-group v-model="currIndex" size="small">
+          <el-radio-button :label="0">体温</el-radio-button>
+          <el-radio-button :label="1">心率</el-radio-button>
+          <el-radio-button :label="2">血压</el-radio-button>
+          <el-radio-button :label="3">血氧</el-radio-button>
+          <el-radio-button :label="4">电量</el-radio-button>
+        </el-radio-group>
+        <el-form label-width="70px">
+          <div class="rules-form" v-for="(item, index) in rules" :key="index" v-show="currIndex === index">
+            <el-form-item label="规则推送">
+              <el-switch
+                v-model="item.pushType" active-value="1" inactive-value="0">
+              </el-switch>
+            </el-form-item>
+            <el-form-item label="预警规则">
+              <el-input size="small" placeholder="请输入" v-model="item.gtValue" v-if="index !== 4 && index !== 3">
+                <template slot="prepend"><el-button>大于</el-button></template>
+              </el-input>
+              <el-input size="small" placeholder="请输入" v-model="item.ltValue">
+                <template slot="prepend"><el-button type="info">小于</el-button></template>
+              </el-input>
+            </el-form-item>
+          </div>
+        </el-form>
+      </ai-dialog>
+    </template>
+  </ai-list>
+</template>
+
+<script>
+  import { mapState } from 'vuex'
+  export default {
+    name: 'List',
+
+    props: {
+      instance: Function,
+      dict: Object
+    },
+
+    data() {
+      return {
+        search: {
+          current: 1,
+          size: 10,
+          name: '',
+          areaId: '',
+          createTimeRange: [],
+          item: ''
+        },
+        currIndex: 0,
+        isShow: false,
+        loading: false,
+        rules: [],
+        total: 0,
+        colConfigs: [
+          { prop: 'name', label: '姓名' },
+          { prop: 'mid', label: '设备号' },
+          {
+            prop: 'departmentNames',
+            label: '年龄',
+            align: 'center',
+            render: (h, { row }) => {
+              return h('span', {}, this.getIdInfo(row.idNumber, 3))
+            }
+          },
+          { prop: 'sex', align: 'center', label: '性别', formart: v => v === '1' ? '男' : '女' },
+          { prop: 'phone', align: 'center', label: '联系方式' },
+          { prop: 'areaName', align: 'center', label: '所属地区' },
+          { prop: 'type', align: 'center', label: '预警类型', formart: v => this.dict.getLabel('intelligentGuardianshipItem3', v) },
+          { prop: 'itemValue', align: 'center', label: '预警值' },
+          { prop: 'gpsDesc', align: 'center', width: 150, label: '预警地点' },
+          { prop: 'createTime', align: 'center', label: '预警时间' }
+        ],
+        tableData: []
+      }
+    },
+
+    computed: {
+      ...mapState(['user'])
+    },
+
+    mounted() {
+      this.search.areaId = this.user.info.areaId
+      this.dict.load(['intelligentGuardianshipItem3']).then(() => {
+        this.getList()
+      })
+    },
+
+    methods: {
+      getList () {
+        this.instance.post(`/app/appintelligentguardianshipalarm/list`, null, {
+          params: {
+            ...this.search,
+            type: 0,
+            createTimeRange: (this.search.createTimeRange && this.search.createTimeRange.length) ? this.search.createTimeRange.join(',') : ','
+          }
+        }).then(res => {
+          if (res.code == 0) {
+            this.tableData = res.data.records.map(v => {
+              return {
+                ...v,
+                type: this.dict.getLabel('ntelligentGuardianshipItem3', v.item)
+              }
+            })
+            this.total = res.data.total
+
+            this.$nextTick(() => {
+              this.loading = false
+            })
+          } else {
+            this.loading = false
+          }
+        }).catch(() => {
+          this.loading = false
+        })
+      },
+
+      getRules () {
+        this.instance.post(`/app/appintelligentguardianshipalarm/queryAlarmConfig`).then(res => {
+          if (res.code == 0) {
+            this.rules = res.data.sort((a, b) => a.item - b.item)
+
+            if (!res.data.length) {
+              this.rules = [0, 1, 2, 3, 4].map(index => {
+                return {
+                  gtValue: '',
+                  item: index,
+                  ltValue: '',
+                  pushType: '1'
+                }
+              })
+            }
+          }
+        })
+      },
+
+      onConfirm () {
+        this.instance.post(`/app/appintelligentguardianshipalarm/addOrUpdateConfig`, this.rules).then(res => {
+          if (res.code == 0) {
+            this.$message.success('提交成功')
+            this.isShow = false
+          }
+        })
+      },
+
+      getIdInfo (UUserCard, num) {
+        if (num == 1) {
+          var birth = UUserCard.substring(6, 10) + '-' + UUserCard.substring(10, 12) + '-' + UUserCard.substring(12, 14)
+          return birth
+        }
+        if (num == 2) {
+          if (parseInt(UUserCard.substr(16, 1)) % 2 == 1) {
+            return '1'
+          } else {
+            return '0'
+          }
+        }
+
+        if (num == 3) {
+          var myDate = new Date()
+          var month = myDate.getMonth() + 1
+          var day = myDate.getDate()
+          var age = myDate.getFullYear() - UUserCard.substring(6, 10) - 1;
+          if (UUserCard.substring(10, 12) < month || UUserCard.substring(10, 12) == month && UUserCard.substring(12, 14) <= day) {
+            age ++
+          }
+
+          return age
+        }
+      },
+
+      remove (id) {
+        this.$confirm('确定删除该数据？').then(() => {
+          this.instance.post(`/app/appintelligentguardianshipdevice/delete?ids=${id}`).then(res => {
+            if (res.code == 0) {
+              this.$message.success('删除成功！')
+              this.getList()
+            }
+          })
+        })
+      },
+
+      toMonitor (id) {
+        this.$emit('change', {
+          type: 'Monitor',
+          params: {
+            id: id || ''
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+.early-warning {
+  .rules-form {
+    margin-top: 20px;
+  }
+}
+</style>

packages/tutelage/AppSoS/AppSoS.vue

@@ -0,0 +1,66 @@
+<template>
+  <div class="doc-circulation ailist-wrapper">
+    <keep-alive :include="['List']">
+      <component ref="component" :is="component" @change="onChange" :params="params" :instance="instance" :dict="dict"></component>
+    </keep-alive>
+  </div>
+</template>
+
+<script>
+  import List from './components/List'
+  import Monitor from '../AppWristband/components/Monitor'
+
+  export default {
+    name: 'AppSOS',
+    label: 'SOS求助',
+
+    props: {
+      instance: Function,
+      dict: Object
+    },
+
+    data () {
+      return {
+        component: 'List',
+        params: {},
+        include: []
+      }
+    },
+
+    components: {
+      List,
+      Monitor
+    },
+
+    mounted () {
+    },
+
+    methods: {
+      onChange (data) {
+        if (data.type === 'Monitor') {
+          this.component = 'Monitor'
+          this.params = data.params
+        }
+
+        if (data.type === 'list') {
+          this.component = 'List'
+          this.params = data.params
+
+          this.$nextTick(() => {
+            if (data.isRefresh) {
+              this.$refs.component.getList()
+            }
+          })
+        }
+      }
+    }
+  }
+</script>
+
+<style lang="scss">
+  .doc-circulation {
+    height: 100%;
+    background: #F3F6F9;
+    overflow: auto;
+  }
+</style>

packages/tutelage/AppSoS/components/List.vue

@@ -0,0 +1,188 @@
+<template>
+  <ai-list class="early-warning">
+    <template slot="title">
+      <ai-title title="SOS求助" isShowArea isShowBottomBorder v-model="search.areaId" :instance="instance" @change="search.current = 1, getList()">
+      </ai-title>
+    </template>
+    <template slot="content">
+      <ai-search-bar class="search-bar">
+        <template #left>
+          <el-date-picker
+            @change="search.current = 1, getList()"
+            v-model="search.createTimeRange"
+            type="daterange"
+            size="small"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期">
+          </el-date-picker>
+        </template>
+        <template slot="right">
+          <el-input
+            v-model="search.name"
+            size="small"
+            @keyup.enter.native="search.current = 1, getList()"
+            placeholder="请输入成员姓名、设备号"
+            clearable
+            @clear="search.current = 1, search.name = '', getList()"
+            suffix-icon="iconfont iconSearch">
+          </el-input>
+        </template>
+      </ai-search-bar>
+      <ai-table
+        :tableData="tableData"
+        :col-configs="colConfigs"
+        :total="total"
+        v-loading="loading"
+        style="margin-top: 6px;"
+        :current.sync="search.current"
+        :size.sync="search.size"
+        @getList="getList">
+        <el-table-column slot="options" width="160px" fixed="right" label="操作" align="center">
+          <template slot-scope="{ row }">
+            <div class="table-options">
+              <el-button type="text" @click="$router.push({name: '监护地图', query: {id: row.deviceId, lat: row.lat, lng: row.lng}})">地图查看</el-button>
+              <el-button type="text" @click="toMonitor(row.deviceId)">监测数据</el-button>
+            </div>
+          </template>
+        </el-table-column>
+      </ai-table>
+    </template>
+  </ai-list>
+</template>
+
+<script>
+  import { mapState } from 'vuex'
+  export default {
+    name: 'List',
+
+    props: {
+      instance: Function,
+      dict: Object
+    },
+
+    data() {
+      return {
+        search: {
+          current: 1,
+          size: 10,
+          name: '',
+          areaId: '',
+          createTimeRange: []
+        },
+        currIndex: 0,
+        isShow: false,
+        loading: false,
+        total: 0,
+        colConfigs: [
+          { prop: 'name', label: '姓名' },
+          { prop: 'mid', label: '设备号' },
+          {
+            prop: 'departmentNames',
+            label: '年龄',
+            align: 'center',
+            render: (h, { row }) => {
+              return h('span', {}, this.getIdInfo(row.idNumber, 3))
+            }
+          },
+          { prop: 'sex', align: 'center', label: '性别', formart: v => v === '1' ? '男' : '女' },
+          { prop: 'phone', align: 'center', label: '联系方式' },
+          { prop: 'areaName', align: 'center', label: '所属地区' },
+          { prop: 'type', align: 'center', label: '预警类型' },
+          { prop: 'gpsDesc', align: 'center', width: 150, label: '预警地点' },
+          { prop: 'createTime', align: 'center', label: '预警时间' }
+        ],
+        tableData: []
+      }
+    },
+
+    computed: {
+      ...mapState(['user'])
+    },
+
+    mounted() {
+      this.search.areaId = this.user.info.areaId
+      this.getList()
+    },
+
+    methods: {
+      getList () {
+        this.loading = true
+        this.instance.post(`/app/appintelligentguardianshipalarm/list`, null, {
+          params: {
+            ...this.search,
+            item: 5,
+            type: 1,
+            createTimeRange: (this.search.createTimeRange && this.search.createTimeRange.length) ? this.search.createTimeRange.join(',') : ','
+          }
+        }).then(res => {
+          if (res.code == 0) {
+            this.tableData = res.data.records.map(v => {
+              return {
+                ...v,
+                type: 'SOS'
+              }
+            })
+            this.total = res.data.total
+
+            this.$nextTick(() => {
+              this.loading = false
+            })
+          } else {
+            this.loading = false
+          }
+        }).catch(() => {
+          this.loading = false
+        })
+      },
+
+      getIdInfo (UUserCard, num) {
+        if (num == 1) {
+          var birth = UUserCard.substring(6, 10) + '-' + UUserCard.substring(10, 12) + '-' + UUserCard.substring(12, 14)
+          return birth
+        }
+        if (num == 2) {
+          if (parseInt(UUserCard.substr(16, 1)) % 2 == 1) {
+            return '1'
+          } else {
+            return '0'
+          }
+        }
+
+        if (num == 3) {
+          var myDate = new Date()
+          var month = myDate.getMonth() + 1
+          var day = myDate.getDate()
+          var age = myDate.getFullYear() - UUserCard.substring(6, 10) - 1;
+          if (UUserCard.substring(10, 12) < month || UUserCard.substring(10, 12) == month && UUserCard.substring(12, 14) <= day) {
+            age ++
+          }
+
+          return age
+        }
+      },
+
+      onConfirm () {
+
+      },
+
+      toMonitor (id) {
+        this.$emit('change', {
+          type: 'Monitor',
+          params: {
+            id: id || ''
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+.early-warning {
+  .rules-form {
+    margin-top: 20px;
+  }
+}
+</style>

packages/tutelage/AppWristband/AppWristband.vue

@@ -0,0 +1,73 @@
+<template>
+  <div class="doc-circulation ailist-wrapper">
+    <keep-alive :include="['List']">
+      <component ref="component" :is="component" @change="onChange" :params="params" :instance="instance" :dict="dict"></component>
+    </keep-alive>
+  </div>
+</template>
+
+<script>
+  import List from './components/List'
+  import Add from './components/Add'
+  import Monitor from './components/Monitor'
+
+  export default {
+    name: 'AppWristband',
+    label: '人员设备',
+
+    props: {
+      instance: Function,
+      dict: Object
+    },
+
+    data () {
+      return {
+        component: 'List',
+        params: {},
+        include: []
+      }
+    },
+
+    components: {
+      Add,
+      List,
+      Monitor
+    },
+
+    mounted () {
+    },
+
+    methods: {
+      onChange (data) {
+        if (data.type === 'Add') {
+          this.component = 'Add'
+          this.params = data.params
+        }
+
+        if (data.type === 'Monitor') {
+          this.component = 'Monitor'
+          this.params = data.params
+        }
+
+        if (data.type === 'list') {
+          this.component = 'List'
+          this.params = data.params
+
+          this.$nextTick(() => {
+            if (data.isRefresh) {
+              this.$refs.component.getList()
+            }
+          })
+        }
+      }
+    }
+  }
+</script>
+
+<style lang="scss">
+  .doc-circulation {
+    height: 100%;
+    background: #F3F6F9;
+    overflow: auto;
+  }
+</style>

packages/tutelage/AppWristband/components/Add.vue

@@ -0,0 +1,305 @@
+<template>
+  <ai-detail class="wristband-add">
+    <template slot="title">
+      <ai-title :title="id ? '编辑人员' : '添加人员'" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
+      </ai-title>
+    </template>
+    <template slot="content">
+      <el-form ref="form" :model="form" label-width="120px" label-position="right">
+        <ai-card title="个人信息">
+          <template #content>
+            <div class="ai-form">
+              <el-form-item label="姓名" prop="name" :rules="[{ required: true, message: '请输入姓名', trigger: 'blur' }]">
+                <el-input size="small" placeholder="请输入姓名" v-model="form.name"></el-input>
+              </el-form-item>
+              <el-form-item label="身份证号码" prop="idNumber" :rules="[{ required: true, message: '请输入身份证号码', trigger: 'blur' }, {validator: validatorId, trigger: 'blur'}]">
+                <el-input size="small" @blur="onBlur" placeholder="请输入身份证号码" v-model="form.idNumber"></el-input>
+              </el-form-item>
+              <el-form-item label="年龄" prop="age" :rules="[{ required: true, message: '请输入年龄', trigger: 'blur' }]">
+                <el-input size="small" disabled placeholder="请输入年龄" v-model="form.age"></el-input>
+              </el-form-item>
+              <el-form-item label="性别" prop="sex" placeholder="请选择性别" :rules="[{ required: true, message: '请选择性别', trigger: 'change' }]">
+                <el-radio-group v-model="form.sex" disabled>
+                  <el-radio label="1">男</el-radio>
+                  <el-radio label="0">女</el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="设备号" prop="mid" :rules="[{ required: true, message: '请输入设备号', trigger: 'blur' }]">
+                <el-input size="small" placeholder="请输入设备号" v-model="form.mid"></el-input>
+              </el-form-item>
+              <el-form-item label="联系方式" prop="phone">
+                <el-input size="small" placeholder="请输入联系方式" v-model="form.phone"></el-input>
+              </el-form-item>
+              <el-form-item label="所属地区" prop="areaName" style="width: 100%;" :rules="[{ required: true, message: '请选择地区', trigger: 'change' }]">
+                <ai-area-get v-model="form.areaId" :root="areaRootid" :instance="instance" :name.sync="form.areaName" @change="onAreaChange"></ai-area-get>
+              </el-form-item>
+              <el-form-item label="备注" style="width: 100%;" prop="remark">
+                <el-input size="small" placeholder="请输入备注" v-model="form.remark"></el-input>
+              </el-form-item>
+            </div>
+          </template>
+        </ai-card>
+        <ai-card title="监护人信息">
+          <template #right>
+            <el-button type="text" @click="isShow = true">添加监护人</el-button>
+          </template>
+          <template #content>
+            <ai-table
+              :border="true"
+              :tableData="form.guardians"
+              :isShowPagination="false"
+              :col-configs="colConfigs"
+              :stripe="false"
+              @getList="() => {}">
+              <el-table-column
+                slot="index"
+                type="index"
+                width="100px"
+                label="序号"
+                align="center">
+              </el-table-column>
+              <el-table-column
+                slot="options"
+                width="120px"
+                label="操作"
+                align="center">
+                <template slot-scope="{ row, $index }">
+                  <div class="table-options">
+                    <el-button type="text" @click="edit(row, $index)">编辑</el-button>
+                    <el-button type="text" @click="remove($index)">删除</el-button>
+                  </div>
+                </template>
+              </el-table-column>
+            </ai-table>
+          </template>
+        </ai-card>
+      </el-form>
+      <ai-dialog
+        :visible.sync="isShow"
+        width="690px"
+        :title="guardiansId ? '修改监护人' : '添加监护人'"
+        @close="onClose"
+        @onConfirm="onUserConfirm">
+        <el-form
+          ref="userForm"
+          :model="userForm"
+          label-width="130px"
+          label-position="right">
+          <el-form-item
+            label="监护人姓名"
+            prop="guardianName"
+            :rules="[{ required: true, message: '请输入监护人姓名', trigger: 'blur' }]">
+            <el-input
+              size="small"
+              :maxLength="30"
+              v-model="userForm.guardianName"
+              placeholder="请输入监护人姓名">
+            </el-input>
+          </el-form-item>
+          <el-form-item
+            label="监护人联系电话"
+            prop="guardianPhone"
+            :rules="[{ required: true, message: '请输入监护人联系电话', trigger: 'blur' }]">
+            <el-input
+              size="small"
+              :maxLength="11"
+              v-model="userForm.guardianPhone"
+              placeholder="请输入监护人联系电话">
+            </el-input>
+          </el-form-item>
+        </el-form>
+      </ai-dialog>
+    </template>
+    <template #footer>
+      <el-button @click="cancel">取消</el-button>
+      <el-button type="primary" @click="confirm">提交</el-button>
+    </template>
+  </ai-detail>
+</template>
+
+<script>
+  import { mapState } from 'vuex'
+  export default {
+    name: 'Add',
+
+    props: {
+      instance: Function,
+      dict: Object,
+      params: Object
+    },
+
+    data () {
+      const validatorId = (rule, value, callback) => {
+        if (value === '') {
+          callback(new Error('请输入身份证号'))
+        } else if (!this.idCardNoUtil.checkIdCardNo(value)) {
+          callback(new Error('身份证号格式错误'))
+        } else {
+          callback()
+        }
+      }
+      return {
+        info: {},
+        isShow: false,
+        colConfigs: [
+          { slot: 'index', label: '序号', width: 200 },
+          { prop: 'guardianName', label: '监护人姓名' },
+          { prop: 'guardianPhone', label: '监护人联系电话' }
+        ],
+        userForm: {
+          guardianName: '',
+          guardianPhone: ''
+        },
+        validatorId,
+        form: {
+          guardians: [],
+          idNumber: '',
+          name: '',
+          phone: '',
+          age: '',
+          areaName: '',
+          areaId: '',
+          sex: '',
+          remark: '',
+          mid: ''
+        },
+        areaRootid: '',
+        id: '',
+        guardiansId: ''
+      }
+    },
+
+    computed: {
+      ...mapState(['user'])
+    },
+
+    created () {
+      this.areaRootid = this.user.info.areaId
+
+      if (this.params && this.params.id) {
+        this.id = this.params.id
+        this.getInfo(this.params.id)
+      }
+    },
+
+    methods: {
+      getInfo (id) {
+        this.instance.post(`/app/appintelligentguardianshipdevice/queryDetailById?id=${id}`).then(res => {
+          if (res.code === 0) {
+            this.form = {
+              ...res.data
+            }
+            this.form.age = this.getIdInfo(res.data.idNumber, 3)
+          }
+        })
+      },
+
+      onAreaChange (e) {
+        if (e) {
+          this.$nextTick(() => {
+            this.$refs.form.clearValidate('areaName')
+          })
+        } else {
+          setTimeout(() => {
+            this.$refs.form.validateField('areaName')
+          }, 80);
+        }
+      },
+
+      onBlur () {
+        this.form.age = this.getIdInfo(this.form.idNumber, 3)
+        this.form.sex = this.getIdInfo(this.form.idNumber, 2)
+      },
+
+      getIdInfo (UUserCard, num) {
+        if (num == 1) {
+          var birth = UUserCard.substring(6, 10) + '-' + UUserCard.substring(10, 12) + '-' + UUserCard.substring(12, 14)
+          return birth
+        }
+        if (num == 2) {
+          if (parseInt(UUserCard.substr(16, 1)) % 2 == 1) {
+            return '1'
+          } else {
+            return '0'
+          }
+        }
+
+        if (num == 3) {
+          var myDate = new Date()
+          var month = myDate.getMonth() + 1
+          var day = myDate.getDate()
+          var age = myDate.getFullYear() - UUserCard.substring(6, 10) - 1;
+          if (UUserCard.substring(10, 12) < month || UUserCard.substring(10, 12) == month && UUserCard.substring(12, 14) <= day) {
+            age ++
+          }
+
+          return age
+        }
+      },
+
+      onClose () {
+        this.userForm.guardianName = ''
+        this.userForm.guardianPhone = ''
+        this.guardiansId = ''
+      },
+
+      edit (row, index) {
+        this.guardiansId = index
+        this.userForm = {
+          ...row
+        }
+        this.isShow = true
+      },
+
+      onUserConfirm () {
+        this.$refs.userForm.validate((valid) => {
+          if (valid) {
+            if (this.guardiansId || this.guardiansId === 0) {
+              this.isShow = false
+              this.$set(this.form.guardians, this.guardiansId, JSON.parse(JSON.stringify(this.userForm)))
+            } else {
+              this.isShow = false
+              this.form.guardians.push(JSON.parse(JSON.stringify(this.userForm)))
+            }
+          }
+        })
+      },
+
+      confirm () {
+        this.$refs.form.validate((valid) => {
+          if (valid) {
+            this.instance.post(`/app/appintelligentguardianshipdevice/addOrUpdate`, {
+              ...this.form
+            }).then(res => {
+              if (res.code == 0) {
+                this.$message.success('提交成功')
+                setTimeout(() => {
+                  this.cancel(true)
+                }, 600)
+              }
+            })
+          }
+        })
+      },
+
+      remove (index) {
+        this.form.guardians.splice(index, 1)
+      },
+
+      cancel (isRefresh) {
+        this.$emit('change', {
+          type: 'list',
+          isRefresh: !!isRefresh
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+.wristband-add {
+  ::v-deep .ai-table .el-table__header tr th:first-child .cell, ::v-deep .ai-table .el-table__body tr td:first-child .cell {
+    padding: 0!important;
+  }
+}
+</style>

packages/tutelage/AppWristband/components/List.vue

@@ -0,0 +1,278 @@
+<template>
+  <ai-list class="addressBook">
+    <template slot="title">
+      <ai-title title="人员设备" isShowArea isShowBottomBorder v-model="search.areaId" :instance="instance" @change="search.current = 1, getList()"></ai-title>
+    </template>
+    <template slot="content">
+      <ai-search-bar class="search-bar" bottomBorder>
+        <template #left>
+          <ai-select
+            v-model="search.abnormalStatus"
+            @change="search.current = 1, getList()"
+            placeholder="异常状态"
+            :selectList="dict.getDict('intelligentGuardianshipAbnormalStatus')">
+          </ai-select>
+          <ai-select
+            v-model="search.onlineStatus"
+            @change="search.current = 1, getList()"
+            placeholder="在线状态"
+            :selectList="onlineStatusList">
+          </ai-select>
+        </template>
+        <template slot="right">
+          <el-input
+            v-model="search.name"
+            size="small"
+            @keyup.enter.native="search.current = 1, getList()"
+            placeholder="请输入成员姓名、设备号、监护人"
+            clearable
+            @clear="search.current = 1, search.name = '', getList()"
+            suffix-icon="iconfont iconSearch">
+          </el-input>
+        </template>
+      </ai-search-bar>
+      <ai-search-bar class="search-bar" style="margin-top: 12px;">
+        <template #left>
+          <el-button size="small" type="primary" icon="iconfont iconAdd" @click="toAdd('')">添加</el-button>
+        </template>
+      </ai-search-bar>
+      <ai-table
+        :tableData="tableData"
+        :col-configs="colConfigs"
+        :total="total"
+        v-loading="loading"
+        style="margin-top: 6px;"
+        :current.sync="search.current"
+        @handleSelectionChange="handleSelectionChange"
+        :size.sync="search.size"
+        @getList="getList">
+        <el-table-column slot="options" width="240px" fixed="right" label="操作" align="center">
+          <template slot-scope="{ row }">
+            <div class="table-options">
+              <el-button type="text" @click="toAdd(row.id)">编辑</el-button>
+              <el-button type="text" @click="$router.push({name: '监护地图', query: {id: row.id, lat: row.lat, lng: row.lng}})">地图查看</el-button>
+              <el-button type="text" @click="toMonitor(row.id)">监测数据</el-button>
+              <el-button type="text" @click="remove(row.id)">删除</el-button>
+            </div>
+          </template>
+        </el-table-column>
+        <div slot="paginationBtns" class="table__btns">
+          <span style="margin-right: 8px;" @click="removeAll">批量删除</span>
+        </div>
+      </ai-table>
+    </template>
+  </ai-list>
+</template>
+
+<script>
+  import { mapState } from 'vuex'
+  export default {
+    name: 'List',
+
+    props: {
+      instance: Function,
+      dict: Object
+    },
+
+    data() {
+      return {
+        search: {
+          current: 1,
+          size: 10,
+          name: '',
+          areaId: '',
+          abnormalStatus: '',
+          onlineStatus: ''
+        },
+        abnormalStatusList: [{
+          dictName: '正常',
+          dictValue: '0'
+        }, {
+          dictName: '异常',
+          dictValue: '1'
+        }],
+        onlineStatusList: [{
+          dictName: '离线',
+          dictValue: '0'
+        }, {
+          dictName: '在线',
+          dictValue: '1'
+        }],
+        ids: [],
+        loading: false,
+        total: 0,
+        tableData: []
+      }
+    },
+
+    computed: {
+      ...mapState(['user']),
+      colConfigs () {
+        return [
+          { type: 'selection', label: ''},
+          { prop: 'name', label: '姓名' },
+          { prop: 'mid', label: '设备号', width: 140 },
+          {
+            prop: 'departmentNames',
+            label: '年龄',
+            align: 'center',
+            render: (h, { row }) => {
+              return h('span', {}, this.getIdInfo(row.idNumber, 3))
+            }
+          },
+          { prop: 'sex', align: 'center', label: '性别', formart: v => v === '1' ? '男' : '女' },
+          { prop: 'phone', align: 'center', label: '联系方式', width: 120 },
+          { prop: 'guardianCount', align: 'center', label: '监护人数' },
+          { prop: 'areaName', align: 'center', label: '所属地区' },
+          { prop: 'electricQuantity', align: 'center', label: '电量', formart: v => v ? `${v}%` : '-' },
+          { prop: 'createTime', align: 'center', width: 150, label: '最后更新时间' },
+          { prop: 'temperature', align: 'center', label: '体温' },
+          {
+            prop: 'abnormalStatus',
+            align: 'center',
+            label: '是否异常',
+            render: (h, { row }) => {
+              return h('span', {
+                style: {
+                  color: this.getStatusColor(row.abnormalStatus)
+                }
+              }, this.getStatus(row.abnormalStatus))
+            }
+          },
+          {
+            prop: 'onlineStatus',
+            align: 'center',
+            label: '在线状态',
+            render: (h, { row }) => {
+              return h('span', {
+                style: {
+                  color: row.onlineStatus === '1' ? '#2EA222' : '#F46'
+                }
+              }, row.onlineStatus === '1' ? '在线' : '离线')
+            }
+          }
+        ]
+      }
+    },
+
+    mounted() {
+      this.search.areaId = this.user.info.areaId
+
+      this.dict.load(['intelligentGuardianshipAbnormalStatus']).then(() => {
+        this.getList()
+      })
+    },
+
+    methods: {
+      handleSelectionChange (e) {
+        this.ids = e.map(v => v.id).join(',')
+      },
+
+      getStatusColor (status) {
+        if (!status && status !== '0') return ''
+
+        return {
+          '0': '#2EA222',
+          '1': '#F46',
+          '2': '#D326C7'
+        }[status]
+      },
+
+      getStatus (status) {
+        if (!status && status !== '0') return '-'
+
+        return {
+          '0': '正常',
+          '1': '异常',
+          '2': '求助'
+        }[status]
+      },
+
+      getList () {
+        this.loading = true
+        this.instance.post(`/app/appintelligentguardianshipdevice/list`, null, {
+          params: {
+            ...this.search
+          }
+        }).then(res => {
+          if (res.code == 0) {
+            this.tableData = res.data.records
+            this.total = res.data.total
+
+            this.$nextTick(() => {
+              this.loading = false
+            })
+          } else {
+            this.loading = false
+          }
+        }).catch(() => {
+          this.loading = false
+        })
+      },
+
+      getIdInfo (UUserCard, num) {
+        if (num == 1) {
+          var birth = UUserCard.substring(6, 10) + '-' + UUserCard.substring(10, 12) + '-' + UUserCard.substring(12, 14)
+          return birth
+        }
+        if (num == 2) {
+          if (parseInt(UUserCard.substr(16, 1)) % 2 == 1) {
+            return '1'
+          } else {
+            return '0'
+          }
+        }
+
+        if (num == 3) {
+          var myDate = new Date()
+          var month = myDate.getMonth() + 1
+          var day = myDate.getDate()
+          var age = myDate.getFullYear() - UUserCard.substring(6, 10) - 1;
+          if (UUserCard.substring(10, 12) < month || UUserCard.substring(10, 12) == month && UUserCard.substring(12, 14) <= day) {
+            age ++
+          }
+
+          return age
+        }
+      },
+
+      removeAll () {
+        if (!this.ids) return
+
+        this.remove(this.ids)
+      },
+
+      remove (id) {
+        this.$confirm('确定删除该数据？').then(() => {
+          this.instance.post(`/app/appintelligentguardianshipdevice/delete?ids=${id}`).then(res => {
+            if (res.code == 0) {
+              this.$message.success('删除成功！')
+              this.getList()
+            }
+          })
+        })
+      },
+
+      toMonitor (id) {
+        this.$emit('change', {
+          type: 'Monitor',
+          params: {
+            id: id || ''
+          }
+        })
+      },
+
+      toAdd(id) {
+        this.$emit('change', {
+          type: 'Add',
+          params: {
+            id: id || ''
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+</style>

packages/tutelage/AppWristband/components/Monitor.vue

@@ -0,0 +1,198 @@
+<template>
+  <ai-detail class="statistics">
+    <template slot="title">
+      <ai-title title="监测数据" isShowBack isShowBottomBorder @onBackClick="cancel(false)"></ai-title>
+    </template>
+    <template slot="content">
+      <div class="statistics-wrapper">
+        <div class="statistics-wrapper__title">
+          <span :class="[currIndex === 0 ? 'active' : '']" @click="search.current = 1, currIndex = 0, getList()">体温</span>
+          <span :class="[currIndex === 1 ? 'active' : '']" @click="search.current = 1, currIndex = 1, getList()">心率</span>
+          <span :class="[currIndex === 2 ? 'active' : '']" @click="search.current = 1, currIndex = 2, getList()">血压</span>
+          <span :class="[currIndex === 3 ? 'active' : '']" @click="search.current = 1, currIndex = 3, getList()">血氧</span>
+        </div>
+        <div class="statistics-wrapper__body">
+          <div style="padding: 16px;">
+            <ai-search-bar>
+              <template #left>
+                <el-date-picker
+                  @change="search.current = 1, getList()"
+                  v-model="search.createTimeRange"
+                  type="daterange"
+                  size="small"
+                  value-format="yyyy-MM-dd"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期">
+                </el-date-picker>
+              </template>
+            </ai-search-bar>
+            <ai-table
+              class="detail-table__table"
+              :border="true"
+              style="margin-top: 4px;"
+              :tableData="tableData"
+              :col-configs="colConfigs"
+              :total="total"
+              :stripe="false"
+              :current.sync="search.current"
+              :size.sync="search.size"
+              @getList="getList">
+            </ai-table>
+          </div>
+        </div>
+      </div>
+    </template>
+  </ai-detail>
+</template>
+
+<script>
+  export default {
+    name: 'Statistics',
+
+    props: {
+      instance: Function,
+      dict: Object,
+      params: Object
+    },
+
+    data () {
+      return {
+        currIndex: 0,
+        search: {
+          name: '',
+          current: 1,
+          size: 10,
+          createTimeRange: []
+        },
+        tableData: [],
+        total: 0
+      }
+    },
+
+    computed: {
+      colConfigs () {
+        return [
+          {prop: 'deviceName', label: '姓名', align: 'center' },
+          {prop: 'deviceMID', label: '设备号', width: 280, align: 'center' },
+          {prop: 'itemValue', label: this.getLabel(), align: 'center' },
+          {prop: 'sampleTime', label: '更新时间', align: 'center' },
+          {
+            prop: 'abnormalStatus',
+            align: 'center',
+            label: '是否异常',
+            render: (h, { row }) => {
+              return h('span', {
+                style: {
+                  color: this.getStatusColor(row.abnormalStatus)
+                }
+              }, this.getStatus(row.abnormalStatus))
+            }
+          }
+        ]
+      }
+    },
+
+    mounted () {
+      this.getList()
+    },
+    methods: {
+      getList () {
+        this.instance.post(`/app/appintelligentguardianshipdevice/queryMonitorList?deviceId=${this.params.id}&item=${this.currIndex}`, null, {
+          params: {
+            ...this.search,
+            createTimeRange: (this.search.createTimeRange && this.search.createTimeRange.length) ? this.search.createTimeRange.join(',') : ','
+          }
+        }).then(res => {
+          if (res.code == 0) {
+            this.tableData = res.data.records
+            this.total = res.data.total
+          }
+        })
+      },
+
+      getStatusColor (status) {
+        if (!status && status !== '0') return ''
+
+        return {
+          '0': '#2EA222',
+          '1': '#F46',
+          '2': '#F46'
+        }[status]
+      },
+
+      getStatus (status) {
+        if (!status && status !== '0') return ''
+
+        return {
+          '0': '正常',
+          '1': '异常',
+          '2': '异常'
+        }[status]
+      },
+
+      getLabel () {
+        return ['体温(℃)', '心率', '血压', '血氧'][this.currIndex]
+      },
+
+      cancel (isRefresh) {
+        this.$emit('change', {
+          type: 'list',
+          isRefresh: !!isRefresh
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .statistics {
+    ::v-deep .ai-table .el-table__header tr th:first-child .cell, ::v-deep .ai-table .el-table__body tr td:first-child .cell {
+      padding: 0!important;
+    }
+
+    * {
+      box-sizing: border-box;
+      font-weight: normal;
+      font-style: normal;
+    }
+    .statistics-wrapper {
+      background: #FFFFFF;
+      box-shadow: 0px 4px 6px -2px rgba(15, 15, 21, 0.15);
+      border-radius: 2px;
+
+      .statistics-wrapper__title {
+        display: flex;
+        align-items: center;
+        height: 56px;
+        padding: 0 16px;
+        border-bottom: 1px solid #EEEEEE;
+
+        span {
+          height: 56px;
+          line-height: 56px;
+          margin-right: 32px;
+          color: #888888;
+          font-size: 16px;
+          font-weight: 600;
+          cursor: pointer;
+          user-select: none;
+          border-bottom: 3px solid transparent;
+
+          &:last-child {
+            margin-right: 0;
+          }
+
+          &.active {
+            color: #222222;
+            border-color: #2266FF;
+          }
+        }
+      }
+
+      .statistics-wrapper__body--list {
+        padding: 0 40px 20px;
+    }
+    }
+  }
+</style>