108 lines
2.0 KiB
XML
108 lines
2.0 KiB
XML
<template>
|
|
<div class="page">
|
|
<text class="title">输入指令</text>
|
|
<input class="text-input" type="text" value="{{text}}" placeholder="输入内容..." onchange="onTextChange" />
|
|
<div class="quick-list">
|
|
<div class="quick-row" for="{{quick}}" tid="{{$index}}" onclick="sendQuick({{$index}})">
|
|
<text class="quick-text">{{$item}}</text>
|
|
</div>
|
|
</div>
|
|
<div class="actions">
|
|
<input class="btn" type="button" value="发送" onclick="sendText" />
|
|
<input class="btn btn-ghost" type="button" value="返回" onclick="goBack" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import router from '@system.router'
|
|
import bridge from '../../common/bridge.js'
|
|
|
|
export default {
|
|
private: {
|
|
text: '',
|
|
quick: ['查看今日任务', '总结当前进度', '停止当前任务']
|
|
},
|
|
onTextChange(e) {
|
|
this.text = e && e.value || ''
|
|
},
|
|
sendQuick(index) {
|
|
const item = this.quick[index]
|
|
bridge.sendCommand({ kind: 'quick', quick: item, content: item })
|
|
this.text = item
|
|
},
|
|
sendText() {
|
|
bridge.sendText(this.text)
|
|
},
|
|
goBack() {
|
|
router.back()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.page {
|
|
width: 100%;
|
|
height: 100%;
|
|
flex-direction: column;
|
|
padding: 12px;
|
|
box-sizing: border-box;
|
|
background-color: #0b1220;
|
|
}
|
|
|
|
.title {
|
|
color: #e6f0ff;
|
|
font-size: 22px;
|
|
font-weight: bold;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.text-input {
|
|
width: 100%;
|
|
height: 64px;
|
|
border-radius: 12px;
|
|
background-color: #152238;
|
|
color: #e6f0ff;
|
|
font-size: 16px;
|
|
padding: 0 10px;
|
|
margin-bottom: 14px;
|
|
}
|
|
|
|
.quick-list {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.quick-row {
|
|
padding: 10px 12px;
|
|
border-radius: 10px;
|
|
background-color: #152238;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.quick-text {
|
|
color: #b7c8e8;
|
|
font-size: 16px;
|
|
}
|
|
|
|
.actions {
|
|
flex-direction: row;
|
|
margin-top: 16px;
|
|
gap: 12px;
|
|
}
|
|
|
|
.btn {
|
|
width: 110px;
|
|
height: 44px;
|
|
border-radius: 22px;
|
|
background-color: #33b4ff;
|
|
color: #08131f;
|
|
font-size: 16px;
|
|
text-align: center;
|
|
}
|
|
|
|
.btn-ghost {
|
|
background-color: #1c2c47;
|
|
color: #dbe8ff;
|
|
}
|
|
</style>
|