kubbo/dvcp_v2_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

初始化

Browse Source
This commit is contained in:
aixianling
2021-12-14 18:36:19 +08:00
parent 9afa4101b6
commit a8dff862d2
327 changed files with 88702 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
packages/tutelage/AppWristband/AppWristband.vue Normal file
View File

@@ -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>

305
packages/tutelage/AppWristband/components/Add.vue Normal file
View File

@@ -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>

278
packages/tutelage/AppWristband/components/List.vue Normal file
View File

@@ -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>

198
packages/tutelage/AppWristband/components/Monitor.vue Normal file
View File

@@ -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>