Browse Source

模拟按钮界面

master
aBin 5 years ago
parent
commit
e98378e67b
  1. 1
      src/common/index.styl
  2. 30
      src/components/Duration/Duration.js
  3. 8
      src/components/Map/Map.js
  4. 2
      src/components/Map/Map.vue
  5. 33
      src/components/RFID/RFID.styl
  6. 26
      src/components/RFID/RFID.vue
  7. 3
      src/config/api.js
  8. 170
      src/views/BtnPage/BtnPage.vue
  9. 22
      src/views/Index/Index.vue

1
src/common/index.styl

@ -21,6 +21,7 @@
height: 100.64px; height: 100.64px;
left: 1.5%; left: 1.5%;
top: 0; top: 0;
z-index: 9;
} }
.wrap .bg-top .animation{ .wrap .bg-top .animation{

30
src/components/Duration/Duration.js

@ -88,11 +88,11 @@ const mixin = {
// symbol: 'star', // symbol: 'star',
data: this.pointTimeHospital, data: this.pointTimeHospital,
color: 'rgb(18, 131, 227)', color: 'rgb(18, 131, 227)',
lineStyle: { // lineStyle: {
shadowColor: '#5cfbff', // shadowColor: '#5cfbff',
shadowBlur: 8, // shadowBlur: 8,
width: 4, // width: 4,
}, // },
}, },
{ {
name: '国际水准', name: '国际水准',
@ -102,11 +102,11 @@ const mixin = {
symbolSize: 6, symbolSize: 6,
data: this.pointTimeInternation, data: this.pointTimeInternation,
color: 'rgb(30, 231, 231)', color: 'rgb(30, 231, 231)',
lineStyle: { // lineStyle: {
shadowColor: '#5cfbff', // shadowColor: '#5cfbff',
shadowBlur: 8, // shadowBlur: 8,
width: 4, // width: 4,
}, // },
}, },
{ {
name: '当前数据', name: '当前数据',
@ -116,11 +116,11 @@ const mixin = {
symbolSize: 6, symbolSize: 6,
data: this.pointTimeCurrentList, data: this.pointTimeCurrentList,
color: 'rgb(227, 18, 187)', color: 'rgb(227, 18, 187)',
lineStyle: { // lineStyle: {
shadowColor: '#5cfbff', // shadowColor: '#5cfbff',
shadowBlur: 8, // shadowBlur: 8,
width: 4, // width: 4,
}, // },
}, },
], ],
}; };

8
src/components/Map/Map.js

