feat: 调整分辨率问题

This commit is contained in:
zhanghao 2025-10-11 17:28:22 +08:00
parent dd5dd9676c
commit 8089e157f9
7 changed files with 351 additions and 318 deletions

View File

@ -1,5 +1,6 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<div ref="topContainerRef">
<TableSearch <TableSearch
:queryParams="queryParams" :queryParams="queryParams"
:showSearch="showSearch" :showSearch="showSearch"
@ -94,8 +95,10 @@
<!-- </el-col>--> <!-- </el-col>-->
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
</div>
<el-table v-loading="loading" :data="registerList" @selection-change="handleSelectionChange"> <div :style="containerHeight">
<el-table height="100%" v-loading="loading" :data="registerList" @selection-change="handleSelectionChange">
<el-table-column align="center" type="selection" width="55" /> <el-table-column align="center" type="selection" width="55" />
<el-table-column align="center" label="id" prop="id" show-overflow-tooltip/> <el-table-column align="center" label="id" prop="id" show-overflow-tooltip/>
<el-table-column align="center" label="设备终端配置id" prop="idDeDeviceTerminalConfig" show-overflow-tooltip <el-table-column align="center" label="设备终端配置id" prop="idDeDeviceTerminalConfig" show-overflow-tooltip
@ -147,6 +150,7 @@
:total="total" :total="total"
@pagination="getList" @pagination="getList"
/> />
</div>
<!-- 添加或修改设备注册对话框 --> <!-- 添加或修改设备注册对话框 -->
<el-dialog v-model="open" :title="title" append-to-body width="500px"> <el-dialog v-model="open" :title="title" append-to-body width="500px">
@ -217,6 +221,11 @@ import {controlModuleList} from "@/enum/index.js";
import {listGroup} from "@/api/system/group.js"; import {listGroup} from "@/api/system/group.js";
import useTagsViewStore from '@/store/modules/tagsView' import useTagsViewStore from '@/store/modules/tagsView'
import { useContainerHeight } from "@/hooks/tableHeight";
const topContainerRef = ref();
const containerHeight = useContainerHeight(topContainerRef);
const router = useRouter() const router = useRouter()

View File

