feat: add printer settings dialog to dashboard
Co-authored-by: aider (openai/DeepSeek-V3.2-Thinking) <aider@aider.chat>
This commit is contained in:
@ -4,7 +4,12 @@
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="title">👋 欢迎回来,{{ userStore.username }}</span>
|
||||
<el-tag type="success">系统运行正常</el-tag>
|
||||
<div style="display: flex; align-items: center; gap: 10px;">
|
||||
<el-tag type="success">系统运行正常</el-tag>
|
||||
<el-button type="info" plain size="small" @click="openPrinterDialog" :icon="Setting" class="printer-btn">
|
||||
打印设置
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -30,6 +35,30 @@
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<el-dialog v-model="printerDialogVisible" title="打印机 IP 配置" width="500px">
|
||||
<el-form :model="printerForm" label-width="120px">
|
||||
<el-form-item label="标签打印机 IP">
|
||||
<el-input v-model="printerForm.label_ip" placeholder="例如 192.168.9.221" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签打印机端口">
|
||||
<el-input v-model.number="printerForm.label_port" placeholder="例如 9100" />
|
||||
</el-form-item>
|
||||
<el-form-item label="网络打印机 IP">
|
||||
<el-input v-model="printerForm.network_ip" placeholder="例如 192.168.9.250" />
|
||||
</el-form-item>
|
||||
<el-form-item label="网络打印机端口">
|
||||
<el-input v-model.number="printerForm.network_port" placeholder="例如 9100" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="printerDialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="savePrinterConfig" :loading="loading">保存</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -38,12 +67,70 @@ import { useRouter } from 'vue-router'
|
||||
// 1. 引入 User Store
|
||||
import { useUserStore } from '@/stores/user'
|
||||
// 引入需要的图标
|
||||
import { Box, TrendCharts, ShoppingCart, Operation } from '@element-plus/icons-vue'
|
||||
import { Box, TrendCharts, ShoppingCart, Operation, Setting } from '@element-plus/icons-vue'
|
||||
import { getPrinterConfig, updatePrinterConfig } from '@/api/common/print'
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
const router = useRouter()
|
||||
// 2. 实例化 store
|
||||
const userStore = useUserStore()
|
||||
|
||||
// 打印机配置相关
|
||||
const printerDialogVisible = ref(false)
|
||||
const printerForm = reactive({
|
||||
label_ip: '',
|
||||
label_port: '',
|
||||
network_ip: '',
|
||||
network_port: ''
|
||||
})
|
||||
const loading = ref(false)
|
||||
|
||||
const openPrinterDialog = async () => {
|
||||
try {
|
||||
loading.value = true
|
||||
const res = await getPrinterConfig()
|
||||
if (res.code === 200) {
|
||||
const config = res.data
|
||||
printerForm.label_ip = config.label_printer?.ip || ''
|
||||
printerForm.label_port = config.label_printer?.port || ''
|
||||
printerForm.network_ip = config.network_printer?.ip || ''
|
||||
printerForm.network_port = config.network_printer?.port || ''
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
printerDialogVisible.value = true
|
||||
}
|
||||
|
||||
const savePrinterConfig = async () => {
|
||||
try {
|
||||
loading.value = true
|
||||
const config = {
|
||||
label_printer: {
|
||||
ip: printerForm.label_ip,
|
||||
port: Number(printerForm.label_port)
|
||||
},
|
||||
network_printer: {
|
||||
ip: printerForm.network_ip,
|
||||
port: Number(printerForm.network_port)
|
||||
}
|
||||
}
|
||||
const res = await updatePrinterConfig(config)
|
||||
if (res.code === 200) {
|
||||
ElMessage.success('保存成功')
|
||||
printerDialogVisible.value = false
|
||||
} else {
|
||||
ElMessage.error(res.msg || '保存失败')
|
||||
}
|
||||
} catch (e) {
|
||||
ElMessage.error('请求异常')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 统一跳转函数
|
||||
const handleNav = (path: string) => {
|
||||
router.push(path)
|
||||
|
||||
Reference in New Issue
Block a user