@ -15,7 +15,7 @@ var option = {
label: { label: {
show: true, //是否显示市 show: true, //是否显示市
textStyle: { textStyle: {
color: '#aaa', //文字颜色 color: '#c8ced5', //文字颜色
fontSize: 12, //文字大小 fontSize: 12, //文字大小
backgroundColor: 'rgba(0,0,0,0)', //透明度0清空文字背景 backgroundColor: 'rgba(0,0,0,0)', //透明度0清空文字背景
}, },
@ -43,11 +43,11 @@ var option = {
//高亮市区 echarts bug 不生效 //高亮市区 echarts bug 不生效
// regions: [ // regions: [
// { // {
// name: '运城市', // name: '运城',
// value: 0,
// itemStyle: { // itemStyle: {
// borderWidth: 3,
// areaColor: 'red', // areaColor: 'red',
// label: { show: false }, // color: 'red',
// }, // },
// }, // },
// ], // ],

2
src/components/Map/Map.vue

@ -22,8 +22,6 @@ export default {
let hg = window.innerHeight; let hg = window.innerHeight;
this.width = wh + 'px'; this.width = wh + 'px';
this.height = hg + 'px'; this.height = hg + 'px';
console.log(this.width);
console.log(this.height);
window.onresize = () => { window.onresize = () => {
return (() => { return (() => {
wh = window.innerWidth; wh = window.innerWidth;

33
src/components/RFID/RFID.styl

@ -3,24 +3,35 @@
} }
.list { .list {
width: 4.4rem; width: 4.4rem;
height: 4.4rem; height: 4.4rem;
line-height: 4.4rem; font-size: 12px;
text-align: center; color: #C8CED5;
font-size: 12px; background: url('~assets/rfid-bg.png') no-repeat center;
color: #C8CED5; background-size: contain;
background: url('~assets/rfid-bg.png') no-repeat center; position: absolute;
background-size: contain; }
position: absolute;
.list span{
display: inline-block;
position: relative;
top: 25%;
width: 100%;
height: 50%;
text-align: center;
} }
.active { .active {
width: 5rem; width: 5.4rem;
height: 5rem; height: 5.4rem;
line-height: 5rem;
font-size: 12px; font-size: 12px;
background: url('~assets/rfid-bg-active.png') no-repeat center; background: url('~assets/rfid-bg-active.png') no-repeat center;
background-size: contain; background-size: contain;
text-align: center;
}
.list.active span{
width: 80%;
} }
.list1 { .list1 {

26
src/components/RFID/RFID.vue

@ -18,22 +18,14 @@ export default {
data() { data() {
return { return {
lists: [ lists: [
{ id: 1, active: false, name: '专科护士' }, { code: 1, active: false, name: '急救医生到场' },
{ id: 2, active: false, name: '专科医生' }, { code: 1, active: false, name: '急救护士到场' },
{ id: 3, active: false, name: '采血推车' }, { code: 3, active: false, name: '护士采血' },
{ id: 4, active: false, name: '心电图推车' }, { code: 3, active: false, name: '采血车到场' },
{ id: 5, active: false, name: '介入室' }, { code: 4, active: false, name: 'CT室' },
{ id: 6, active: false, name: 'CT室' }, { code: 8, active: false, name: '介入室' },
{ id: 7, active: false, name: '急救室' }, { code: 8, active: false, name: '抢救室' },
{ id: 8, active: false, name: '急诊医生' }, { code: 8, active: false, name: '抢救室' },
{ id: 9, active: false, name: '专科护士' },
{ id: 10, active: false, name: '专科医生' },
{ id: 11, active: false, name: '采血推车' },
{ id: 12, active: false, name: '心电图推车' },
{ id: 13, active: false, name: '介入室' },
{ id: 14, active: false, name: 'CT室' },
{ id: 15, active: false, name: '急救室' },
{ id: 16, active: false, name: '急诊医生' },
], ],
num: 0, //div num: 0, //div
}; };
@ -55,7 +47,7 @@ export default {
// //
for (let a = 0; a < this.newArr.length; a++) { for (let a = 0; a < this.newArr.length; a++) {
const arr = this.newArr[a]; const arr = this.newArr[a];
const item = arr.find(item => item.id === element.id); const item = arr.find(item => item.name === element.name);
if (item) { if (item) {
this.num = a; this.num = a;
} }

3
src/config/api.js

@ -12,6 +12,9 @@ const statistics = `${wisdomcar}/statistics`; // 盐湖医院相关接口
// websocket基础地址 // websocket基础地址
export const WS_BASE_URL = msgUrl; export const WS_BASE_URL = msgUrl;
// 按钮模拟信息发送
export const record = params => axios.post(`${wisdomcar}/debug/record`, params);
// 急救数量统计图数据 // 急救数量统计图数据
export const selResult = params => axios.post(`${statistics}/get/selResult`, params); export const selResult = params => axios.post(`${statistics}/get/selResult`, params);
// 急救市场分析统计图数据 // 急救市场分析统计图数据

170
src/views/BtnPage/BtnPage.vue

@ -1,48 +1,168 @@
<template> <template>
<div class="wrap flex-1"> <div class="wrap">
<a-button type="primary" v-for="(item, index) in nameList" :key="index"> {{ item }} </a-button> <a-button type="primary" @click="sendData(20)">开始</a-button>
<a-button type="primary" v-for="(item, index) in nameList" :key="index" @click="sendData(index)"> {{ item.name }} </a-button>
<a-button type="primary" @click="sendData(21)">震动传感器</a-button>
<a-button type="primary" @click="sendData(25)">药物剂量</a-button>
<a-button type="primary" @click="sendData(26)">团注剂量</a-button>
<a-button type="primary" @click="sendData(27)">维持剂量</a-button>
</div> </div>
</template> </template>
<script> <script>
import { record } from 'config/api';
export default { export default {
name: 'BtnPage', name: 'BtnPage',
data() { data() {
return { return {
str: '模拟按钮界面', str: '模拟按钮界面',
nameList: [ nameList: [
'分诊区', {
'急救医生', name: '分诊区',
'采血车', value: '01',
'CT室', },
'介入室', {
'平车停放点', name: '急救医生',
'卒中中心门口', value: '0B',
'急救大楼门', },
'抢救室门', {
'走廊', name: '采血车',
'心电图室门口', value: '0C',
'专用电梯口(一楼)', },
'专用电梯口(四楼)', {
'CCU导管室门口', name: 'CT室',
'急救护士', value: '03',
'专科医生', },
'专科护士', {
name: '介入室',
value: '05',
},
{
name: '平车停放点',
value: '20',
},
{
name: '卒中中心门口',
value: '21',
},
{
name: '急救大楼门',
value: '22',
},
{
name: '抢救室门',
value: '23',
},
{
name: '走廊',
value: '24',
},
{
name: '心电图室门口',
value: '25',
},
{
name: '专用电梯口(一楼)',
value: '26',
},
{
name: '专用电梯口(四楼)',
value: '27',
},
{
name: 'CCU导管室门口',
value: '28',
},
{
name: '急救护士',
value: '30',
},
{
name: '专科医生',
value: '31',
},
{
name: '专科护士',
value: '32',
},
], ],
}; };
}, },
methods: {}, methods: {
async sendData(index) {
try {
let params = {};
console.log(index);
if (index === 20) {
params = {
param: {
authId: '1',
type: '1',
value: '80000',
time: new Date().getTime(),
},
};
} else if (index === 21) {
params = {
param: {
authId: '1',
type: '7',
value: '10,20,10',
time: new Date().getTime(),
},
};
} else if (index === 25) {
params = {
param: {
authId: '1',
type: '8',
value: '50.2',
time: new Date().getTime(),
},
};
} else if (index === 26) {
params = {
param: {
authId: '1',
type: '9',
value: '6.4',
time: new Date().getTime(),
},
};
} else if (index === 27) {
params = {
param: {
authId: '1',
type: '10',
value: '60.1',
time: new Date().getTime(),
},
};
} else if (index < 20) {
params = {
param: {
authId: '1',
type: '2',
value: this.nameList[index].value,
time: new Date().getTime(),
},
};
}
const res = await record(params);
const { msg, data, code } = res.data;
console.log('data:' + data);
} catch (error) {
console.log(error);
}
},
},
}; };
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped>
.wrap { .wrap {
flex-wrap: wrap;
justify-content: center;
align-items: center;
button { button {
margin: 20px; margin: 10px;
flex: 0 0 8%; flex: 0 0 8%;
} }
} }

22
src/views/Index/Index.vue

@ -49,9 +49,12 @@
</div> </div>
</div> </div>
</div> </div>
<div class="flex-2 ma-2"> <div class="flex-2 ma-2" style="position:relative">
<!-- <iframe src="https://www.thingjs.com/pp/6dab0a018283ef357a85684c"></iframe> --> <iframe
<shanxi-map /> class="fill-width fill-height"
src="https://www.thingjs.com/pp/6dab0a018283ef357a85684c"
></iframe>
<shanxi-map class="sxmap" />
<!-- <div class="bg s-pic"> --> <!-- <div class="bg s-pic"> -->
<!-- </div> --> <!-- </div> -->
</div> </div>
@ -171,6 +174,19 @@ export default {
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped>
iframe {
border: none !important;
}
.sxmap {
position: absolute;
top: -4rem;
right: -2rem;
z-index: 9;
width: 19rem;
height: 25rem;
}
.time { .time {
position: absolute; position: absolute;
top: 2.5rem; top: 2.5rem;

Loading…
Cancel
Save