@ -1,308 +1,316 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<div ref="topContainerRef">
<TableSearch <TableSearch
:queryParams="queryParams" :queryParams="queryParams"
queryRef="queryRef" queryRef="queryRef"
:showSearch="showSearch" :showSearch="showSearch"
@search="handleQuery" @search="handleQuery"
@refresh="resetQuery" @refresh="resetQuery"
label-width="80px" label-width="80px"
> >
<template #one> <template #one>
<el-col :xs="24" :sm="24" :md="12" :lg="6" :xl="6" :xxl="6"> <el-col :xs="24" :sm="24" :md="12" :lg="6" :xl="6" :xxl="6">
<el-form-item label="终端名称" prop="name"> <el-form-item label="终端名称" prop="name">
<el-input <el-input
v-model="queryParams.name" v-model="queryParams.name"
placeholder="请输入终端名称" placeholder="请输入终端名称"
style="width:100%" style="width:100%"
clearable clearable
@keyup.enter="handleQuery" @keyup.enter="handleQuery"
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :xs="24" :sm="24" :md="12" :lg="6" :xl="6" :xxl="6"> <el-col :xs="24" :sm="24" :md="12" :lg="6" :xl="6" :xxl="6">
<el-form-item label="端口号" prop="port"> <el-form-item label="端口号" prop="port">
<el-input <el-input
v-model="queryParams.port" v-model="queryParams.port"
placeholder="请输入端口号" placeholder="请输入端口号"
style="width:100%" style="width:100%"
clearable clearable
@keyup.enter="handleQuery" @keyup.enter="handleQuery"
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
</template> </template>
</TableSearch> </TableSearch>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="primary" type="primary"
plain plain
icon="Plus" icon="Plus"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['device:terminal:add']" v-hasPermi="['device:terminal:add']"
>新增 >新增
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="success" type="success"
plain plain
icon="Edit" icon="Edit"
:disabled="single" :disabled="single"
@click="handleUpdate" @click="handleUpdate"
v-hasPermi="['device:terminal:edit']" v-hasPermi="['device:terminal:edit']"
>修改 >修改
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
plain plain
icon="Delete" icon="Delete"
:disabled="multiple" :disabled="multiple"
@click="handleDelete" @click="handleDelete"
v-hasPermi="['device:terminal:remove']" v-hasPermi="['device:terminal:remove']"
>删除 >删除
</el-button> </el-button>
</el-col> </el-col>
<!-- <el-col :span="1.5">--> <!-- <el-col :span="1.5">-->
<!-- <el-button--> <!-- <el-button-->
<!-- type="warning"--> <!-- type="warning"-->
<!-- plain--> <!-- plain-->
<!-- icon="Download"--> <!-- icon="Download"-->
<!-- @click="handleExport"--> <!-- @click="handleExport"-->
<!-- v-hasPermi="['device:terminal:export']"--> <!-- v-hasPermi="['device:terminal:export']"-->
<!-- >导出--> <!-- >导出-->
<!-- </el-button>--> <!-- </el-button>-->
<!-- </el-col>--> <!-- </el-col>-->
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
</div>
<el-table v-loading="loading" :data="terminalList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center"/> <div :style="containerHeight">
<el-table-column show-overflow-tooltip label="id" align="center" prop="id"/> <el-table height="100%" v-loading="loading" :data="terminalList" @selection-change="handleSelectionChange">
<el-table-column label="终端名称" align="center" prop="name" show-overflow-tooltip/> <el-table-column type="selection" width="55" align="center"/>
<el-table-column label="主机" align="center" prop="host" show-overflow-tooltip/> <el-table-column show-overflow-tooltip label="id" align="center" prop="id"/>
<el-table-column label="端口号" align="center" prop="port" show-overflow-tooltip/> <el-table-column label="终端名称" align="center" prop="name" show-overflow-tooltip/>
<el-table-column label="说明" align="center" prop="description" show-overflow-tooltip/> <el-table-column label="主机" align="center" prop="host" show-overflow-tooltip/>
<el-table-column label="备注" align="center" prop="remake" show-overflow-tooltip/> <el-table-column label="端口号" align="center" prop="port" show-overflow-tooltip/>
<el-table-column label="状态" align="center" prop="status"> <el-table-column label="说明" align="center" prop="description" show-overflow-tooltip/>
<template #default="scope"> <el-table-column label="备注" align="center" prop="remake" show-overflow-tooltip/>
<el-switch <el-table-column label="状态" align="center" prop="status">
v-model="scope.row.status" <template #default="scope">
inline-prompt <el-switch
active-text="启用" v-model="scope.row.status"
inactive-text="停用" inline-prompt
active-value="0" active-text="启用"
inactive-value="1" inactive-text="停用"
@change="handleChange(scope.row)" active-value="0"
/> inactive-value="1"
</template> @change="handleChange(scope.row)"
</el-table-column> />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> </template>
<template #default="scope"> </el-table-column>
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
v-hasPermi="['device:terminal:edit']">修改 <template #default="scope">
</el-button> <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['device:terminal:edit']">修改
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" </el-button>
v-hasPermi="['device:terminal:remove']">删除
</el-button> <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
</template> v-hasPermi="['device:terminal:remove']">删除
</el-table-column> </el-button>
</el-table> </template>
</el-table-column>
<pagination </el-table>
v-show="total>0"
:total="total" <pagination
v-model:page="queryParams.pageNum" v-show="total>0"
v-model:limit="queryParams.pageSize" :total="total"
@pagination="getList" v-model:page="queryParams.pageNum"
/> v-model:limit="queryParams.pageSize"
@pagination="getList"
<!-- 添加或修改设备终端配置对话框 --> />
<el-dialog :title="title" v-model="open" width="500px" append-to-body> </div>
<el-form ref="terminalRef" :model="form" :rules="rules" label-width="80px">
<el-form-item label="终端名称" prop="name"> <!-- 添加或修改设备终端配置对话框 -->
<el-input v-model="form.name" placeholder="请输入终端名称"/> <el-dialog :title="title" v-model="open" width="500px" append-to-body>
</el-form-item> <el-form ref="terminalRef" :model="form" :rules="rules" label-width="80px">
<el-form-item label="主机" prop="host"> <el-form-item label="终端名称" prop="name">
<el-input v-model="form.host" placeholder="请输入主机"/> <el-input v-model="form.name" placeholder="请输入终端名称"/>
</el-form-item> </el-form-item>
<el-form-item label="端口号" prop="port"> <el-form-item label="主机" prop="host">
<el-input v-model="form.port" placeholder="请输入端口号"/> <el-input v-model="form.host" placeholder="请输入主机"/>
</el-form-item> </el-form-item>
<el-form-item label="说明" prop="description"> <el-form-item label="端口号" prop="port">
<el-input v-model="form.description" placeholder="请输入说明"/> <el-input v-model="form.port" placeholder="请输入端口号"/>
</el-form-item> </el-form-item>
<el-form-item label="备注" prop="remake"> <el-form-item label="说明" prop="description">
<el-input :rows="2" <el-input v-model="form.description" placeholder="请输入说明"/>
type="textarea" v-model="form.remake" placeholder="请输入备注"/> </el-form-item>
</el-form-item> <el-form-item label="备注" prop="remake">
</el-form> <el-input :rows="2"
<template #footer> type="textarea" v-model="form.remake" placeholder="请输入备注"/>
<div class="dialog-footer"> </el-form-item>
<el-button type="primary" @click="submitForm"> </el-button> </el-form>
<el-button @click="cancel"> </el-button> <template #footer>
</div> <div class="dialog-footer">
</template> <el-button type="primary" @click="submitForm"> </el-button>
</el-dialog> <el-button @click="cancel"> </el-button>
</div> </div>
</template> </template>
</el-dialog>
<script setup name="Terminal"> </div>
import {listTerminal, getTerminal, delTerminal, addTerminal, updateTerminal} from "@/api/device/terminal" </template>
import TableSearch from "@/components/TableSearch/index.vue"
<script setup name="Terminal">
const {proxy} = getCurrentInstance() import {listTerminal, getTerminal, delTerminal, addTerminal, updateTerminal} from "@/api/device/terminal"
import TableSearch from "@/components/TableSearch/index.vue"
const terminalList = ref([])
const open = ref(false) import { useContainerHeight } from "@/hooks/tableHeight";
const loading = ref(true)
const showSearch = ref(true) const topContainerRef = ref();
const ids = ref([]) const containerHeight = useContainerHeight(topContainerRef);
const single = ref(true)
const multiple = ref(true) const {proxy} = getCurrentInstance()
const total = ref(0)
const title = ref("") const terminalList = ref([])
const open = ref(false)
const data = reactive({ const loading = ref(true)
form: {}, const showSearch = ref(true)
queryParams: { const ids = ref([])
pageNum: 1, const single = ref(true)
pageSize: 10, const multiple = ref(true)
remake: null, const total = ref(0)
name: null, const title = ref("")
host: null,
port: null, const data = reactive({
status: null, form: {},
description: null queryParams: {
}, pageNum: 1,
rules: {} pageSize: 10,
}) remake: null,
name: null,
const {queryParams, form, rules} = toRefs(data) host: null,
port: null,
/** 查询设备终端配置列表 */ status: null,
function getList() { description: null
loading.value = true },
listTerminal(queryParams.value).then(response => { rules: {}
terminalList.value = response.rows })
total.value = response.total
loading.value = false const {queryParams, form, rules} = toRefs(data)
})
} /** 查询设备终端配置列表 */
function getList() {
// loading.value = true
function cancel() { listTerminal(queryParams.value).then(response => {
open.value = false terminalList.value = response.rows
reset() total.value = response.total
} loading.value = false
})
// }
function reset() {
form.value = { //
// id: null, function cancel() {
// createBy: null, open.value = false
// createTime: null, reset()
// updateBy: null, }
// updateTime: null,
// remake: null, //
// name: null, function reset() {
// host: null, form.value = {
// port: null, // id: null,
// status: null, // createBy: null,
// description: null // createTime: null,
} // updateBy: null,
proxy.resetForm("terminalRef") // updateTime: null,
} // remake: null,
// name: null,
/** 搜索按钮操作 */ // host: null,
function handleQuery() { // port: null,
queryParams.value.pageNum = 1 // status: null,
getList() // description: null
} }
proxy.resetForm("terminalRef")
/** 重置按钮操作 */ }
function resetQuery() {
proxy.resetForm("queryRef") /** 搜索按钮操作 */
handleQuery() function handleQuery() {
} queryParams.value.pageNum = 1
getList()
// }
function handleSelectionChange(selection) {
ids.value = selection.map(item => item.id) /** 重置按钮操作 */
single.value = selection.length != 1 function resetQuery() {
multiple.value = !selection.length proxy.resetForm("queryRef")
} handleQuery()
}
/** 新增按钮操作 */
function handleAdd() { //
reset() function handleSelectionChange(selection) {
open.value = true ids.value = selection.map(item => item.id)
title.value = "添加设备终端配置" single.value = selection.length != 1
} multiple.value = !selection.length
}
/** 修改按钮操作 */
function handleUpdate(row) { /** 新增按钮操作 */
reset() function handleAdd() {
const _id = row.id || ids.value reset()
getTerminal(_id).then(response => { open.value = true
form.value = response.data title.value = "添加设备终端配置"
open.value = true }
title.value = "修改设备终端配置"
}) /** 修改按钮操作 */
} function handleUpdate(row) {
reset()
/** 提交按钮 */ const _id = row.id || ids.value
function submitForm() { getTerminal(_id).then(response => {
proxy.$refs["terminalRef"].validate(valid => { form.value = response.data
if (valid) { open.value = true
if (form.value.id != null) { title.value = "修改设备终端配置"
updateTerminal(form.value).then(response => { })
proxy.$modal.msgSuccess("修改成功") }
open.value = false
getList() /** 提交按钮 */
}) function submitForm() {
} else { proxy.$refs["terminalRef"].validate(valid => {
addTerminal(form.value).then(response => { if (valid) {
proxy.$modal.msgSuccess("新增成功") if (form.value.id != null) {
open.value = false updateTerminal(form.value).then(response => {
getList() proxy.$modal.msgSuccess("修改成功")
}) open.value = false
} getList()
} })
}) } else {
} addTerminal(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功")
/** 删除按钮操作 */ open.value = false
function handleDelete(row) { getList()
const _ids = row.id || ids.value })
proxy.$modal.confirm('是否确认删除设备终端配置编号为"' + _ids + '"的数据项?').then(function () { }
return delTerminal(_ids) }
}).then(() => { })
getList() }
proxy.$modal.msgSuccess("删除成功")
}).catch(() => { /** 删除按钮操作 */
}) function handleDelete(row) {
} const _ids = row.id || ids.value
proxy.$modal.confirm('是否确认删除设备终端配置编号为"' + _ids + '"的数据项?').then(function () {
/** 导出按钮操作 */ return delTerminal(_ids)
function handleExport() { }).then(() => {
proxy.download('device/terminal/export', { getList()
...queryParams.value proxy.$modal.msgSuccess("删除成功")
}, `terminal_${new Date().getTime()}.xlsx`) }).catch(() => {
} })
}
function handleChange(row) {
updateTerminal({status: row.status, id: row.id}).then(response => { /** 导出按钮操作 */
proxy.$modal.msgSuccess("修改成功") function handleExport() {
getList() proxy.download('device/terminal/export', {
}) ...queryParams.value
} }, `terminal_${new Date().getTime()}.xlsx`)
}
getList()
</script> function handleChange(row) {
updateTerminal({status: row.status, id: row.id}).then(response => {
proxy.$modal.msgSuccess("修改成功")
getList()
})
}
getList()
</script>

