Compare commits
merge into: maochaoying:master
maochaoying:master
chenjinliang:master
pull from: chenjinliang:master
chenjinliang:master
maochaoying:master
31 Commits
35 changed files with 1210 additions and 643 deletions
-
7.env
-
2.env.production
-
7README.md
-
32publish.ps1
-
40src/App.vue
-
17src/assets/img/icon/exclamation-cricle-red-fill.svg
-
114src/components/AddPreSetting.vue
-
31src/components/Audit.vue
-
129src/components/LiquidHandle.vue
-
2src/components/LoginForm.vue
-
90src/components/MyInput.vue
-
133src/components/MyModal.vue
-
38src/components/Operator.vue
-
168src/components/Progress.vue
-
118src/components/Setting/components/Device.vue
-
115src/components/Setting/components/History.vue
-
132src/components/Setting/components/RunInfectionSetting.vue
-
8src/components/Setting/index.vue
-
42src/components/Test.vue
-
93src/components/UpdatePreSetting.vue
-
110src/components/dialogs/ClearRecordByKeysModal.vue
-
39src/components/dialogs/DelPreModal.vue
-
59src/components/dialogs/DisinfectModal.vue
-
58src/components/dialogs/LiquidModal.vue
-
40src/components/dialogs/UserModal.vue
-
6src/components/info/EnvironmentInfo.vue
-
12src/main.js
-
13src/mock/command.js
-
18src/store/modules/device.js
-
14src/store/modules/echarts.js
-
3src/store/modules/operator.js
-
2src/store/modules/setting.js
-
5src/store/modules/test.js
-
94src/store/modules/websocket.js
-
60src/utils/MyModal.js
@ -1,5 +1,2 @@ |
|||||
# VITE_BASE_WS1_URL=ws://192.168.8.10:19001/ |
|
||||
# VITE_BASE_WS2_URL=ws://192.168.8.10:19002/ |
|
||||
|
|
||||
VITE_BASE_WS1_URL=ws://127.0.0.1:19001/ |
|
||||
VITE_BASE_WS2_URL=ws://127.0.0.1:19002/ |
|
||||
|
VITE_BASE_WS1_URL=ws://192.168.8.10:19001/ |
||||
|
VITE_BASE_WS2_URL=ws://192.168.8.10:19002/ |
||||
@ -0,0 +1,2 @@ |
|||||
|
VITE_BASE_WS1_URL=ws://127.0.0.1:19001/ |
||||
|
VITE_BASE_WS2_URL=ws://127.0.0.1:19002/ |
||||
@ -0,0 +1,32 @@ |
|||||
|
Param( |
||||
|
[String]$Exec="Deploy" |
||||
|
) |
||||
|
|
||||
|
if ( $Exec -eq "DevDisable" ) { |
||||
|
ssh root:zwsd@192.168.8.10 "rm /var/zapp_flag/chrome_in_test_mode"; |
||||
|
ssh root:zwsd@192.168.8.10 "reboot" |
||||
|
} elseif ( $Exec -eq "DevEnable" ) { |
||||
|
ssh root:zwsd@192.168.8.10 "touch /var/zapp_flag/chrome_in_test_mode"; |
||||
|
ssh root:zwsd@192.168.8.10 "reboot" |
||||
|
} elseif ( $Exec -eq "Deploy" ) { |
||||
|
# build project |
||||
|
yarn build |
||||
|
# rename dist to current time, like 20221215121300 |
||||
|
$now = Get-Date -Format "yyyyMMddHHmmss" |
||||
|
Rename-Item -Path ./dist -NewName $now |
||||
|
# compress dist to app.zip |
||||
|
Compress-Archive -Path ./$now -DestinationPath ./app.zip -Force |
||||
|
# upload app.zip to server |
||||
|
scp app.zip root@192.168.8.10:/frontend/ |
||||
|
# unzip app.zip |
||||
|
ssh root:zwsd@192.168.8.10 "cd /frontend && unzip app.zip" |
||||
|
# remove old link |
||||
|
ssh root:zwsd@192.168.8.10 "cd /frontend && rm -f dist" |
||||
|
# create link |
||||
|
ssh root:zwsd@192.168.8.10 "cd /frontend && ln -s /frontend/$now /frontend/dist" |
||||
|
# remove app.zip |
||||
|
ssh root:zwsd@192.168.8.10 "cd /frontend && rm -f app.zip" |
||||
|
Remove-Item -Path ./app.zip |
||||
|
# remove folder |
||||
|
Remove-Item -Path ./$now -Recurse |
||||
|
} |
||||
@ -1,7 +1,41 @@ |
|||||
<script setup></script> |
|
||||
|
|
||||
<template> |
<template> |
||||
<router-view></router-view> |
<router-view></router-view> |
||||
|
<my-modal type="info" icon="warning" |
||||
|
v-model:visible="deviceAlert.visible" |
||||
|
:content="deviceAlert.content" |
||||
|
@ok="actionDeviceAlertOk" |
||||
|
></my-modal> |
||||
</template> |
</template> |
||||
|
<script setup> |
||||
|
import { useWebSocketStore } from '@/store' |
||||
|
import { onMounted, ref } from 'vue'; |
||||
|
/** @var {webSocketStore} */ |
||||
|
const webSocketStore = useWebSocketStore(); |
||||
|
/** @var {Object} */ |
||||
|
const deviceAlert = ref({ |
||||
|
visible: false, |
||||
|
content: '', |
||||
|
key : null, |
||||
|
}); |
||||
|
// on mounted |
||||
|
onMounted(mounted); |
||||
|
|
||||
|
// on mounted |
||||
|
function mounted() { |
||||
|
webSocketStore.registerEventHandler('AlertEvent', handleAlertEvent); |
||||
|
} |
||||
|
|
||||
|
// handle alert event |
||||
|
async function handleAlertEvent(data) { |
||||
|
deviceAlert.value.visible = true; |
||||
|
deviceAlert.value.content = data.displayInfo; |
||||
|
deviceAlert.value.key = data.alertContext; |
||||
|
await webSocketStore.call('AlertEventFrontEndConfirm', {alertContext:data.alertContext}); |
||||
|
} |
||||
|
|
||||
|
// action device alert ok |
||||
|
async function actionDeviceAlertOk() { |
||||
|
await webSocketStore.call('AlertEventUsrConfirm', {alertContext:deviceAlert.value.key}); |
||||
|
} |
||||
|
|
||||
<style scoped></style> |
|
||||
|
</script> |
||||
@ -0,0 +1,17 @@ |
|||||
|
<svg |
||||
|
xmlns="http://www.w3.org/2000/svg" |
||||
|
xmlns:xlink="http://www.w3.org/1999/xlink" |
||||
|
fill="none" |
||||
|
version="1.1" |
||||
|
width="69" |
||||
|
height="69" |
||||
|
viewBox="0 0 69 69" |
||||
|
> |
||||
|
<g> |
||||
|
<path |
||||
|
d="M34.5,0C15.456,0,0,15.456,0,34.5C0,53.544,15.456,69,34.5,69C53.544,69,69,53.544,69,34.5C69,15.456,53.544,0,34.5,0ZM34.5,55.2C32.5335,55.2,30.981,53.613,30.981,51.681C30.981,49.7145,32.568,48.162,34.5,48.162C36.4665,48.162,38.019,49.749,38.019,51.681C38.019,53.613,36.4665,55.2,34.5,55.2ZM38.3295,15.8355L37.605,40.9515C37.5705,42.2625,36.225,43.2975,34.638,43.2975L34.086,43.2975C32.499,43.2975,31.1535,42.2625,31.119,40.9515L30.36,15.8355C30.291,13.8345,31.9125,12.144,33.9825,12.144L34.707,12.144C36.777,12.144,38.3985,13.8345,38.3295,15.8355Z" |
||||
|
fill="#FA1C1C" |
||||
|
fill-opacity="1" |
||||
|
/> |
||||
|
</g> |
||||
|
</svg> |
||||
@ -0,0 +1,90 @@ |
|||||
|
<template> |
||||
|
<van-field |
||||
|
ref="input" |
||||
|
v-model="value" |
||||
|
readonly |
||||
|
:formatter="props.formatter" |
||||
|
:class="props.class" |
||||
|
:type="props.type" |
||||
|
@click.stop="actionInputClick" |
||||
|
></van-field> |
||||
|
|
||||
|
<template v-if="keyboardVisible"> |
||||
|
<van-number-keyboard v-if="'number' === props.type" |
||||
|
v-model="value" |
||||
|
:show="true" |
||||
|
:title="value" |
||||
|
:theme="props.theme" |
||||
|
:close-button-text="props.closeText" |
||||
|
@input="actionKeyBoardInput" |
||||
|
@blur="actionKeyBoardBlur" |
||||
|
@close="actionKeyBoardClose" |
||||
|
></van-number-keyboard> |
||||
|
</template> |
||||
|
</template> |
||||
|
<script setup> |
||||
|
import { nextTick, ref, watch } from 'vue'; |
||||
|
/** @var {Function} */ |
||||
|
const emits = defineEmits(['update:value','done']); |
||||
|
/** @var {Object} */ |
||||
|
const props = defineProps({ |
||||
|
// 格式化函数 |
||||
|
formatter : { type: Function, default: value => value}, |
||||
|
// 类名 |
||||
|
class : { type: String, default: ''}, |
||||
|
// 类型 |
||||
|
type : { type: String, default: 'text'}, |
||||
|
// 取值 |
||||
|
value : { type: String, default: ''}, |
||||
|
// 主题 |
||||
|
theme : { type: String, default: ''}, |
||||
|
// 关闭按钮文本 |
||||
|
closeText : { type: String, default: ''}, |
||||
|
}); |
||||
|
/** @var {String} */ |
||||
|
const value = ref(props.value); |
||||
|
/** @var {Boolean} */ |
||||
|
const keyboardVisible = ref(false); |
||||
|
/** @var {Boolean} */ |
||||
|
const isFirstClick = ref(true); |
||||
|
/** @var {Component} */ |
||||
|
const input = ref(null); |
||||
|
/** @var {String} */ |
||||
|
let originValue = null; |
||||
|
// 监听外部值变化 |
||||
|
watch(() => props.value, (val) => value.value = val); |
||||
|
|
||||
|
// 输入框点击 |
||||
|
async function actionInputClick() { |
||||
|
originValue = props.value; |
||||
|
isFirstClick.value = true; |
||||
|
keyboardVisible.value = true; |
||||
|
await nextTick(); |
||||
|
input.value.$el.querySelector('input').select(); |
||||
|
input.value.$el.querySelector('input').focus(); |
||||
|
} |
||||
|
|
||||
|
// 键盘输入 |
||||
|
async function actionKeyBoardInput(val) { |
||||
|
if (isFirstClick.value) { |
||||
|
isFirstClick.value = false |
||||
|
await nextTick(); |
||||
|
value.value = val + ''; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// 键盘失焦 |
||||
|
function actionKeyBoardBlur() { |
||||
|
actionKeyBoardClose(); |
||||
|
} |
||||
|
|
||||
|
// 键盘关闭 |
||||
|
function actionKeyBoardClose() { |
||||
|
keyboardVisible.value = false; |
||||
|
window.getSelection().removeAllRanges(); |
||||
|
emits('update:value', value.value); |
||||
|
if (`${originValue}` !== value.value) { |
||||
|
emits('done'); |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,133 @@ |
|||||
|
<template> |
||||
|
<div v-if="visible" class="clear_record_modal_container"> |
||||
|
<div class="modal_content"> |
||||
|
<div v-if="'warning' === props.icon"> |
||||
|
<img src="@/assets/img/icon/exclamation-cricle-red-fill.svg " /> |
||||
|
</div> |
||||
|
|
||||
|
<template v-if="'' === props.content"> |
||||
|
<slot></slot> |
||||
|
</template> |
||||
|
<p v-else class="tips"> |
||||
|
<span>{{ props.content }}</span> |
||||
|
</p> |
||||
|
|
||||
|
<div v-if="'confirm' === props.type" class="btns"> |
||||
|
<div class="cancel" @click="actionCancel">取消</div> |
||||
|
<div class="ok" @click="actionOk">确定</div> |
||||
|
</div> |
||||
|
<div v-else-if="'info' === props.type" class="btns" style="justify-content: center;"> |
||||
|
<div class="ok" @click="actionOk">确定</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script setup> |
||||
|
import { ref, watch } from 'vue' |
||||
|
/** @var {Function} */ |
||||
|
const emits = defineEmits(['update:visible', 'ok', 'cancel']); |
||||
|
/** @var {Object} */ |
||||
|
const props = defineProps({ |
||||
|
visible: {type:Boolean, default:false}, // 是否显示 |
||||
|
content : {type:String, default:''}, // 提示内容 |
||||
|
type : {type:String, default:'confirm'}, // 类型 |
||||
|
icon : {type:String, default:''} // 图标 |
||||
|
}); |
||||
|
/** @var {Boolean} */ |
||||
|
const visible = ref(props.visible); |
||||
|
// watch visible |
||||
|
watch(() => props.visible, val => visible.value = val); |
||||
|
// expose public functions |
||||
|
defineExpose({show}); |
||||
|
|
||||
|
// show dialog |
||||
|
function show() { |
||||
|
emits('update:visible', true); |
||||
|
visible.value = true; |
||||
|
} |
||||
|
|
||||
|
// action ok |
||||
|
function actionOk() { |
||||
|
emits('ok'); |
||||
|
emits('update:visible', false); |
||||
|
visible.value = false; |
||||
|
} |
||||
|
|
||||
|
// action cancel |
||||
|
function actionCancel() { |
||||
|
emits('cancel'); |
||||
|
emits('update:visible', false); |
||||
|
visible.value = false; |
||||
|
} |
||||
|
</script> |
||||
|
<style lang="scss" scoped> |
||||
|
.clear_record_modal_container { |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
bottom: 0; |
||||
|
background: rgba(0, 0, 0, 0.5); |
||||
|
z-index: 2; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
.modal_content { |
||||
|
width: 476px; |
||||
|
height: 350px; |
||||
|
border-radius: 16px; |
||||
|
background: #ffffff; |
||||
|
padding: 52px 37px 55px 37px; |
||||
|
box-sizing: border-box; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
.tips { |
||||
|
margin-top: 33px; |
||||
|
margin-bottom: 50px; |
||||
|
font-family: Source Han Sans CN; |
||||
|
font-size: 21px; |
||||
|
font-weight: normal; |
||||
|
letter-spacing: 0.04em; |
||||
|
color: #000000; |
||||
|
.red { |
||||
|
color: #fa1c1c; |
||||
|
} |
||||
|
} |
||||
|
.btns { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: space-between; |
||||
|
width: 362px; |
||||
|
.cancel { |
||||
|
width: 173px; |
||||
|
height: 68px; |
||||
|
border-radius: 34px; |
||||
|
background: #06518b; |
||||
|
font-family: Source Han Sans CN; |
||||
|
font-size: 23px; |
||||
|
font-weight: 350; |
||||
|
letter-spacing: 0em; |
||||
|
color: #ffffff; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
.ok { |
||||
|
width: 173px; |
||||
|
height: 68px; |
||||
|
border-radius: 34px; |
||||
|
background: #1f6397; |
||||
|
font-family: Source Han Sans CN; |
||||
|
font-size: 23px; |
||||
|
font-weight: 350; |
||||
|
letter-spacing: 0em; |
||||
|
color: #ffffff; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,110 @@ |
|||||
|
<template> |
||||
|
<my-modal type="confirm" icon="warning" |
||||
|
content="确定要删除所选消毒记录吗！" |
||||
|
v-model:visible="enable" |
||||
|
@ok="handleStart" |
||||
|
@cancel="handleCancel" |
||||
|
></my-modal> |
||||
|
</template> |
||||
|
|
||||
|
<script setup> |
||||
|
import { useWebSocketStore } from '@/store' |
||||
|
import { cleanDisinfectionRecordByKeysJSON } from '@/mock/command' |
||||
|
import { ref } from 'vue' |
||||
|
// props |
||||
|
const props = defineProps({ |
||||
|
keys : {type: Array,default: () => []} |
||||
|
}) |
||||
|
// WebSocket store |
||||
|
const webSocketStore = useWebSocketStore() |
||||
|
// 启用 |
||||
|
const enable = ref(false); |
||||
|
// 暴露方法 |
||||
|
defineExpose({showDialog}); |
||||
|
|
||||
|
function showDialog() { |
||||
|
enable.value = true; |
||||
|
} |
||||
|
|
||||
|
const handleCancel = () => { |
||||
|
enable.value = false; |
||||
|
} |
||||
|
|
||||
|
const handleStart = () => { |
||||
|
webSocketStore.sendCommandMsg(cleanDisinfectionRecordByKeysJSON(props.keys)) |
||||
|
|
||||
|
enable.value = false; |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.clear_record_modal_container { |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
bottom: 0; |
||||
|
background: rgba(0, 0, 0, 0.5); |
||||
|
z-index: 2; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
.modal_content { |
||||
|
width: 476px; |
||||
|
height: 350px; |
||||
|
border-radius: 16px; |
||||
|
background: #ffffff; |
||||
|
padding: 52px 37px 55px 37px; |
||||
|
box-sizing: border-box; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
.tips { |
||||
|
margin-top: 33px; |
||||
|
margin-bottom: 50px; |
||||
|
font-family: Source Han Sans CN; |
||||
|
font-size: 21px; |
||||
|
font-weight: normal; |
||||
|
letter-spacing: 0.04em; |
||||
|
color: #000000; |
||||
|
.red { |
||||
|
color: #fa1c1c; |
||||
|
} |
||||
|
} |
||||
|
.btns { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: space-between; |
||||
|
width: 362px; |
||||
|
.cancel { |
||||
|
width: 173px; |
||||
|
height: 68px; |
||||
|
border-radius: 34px; |
||||
|
background: #06518b; |
||||
|
font-family: Source Han Sans CN; |
||||
|
font-size: 23px; |
||||
|
font-weight: 350; |
||||
|
letter-spacing: 0em; |
||||
|
color: #ffffff; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
.ok { |
||||
|
width: 173px; |
||||
|
height: 68px; |
||||
|
border-radius: 34px; |
||||
|
background: #1f6397; |
||||
|
font-family: Source Han Sans CN; |
||||
|
font-size: 23px; |
||||
|
font-weight: 350; |
||||
|
letter-spacing: 0em; |
||||
|
color: #ffffff; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,60 @@ |
|||||
|
import { createApp, h } from 'vue'; |
||||
|
import MyModalComponent from 'cpns/MyModal.vue'; |
||||
|
export default class MyModal { |
||||
|
// show error message
|
||||
|
static error( message ) { |
||||
|
return new Promise( resolve => { |
||||
|
const modalContainer = document.createElement('div'); |
||||
|
document.body.appendChild(modalContainer); |
||||
|
const modalApp = createApp({ |
||||
|
render() { |
||||
|
return h(MyModalComponent, { |
||||
|
ref : 'modal', |
||||
|
icon : 'warning', |
||||
|
type : 'info', |
||||
|
content : message, |
||||
|
onOk : () => { |
||||
|
modalApp.unmount(); |
||||
|
document.body.removeChild(modalContainer); |
||||
|
resolve(); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
}); |
||||
|
|
||||
|
const vm = modalApp.mount(modalContainer); |
||||
|
vm.$refs.modal.show(); |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
// show confirm message
|
||||
|
static confirm( message ) { |
||||
|
return new Promise( resolve => { |
||||
|
const modalContainer = document.createElement('div'); |
||||
|
document.body.appendChild(modalContainer); |
||||
|
const modalApp = createApp({ |
||||
|
render() { |
||||
|
return h(MyModalComponent, { |
||||
|
ref : 'modal', |
||||
|
icon : 'warning', |
||||
|
type : 'confirm', |
||||
|
content : message, |
||||
|
onOk : () => { |
||||
|
modalApp.unmount(); |
||||
|
document.body.removeChild(modalContainer); |
||||
|
resolve(true); |
||||
|
}, |
||||
|
onCancel : () => { |
||||
|
modalApp.unmount(); |
||||
|
document.body.removeChild(modalContainer); |
||||
|
resolve(false); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
}); |
||||
|
|
||||
|
const vm = modalApp.mount(modalContainer); |
||||
|
vm.$refs.modal.show(); |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue