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> |
|||
<router-view></router-view> |
|||
<my-modal type="info" icon="warning" |
|||
v-model:visible="deviceAlert.visible" |
|||
:content="deviceAlert.content" |
|||
@ok="actionDeviceAlertOk" |
|||
></my-modal> |
|||
</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