File diff suppressed because one or more lines are too long

View File

@ -488,6 +488,10 @@ onMounted(() => {
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-container {
height: 100%;
}
.tableFormItem { .tableFormItem {
margin-bottom: 0; margin-bottom: 0;
} }

View File

@ -121,7 +121,7 @@
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
> >
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="语料名称" align="center" prop="corpusName" /> <el-table-column label="语料名称" width="150" align="center" prop="corpusName" show-overflow-tooltip />
<el-table-column <el-table-column
label="语音文本" label="语音文本"
align="center" align="center"
@ -136,8 +136,8 @@
min-width="150" min-width="150"
show-overflow-tooltip show-overflow-tooltip
/> />
<el-table-column label="音色" align="center" prop="voiceType" /> <el-table-column label="音色" width="80" align="center" prop="voiceType" />
<el-table-column label="语种" align="center" prop="dialect" /> <el-table-column label="语种" width="80" align="center" prop="dialect" />
<el-table-column <el-table-column
label="预期结果" label="预期结果"
align="center" align="center"
@ -474,3 +474,8 @@ defineExpose({
getList, getList,
}); });
</script> </script>
<style lang="scss" scoped>
.app-container {
height: 100%;
}
</style>

View File

@ -29,5 +29,9 @@ const multipleRef= ref()
padding: 0 12px; padding: 0 12px;
background: #fff; background: #fff;
} }
.el-tab-pane {
height: 100%;
}
} }
</style> </style>

View File

@ -3,13 +3,18 @@
<div class="btn-container"> <div class="btn-container">
<el-button type="primary" @click="openDialog">配置语料</el-button> <el-button type="primary" @click="openDialog">配置语料</el-button>
</div> </div>
<el-table :data="selectList"> <el-table :data="selectList" height="260">
<el-table-column label="语料名称" align="center" prop="corpusName" /> <el-table-column
label="语料名称"
align="center"
prop="corpusName"
width="150"
show-overflow-tooltip />
<el-table-column <el-table-column
label="语音文本" label="语音文本"
align="center" align="center"
prop="textContent" prop="textContent"
min-width="200" width="150"
show-overflow-tooltip show-overflow-tooltip
/> />
<el-table-column label="音色" align="center" prop="voiceType" /> <el-table-column label="音色" align="center" prop="voiceType" />
@ -22,6 +27,7 @@
:data="corpusList" :data="corpusList"
:tree-props="{ checkStrictly: true }" :tree-props="{ checkStrictly: true }"
:row-key="rowKey" :row-key="rowKey"
:height="400"
> >
<el-table-column <el-table-column
type="selection" type="selection"